/* ═══════════════════════════════════════════════════════════════
   PULPIT BEZ PRZEWIJANIA
   Cała aplikacja ma wysokość okna, a pulpit dzieli ją na siatkę.
   Nic nie wychodzi poza ekran: jeśli lista jest dłuższa niż jej
   kafel, przewija się TA lista, nie cała strona.
   ═══════════════════════════════════════════════════════════════ */

/* ramy: okno jest sceną, nie taśmą — ALE TYLKO NA PULPICIE.
   Wcześniej blokada była globalna i odbierała przewijanie notatkom,
   testom i całej reszcie. Atrybut ustawia i-pulpit.js przy każdej zmianie trasy. */
html[data-widok="pulpit"],html[data-widok="pulpit"] body{height:100%;overflow:hidden;}
html[data-widok="pulpit"] .app{height:100vh;min-height:0;overflow:hidden;}
html[data-widok="pulpit"] .main{min-height:0;overflow:hidden;}
html[data-widok="pulpit"] .view{flex:1;min-height:0;overflow:hidden;
  padding:var(--s5) var(--s6) var(--s6);max-width:none;display:flex;}
html[data-widok="pulpit"] .top{padding:var(--s3) var(--s6);flex:none;}
html[data-widok="pulpit"] .top h1{font-size:var(--t-md);}

/* SIATKA: lewa kolumna to działanie, prawa to stan wiedzy */
.pulpit-siatka{
  flex:1;min-height:0;display:grid;gap:var(--s4);
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);
  grid-template-rows:minmax(0,1.35fr) minmax(0,1fr);
  grid-template-areas:
    "teraz     przedmioty plan"
    "kalendarz slabe      zapowiedzi";
}
.pl-kalendarz{grid-area:kalendarz;}
.pl-teraz{grid-area:teraz;}
.pl-przedmioty{grid-area:przedmioty;}
.pl-plan{grid-area:plan;}
.pl-slabe{grid-area:slabe;}
.pl-zapowiedzi{grid-area:zapowiedzi;}

/* ── KAFEL GŁÓWNY: jedna akcja ── */
.pl-teraz{position:relative;display:flex;flex-direction:column;justify-content:center;
  gap:var(--s5);padding:var(--s8);border-radius:1rem;overflow:hidden;min-height:0;
  background:linear-gradient(140deg,var(--deep) 0%,#1C2836 55%,#33260F 150%);
  color:var(--on-deep);box-shadow:var(--sh-lg);}
/* Poświata stonowana: akcent zmieszany z niebieskoszarym tłem kafla robił
   się brudnozielony — mniejsza siła i krótszy zasięg trzymają ciepły ton. */
.pl-teraz::after{content:"";position:absolute;right:-90px;bottom:-110px;
  width:340px;height:340px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 11%,transparent) 0,transparent 58%);}
.pl-dz{--r:clamp(80px,9vh,124px) !important;position:relative;z-index:1;}
.pl-teraz-tx{position:relative;z-index:1;}
.pl-teraz .lab{color:var(--deep-3);margin-bottom:var(--s2);}
.pl-teraz h2{font-size:clamp(1.5rem,2.6vh,2.3rem);line-height:1.1;color:#fff;
  font-weight:600;letter-spacing:-.025em;margin-bottom:var(--s2);}
