/* Komputerowka - Aplikacje edukacyjne. Plik tylko ASCII. */
.kapp{
  --kbg:#ffffff; --kfg:#141821; --kmuted:#596273; --kline:#e2e6ee; --ksoft:#f3f5f9; --kpage:transparent;
  --kfocus:#2f6fde; --kshadow:0 1px 2px rgba(20,24,33,.06),0 8px 24px rgba(20,24,33,.06);
  --kshadow-h:0 2px 4px rgba(20,24,33,.08),0 18px 40px rgba(20,24,33,.12);
  color:var(--kfg); background:var(--kpage); font-size:16px; line-height:1.5; box-sizing:border-box;
  margin:0 0 2em; text-align:left;
}
.kapp *,.kapp *::before,.kapp *::after{box-sizing:border-box}
.kapp [hidden]{display:none!important}
.kapp[data-theme="dark"]{
  --kbg:#1a1f2b; --kfg:#eef1f7; --kmuted:#a5adbf; --kline:#2d3547; --ksoft:#232a3a; --kpage:#11151e; --kfocus:#8db4ff;
  --kshadow:0 1px 2px rgba(0,0,0,.3); --kshadow-h:0 18px 40px rgba(0,0,0,.45);
  padding:clamp(16px,3vw,32px); border-radius:20px;
}
@media (prefers-color-scheme:dark){
  .kapp[data-theme="auto"]{
    --kbg:#1a1f2b; --kfg:#eef1f7; --kmuted:#a5adbf; --kline:#2d3547; --ksoft:#232a3a; --kpage:#11151e; --kfocus:#8db4ff;
    --kshadow:0 1px 2px rgba(0,0,0,.3); --kshadow-h:0 18px 40px rgba(0,0,0,.45);
    padding:clamp(16px,3vw,32px); border-radius:20px;
  }
}

/* reset stylow motywu */
.kapp a{text-decoration:none;box-shadow:none;border:0}
.kapp ul{list-style:none;margin:0;padding:0}
.kapp li{margin:0;padding:0}
.kapp li::before{content:none}
.kapp h2,.kapp h3,.kapp h4{margin:0;padding:0;color:var(--kfg);text-transform:none;letter-spacing:normal}
.kapp p{margin:0}
.kapp button{font:inherit;text-transform:none;letter-spacing:normal;line-height:1.2;margin:0;min-height:0;width:auto}
.kapp img{max-width:100%;height:auto;border:0;box-shadow:none;margin:0}
.kapp-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.kapp a:focus-visible,.kapp button:focus-visible,.kapp input:focus-visible{outline:3px solid var(--kfocus);outline-offset:2px}

/* naglowek */
.kapp-hero{margin-bottom:22px}
.kapp-hero-title{font-size:clamp(28px,4.4vw,44px)!important;line-height:1.1!important;font-weight:800!important;margin-bottom:10px!important}
.kapp-hero-intro{color:var(--kmuted);font-size:clamp(16px,1.6vw,19px);max-width:62ch}
.kapp-stats{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:16px!important}
.kapp-stats li{background:var(--ksoft);border:1px solid var(--kline);border-radius:999px;padding:5px 14px;font-size:14px;color:var(--kmuted)}
.kapp-stats b{color:var(--kfg);font-size:16px}

