/* ==========================================================================
   Egzamin8klasa — strony przedmiotowe (matematyka / polski / angielski /
   testy) — spójny chrom w klimacie "esports HUD" landing page'a i gry.
   Ładowany PO magic.css i literature.css, tylko na tych czterech
   szablonach. Strony są już ciemne (magic.css) — nie odwracamy nic,
   tylko: tło strony, typografia nagłówków, przyciski, ramki kart.
   Bez animacji (prefers-reduced-motion nietknięty), bez !important.
   ========================================================================== */

/* --- Tokeny potrzebne lokalnie (te strony nie ładują game-gaming.css) ---- */
body.page-matematyka,body.page-polski,body.page-angielski,body.page-testy{
  --bg:#06070d;
  --panel:#0d1020;
  --panel-2:#131736;
  --ink:#eef1ff;
  --muted:#97a1c6;
  --muted-2:#6f7aa3;
  --mint:#25f4c8;
  --gold:#ffd23f;
  --pop:#ff2e88;
  --primary:#7c5cff;
  --primary-2:#9d85ff;
  --line:rgba(126,150,255,.18);
  --line-strong:rgba(126,150,255,.4);
  --font-h:'Chakra Petch','Manrope',system-ui,sans-serif;
  --gh-clip:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  /* Bazowe tło strony, jak w game-gaming.css. */
  background:
    radial-gradient(ellipse 80% 50% at 88% -10%, rgba(124,92,255,.12), transparent 62%),
    radial-gradient(ellipse 55% 40% at 8% 32%, rgba(37,244,200,.06), transparent 60%),
    var(--bg);
  color:var(--ink);
}
body.page-matematyka ::selection,body.page-polski ::selection,
body.page-angielski ::selection,body.page-testy ::selection{background:#25f4c8;color:#04060d}

/* --- Hero: Chakra Petch + akcenty neonowe -------------------------------- */
.page-matematyka .hero h1,.page-polski .hero h1,.page-angielski .hero h1,
.page-testy .subhead h1{
  font-family:var(--font-h);font-weight:700;letter-spacing:-.01em;
  text-shadow:0 0 40px rgba(124,92,255,.35);
}
.page-matematyka .hero h1 em,.page-polski .hero h1 em,.page-angielski .hero h1 em{
  background:linear-gradient(92deg,#25f4c8 10%,#7c5cff 90%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 0 34px rgba(37,244,200,.3);
}
.page-matematyka .hero .lead,.page-polski .hero .lead,.page-angielski .hero .lead{color:#c5cbe8}
.page-matematyka .eyebrow,.page-polski .eyebrow,.page-angielski .eyebrow,.page-testy .eyebrow{
  font-family:var(--font-h);color:var(--mint);letter-spacing:.16em;
  background:rgba(37,244,200,.06);border-color:var(--line);
}
.page-matematyka .eyebrow::before,.page-polski .eyebrow::before,
.page-angielski .eyebrow::before,.page-testy .eyebrow::before{
  content:'[';color:var(--pop);background:none;width:auto;height:auto;border-radius:0;
}
.page-matematyka .eyebrow::after,.page-polski .eyebrow::after,
.page-angielski .eyebrow::after,.page-testy .eyebrow::after{content:']';color:var(--pop)}

/* --- Nagłówki sekcji: Chakra Petch + neonowa kreska 74px ----------------- */
.page-matematyka .sec-head h2,.page-polski .sec-head h2,.page-angielski .sec-head h2,
.page-testy .sec-head h2,.page-testy .testy-klasa-h{
  position:relative;padding-bottom:14px;
  font-family:var(--font-h);font-weight:700;letter-spacing:.02em;
}
.page-matematyka .sec-head h2::after,.page-polski .sec-head h2::after,
.page-angielski .sec-head h2::after,.page-testy .sec-head h2::after,
.page-testy .testy-klasa-h::after{
  content:'';position:absolute;left:0;bottom:0;width:74px;height:3px;
  background:linear-gradient(90deg,var(--mint),var(--primary),transparent);
  box-shadow:0 0 14px rgba(37,244,200,.6);
}
.page-testy .testy-klasa-h{border-bottom:0}
.page-matematyka .sec-head p,.page-polski .sec-head p,.page-angielski .sec-head p,
.page-testy .sec-head p{color:var(--muted)}

/* --- Przyciski: primary = gradient mint (jak game-gaming.css) ------------ */
.page-matematyka .btn-primary,.page-polski .btn-primary,.page-angielski .btn-primary,
.page-testy .btn-primary{
  position:relative;color:#04060d;border:0;border-radius:0;
  font-family:var(--font-h);font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  clip-path:var(--gh-clip);
  background:linear-gradient(92deg,#25f4c8,#4dd7ff 70%);
  box-shadow:0 0 0 1px rgba(37,244,200,.5),0 0 24px rgba(37,244,200,.35);
}
.page-matematyka .btn-primary:hover,.page-polski .btn-primary:hover,
.page-angielski .btn-primary:hover,.page-testy .btn-primary:hover{
  background:linear-gradient(92deg,#5cffdb,#6ee0ff 70%);
  box-shadow:0 0 0 1px rgba(37,244,200,.65),0 0 32px rgba(37,244,200,.5);
}
/* Ghost: ciemne szkło, neonowa obwódka. */
.page-matematyka .btn-ghost,.page-polski .btn-ghost,.page-angielski .btn-ghost,
.page-testy .btn-ghost{
  background:rgba(13,16,32,.7);color:var(--ink);border:1px solid var(--line-strong);border-radius:0;
  clip-path:var(--gh-clip);
}
.page-matematyka .btn-ghost:hover,.page-polski .btn-ghost:hover,
.page-angielski .btn-ghost:hover,.page-testy .btn-ghost:hover{
  border-color:rgba(37,244,200,.55);color:var(--mint);
  box-shadow:0 0 16px rgba(37,244,200,.18);
}
/* Accent (np. "Aktywuj kod" w gate-box): fioletowy gradient z jasnym tekstem. */
.page-matematyka .btn-accent,.page-polski .btn-accent,.page-angielski .btn-accent,
.page-testy .btn-accent{
  border:0;border-radius:0;color:#f4f2fb;
  font-family:var(--font-h);font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  clip-path:var(--gh-clip);
  background:linear-gradient(92deg,#7c5cff,#9d85ff 70%);
  box-shadow:0 0 0 1px rgba(124,92,255,.5),0 0 24px rgba(124,92,255,.3);
}
.page-matematyka .btn-accent:hover,.page-polski .btn-accent:hover,
.page-angielski .btn-accent:hover,.page-testy .btn-accent:hover{
  background:linear-gradient(92deg,#9378ff,#b39dff 70%);
  box-shadow:0 0 0 1px rgba(124,92,255,.65),0 0 32px rgba(124,92,255,.45);
}

/* --- Karty / panele: ciemny panel + obwódka --line-strong + odcięte rogi -- */
.page-matematyka .card,.page-polski .card,.page-angielski .card,.page-testy .card,
.page-matematyka .arch-card,.page-polski .arch-card,.page-angielski .arch-card,.page-testy .arch-card,
.page-matematyka .zad-card,.page-polski .zad-card,.page-angielski .zad-card,
.page-matematyka .kp-card,.page-polski .kp-card,.page-angielski .kp-card,
.page-matematyka .slowka-card,.page-angielski .slowka-card,
.page-matematyka .word-game,.page-polski .word-game,.page-angielski .word-game,
.page-matematyka .countdown-card,.page-polski .countdown-card,.page-angielski .countdown-card,
.page-testy .countdown-card,.page-testy .testy-inne-link{
  background:var(--panel);
  border:1px solid var(--line-strong);border-radius:0;
  clip-path:var(--gh-clip);
  box-shadow:0 0 0 1px rgba(37,244,200,.04),0 0 28px rgba(37,244,200,.06);
}
/* Mniejsze elementy interaktywne: tylko kolor tła i ramki, bez clip-path. */
.page-matematyka .fiszka,.page-polski .fiszka,.page-angielski .fiszka,
.page-matematyka .dzial-card,.page-polski .dzial-card,.page-angielski .dzial-card,
.page-angielski .motyw-chip,.page-polski .motyw-chip{
  background:#090b16;border-color:var(--line);
}
.page-matematyka .fiszka:hover,.page-polski .fiszka:hover,.page-angielski .fiszka:hover,
.page-matematyka .dzial-card:hover,.page-polski .dzial-card:hover,.page-angielski .dzial-card:hover{
  border-color:var(--line-strong);background:#10132a;
}
.page-matematyka .dzial-card.unlocked,.page-polski .dzial-card.unlocked,.page-angielski .dzial-card.unlocked{
  border-color:rgba(37,244,200,.45);background:rgba(37,244,200,.04);
}
.page-polski .motyw-chip.active,.page-angielski .motyw-chip.active{
  background:linear-gradient(135deg,#7c5cff,#9d85ff);color:#fff;border-color:transparent;
  box-shadow:0 0 20px rgba(124,92,255,.3);
}

/* --- Bramki dostępu (gate) i alerty: mint = sukces, pink = błąd ------------ */
.page-matematyka .gate-box,.page-polski .gate-box,.page-angielski .gate-box,.page-testy .gate-box{
  background:linear-gradient(160deg,#0e1226,#080a15);
  border:1px solid var(--line-strong);border-radius:0;
  clip-path:var(--gh-clip);
  box-shadow:0 24px 70px rgba(0,0,0,.5);
}
.page-matematyka .gate-alert,.page-polski .gate-alert,.page-angielski .gate-alert,.page-testy .gate-alert{
  max-width:none;text-align:left;border-radius:0;
  clip-path:var(--gh-clip);
  font-family:var(--font-h);font-size:.88rem;font-weight:600;letter-spacing:.02em;
}
.page-matematyka .gate-alert.ok,.page-polski .gate-alert.ok,.page-angielski .gate-alert.ok,.page-testy .gate-alert.ok{
  background:rgba(37,244,200,.07);border:1px solid rgba(37,244,200,.4);
  color:var(--mint);box-shadow:0 0 22px rgba(37,244,200,.1);
}
.page-matematyka .gate-alert.err,.page-polski .gate-alert.err,.page-angielski .gate-alert.err,.page-testy .gate-alert.err{
  background:rgba(255,46,136,.07);border:1px solid rgba(255,46,136,.4);
  color:#ff7ab0;box-shadow:0 0 22px rgba(255,46,136,.1);
}
.page-matematyka .gate-form input,.page-polski .gate-form input,
.page-angielski .gate-form input,.page-testy .gate-form input{
  background:#0a0d1c;border:1px solid var(--line-strong);border-radius:0;
  clip-path:var(--gh-clip);
  color:var(--ink);caret-color:var(--mint);
}
.page-matematyka .gate-form input:focus,.page-polski .gate-form input:focus,
.page-angielski .gate-form input:focus,.page-testy .gate-form input:focus{
  outline:none;border-color:var(--mint);
  box-shadow:0 0 0 1px rgba(37,244,200,.4),0 0 16px rgba(37,244,200,.25);
}

/* --- Formularze ćwiczeń (rozprawka, transformacje, odpowiedzi otwarte) ---- */
.page-polski .rozprawka-textarea,
.page-angielski .transform-input,.page-angielski .arkusz-open-input,
.page-matematyka .arkusz-open-input{
  background:#0a0d1c;border:1px solid var(--line-strong);border-radius:0;
  clip-path:var(--gh-clip);
  color:var(--ink);caret-color:var(--mint);
}
.page-polski .rozprawka-textarea:focus,
.page-angielski .transform-input:focus,.page-angielski .arkusz-open-input:focus,
.page-matematyka .arkusz-open-input:focus{
  outline:none;border-color:var(--mint);
  box-shadow:0 0 0 1px rgba(37,244,200,.4),0 0 16px rgba(37,244,200,.25);
}

/* --- Drobiazgi typograficzne ---------------------------------------------- */
.page-matematyka .study-item .month,.page-polski .study-item .month,
.page-angielski .study-item .month{color:var(--primary-2)}
.page-testy .testy-dzial-h{color:var(--primary-2);font-family:var(--font-h);letter-spacing:.08em}
.page-matematyka .countdown-card .cd-head,.page-polski .countdown-card .cd-head,
.page-angielski .countdown-card .cd-head{color:var(--muted)}