.pl-teraz p{color:#A8B2BD;font-size:var(--t-sm);margin-bottom:var(--s5);}
.pl-start{background:var(--on-deep);color:var(--deep);font-weight:600;
  align-self:flex-start;box-shadow:0 6px 18px -6px rgba(0,0,0,.5);}
.pl-start:hover{transform:translateY(-1px);}

/* pierścień postępu dnia — jedna liczba zamiast paska i podpisu */
.pl-postep{position:relative;z-index:1;display:flex;align-items:center;gap:var(--s4);
  margin-top:auto;}
.pl-kolo{width:64px;height:64px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:conic-gradient(var(--accent) calc(var(--p) * 1%),rgba(255,255,255,.12) 0);}
.pl-kolo::before{content:"";position:absolute;width:50px;height:50px;border-radius:50%;
  background:#16212C;}
.pl-kolo span{position:relative;font-family:var(--f-mono);font-size:var(--t-sm);color:#fff;}
.pl-kolo small{font-size:9px;opacity:.7;}
.pl-postep-t{font-family:var(--f-mono);font-size:var(--t-xs);color:var(--deep-3);}
.pl-gotowe{align-items:center;text-align:center;}

/* ── KAFLE BOCZNE ── */
.pl-blok{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:var(--s4) var(--s5);display:flex;flex-direction:column;min-height:0;
  box-shadow:var(--sh-md);}
.pl-blok h3{font-family:var(--f-serif);font-size:var(--t-sm);font-weight:600;
  letter-spacing:-.01em;display:flex;align-items:baseline;gap:var(--s3);
  padding-bottom:var(--s3);flex:none;}
.pl-r{margin-left:auto;font-family:var(--f-mono);font-size:10px;color:var(--ink-3);
  letter-spacing:.06em;text-transform:uppercase;}
/* to lista się przewija, nie strona */
.pl-lista{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;
  display:flex;flex-direction:column;gap:2px;margin:0 calc(-1 * var(--s2));
  padding:0 var(--s2);scrollbar-width:thin;}
.pl-lista::-webkit-scrollbar{width:4px;}
.pl-lista::-webkit-scrollbar-thumb{background:var(--line);border-radius:2px;}

/* przedmioty: dni, nazwa, gotowość */
.pl-przedm{display:grid;grid-template-columns:34px minmax(0,1fr) 36px 28px;gap:var(--s2);
  align-items:center;padding:var(--s2) var(--s2);border-radius:var(--r-sm);
  transition:background .16s var(--ease);}
.pl-przedm:hover{background:var(--bg-2);}
.pl-dni{font-family:var(--f-serif);font-size:var(--t-md);font-weight:600;
  letter-spacing:-.03em;line-height:1;}
.pl-dni small{display:block;font-family:var(--f-mono);font-size:8px;
  color:var(--ink-3);letter-spacing:.1em;}
.pl-przedm.pilny .pl-dni{color:#C2410C;}
.pl-nazwa{font-size:var(--t-xs);font-weight:500;overflow:hidden;min-width:0;
  text-overflow:ellipsis;white-space:nowrap;}
.pl-slupek{height:3px;background:var(--line);border-radius:2px;overflow:hidden;}
.pl-slupek i{display:block;height:100%;background:var(--accent);border-radius:2px;}
.pl-proc{font-family:var(--f-mono);font-size:10px;color:var(--ink-2);text-align:right;}

/* plan: zadania do odhaczenia */
.pl-zad{display:grid;grid-template-columns:16px 1fr auto;gap:var(--s3);align-items:center;
  padding:var(--s2);border-radius:var(--r-sm);width:100%;text-align:left;
  transition:background .16s var(--ease);}
.pl-zad:hover{background:var(--bg-2);}
.pl-bx{width:15px;height:15px;border:1.5px solid var(--line);border-radius:4px;}
.pl-zad.zrobione .pl-bx{background:var(--accent);border-color:var(--accent);
  background-image:linear-gradient(45deg,transparent 45%,#fff 45%,#fff 55%,transparent 55%),
    linear-gradient(-45deg,transparent 45%,#fff 45%,#fff 55%,transparent 55%);
  background-size:9px 9px;background-position:center;background-repeat:no-repeat;}
.pl-zad-t{font-size:var(--t-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pl-zad.zrobione .pl-zad-t{text-decoration:line-through;color:var(--ink-3);}
.pl-min{font-family:var(--f-mono);font-size:10px;color:var(--ink-3);}

/* słabe punkty: liczba błędów prowadzi wzrok */
.pl-slaby{display:grid;grid-template-columns:26px 1fr;gap:var(--s3);align-items:center;
  padding:var(--s2);border-radius:var(--r-sm);transition:background .16s var(--ease);}
.pl-slaby:hover{background:var(--bg-2);}
.pl-bledy{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb,#C2410C 12%,transparent);color:#C2410C;
  font-family:var(--f-mono);font-size:11px;font-weight:600;}
.pl-slaby-t{display:block;font-size:var(--t-xs);font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pl-slaby-m{display:block;font-family:var(--f-mono);font-size:10px;color:var(--ink-3);}

/* zapowiedzi: cytat prowadzącego = najwyższy zwrot z nauki */
.pl-zap{display:block;padding:var(--s2);border-left:2px solid var(--accent);
  padding-left:var(--s3);border-radius:0 var(--r-sm) var(--r-sm) 0;
  transition:background .16s var(--ease);}
.pl-zap:hover{background:var(--accent-bg);}
.pl-zap-t{display:block;font-size:var(--t-xs);line-height:1.4;}
.pl-zap-m{display:block;font-family:var(--f-mono);font-size:10px;
  color:var(--ink-3);margin-top:2px;}

/* Poniżej pewnej wysokości jeden ekran przestaje być realny —
   wtedy wracamy do zwykłego przewijania zamiast ściskać treść. */
@media(max-height:620px),(max-width:1000px){
  html[data-widok="pulpit"],html[data-widok="pulpit"] body{overflow:auto;}
  html[data-widok="pulpit"] .app{height:auto;overflow:visible;}
  html[data-widok="pulpit"] .main{overflow:visible;}
  html[data-widok="pulpit"] .view{overflow:visible;display:block;}
  .pulpit-siatka{grid-template-columns:1fr;grid-template-rows:none;
    grid-template-areas:"teraz" "przedmioty" "plan" "slabe" "zapowiedzi";}
  .pl-blok{min-height:180px;}
  .pl-lista{overflow:visible;}
}

/* ── KALENDARZ ──────────────────────────────────────────────
   Siatka od poniedziałku, weekendy przygaszone (mniej się w nie uczy),
   terminy jako kolorowe pola z kropką, dziś w ramce. Pod spodem jedno
   zdanie z najbliższym terminem — czytelniejsze niż legenda kolorów. */
.kal-siatka{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;
  flex:1;min-height:0;align-content:safe center;}
.kal-h{font-style:normal;font-family:var(--f-mono);font-size:9px;
  color:var(--ink-3);text-align:center;padding-bottom:2px;letter-spacing:.04em;}
.kal-h.kal-we{color:color-mix(in srgb,var(--ink-3) 65%,transparent);}
.kal-pusta{font-style:normal;}
.kal-d{font-style:normal;position:relative;display:grid;place-items:center;
  height:clamp(17px,2.4vh,26px);border-radius:var(--r-sm);
  font-family:var(--f-mono);font-size:clamp(9px,1.15vh,11px);
  color:var(--ink-2);transition:background .16s var(--ease);}
.kal-d.kal-we{color:var(--ink-3);opacity:.55;}
.kal-d.kal-dzis{outline:1.5px solid var(--ink);outline-offset:-1.5px;
  color:var(--ink);font-weight:600;opacity:1;}
/* terminy: pole + kropka, żeby czytelne było też bez rozpoznawania koloru */
a.kal-d{color:var(--ink);font-weight:600;opacity:1;}
a.kal-d:hover{filter:brightness(.94);}
.kal-egz{background:color-mix(in srgb,#C2410C 14%,transparent);color:#C2410C;}
.kal-kolo{background:var(--accent-bg);color:var(--accent-ink);}
.kal-kropka{position:absolute;bottom:2px;left:50%;transform:translateX(-50%);
  width:3px;height:3px;border-radius:50%;background:currentColor;}
.kal-egz-k{position:static;transform:none;width:6px;height:6px;background:#C2410C;
  display:inline-block;flex:none;}
.kal-stopka{display:flex;align-items:center;gap:var(--s2);flex:none;
  padding-top:var(--s3);margin-top:var(--s2);border-top:1px solid var(--line);
  font-size:var(--t-xs);color:var(--ink-2);}
.kal-stopka b{font-weight:600;color:var(--ink);}

/* przy niższym oknie kafel akcji oddaje wysokość kalendarzowi */
@media(max-height:820px){
  .pulpit-siatka{grid-template-rows:minmax(0,1.15fr) minmax(0,1fr);}
  .pl-teraz{padding:var(--s6);gap:var(--s3);}
  .pl-dz{--r:clamp(64px,7.5vh,96px) !important;}
}
@media(max-height:620px),(max-width:1000px){
  .pulpit-siatka{grid-template-areas:"teraz" "przedmioty" "plan" "kalendarz" "slabe" "zapowiedzi";}
}

/* ── STAN PUSTY PULPITU ───────────────────────────────────────────
   Pierwszy ekran nowego użytkownika. Jedna oś, jedno wezwanie, duszek
   jako powitanie — bez sześciu pustych ramek udających interfejs. */
.pl-pusto{display:flex;flex-direction:column;align-items:center;text-align:center;
  justify-content:center;min-height:min(72vh,640px);padding:var(--s8) var(--s6);}
.pl-pusto-dz{--r:180px;margin-bottom:var(--s6);}
.pl-pusto h2{font-size:clamp(1.5rem,3vw,2rem);line-height:1.2;margin:0 0 var(--s4);}
.pl-pusto p{color:var(--ink-2);line-height:1.65;max-width:46ch;margin:0 0 var(--s8);}
.pl-pusto .btn{padding:14px 28px;}
.pl-pusto-mniej{font-size:var(--t-xs);color:var(--ink-3);margin:var(--s5) 0 0!important;}

/* ── WYRÓWNANIE NAGŁÓWKÓW BLOKÓW ──────────────────────────────────
   Zmierzone 2026-07-26: nagłówki sąsiadujących kart stały na pięciu
   różnych osiach (274 i 299 px w tym samym rzędzie) i miały dwa prawie
   identyczne stopnie, 18 i 18,4 px. Jedna oś i jeden stopień na sekcję. */
.pl-blok > h3, .pl-blok > .pl-h, .pl-blok > .lab{padding-left:0;margin-left:0;}
.pl-blok{padding-left:var(--s6);padding-right:var(--s6);}
.pl-blok h2, .pl-blok h3{font-size:1.05rem;}