/* pasek: szukanie, losowanie, dzialy */
.kapp-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:10px}
.kapp-search{position:relative;flex:1 1 280px;max-width:460px}
.kapp-search svg{position:absolute;left:14px;top:50%;width:20px;height:20px;transform:translateY(-50%);fill:none;stroke:var(--kmuted);stroke-width:2.2;stroke-linecap:round;pointer-events:none}
.kapp .kapp-q{width:100%;height:46px;margin:0;padding:0 16px 0 44px;border:1.5px solid var(--kline);border-radius:999px;background:var(--kbg);color:var(--kfg);font:inherit;font-size:16px;box-shadow:none}
.kapp .kapp-q:focus{border-color:var(--kfocus);outline:none;box-shadow:0 0 0 3px rgba(47,111,222,.18)}
.kapp-chips{display:flex;flex-wrap:wrap;gap:8px;flex-basis:100%}
.kapp .kapp-chip{--kc:var(--kfg);display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 14px;border-radius:999px;border:1.5px solid var(--kline);background:var(--kbg);color:var(--kfg);font-size:15px;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.kapp .kapp-chip::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--kc)}
.kapp .kapp-chip[data-cat=""]::before{display:none}
.kapp .kapp-chip span{font-size:12px;font-weight:700;color:var(--kmuted);background:var(--ksoft);border-radius:999px;padding:2px 7px}
.kapp .kapp-chip:hover{border-color:var(--kc)}
.kapp .kapp-chip[aria-pressed="true"]{background:var(--kc);border-color:var(--kc);color:#fff}
.kapp .kapp-chip[data-cat=""][aria-pressed="true"]{background:var(--kfg);border-color:var(--kfg);color:var(--kbg)}
.kapp .kapp-chip[aria-pressed="true"] span{background:rgba(255,255,255,.22);color:inherit}
.kapp .kapp-chip[aria-pressed="true"]::before{background:#fff}
.kapp-count{color:var(--kmuted);font-size:14px;min-height:21px;margin:4px 0 14px!important}

/* siatka i karty */
.kapp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:22px}
.kapp-card{--kc:#64748b;position:relative;display:flex;flex-direction:column;background:var(--kbg);border:1px solid var(--kline);border-radius:18px;overflow:hidden;box-shadow:var(--kshadow);transition:transform .2s,box-shadow .2s}
.kapp-card:hover{transform:translateY(-4px);box-shadow:var(--kshadow-h)}
.kapp-thumb{position:relative;display:block;aspect-ratio:640/336;overflow:hidden;background:var(--ksoft);border-bottom:4px solid var(--kc)}
.kapp-thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:left center;transition:transform .35s}
.kapp-card:hover .kapp-thumb img{transform:scale(1.04)}
.kapp-ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:64px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,var(--kc),#1b2030)}
.kapp-body{display:flex;flex-direction:column;gap:9px;padding:16px 18px 18px;flex:1}
.kapp-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.kapp-cat{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--kc)}
.kapp-cat::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--kc)}
.kapp-new{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:linear-gradient(90deg,#ff5a3c,#ff9b2f);border-radius:999px;padding:3px 9px}
.kapp-title{font-size:21px!important;line-height:1.2!important;font-weight:800!important}
.kapp-title a{color:inherit!important}
.kapp-title a:hover{color:var(--kc)!important}
.kapp-desc{color:var(--kmuted);font-size:15px}
.kapp-tags{display:flex;flex-wrap:wrap;gap:6px}
.kapp-tags li{font-size:12px;color:var(--kmuted);background:var(--ksoft);border-radius:6px;padding:2px 8px}
.kapp-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:6px}
.kapp .kapp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 16px;border-radius:11px;border:1.5px solid var(--kline);background:var(--kbg);color:var(--kfg);font-size:15px;font-weight:700;cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.kapp .kapp-btn:hover{border-color:var(--kc,var(--kfg));transform:translateY(-1px)}
.kapp .kapp-btn--main{background:var(--kc);border-color:var(--kc);color:#fff!important}
.kapp .kapp-btn--main::after{content:"\2192";font-weight:800}
.kapp .kapp-btn--main:hover{filter:brightness(1.08)}
.kapp .kapp-random{--kc:var(--kfg);height:46px;border-radius:999px}

/* wkrotce */
.kapp-card.is-soon{box-shadow:none;border-style:dashed}
.kapp-card.is-soon:hover{transform:none;box-shadow:none}
.kapp-card.is-soon .kapp-thumb{background:repeating-linear-gradient(135deg,var(--ksoft) 0 14px,var(--kbg) 14px 28px)}
.kapp-card.is-soon .kapp-ph{background:none;color:var(--kc);opacity:.35}
.kapp-soon-badge{position:absolute;right:12px;top:12px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:var(--kfg);color:var(--kbg);border-radius:999px;padding:4px 11px}
.kapp-soon-note{font-size:14px;color:var(--kmuted);font-style:italic;margin-top:auto!important}

/* wylosowana karta */
.kapp-card.is-picked{animation:kapp-pick 1.6s ease-out 1}
@keyframes kapp-pick{0%{box-shadow:0 0 0 0 var(--kc)}25%{box-shadow:0 0 0 8px var(--kc)}100%{box-shadow:0 0 0 0 transparent}}

.kapp-empty{text-align:center;padding:40px 16px;border:2px dashed var(--kline);border-radius:18px;color:var(--kmuted)}

/* karta pozioma do wpisow */
.kapp-single{margin:1.6em 0}
.kapp-card--wide{max-width:900px}
@media (min-width:640px){
  .kapp-card--wide{flex-direction:row}
  .kapp-card--wide .kapp-thumb{flex:0 0 42%;aspect-ratio:auto;min-height:220px;border-bottom:0;border-right:4px solid var(--kc)}
  .kapp-card--wide .kapp-body{padding:20px 24px}
}

/* zobacz tez */
.kapp-related{margin:2em 0}
.kapp-related-title{font-size:24px!important;font-weight:800!important;margin-bottom:14px!important}
.kapp-grid--small{grid-template-columns:repeat(auto-fill,minmax(min(100%,180px),1fr));gap:16px}
.kapp-card--small .kapp-title{font-size:18px!important}
.kapp-card--small .kapp-desc{font-size:14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.kapp-card--small .kapp-body{padding:12px 14px 14px}

@media (max-width:520px){
  .kapp-search{max-width:none}
  .kapp .kapp-random{flex:1 1 100%}
  .kapp-chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;margin-inline:-2px;scrollbar-width:thin}
  .kapp .kapp-chip{flex:0 0 auto}
}
@media (prefers-reduced-motion:reduce){
  .kapp *{transition:none!important;animation:none!important}
}