
:root{--honey:#f6bd16;--honey-dark:#d99b00;--ink:#172033;--cream:#fffaf0;--paper:#fff;--muted:#677286;--ok:#11865b;--bad:#c33d37;--line:#e7d9ad;--shadow:0 18px 50px rgba(37,31,15,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background-color:#fff9e8;background-image:radial-gradient(circle at 25px 25px,rgba(246,189,22,.13) 2px,transparent 2.5px),linear-gradient(30deg,rgba(246,189,22,.055) 12%,transparent 12.5%,transparent 87%,rgba(246,189,22,.055) 87.5%),linear-gradient(150deg,rgba(246,189,22,.055) 12%,transparent 12.5%,transparent 87%,rgba(246,189,22,.055) 87.5%);background-size:50px 50px,60px 104px,60px 104px;min-height:100vh}.site-shell{max-width:1180px;margin:auto;padding:20px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 0 22px}.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit}.brand img{width:120px;height:64px;object-fit:contain}.brand-copy strong{display:block;font-size:1.05rem}.brand-copy span{font-size:.82rem;color:var(--muted)}.back-link{font-weight:800;color:var(--ink);text-decoration:none;background:#fff;border:1px solid var(--line);padding:10px 14px;border-radius:999px}.hero{display:grid;grid-template-columns:1.35fr .65fr;gap:34px;align-items:center;background:linear-gradient(135deg,#fff 0%,#fff9dc 100%);border:1px solid var(--line);border-radius:30px;padding:46px;box-shadow:var(--shadow);overflow:hidden;position:relative}.hero:after{content:"";position:absolute;width:280px;height:280px;border:44px solid rgba(246,189,22,.08);border-radius:50%;right:-90px;top:-110px}.eyebrow{display:inline-flex;align-items:center;gap:8px;background:#fff1ac;border:1px solid #efd36d;border-radius:999px;padding:7px 12px;font-weight:800;font-size:.82rem;text-transform:uppercase;letter-spacing:.06em}.hero h1{font-size:clamp(2.2rem,5vw,4.6rem);line-height:.98;margin:18px 0 16px;letter-spacing:-.045em}.hero p{font-size:1.12rem;line-height:1.65;color:#4d5668;max-width:720px}.hero-bee{width:310px;max-width:100%;justify-self:center;filter:drop-shadow(0 18px 16px rgba(60,45,0,.18));z-index:1}.stats-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.stat-chip{background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 13px;font-weight:800}.section-title{font-size:1.8rem;margin:44px 0 18px}.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.game-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;text-decoration:none;color:inherit;box-shadow:0 8px 24px rgba(37,31,15,.06);transition:.2s transform,.2s box-shadow;position:relative;overflow:hidden}.game-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.game-no{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--honey);font-weight:950}.game-card h2{font-size:1.25rem;margin:14px 0 8px}.game-card p{color:var(--muted);line-height:1.5;margin:0}.game-card .count{display:block;margin-top:14px;font-size:.83rem;font-weight:800;color:#7c5a00}.footer{margin-top:44px;border-top:1px solid var(--line);padding:24px 0 10px;display:flex;justify-content:space-between;gap:18px;color:var(--muted);font-size:.88rem}.game-app{max-width:920px;margin:0 auto}.panel{background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);padding:30px}.start-panel{text-align:center}.chapter-badge{display:inline-block;background:#fff1ac;border:1px solid #efd36d;border-radius:999px;padding:7px 13px;font-weight:900}.start-panel h1{font-size:clamp(2rem,6vw,3.5rem);margin:18px 0 10px;line-height:1.05}.start-panel .lead{color:var(--muted);font-size:1.05rem;line-height:1.6}.bee-small{width:175px;margin:5px auto 12px;display:block}.option-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:25px 0}.count-option{position:relative}.count-option input{position:absolute;opacity:0}.count-option span{display:block;padding:12px 17px;border-radius:14px;background:#fff;border:2px solid var(--line);font-weight:900;cursor:pointer}.count-option input:checked+span{background:#fff3b4;border-color:var(--honey-dark);box-shadow:0 0 0 3px rgba(246,189,22,.18)}.btn{border:0;border-radius:15px;padding:13px 20px;font-weight:900;font-size:1rem;cursor:pointer;transition:.18s transform,.18s filter;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn:hover{transform:translateY(-2px);filter:brightness(.98)}.btn-primary{background:var(--honey);color:#1b1b16;box-shadow:0 10px 24px rgba(217,155,0,.24)}.btn-secondary{background:#fff;border:1px solid var(--line);color:var(--ink)}.btn-danger{background:#fff0ef;color:var(--bad);border:1px solid #f0c3bf}.actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.hidden{display:none!important}.game-head{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;margin-bottom:20px}.progress-wrap{height:12px;background:#f0ead8;border-radius:999px;overflow:hidden}.progress-bar{height:100%;background:linear-gradient(90deg,#f8d33b,#efa600);width:0%;transition:width .3s}.score-box{font-weight:900;white-space:nowrap}.source-strip{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;background:#fff8d6;border:1px solid #ead98c;border-radius:15px;padding:10px 13px;margin-bottom:22px;font-size:.88rem}.source-strip strong{font-weight:900}.source-strip a{color:#6c4b00;font-weight:900}.topic-label{font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;color:#8a6500;font-weight:900;margin-bottom:12px}.question-text{font-size:1.18rem;line-height:1.7;margin:0 0 22px}.choices{display:grid;gap:12px}.choice-btn{display:grid;grid-template-columns:42px 1fr;gap:13px;text-align:left;align-items:center;border:2px solid #e8e0ca;border-radius:17px;background:#fff;padding:13px 15px;cursor:pointer;font:inherit;color:inherit;transition:.16s}.choice-btn:hover:not(:disabled){border-color:#e7b719;background:#fffaf0;transform:translateX(3px)}.choice-btn:disabled{cursor:default}.choice-letter{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#f7f0da;font-weight:950}.choice-btn.selected{border-color:#d5a400;background:#fff7cf}.choice-btn.correct{border-color:#50aa83;background:#eaf8f1}.choice-btn.correct .choice-letter{background:#16845b;color:#fff}.choice-btn.wrong{border-color:#df7b74;background:#fff0ef}.choice-btn.wrong .choice-letter{background:#c33d37;color:#fff}.feedback{margin-top:20px;padding:19px;border-radius:18px;line-height:1.62}.feedback.ok{background:#eaf8f1;border:1px solid #a9d9c3}.feedback.bad{background:#fff0ef;border:1px solid #f0c3bf}.feedback h3{margin:0 0 8px}.next-row{display:flex;justify-content:flex-end;margin-top:18px}.result-score{font-size:4rem;font-weight:950;letter-spacing:-.05em;margin:10px 0;color:#a97400}.result-list{display:grid;gap:12px;margin-top:22px;text-align:left}.result-item{border:1px solid var(--line);border-radius:16px;padding:15px}.result-item strong{display:block;margin-bottom:6px}.editor-panel{margin-top:18px;text-align:left}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{display:grid;gap:6px}.field.full{grid-column:1/-1}.field label{font-weight:850;font-size:.9rem}.field input,.field textarea,.field select{font:inherit;border:1px solid #d9ceb0;border-radius:11px;padding:10px 11px;background:#fff}.field textarea{min-height:92px;resize:vertical}.editor-note{font-size:.88rem;color:var(--muted);line-height:1.5}.toast{position:fixed;right:20px;bottom:20px;background:#172033;color:#fff;padding:13px 17px;border-radius:13px;box-shadow:var(--shadow);z-index:50}.kbd{font-size:.78rem;background:#f2ecda;border:1px solid #ded4b8;border-radius:6px;padding:2px 6px}.offline-note{font-size:.82rem;color:var(--muted);margin-top:12px}.mjx-container{overflow-x:auto;overflow-y:hidden;max-width:100%}@media(max-width:900px){.hero{grid-template-columns:1fr;padding:30px}.hero-bee{width:210px}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.site-shell{padding:12px}.topbar{align-items:flex-start}.brand img{width:92px}.brand-copy{display:none}.hero{padding:25px;border-radius:22px}.hero h1{font-size:2.5rem}.game-grid{grid-template-columns:1fr}.panel{padding:19px;border-radius:20px}.game-head{grid-template-columns:1fr}.score-box{text-align:right}.editor-grid{grid-template-columns:1fr}.field.full{grid-column:1}.choice-btn{grid-template-columns:36px 1fr;padding:11px}.source-strip{align-items:flex-start}.footer{flex-direction:column}}

/* =========================================================
   Panel dostępności, płynne przyciemnianie tła i logo RGBA
   ========================================================= */
:root{
  --font-scale:1;
  --scroll-bg:255,249,226;
  --scroll-progress:0;
  --toolbar-size:48px;
}
html{font-size:calc(100% * var(--font-scale));background:#fff9e2}
body{
  position:relative;
  isolation:isolate;
  background-color:rgb(var(--scroll-bg));
  background-image:none;
  transition:background-color .16s linear;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background-color:rgb(var(--scroll-bg));
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:calc(.18 + var(--scroll-progress) * .12);
  background-image:
    radial-gradient(circle at 25px 25px,rgba(246,189,22,.48) 2px,transparent 2.6px),
    linear-gradient(30deg,rgba(255,222,74,.34) 12%,transparent 12.5%,transparent 87%,rgba(255,222,74,.34) 87.5%),
    linear-gradient(150deg,rgba(255,222,74,.34) 12%,transparent 12.5%,transparent 87%,rgba(255,222,74,.34) 87.5%);
  background-size:50px 50px,60px 104px,60px 104px;
}
.site-shell{position:relative;z-index:1;padding-top:84px}
.brand img{
  width:132px;
  height:72px;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 7px 8px rgba(0,0,0,.16));
}
.section-title{
  display:inline-block;
  padding:8px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.86);
  box-shadow:0 6px 18px rgba(31,26,12,.08);
  backdrop-filter:blur(5px);
}
.footer{
  padding:18px 20px;
  border:1px solid rgba(231,217,173,.88);
  border-radius:18px;
  background:rgba(255,255,255,.9);
  box-shadow:0 10px 30px rgba(31,26,12,.11);
  backdrop-filter:blur(7px);
  margin-bottom:18px;
}
.accessibility-panel{
  position:fixed;
  z-index:1000;
  top:12px;
  right:max(12px,calc((100vw - 1180px)/2 + 20px));
  display:flex;
  align-items:center;
  gap:7px;
  padding:7px;
  border:1px solid rgba(231,194,62,.76);
  border-radius:17px;
  background:rgba(255,244,176,.9);
  box-shadow:0 12px 32px rgba(38,29,4,.2);
  backdrop-filter:blur(11px);
  -webkit-backdrop-filter:blur(11px);
}
.accessibility-button{
  width:var(--toolbar-size);
  height:var(--toolbar-size);
  display:grid;
  place-items:center;
  flex:0 0 auto;
  padding:0;
  border:2px solid #172033;
  border-radius:12px;
  background:#fffdf6;
  color:#172033;
  box-shadow:0 3px 0 rgba(23,32,51,.18);
  font:900 1rem/1 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  cursor:pointer;
  transition:transform .15s ease,background .15s ease,box-shadow .15s ease;
}
.accessibility-button:hover{transform:translateY(-2px);background:#fff4ad;box-shadow:0 5px 0 rgba(23,32,51,.16)}
.accessibility-button:active{transform:translateY(1px);box-shadow:0 1px 0 rgba(23,32,51,.18)}
.accessibility-button:focus-visible{outline:4px solid #1476ff;outline-offset:3px}
.accessibility-button[aria-pressed="true"]{background:#f6bd16;box-shadow:inset 0 0 0 2px rgba(255,255,255,.7)}
.accessibility-font-symbol{font-size:1.26rem;letter-spacing:-.06em}
.accessibility-button[data-level="1"] .accessibility-font-symbol{font-size:1.38rem}
.accessibility-button[data-level="2"] .accessibility-font-symbol{font-size:1.5rem}
.accessibility-button[data-level="3"] .accessibility-font-symbol{font-size:1.6rem}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.question-figure{
  display:block;
  max-width:min(100%,720px);
  max-height:460px;
  margin:18px auto;
  border-radius:14px;
  background:#fff;
  object-fit:contain;
}

/* Wysoki kontrast */
.high-contrast body,
.high-contrast body::before{background:#0b0f17!important;color:#fff}
.high-contrast body::after{opacity:.08;background-image:linear-gradient(30deg,#ffd500 12%,transparent 12.5%,transparent 87%,#ffd500 87.5%),linear-gradient(150deg,#ffd500 12%,transparent 12.5%,transparent 87%,#ffd500 87.5%)}
.high-contrast .panel,
.high-contrast .game-card,
.high-contrast .hero,
.high-contrast .footer,
.high-contrast .back-link,
.high-contrast .btn-secondary,
.high-contrast .choice-btn,
.high-contrast .stat-chip,
.high-contrast .count-option span,
.high-contrast .field input,
.high-contrast .field textarea,
.high-contrast .field select{
  background:#111827!important;
  color:#fff!important;
  border-color:#ffd500!important;
}
.high-contrast .hero p,
.high-contrast .game-card p,
.high-contrast .brand-copy span,
.high-contrast .lead,
.high-contrast .editor-note,
.high-contrast .offline-note,
.high-contrast .footer{color:#fff!important}
.high-contrast .eyebrow,
.high-contrast .chapter-badge,
.high-contrast .source-strip,
.high-contrast .topic-label,
.high-contrast .section-title{background:#ffd500!important;color:#05070b!important;border-color:#fff!important}
.high-contrast .choice-letter{background:#ffd500;color:#05070b}
.high-contrast .choice-btn.correct{background:#064e3b!important;border-color:#6ee7b7!important}
.high-contrast .choice-btn.wrong{background:#6b1111!important;border-color:#fca5a5!important}
.high-contrast a{color:#fff;text-decoration-thickness:2px}
.high-contrast .source-strip a{color:#05070b}
.high-contrast .accessibility-panel{background:#05070b;border-color:#ffd500}
.high-contrast .accessibility-button{background:#05070b;color:#fff;border-color:#ffd500;box-shadow:0 3px 0 #ffd500}
.high-contrast .accessibility-button[aria-pressed="true"]{background:#ffd500;color:#05070b}

@media(max-width:720px){
  :root{--toolbar-size:44px}
  .accessibility-panel{
    left:50%;right:auto;top:7px;transform:translateX(-50%);
    max-width:calc(100vw - 14px);
    gap:5px;padding:6px;border-radius:15px;
  }
  .site-shell{padding-top:76px}
  .brand img{width:105px;height:62px}
}
@media(max-width:390px){
  :root{--toolbar-size:40px}
  .accessibility-panel{gap:4px;padding:5px}
  .accessibility-button{border-radius:10px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
/* Pełna pula: zadania wielokrotnego wyboru, P/F i odpowiedzi łączone */
.selection-note{grid-column:1/-1;padding:11px 14px;border-radius:12px;background:#fff8d6;border:1px solid #ead98c;font-weight:750;line-height:1.45}
.choice-btn.selected{border-color:#d5a400;background:#fff2a8;box-shadow:0 0 0 3px rgba(213,164,0,.12)}
.combo-choice .choice-letter{width:auto;min-width:46px;padding:0 8px}
.choice-content p{margin:.15em 0}.choice-content .mjx-container{margin:0!important}
.pf-list{display:grid;gap:13px}.pf-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:15px;align-items:center;padding:14px 15px;border:2px solid #e8e0ca;border-radius:17px;background:#fff}.pf-statement{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;align-items:start;line-height:1.55}.pf-number{width:28px;height:28px;border-radius:9px;background:#f7f0da;display:grid;place-items:center;font-weight:950}.pf-statement p{margin:0}.pf-buttons{display:flex;gap:8px}.pf-buttons button{width:44px;height:42px;border:2px solid #172033;border-radius:11px;background:#fffdf6;font:900 1rem/1 inherit;cursor:pointer}.pf-buttons button.selected{background:#fff2a8;border-color:#d5a400}.pf-buttons button.correct{background:#16845b;color:#fff;border-color:#16845b}.pf-buttons button.wrong{background:#c33d37;color:#fff;border-color:#c33d37}.pf-buttons button:disabled{cursor:default}
.math-data-table{border-collapse:collapse;margin:14px auto;max-width:100%;background:#fff}.math-data-table td,.math-data-table th{border:1px solid #cfc4a3;padding:6px 10px;text-align:center}
.high-contrast .pf-row,.high-contrast .selection-note{background:#111827!important;color:#fff!important;border-color:#ffd500!important}.high-contrast .pf-buttons button{background:#05070b;color:#fff;border-color:#ffd500}.high-contrast .pf-buttons button.selected{background:#ffd500;color:#05070b}
@media(max-width:640px){.pf-row{grid-template-columns:1fr}.pf-buttons{justify-content:flex-end}.question-text{font-size:1.08rem}.choice-content{min-width:0;overflow-wrap:anywhere}}


/* Poprawne formatowanie wzorów MathJax w uzasadnieniach i podsumowaniu */
.feedback,.result-item{overflow-x:auto}
.feedback mjx-container,.result-item mjx-container{max-width:100%;overflow-x:auto;overflow-y:hidden}
.feedback mjx-container[display="true"],.result-item mjx-container[display="true"]{margin:.55em 0!important}

/* Tabele danych w zadaniach po audycie treści */
.question-data-table{width:100%;border-collapse:collapse;margin:16px 0;background:#fff;font-size:.98rem}
.question-data-table th,.question-data-table td{border:1px solid #6b7280;padding:8px 10px;text-align:center}
.question-data-table th{font-weight:900;background:#fff8d6}
.high-contrast .question-data-table{background:#111827;color:#fff}
.high-contrast .question-data-table th{background:#ffd500;color:#05070b}


/* Korekta 2026-08: długie wzory i tabele nie wychodzą poza kartę pytania. */
.question-text mjx-container[display="true"],
.choice-btn mjx-container[display="true"],
.feedback mjx-container[display="true"],
.result-item mjx-container[display="true"]{
  display:block!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:.15rem 0 .35rem;
  -webkit-overflow-scrolling:touch;
}
.question-text,.choice-btn,.feedback,.result-item{min-width:0;overflow-wrap:anywhere}
.table-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;margin:14px 0}
.math-data-table{border-collapse:collapse;margin:0 auto;min-width:420px;background:#fff}
.math-data-table th,.math-data-table td{border:1px solid #d8cda8;padding:8px 12px;text-align:center;white-space:nowrap}
.math-data-table th{background:#fff4bd;font-weight:900}
