@font-face{font-family:'LE Nunito';font-weight:400;font-display:swap;src:url(assets/fonts/le-nunito-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'LE Nunito';font-weight:400;font-display:swap;src:url(assets/fonts/le-nunito-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2190-2193,U+20AC,U+2122}
@font-face{font-family:'LE Nunito';font-weight:600;font-display:swap;src:url(assets/fonts/le-nunito-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'LE Nunito';font-weight:600;font-display:swap;src:url(assets/fonts/le-nunito-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2190-2193,U+20AC,U+2122}
@font-face{font-family:'LE Nunito';font-weight:700;font-display:swap;src:url(assets/fonts/le-nunito-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'LE Nunito';font-weight:700;font-display:swap;src:url(assets/fonts/le-nunito-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2190-2193,U+20AC,U+2122}
@font-face{font-family:'LE Nunito';font-weight:800;font-display:swap;src:url(assets/fonts/le-nunito-800-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'LE Nunito';font-weight:800;font-display:swap;src:url(assets/fonts/le-nunito-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2190-2193,U+20AC,U+2122}
@font-face{font-family:'LE Baloo';font-weight:700;font-display:swap;src:url(assets/fonts/le-baloo-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'LE Baloo';font-weight:700;font-display:swap;src:url(assets/fonts/le-baloo-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2190-2193,U+20AC,U+2122}
@font-face{font-family:'LE Baloo';font-weight:800;font-display:swap;src:url(assets/fonts/le-baloo-800-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'LE Baloo';font-weight:800;font-display:swap;src:url(assets/fonts/le-baloo-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2190-2193,U+20AC,U+2122}

:root{
  --navy-950:#0f1330;--navy-900:#151a3d;--navy-800:#1f2656;--ink:#1d2550;--ink-2:#4a5078;--ink-3:#7b809e;
  --violet-700:#5a2fc2;--violet-600:#6d3fd1;--violet-500:#8b5cf6;--lav-100:#f3eeff;--lav-200:#e6dcff;--lav-300:#d3c3ff;
  --gold-300:#ffe08a;--gold-400:#f4c542;--gold-500:#e0a91b;
  --success-500:#14a06a;--success-100:#dcf6ea;--amber-500:#e3901a;--amber-100:#fff1d9;--coral:#ef6b5b;
  --c5:#2f6fe4;--c5-soft:#e4edff;
  --paper:#f7f5fb;--card:#ffffff;--line:#e7e3f1;
  --radius:20px;--radius-s:14px;
  --shadow-s:0 1px 2px rgb(21 26 61/.06),0 2px 8px rgb(21 26 61/.05);
  --shadow-m:0 10px 30px -8px rgb(21 26 61/.18);
  --shadow-l:0 24px 60px -18px rgb(21 26 61/.35);
  --ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.34,1.56,.64,1);
  --dur:240ms;
  --font:'LE Nunito',system-ui,sans-serif;--display:'LE Baloo','LE Nunito',system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:var(--font);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:hidden}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;-webkit-tap-highlight-color:transparent}
input{font:inherit}
h1,h2,h3{font-family:var(--display);margin:0;line-height:1.1;letter-spacing:-.01em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
svg.i{width:22px;height:22px;flex:none;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* ───────── App shell ───────── */
.app{display:grid;grid-template-columns:252px 1fr;min-height:100vh}
.side{position:sticky;top:0;height:100vh;padding:22px 16px;display:flex;flex-direction:column;gap:6px;background:#fff;border-right:1px solid var(--line)}
.side .logo{display:flex;align-items:center;gap:10px;padding:4px 10px 18px}
.side .logo img{height:44px}
.nav-item{display:flex;align-items:center;gap:13px;padding:12px 14px;border-radius:14px;font-weight:700;color:var(--ink-2);transition:background var(--dur) var(--ease),color var(--dur)}
.nav-item:hover{background:var(--lav-100);color:var(--ink)}
.nav-item.on{background:var(--lav-100);color:var(--violet-700)}
.nav-item .pill{margin-left:auto;font-size:12px;background:var(--violet-600);color:#fff;border-radius:99px;padding:1px 8px}
.side .me{margin-top:auto;padding:14px;border-radius:18px;background:linear-gradient(145deg,var(--navy-900),var(--navy-800));color:#fff;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:center}
.avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:linear-gradient(135deg,var(--violet-500),var(--c5));color:#fff;box-shadow:0 0 0 3px var(--gold-400)}
.me small{opacity:.7;font-size:12px}
.me .lvl{grid-column:1/-1;height:6px;border-radius:9px;background:rgb(255 255 255/.14);overflow:hidden;margin-top:8px}
.me .lvl span{display:block;height:100%;background:linear-gradient(90deg,var(--gold-400),#fff2b8);border-radius:9px}
.main{min-width:0}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:14px 32px;background:rgb(247 245 251/.8);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.topbar .crumb{font-weight:700;color:var(--ink-3)}
.stat{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);font-weight:800;font-variant-numeric:tabular-nums}
.stat.xp{color:var(--violet-700)} .stat.xp svg{color:var(--gold-500)}
.stat.fire{color:#e0561b}
.spacer{flex:1}
.tabbar{display:none}
.page{padding:8px 32px 60px;max-width:1240px}
.screen{animation:screenIn .45s var(--ease) backwards} /* backwards: po animacji nie zostaje transform — inaczej pasek dolny i przycisk „Tekst” (position:fixed) przestają być przyklejone do ekranu */
@keyframes screenIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ───────── Cards ───────── */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow-s);border:1px solid var(--line);padding:22px;position:relative;overflow:hidden}
.card.hover{transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.card.hover:hover{transform:translateY(-3px);box-shadow:var(--shadow-m)}
.card.glow::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgb(139 92 246/.10),transparent 45%);opacity:0;transition:opacity .3s}
.card.glow:hover::after{opacity:1}
.eyebrow{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border-radius:16px;font-weight:800;position:relative;overflow:hidden;transition:transform .12s var(--ease),box-shadow var(--dur),background var(--dur)}
.btn:active{transform:scale(.97)}
.btn.primary{background:linear-gradient(180deg,var(--violet-500),var(--violet-600));color:#fff;box-shadow:0 8px 20px -6px rgb(109 63 209/.6),inset 0 1px 0 rgb(255 255 255/.25)}
.btn.primary:hover{box-shadow:0 12px 26px -6px rgb(109 63 209/.7),inset 0 1px 0 rgb(255 255 255/.25)}
.btn.gold{background:linear-gradient(180deg,#ffd862,var(--gold-400));color:var(--navy-900);box-shadow:0 8px 20px -8px rgb(224 169 27/.8),inset 0 1px 0 rgb(255 255 255/.6)}
.btn.ghost{background:#fff;border:1.5px solid var(--line);color:var(--ink)}
.btn.ghost:hover{border-color:var(--lav-300);background:var(--lav-100)}
.btn.small{min-height:40px;padding:0 16px;border-radius:12px;font-size:14px}
.ripple{position:absolute;border-radius:50%;background:rgb(255 255 255/.45);transform:scale(0);animation:ripple .55s ease-out forwards;pointer-events:none}
@keyframes ripple{to{transform:scale(4);opacity:0}}

/* ───────── Dashboard ───────── */
.hero{position:relative;border-radius:28px;padding:34px 36px 30px;color:#fff;overflow:hidden;background:var(--navy-900);isolation:isolate;box-shadow:var(--shadow-l)}
.aurora{position:absolute;inset:-20%;z-index:-1;filter:blur(60px);opacity:.9}
.aurora i{position:absolute;border-radius:50%;mix-blend-mode:screen}
.aurora i:nth-child(1){width:55%;height:70%;left:0;top:10%;background:#5a2fc2;animation:float1 22s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:45%;height:60%;right:0;top:0;background:#2f6fe4;animation:float2 26s ease-in-out infinite alternate}
.aurora i:nth-child(3){width:35%;height:45%;left:40%;bottom:-5%;background:#c98a12;opacity:.55;animation:float3 30s ease-in-out infinite alternate}
@keyframes float1{to{transform:translate(18%,12%) scale(1.15)}}
@keyframes float2{to{transform:translate(-22%,18%) scale(.9)}}
@keyframes float3{to{transform:translate(-25%,-20%) scale(1.2)}}
.hero-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:28px;align-items:end}
.hero h1{font-size:clamp(30px,3.4vw,44px)}
.hero p{margin:8px 0 0;color:rgb(255 255 255/.78);font-size:17px}
.hero .chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.hero .chip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:99px;background:rgb(255 255 255/.1);border:1px solid rgb(255 255 255/.14);font-weight:700;font-size:14px;backdrop-filter:blur(8px)}
.levelbox{padding:18px 20px;border-radius:20px;background:rgb(255 255 255/.08);border:1px solid rgb(255 255 255/.14);backdrop-filter:blur(10px)}
.levelbox .row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.levelbox b{font-family:var(--display);font-size:22px}
.bar{height:12px;border-radius:99px;background:rgb(255 255 255/.14);overflow:hidden;margin-top:10px;position:relative}
.bar span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--gold-400),#fff0b0);position:relative;transition:width 1.2s var(--ease)}
.bar span::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgb(255 255 255/.7),transparent);transform:translateX(-100%);animation:shine 2.6s 1s ease-in-out infinite}
@keyframes shine{to{transform:translateX(100%)}}
.week{display:flex;gap:8px;margin-top:14px}
.week span{flex:1;text-align:center;font-size:11px;font-weight:800;color:rgb(255 255 255/.6)}
.week span i{display:block;height:28px;border-radius:9px;margin-bottom:5px;background:rgb(255 255 255/.1);border:1px solid rgb(255 255 255/.12)}
.week span.done i{background:linear-gradient(180deg,#ff9a3c,#e0561b);border-color:transparent;box-shadow:0 4px 12px -4px #e0561b}
.week span.today i{border:2px dashed var(--gold-400)}

.dash-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:22px;margin-top:22px}
.continue{display:grid;grid-template-columns:230px 1fr;padding:0;min-height:236px}
.continue .ph{background:center/cover no-repeat;position:relative}
.continue .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,#fff)}
.continue .body{padding:24px 26px;display:flex;flex-direction:column;gap:10px}
.continue h2{font-size:28px}
.seg{display:flex;gap:5px}
.seg i{flex:1;height:8px;border-radius:9px;background:var(--lav-200)}
.seg i.on{background:linear-gradient(90deg,var(--c5),#5b93ff)}
.seg i.half{background:linear-gradient(90deg,var(--c5) 50%,var(--lav-200) 50%)}
.meta{display:flex;gap:16px;flex-wrap:wrap;color:var(--ink-2);font-weight:700;font-size:14px}
.meta span{display:inline-flex;align-items:center;gap:6px}
.meta svg{width:17px;height:17px}
.goals{display:grid;grid-template-columns:132px 1fr;gap:18px;align-items:center}
.rings{width:132px;height:132px}
.rings circle{fill:none;stroke-width:11;stroke-linecap:round}
.rings .t{stroke:var(--lav-100)}
.rings .v{transition:stroke-dashoffset 1.4s var(--ease);transform:rotate(-90deg);transform-origin:center}
.goal-list{display:grid;gap:10px}
.goal-list div{display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px}
.goal-list .dot{width:12px;height:12px;border-radius:50%}
.goal-list small{margin-left:auto;color:var(--ink-3);font-variant-numeric:tabular-nums}
.trail-card{margin-top:22px}
.mini-trail{display:flex;align-items:center;gap:0;margin:18px 0 6px;overflow-x:auto;padding-bottom:6px}
.mini-trail .n{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:#fff;border:2.5px solid var(--lav-300);color:var(--ink-3);position:relative}
.mini-trail .n.done{background:var(--c5);border-color:var(--c5);color:#fff}
.mini-trail .n.cur{border-color:var(--gold-400);color:var(--ink);box-shadow:0 0 0 6px rgb(244 197 66/.25);animation:pulse 2s ease-in-out infinite}
.mini-trail .l{flex:1;min-width:26px;height:4px;background:repeating-linear-gradient(90deg,var(--lav-300) 0 6px,transparent 6px 12px)}
.mini-trail .l.done{background:var(--c5)}
@keyframes pulse{50%{box-shadow:0 0 0 12px rgb(244 197 66/.08)}}
.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:22px}
.row3 h3{font-size:21px;margin:6px 0 4px}
.row3 p{margin:0;color:var(--ink-2)}
.medals{display:flex;gap:10px;margin:12px 0}
.pin{display:flex;align-items:center;gap:16px;margin-top:22px;border-left:5px solid var(--gold-400)}
.pin h3{font-size:19px}

/* ───────── Path ───────── */
.path-wrap{display:grid;grid-template-columns:1fr 360px;gap:26px;align-items:start}
.chapter{border-radius:26px;padding:26px 28px;color:#fff;position:relative;overflow:hidden;background:var(--navy-900);margin-bottom:10px;min-height:150px;display:flex;flex-direction:column;justify-content:flex-end}
.chapter .bg{position:absolute;inset:0;background:center/cover;filter:saturate(.25) contrast(1.05);transition:filter 1.2s}
.chapter .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgb(21 26 61/.92),rgb(47 111 228/.55))}
.chapter.colored .bg{filter:saturate(1)}
.chapter > *{position:relative}
.chapter h2{font-size:30px}
.chapter .bar{max-width:320px}
.map{position:relative;margin:0 auto;max-width:560px}
.map svg.trail{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.map .trail .base{fill:none;stroke:var(--lav-300);stroke-width:6;stroke-dasharray:2 12;stroke-linecap:round}
.map .trail .prog{fill:none;stroke:url(#tg);stroke-width:8;stroke-linecap:round}
.node{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:8px;width:150px}
.node button{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-size:26px;font-weight:800;background:#fff;color:var(--ink-3);border:3px solid var(--lav-300);box-shadow:0 6px 0 var(--lav-200),var(--shadow-s);transition:transform .2s var(--spring),box-shadow .2s;position:relative}
.node button:hover{transform:translateY(-3px) scale(1.04)}
.node button:active{transform:translateY(3px);box-shadow:0 2px 0 var(--lav-200)}
.node.done button{background:linear-gradient(180deg,#4f8cff,var(--c5));color:#fff;border-color:#1f58c5;box-shadow:0 6px 0 #1a4aa6,var(--shadow-m)}
.node.cur button{border-color:var(--gold-400);color:var(--ink);box-shadow:0 6px 0 var(--gold-500),0 0 0 10px rgb(244 197 66/.22);animation:pulse 2.2s ease-in-out infinite}
.node .ring{position:absolute;inset:-8px;width:calc(100% + 16px);height:calc(100% + 16px);transform:rotate(-90deg)}
.node .ring circle{fill:none;stroke-width:5;stroke-linecap:round}
.node .crown{position:absolute;top:-16px;font-size:22px;filter:drop-shadow(0 2px 2px rgb(0 0 0/.2))}
.node .lbl{font-weight:800;font-size:13px;text-align:center;line-height:1.25;color:var(--ink-2);background:rgb(247 245 251/.9);border-radius:10px;padding:2px 6px}
.node.sel .lbl{color:var(--violet-700)}
.node.special button{border-radius:22px;background:linear-gradient(180deg,#ffe38f,var(--gold-400));border-color:var(--gold-500);color:var(--navy-900);box-shadow:0 6px 0 var(--gold-500)}
.detail{position:sticky;top:90px}
.detail .ph{height:170px;margin:-22px -22px 18px;background:center/cover}
.detail h2{font-size:27px;margin:4px 0 6px}
.checklist{list-style:none;padding:0;margin:16px 0;display:grid;gap:8px}
.checklist li{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--ink-2)}
.checklist li i{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;font-style:normal;font-size:13px;background:var(--lav-100);color:var(--violet-600)}
.checklist li.ok i{background:var(--success-100);color:var(--success-500)}

/* ───────── Focus mode (lesson) ───────── */
body.focus .app{grid-template-columns:1fr}
body.focus .side,body.focus .topbar,body.focus .tabbar{display:none!important}
body.focus .page{max-width:none;padding:0}
.lesson-bg{min-height:100vh;background:radial-gradient(900px 500px at 85% -10%,var(--c5-soft),transparent 60%),radial-gradient(700px 500px at -10% 110%,var(--lav-100),transparent 60%),var(--paper)}
.intro{max-width:980px;margin:0 auto;padding:28px 24px 50px}
.intro-card{display:grid;grid-template-columns:1fr 1fr;padding:0;min-height:520px;border-radius:30px;box-shadow:var(--shadow-l)}
.intro-card .ph{background:center/cover;position:relative}
.intro-card .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgb(21 26 61/.55),transparent 50%)}
.intro-card .ph span{position:absolute;left:22px;bottom:20px;z-index:1;color:#fff;font-weight:800;padding:7px 12px;border-radius:99px;background:rgb(255 255 255/.18);backdrop-filter:blur(8px)}
.intro-card .body{padding:36px 36px 30px;display:flex;flex-direction:column;gap:14px}
.intro-card h1{font-size:40px}
.goal-line{font-size:18px;color:var(--ink-2);margin:0}
.minigoals{display:flex;flex-wrap:wrap;gap:8px}
.minigoals span{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:12px;background:var(--lav-100);font-weight:700;font-size:14px;animation:pop .5s var(--spring) both}
.minigoals span i{width:10px;height:10px;transform:rotate(45deg);border-radius:2px;background:var(--lav-300)}
.minigoals span.ok i{background:var(--gold-400)}
@keyframes pop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px}
.facts div{padding:12px;border-radius:14px;background:var(--paper);text-align:center}
.facts b{display:block;font-family:var(--display);font-size:24px}
.facts small{color:var(--ink-3);font-weight:700}
.linkbtn{color:var(--violet-700);font-weight:800;text-decoration:underline;text-underline-offset:3px}

/* Player */
.player{min-height:100vh;display:flex;flex-direction:column}
.ptop{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:14px;padding:12px 24px;background:rgb(247 245 251/.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.iconbtn{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;color:var(--ink-2);transition:background .2s}
.iconbtn:hover{background:var(--lav-100);color:var(--ink)}
.iconbtn[aria-pressed=false]{opacity:.45}
.steps{flex:1;display:flex;gap:6px;align-items:center}
.steps button{flex:1;height:14px;border-radius:99px;background:var(--lav-200);position:relative;overflow:hidden;transition:transform .2s var(--spring)}
.steps button:hover{transform:scaleY(1.35)}
.steps button span{position:absolute;inset:0;width:0;background:linear-gradient(90deg,var(--c5),#6aa0ff);border-radius:99px;transition:width .6s var(--ease)}
.steps button.cur{outline:2.5px solid var(--gold-400);outline-offset:2px}
.steps button.full span::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgb(255 255 255/.8),transparent);animation:shine 1s ease-out 1}
.pbody{flex:1;width:100%;max-width:880px;margin:0 auto;padding:26px 24px 140px}
.shead{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px}
.stype{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;color:#fff;flex:none;box-shadow:var(--shadow-m)}
.shead h2{font-size:28px}
.shead p{margin:4px 0 0;color:var(--ink-2)}
.qdots{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px}
.qdots button{width:30px;height:30px;border-radius:10px;font-weight:800;font-size:13px;background:#fff;border:1.5px solid var(--line);color:var(--ink-3);transition:transform .15s var(--spring)}
.qdots button:hover{transform:translateY(-2px)}
.qdots button.cur{border-color:var(--violet-500);color:var(--violet-700);box-shadow:0 0 0 3px var(--lav-200)}
.qdots button.ok{background:var(--success-500);border-color:var(--success-500);color:#fff}
.qdots button.half{background:var(--gold-400);border-color:var(--gold-400);color:var(--navy-900)}
.qdots button.shown{background:var(--lav-200);border-color:var(--lav-300);color:var(--ink-2)}
.qdots button.skip{border-style:dashed}
.qstage{position:relative;min-height:380px}
.qcard{background:#fff;border-radius:26px;box-shadow:var(--shadow-m);border:1px solid var(--line);padding:30px;position:relative}
.qcard.in{animation:cardIn .45s var(--ease) both}
.qcard.out{animation:cardOut .28s var(--ease) both;pointer-events:none}
@keyframes cardIn{from{opacity:0;transform:translateX(50px) scale(.98)}to{opacity:1;transform:none}}
@keyframes cardOut{to{opacity:0;transform:translateX(-50px) scale(.98)}}
.qcard .qnum{font-weight:800;color:var(--ink-3);font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.prompt{font-size:clamp(22px,2.6vw,30px);font-weight:700;line-height:1.45;margin:12px 0 22px}
.prompt .word{font-family:var(--display);font-size:clamp(34px,4vw,48px);display:inline-flex;align-items:center;gap:12px}
.say{width:44px;height:44px;border-radius:50%;display:inline-grid;place-items:center;background:var(--lav-100);color:var(--violet-700);vertical-align:middle;transition:transform .15s var(--spring)}
.say:hover{transform:scale(1.08)}
.gap{display:inline-flex;align-items:center;justify-content:center;min-width:140px;min-height:48px;padding:0 14px;margin:0 4px;border-radius:14px;border:2.5px dashed var(--lav-300);background:var(--lav-100);color:var(--violet-700);font-weight:800;vertical-align:middle;transition:all .25s var(--ease)}
.gap.filled{border-style:solid;border-color:var(--violet-500);background:#fff}
.gap.ok{border-color:var(--success-500);background:var(--success-100);color:#0c7a50}
.gap.bad{border-color:var(--amber-500);background:var(--amber-100);color:#9a5a00}
.tinput{width:100%;min-height:62px;padding:0 20px;border-radius:18px;border:2.5px solid var(--line);font-size:22px;font-weight:700;color:var(--ink);background:#fff;transition:border-color .2s,box-shadow .2s;outline:none}
.tinput:focus{border-color:var(--violet-500);box-shadow:0 0 0 5px var(--lav-200)}
.tinput.ok{border-color:var(--success-500);background:var(--success-100)}
.tinput.bad{border-color:var(--amber-500);background:var(--amber-100)}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.wchip{min-height:48px;padding:0 18px;border-radius:14px;background:#fff;border:2px solid var(--line);box-shadow:0 3px 0 var(--line);font-weight:800;font-size:17px;transition:transform .15s var(--spring),box-shadow .15s,opacity .25s,border-color .2s}
.wchip:hover{transform:translateY(-2px);border-color:var(--lav-300)}
.wchip:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
.wchip.used{opacity:.25;pointer-events:none;transform:scale(.94)}
.wchip.sel{border-color:var(--violet-500);box-shadow:0 3px 0 var(--violet-500);background:var(--lav-100)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px}
.tile{min-height:92px;border-radius:20px;background:#fff;border:2.5px solid var(--line);box-shadow:0 5px 0 var(--line);font-family:var(--display);font-size:28px;font-weight:800;transition:transform .15s var(--spring),box-shadow .15s,border-color .2s,background .2s,opacity .3s}
.tile:hover{transform:translateY(-3px);border-color:var(--lav-300)}
.tile:active{transform:translateY(3px);box-shadow:0 2px 0 var(--line)}
.tile.ok{border-color:var(--success-500);background:var(--success-100);box-shadow:0 5px 0 #0f8a5a;color:#0c7a50}
.tile.bad{border-color:var(--amber-500);background:var(--amber-100);box-shadow:0 5px 0 #c77a0c}
.tile.dim{opacity:.22;pointer-events:none}
.pics{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.pic{aspect-ratio:1.25;border-radius:18px;border:2.5px solid var(--line);background-color:#fff;background-image:url(assets/class5-school-items.webp);background-size:500% 300%;box-shadow:0 5px 0 var(--line);transition:transform .15s var(--spring),box-shadow .15s,border-color .2s,opacity .3s,filter .3s}
.pic:hover{transform:translateY(-3px) rotate(-1deg);border-color:var(--lav-300)}
.pic.ok{border-color:var(--success-500);box-shadow:0 5px 0 #0f8a5a,0 0 0 5px var(--success-100)}
.pic.bad{border-color:var(--amber-500);box-shadow:0 5px 0 #c77a0c}
.pic.dim{opacity:.18;filter:grayscale(1);pointer-events:none}
.pic.taken{opacity:.35}
.builder{min-height:74px;border-radius:18px;border:2.5px dashed var(--lav-300);background:var(--lav-100);padding:12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px;transition:border-color .2s,background .2s}
.builder.ok{border-style:solid;border-color:var(--success-500);background:var(--success-100)}
.builder.bad{border-style:solid;border-color:var(--amber-500);background:var(--amber-100)}
.builder:empty::before{content:"Stukaj słowa w dobrej kolejności…";color:var(--ink-3);font-weight:700;padding:0 8px}
.shake{animation:shake .42s ease}
@keyframes shake{20%{transform:translateX(-7px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(2px)}}
.feedback{margin-top:22px;border-radius:18px;padding:16px 18px;display:flex;align-items:center;gap:14px;font-weight:700;animation:fbIn .35s var(--ease) both}
.feedback.ok{background:var(--success-100);color:#0c6e48}
.feedback.bad{background:var(--amber-100);color:#8a5100}
.feedback.shown{background:var(--lav-100);color:var(--ink)}
.feedback .fbi{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:none;background:#fff}
.feedback .grow{flex:1}
.feedback small{display:block;font-weight:600;opacity:.85;margin-top:2px}
@keyframes fbIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.check-draw path{stroke-dasharray:30;stroke-dashoffset:30;animation:draw .45s .05s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.pbar{position:fixed;left:0;right:0;bottom:0;z-index:30;background:rgb(255 255 255/.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:12px 24px calc(12px + env(safe-area-inset-bottom))}
.pbar .in{max-width:880px;margin:0 auto;display:flex;gap:10px;align-items:center}
.combo{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:#e0561b;opacity:0;transform:scale(.6);transition:all .35s var(--spring)}
.combo.on{opacity:1;transform:none}
/* grouping */
.bank{display:flex;flex-wrap:wrap;gap:10px;min-height:60px;padding:14px;border-radius:18px;background:var(--lav-100);margin-bottom:18px}
.buckets{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:14px}
.bucket{min-height:220px;border-radius:22px;background:#fff;border:2.5px solid var(--line);padding:14px;display:flex;flex-direction:column;gap:8px;transition:border-color .2s,transform .2s var(--spring),background .2s}
.bucket h4{margin:0 0 4px;font-family:var(--display);font-size:19px;display:flex;align-items:center;gap:8px}
.bucket.target{border-color:var(--violet-500);background:var(--lav-100);transform:scale(1.02)}
.bucket.bad{animation:shake .42s}
.bucket .placed{padding:8px 12px;border-radius:12px;font-weight:800;background:var(--success-100);color:#0c6e48;animation:pop .35s var(--spring) both;display:flex;justify-content:space-between;gap:8px;min-width:0;overflow-wrap:anywhere}
.bucket .placed.shown{background:var(--lav-100);color:var(--ink-2)}
.wchip[draggable=true]{cursor:grab}
/* drawer */
.scrim{position:fixed;inset:0;z-index:60;background:rgb(15 19 48/.35);backdrop-filter:blur(3px);animation:fade .25s both}
@keyframes fade{from{opacity:0}}
.drawer{position:fixed;z-index:61;top:0;right:0;bottom:0;width:min(420px,92vw);background:#fff;box-shadow:var(--shadow-l);padding:24px;overflow:auto;animation:slide .35s var(--ease) both}
@keyframes slide{from{transform:translateX(100%)}}
.drawer h3{font-size:24px;margin-bottom:14px}
.dstep{padding:14px 0;border-top:1px solid var(--line)}
.dstep header{display:flex;justify-content:space-between;align-items:center;font-weight:800;margin-bottom:10px}
/* interstitial */
.inter{position:fixed;inset:0;z-index:70;display:grid;place-items:center;background:rgb(15 19 48/.55);backdrop-filter:blur(6px);animation:fade .25s both}
.inter .box{background:#fff;border-radius:28px;padding:34px 40px;text-align:center;box-shadow:var(--shadow-l);animation:pop .5s var(--spring) both;max-width:380px}
.diamond{width:78px;height:78px;margin:0 auto 14px;transform:rotate(45deg);border-radius:18px;background:linear-gradient(135deg,#ffe38f,var(--gold-500));box-shadow:0 12px 30px -8px var(--gold-500);display:grid;place-items:center}
.diamond svg{transform:rotate(-45deg);color:var(--navy-900);width:36px;height:36px}
.inter h3{font-size:26px}
.inter p{color:var(--ink-2);margin:6px 0 0;font-weight:700}
/* XP burst */
.burst{position:fixed;z-index:80;pointer-events:none;font-weight:800;color:var(--violet-700);background:#fff;padding:6px 12px;border-radius:99px;box-shadow:var(--shadow-m);border:2px solid var(--gold-400);white-space:nowrap}
.bump{animation:bump .45s var(--spring)}
@keyframes bump{40%{transform:scale(1.22)}}
/* summary */
.summary{max-width:760px;margin:0 auto;padding:40px 24px 60px;text-align:center}
.summary h1{font-size:44px;margin:8px 0}
.sumgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:26px 0}
.sumgrid .card{padding:18px}
.sumgrid b{display:block;font-family:var(--display);font-size:38px;font-variant-numeric:tabular-nums}
.sumgrid small{color:var(--ink-3);font-weight:800}
.acc{width:110px;height:110px;margin:0 auto}
.lvlcard{text-align:left}
.lvlcard .bar{background:var(--lav-100);height:16px}
.badge-reveal{perspective:900px;margin:22px auto 6px;width:140px;height:140px}
.badge-reveal .flip{width:100%;height:100%;transform-style:preserve-3d;animation:flip 1.4s .9s var(--ease) both}
@keyframes flip{from{transform:rotateY(-540deg) scale(.3);opacity:0}to{transform:none;opacity:1}}
.medal{width:100%;height:100%}
.medal .shine{animation:sweep 2.8s 2.3s ease-in-out infinite}
@keyframes sweep{0%{transform:translateX(-140px)}60%,100%{transform:translateX(140px)}}
.todo{text-align:left;display:grid;gap:10px;margin-top:22px}
.todo .card{padding:16px 18px;display:flex;gap:14px;align-items:center}
.todo .tag{font-weight:800;font-size:12px;padding:4px 9px;border-radius:99px;background:var(--amber-100);color:#8a5100}
.todo .tag.open{background:var(--lav-100);color:var(--violet-700)}
canvas.confetti{position:fixed;inset:0;z-index:90;pointer-events:none;width:100%;height:100%}
/* badges page */
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px}
.badge{text-align:center;padding:20px 14px}
.badge .m{width:108px;height:108px;margin:0 auto 10px;transition:transform .5s var(--spring)}
.badge:hover .m{transform:rotateY(18deg) rotateX(8deg) scale(1.06)}
.badge.locked .m{filter:grayscale(1);opacity:.35}
.badge h3{font-size:18px}
.badge p{margin:4px 0 0;font-size:13px;color:var(--ink-3);font-weight:700}
/* league */
.podium{display:grid;grid-template-columns:1fr 1.1fr 1fr;align-items:end;gap:14px;max-width:620px;margin:10px auto 26px}
.podium div{text-align:center}
.podium .col{border-radius:18px 18px 6px 6px;color:#fff;font-family:var(--display);font-size:34px;display:grid;place-items:center;box-shadow:var(--shadow-m)}
.podium .p1 .col{height:150px;background:linear-gradient(180deg,#ffd862,var(--gold-500));color:var(--navy-900)}
.podium .p2 .col{height:110px;background:linear-gradient(180deg,#d9dde8,#9aa3bb)}
.podium .p3 .col{height:86px;background:linear-gradient(180deg,#f1b88a,#c27a45)}
.podium .avatar{margin:0 auto 8px}
.lrow{display:grid;grid-template-columns:44px 44px 1fr auto;align-items:center;gap:12px;padding:12px 16px;border-radius:16px;background:#fff;border:1px solid var(--line);margin-bottom:8px;font-weight:800;animation:screenIn .4s var(--ease) both}
.lrow.you{border:2px solid var(--violet-500);background:var(--lav-100)}
.lrow .r{color:var(--ink-3);text-align:center}
.vs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.vs b{font-family:var(--display);font-size:32px}
/* flashcards */
.fc-wrap{perspective:1200px;max-width:520px;margin:20px auto}
.fc{height:300px;position:relative;transform-style:preserve-3d;transition:transform .7s var(--ease);cursor:pointer}
.fc.flip{transform:rotateY(180deg)}
.fc .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:28px;display:grid;place-items:center;text-align:center;padding:26px;box-shadow:var(--shadow-l)}
.fc .front{background:#fff;border:1px solid var(--line)}
.fc .back{background:linear-gradient(145deg,var(--navy-900),var(--violet-700));color:#fff;transform:rotateY(180deg)}
.fc .big{font-family:var(--display);font-size:46px}
.toast{position:fixed;left:50%;bottom:110px;transform:translateX(-50%);z-index:95;background:var(--navy-900);color:#fff;padding:12px 18px;border-radius:14px;font-weight:700;box-shadow:var(--shadow-l);animation:fbIn .3s both}
.note-proto{font-size:12px;color:var(--ink-3);font-weight:700;margin-top:14px}

/* ───────── Responsive ───────── */
@media (max-width:1100px){.hero-grid,.dash-grid{grid-template-columns:1fr}.path-wrap{grid-template-columns:1fr}.detail{position:static}}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  .side{display:none}
  .topbar{padding:12px 16px}
  .topbar .crumb{display:none}
  .page{padding:4px 16px 110px}
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgb(255 255 255/.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:6px 8px calc(6px + env(safe-area-inset-bottom))}
  .tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;font-size:11px;font-weight:800;color:var(--ink-3);border-radius:12px}
  .tabbar button.on{color:var(--violet-700);background:var(--lav-100)}
  .hero{padding:24px 20px;border-radius:24px}
  .continue{grid-template-columns:1fr}
  .continue .ph{height:150px}
  .continue .ph::after{background:linear-gradient(180deg,transparent 50%,#fff)}
  .goals{grid-template-columns:110px 1fr}.rings{width:110px;height:110px}
  .row3{grid-template-columns:1fr}
  .intro-card{grid-template-columns:1fr}.intro-card .ph{height:200px}.intro-card .body{padding:24px}
  .intro-card h1{font-size:32px}
  .ptop{padding:10px 12px;gap:8px}
  .pbody{padding:18px 14px 150px}
  .qcard{padding:22px 18px;border-radius:22px}
  .pics{grid-template-columns:repeat(3,1fr)}
  .buckets{grid-template-columns:minmax(0,1fr)}
  .bucket{min-height:110px}
  .sumgrid{grid-template-columns:1fr 1fr 1fr;gap:8px}.sumgrid b{font-size:28px}
  .summary h1{font-size:34px}
  .pbar{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
  .pbar .btn{padding:0 14px}
}
.sumgrid small{display:block;margin-top:4px}
.steps{min-width:0}
@media (max-width:520px){
  .ptop .stat{padding:6px 10px;font-size:14px}
  .ptop .combo{display:none}
  .iconbtn{width:38px;height:38px}
  .pbar .btn.small span{display:none}
  .pbar .btn.small{min-width:48px;padding:0 12px}
  .steps{gap:4px}.steps button{height:10px}
}
/* pomoc */
.mini{display:inline-block;flex:none;border-radius:8px;background-color:#fff;background-image:url(assets/class5-school-items.webp);background-repeat:no-repeat;vertical-align:middle;box-shadow:inset 0 0 0 1px var(--line)}
.wchip{display:inline-flex;align-items:center;gap:10px}
.hintbox{display:flex;gap:14px;align-items:flex-start;margin:0 0 20px;padding:14px 16px;border-radius:18px;background:linear-gradient(135deg,#fff8e1,#fff1d0);border:1.5px solid #f7dc8f;animation:fbIn .35s var(--ease) both}
.hintbox .lv{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--gold-500);box-shadow:var(--shadow-s)}
.hintbox b{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#a36f00}
.hintbox p{margin:3px 0 0;font-weight:700;color:#6b4a00}
.hintbox .pips{display:inline-flex;gap:4px;margin-left:6px;vertical-align:middle}.hintbox .pips i{width:8px;height:8px;border-radius:50%;background:#f1d27a}.hintbox .pips i.on{background:var(--gold-500)}
.choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:14px}
.choice{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 10px;border-radius:18px;background:#fff;border:2px solid var(--line);box-shadow:0 4px 0 var(--line);font-weight:800;transition:transform .15s var(--spring),border-color .2s}
.choice:hover{transform:translateY(-3px);border-color:var(--lav-300)}
.gap .mini{margin-right:6px}
.btn.hint{background:linear-gradient(180deg,#fff6d6,#ffe9a8);border:1.5px solid #f3d27a;color:#7a5200}
.btn.hint:disabled{opacity:.45;cursor:default}
.gloss{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.gloss div{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;background:var(--paper);font-weight:800}
.gloss small{display:block;font-weight:700;color:var(--ink-3)}
.rule{padding:14px 16px;border-radius:16px;background:var(--lav-100);margin-top:10px;font-weight:700}
.rule b{color:var(--violet-700)}
.wchip.locked{opacity:.9;border-style:dashed;cursor:default}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .aurora{display:none}
}

/* ═════════ Pełna platforma — dodatki ═════════ */
.loading-screen{min-height:60vh;display:grid;place-items:center;align-content:center;gap:16px;font-weight:800;color:var(--ink-3)}
.spinner{width:46px;height:46px;border-radius:50%;border:4px solid var(--lav-200);border-top-color:var(--violet-600);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.skeleton{border-radius:18px;background:linear-gradient(90deg,var(--lav-100),#fff,var(--lav-100));background-size:200% 100%;animation:sk 1.2s linear infinite}
@keyframes sk{to{background-position:-200% 0}}

/* kontekst kroku (tekst, obrazek, krzyżówka) */
.ctx{margin:0 0 18px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s);overflow:hidden}
.ctx summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:14px 18px;font-weight:800}
.ctx summary::-webkit-details-marker{display:none}
.ctx summary .ico{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--c5-soft);color:var(--c5)}
.ctx summary small{margin-left:auto;color:var(--ink-3);font-weight:700}
.ctx .ctx-body{padding:4px 20px 20px;font-size:18px;line-height:1.7;max-height:52vh;overflow:auto}
.ctx .ctx-body p{margin:0 0 12px}
.ctx img{max-width:100%;border-radius:14px;display:block;margin:8px auto}
.lead{margin:0 0 12px;padding:12px 16px;border-radius:14px;background:var(--paper);font-weight:700;color:var(--ink-2)}
.qlabel{display:inline-grid;place-items:center;min-width:34px;height:34px;padding:0 8px;margin-right:10px;border-radius:10px;background:var(--lav-100);color:var(--violet-700);font-weight:800;font-size:16px;vertical-align:middle}
.rich{font-size:clamp(20px,2.3vw,26px);font-weight:700;line-height:1.9;margin:6px 0 18px;overflow-wrap:anywhere}
.rich.small{font-size:18px;line-height:1.8}
.gi{display:inline-block;vertical-align:middle;margin:2px 4px;position:relative;max-width:calc(100% - 8px)}
.gi input,.gi textarea{font:inherit;font-weight:800;font-size:.92em;color:var(--violet-700);min-height:46px;padding:4px 12px;border-radius:12px;border:2.5px solid var(--lav-300);background:var(--lav-100);outline:none;transition:border-color .2s,box-shadow .2s,background .2s;max-width:100%}
.gi input:focus,.gi textarea:focus{border-color:var(--violet-500);background:#fff;box-shadow:0 0 0 4px var(--lav-200)}
.gi textarea{display:block;width:min(560px,80vw);min-height:90px;resize:vertical;line-height:1.5}
.gi.ok input,.gi.ok textarea,.gi.ok .sel{border-color:var(--success-500);background:var(--success-100);color:#0c7a50}
.gi.near input{border-color:#47b98b;background:#e9f9f1;color:#0c7a50}
.gi.bad input,.gi.bad .sel,.gi.bad textarea{border-color:var(--amber-500);background:var(--amber-100);color:#9a5a00}
.gi.shown input,.gi.shown .sel{border-color:var(--lav-300);background:#fff;color:var(--ink-2)}
.gi.open input,.gi.open textarea{border-color:#8aa7e8;background:#eef3ff;color:var(--ink)}
.gi .sel{font:inherit;font-weight:800;font-size:.92em;min-height:46px;padding:4px 36px 4px 12px;border-radius:12px;border:2.5px solid var(--lav-300);background:var(--lav-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236d3fd1' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;color:var(--violet-700);appearance:none;-webkit-appearance:none;max-width:78vw}
.gi .tag{position:absolute;left:50%;top:-12px;transform:translateX(-50%);font-size:11px;font-weight:800;padding:1px 7px;border-radius:99px;background:var(--success-500);color:#fff;white-space:nowrap;animation:pop .3s var(--spring)}
.gi.near .tag{background:#47b98b}.gi.shown .tag{background:var(--ink-3)}.gi.open .tag{background:#5b7fd6}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:8px 0 6px}
.opt{min-height:64px;padding:10px 16px;border-radius:18px;background:#fff;border:2.5px solid var(--line);box-shadow:0 5px 0 var(--line);font-weight:800;font-size:18px;display:flex;align-items:center;gap:12px;text-align:left;transition:transform .15s var(--spring),box-shadow .15s,border-color .2s,background .2s,opacity .3s}
.opt b{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700);font-size:15px}
.opt:hover{transform:translateY(-3px);border-color:var(--lav-300)}
.opt:active{transform:translateY(3px);box-shadow:0 2px 0 var(--line)}
.opt.ok{border-color:var(--success-500);background:var(--success-100);box-shadow:0 5px 0 #0f8a5a;color:#0c7a50}
.opt.ok b{background:var(--success-500);color:#fff}
.opt.bad{border-color:var(--amber-500);background:var(--amber-100);box-shadow:0 5px 0 #c77a0c}
.opt.dim{opacity:.22;pointer-events:none}
.opt:disabled{cursor:default}
.checkrow{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:18px}
.bankrow{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 14px;padding:12px;border-radius:16px;background:var(--lav-100)}
.bankrow small{width:100%;font-weight:800;color:var(--ink-3);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.bankrow .wchip{min-height:40px;font-size:15px;padding:0 12px}
.notes{display:grid;gap:8px;margin-top:14px}
.note{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border-radius:14px;font-weight:700;font-size:15px;animation:fbIn .3s var(--ease) both}
.note.near{background:#e9f9f1;color:#0b6443}
.note.shown{background:var(--lav-100);color:var(--ink)}
.note.open{background:#eef3ff;color:#23427f}
.note.bad{background:var(--amber-100);color:#8a5100}
.note q{font-weight:800;quotes:"„" "”"}
.note .ex{display:block;font-weight:800;margin-top:2px}
/* tabela */
.tbl{overflow:auto;border-radius:16px;border:1px solid var(--line);margin:6px 0}
.tbl table{border-collapse:collapse;width:100%;font-size:17px}
.tbl th{background:var(--navy-900);color:#fff;text-align:left;padding:10px 12px;font-size:14px;letter-spacing:.04em}
.tbl td{padding:10px 12px;border-top:1px solid var(--line);vertical-align:top;font-weight:700}
.tbl tr:nth-child(even) td{background:var(--paper)}
.tbl .gi input{min-height:40px;font-size:16px}
@media (max-width:700px){.tbl table,.tbl tbody,.tbl tr,.tbl td{display:block}.tbl thead{display:none}.tbl tr{padding:8px;border-top:1px solid var(--line)}.tbl td{border:0;padding:4px 6px}.tbl td[data-col]::before{content:attr(data-col);display:block;font-size:11px;font-weight:800;color:var(--ink-3);text-transform:uppercase;letter-spacing:.08em}}
/* pisanie */
.writer textarea{width:100%;min-height:180px;padding:16px 18px;border-radius:18px;border:2.5px solid var(--line);font:inherit;font-size:19px;line-height:1.6;resize:vertical;outline:none;background:#fff}
.writer textarea:focus{border-color:var(--violet-500);box-shadow:0 0 0 5px var(--lav-200)}
.wmeter{display:flex;align-items:center;gap:12px;margin-top:10px;font-weight:800;color:var(--ink-3)}
.wmeter .bar{flex:1;height:10px;margin:0;background:var(--lav-100)}
.wmeter .bar span{background:linear-gradient(90deg,var(--violet-500),var(--c5))}
/* rysowanie */
.draw{position:relative;border-radius:18px;overflow:hidden;border:2px solid var(--line);background:#fff;touch-action:none}
.draw canvas{display:block;width:100%;height:auto;cursor:crosshair}
.draw .bgsvg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.drawtools{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.drawtools button.c{width:36px;height:36px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 2px var(--line)}
.drawtools button.c.on{box-shadow:0 0 0 3px var(--violet-500)}
/* historia (reveal) */
.story{font-size:20px;line-height:1.9;padding:22px;border-radius:20px;background:linear-gradient(145deg,#fff,var(--lav-100));border:1px solid var(--line)}
.story mark{background:linear-gradient(180deg,transparent 55%,#ffe08a 55%);color:var(--violet-700);font-weight:800;padding:0 2px;animation:pop .4s var(--spring) both}
/* krzyżówka */
.xw{display:grid;gap:2px;justify-content:center;margin:6px auto}
.xw span{width:clamp(20px,3.2vw,30px);aspect-ratio:1;display:grid;place-items:center;font-weight:800;font-size:clamp(11px,1.6vw,15px);text-transform:uppercase;border-radius:5px;position:relative}
.xw span.c{background:#fff;border:1.5px solid var(--lav-300)}
.xw span.f{background:var(--success-100);border-color:var(--success-500);color:#0c6e48}
.xw span sup{position:absolute;left:2px;top:0;font-size:8px;color:var(--ink-3)}
/* intro lekcji — materiały */
.mats{display:grid;gap:10px}
.mat{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;border:2px solid var(--line);background:#fff;text-align:left;transition:transform .15s var(--spring),border-color .2s,box-shadow .2s}
.mat:hover{transform:translateY(-2px);border-color:var(--lav-300);box-shadow:var(--shadow-s)}
.mat.main{border-color:var(--c5);background:linear-gradient(135deg,#fff,var(--c5-soft))}
.mat .ring{flex:none;width:52px;height:52px}
.mat strong{display:block;font-size:17px}
.mat small{color:var(--ink-3);font-weight:700}
.mat .go{margin-left:auto;color:var(--violet-700)}
.tagpill{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:99px;background:var(--lav-100);color:var(--violet-700);margin-right:6px}
.tagpill.gold{background:#fff3cc;color:#8a6300}
/* ścieżka — rozdziały */
.chap-gap{height:26px}
.node.part button{border-color:var(--c5)}
.pathnote{margin:6px 0 16px;color:var(--ink-3);font-weight:700}
/* ustawienia */
.settings{display:grid;gap:12px;max-width:640px}
.setrow{display:flex;align-items:center;gap:14px;justify-content:space-between}
.switch{width:52px;height:30px;border-radius:99px;background:var(--lav-200);position:relative;transition:background .2s}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:var(--shadow-s);transition:transform .25s var(--spring)}
.switch[aria-checked=true]{background:var(--violet-600)}
.switch[aria-checked=true]::after{transform:translateX(22px)}
.empty{text-align:center;padding:50px 20px}
.empty .diamond{margin-bottom:18px}
.src-link{display:inline-flex;align-items:center;gap:6px;color:var(--ink-3);font-weight:800;font-size:13px;text-decoration:none}
.src-link:hover{color:var(--violet-700)}
.src-link svg{width:16px;height:16px}
.done-banner{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:16px;background:var(--success-100);color:#0b6443;font-weight:800;margin-bottom:14px}

a.nav-item,a.btn,a.iconbtn,a.linkbtn{text-decoration:none}
a.nav-item{color:var(--ink-2)}
a.nav-item.on{color:var(--violet-700)}
.tabbar a svg{width:22px;height:22px}

/* ═════════ Wybór klasy ═════════ */
.klasa{display:inline-flex;padding:4px;gap:2px;border-radius:999px;background:#fff;border:2px solid var(--line);flex:none}
.klasa button{border:0;background:transparent;font:inherit;font-weight:800;font-size:14px;color:var(--ink-3);padding:6px 12px;border-radius:999px;cursor:pointer;transition:background .2s,color .2s}
.klasa button[aria-pressed="true"]{background:var(--violet-600,#6d3fd1);color:#fff;box-shadow:0 3px 10px rgb(109 63 209/.3)}
.klasa button:focus-visible{outline:3px solid var(--gold-400);outline-offset:2px}
.klasa.big button{font-size:15px;padding:9px 16px}
@media (max-width:560px){.klasa button{padding:6px 9px;font-size:13px}}

/* ═════════ Słowniczek (ściąga ze słowami) ═════════ */
.gloss{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin:0 0 10px}
.gloss span{display:flex;flex-direction:column;gap:0;padding:6px 10px;border-radius:12px;background:#fff;border:2px solid var(--line);line-height:1.25}
.gloss b{font-weight:800;color:var(--ink)}
.gloss b{font-size:15px}
.gloss small{font-weight:700;color:var(--ink-3);font-size:13px}
@media (max-width:560px){.gloss{grid-template-columns:repeat(2,minmax(0,1fr))}}
.gloss-title{font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin:6px 0 6px}

/* ═════════ „Jak powinno być” ═════════ */
.note .ex q{quotes:"„" "”"}
.note .ex mark{background:#ffe27a;color:inherit;border-radius:5px;padding:0 3px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.note .ex.mine{font-weight:700;color:var(--ink-3);font-size:.94em}
.gi input{max-width:100%;box-sizing:border-box}
.gi textarea{max-width:100%;box-sizing:border-box}

/* ═════════ Misje ═════════ */
.steps button.mstart{margin-left:10px}
.mhead{margin:14px 0 4px;font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--violet-700)}
.sum-missions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:18px 0 0}
.sum-missions span{padding:6px 12px;border-radius:999px;font-weight:800;font-size:14px;background:var(--lav-100);color:var(--ink-3)}
.sum-missions span.on{background:var(--gold-400);color:#5a3d00}
.sum-missions span.on::before{content:"✓ "}

/* ═════════ Połącz w pary ═════════ */
.match-help{margin:0 0 12px;font-weight:700;color:var(--ink-3);font-size:15px}
.match{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:start}
.mcol{display:flex;flex-direction:column;gap:8px}
.mt{font:inherit;font-weight:800;font-size:16px;text-align:left;color:var(--ink);padding:10px 12px;min-height:50px;border-radius:14px;border:2.5px solid var(--line);background:#fff;box-shadow:0 4px 0 var(--line);cursor:pointer;display:flex;align-items:center;gap:8px;flex-wrap:wrap;overflow-wrap:anywhere;transition:transform .15s var(--spring),border-color .2s,background .2s,box-shadow .2s}
.mt:hover:not(:disabled){transform:translateY(-1px)}
.mt:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 var(--line)}
.mt b{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:13px;background:var(--lav-100);color:var(--violet-700)}
.mt.sel{border-color:var(--violet-500);background:var(--lav-100);box-shadow:0 4px 0 var(--lav-300)}
.mt.hint{border-color:var(--gold-400);background:#fff8dc;box-shadow:0 0 0 4px rgb(244 197 66/.35)}
.mt.bad{border-color:var(--amber-500)}
.mt.done{background:var(--success-100);border-color:var(--success-500);box-shadow:none;color:#0c6e48;cursor:default}
.mt.done.half{background:#eef8f2}
.mt.done.shown{background:var(--lav-100);border-color:var(--lav-300);color:var(--ink-2)}
.mt em{font-style:normal;font-weight:700;font-size:.92em;opacity:.9}
.match-done{font-weight:800;color:var(--success-500);padding:10px}
@media (max-width:560px){.mt{font-size:15px;padding:9px 10px;min-height:46px}.match{gap:8px}}

/* ═════════ Wykorzystane słowa w ramce ═════════ */
.wchip.used{opacity:.5;text-decoration:line-through;text-decoration-thickness:2px}

/* ═════════ Do omówienia z lektorem ═════════ */
.talk-help{margin:2px 0 8px;color:var(--ink-3);font-weight:700;font-size:15px}
.card.talk .mine{color:var(--violet-700);font-weight:800;white-space:pre-wrap}

/* ═════════ Klasy 7 i 8: nowe elementy treści ═════════ */
@media (max-width:560px){.klasa .kl-long{display:none}.klasa button{min-width:34px}}
.ctx-h{font-family:var(--display);font-size:19px;margin:10px 0 6px;color:var(--ink)}
.ctx-note{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border-radius:14px;background:#fff8dc;border:2px solid #f6e3a3;font-weight:700;margin:0 0 10px}
.ctx-note .i{flex:none;color:var(--gold-500);margin-top:2px}
.ctx-note.long{font-weight:500;line-height:1.6}
.ctx-model{padding:12px 16px;border-radius:16px;background:#fff;border:2px dashed var(--lav-300);margin:0 0 10px}
.ctx-model small{display:block;font-weight:800;color:var(--ink-3);font-size:13px;margin-bottom:6px}
.ctx-model p{margin:0;line-height:1.6}
.qimg{margin:0 0 12px;display:flex;justify-content:center}
.qimg img{max-width:min(260px,70vw);max-height:240px;width:auto;height:auto;border-radius:16px;border:2px solid var(--line);background:#fff;padding:6px}
.lead.grp{font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--violet-700);margin-bottom:8px}
.lead.hd{font-family:var(--display);font-weight:800;color:var(--ink)}

/* ═════════════════ WERSJA FINALNA: konta, panel lektora, nowe formy zadań ═════════════════ */
/* logowanie i rejestracja */
body.auth .side,body.auth .topbar,body.auth .tabbar{display:none!important}
body.auth .main{margin-left:0!important;padding-bottom:0}
body.auth .page{max-width:none;padding:0}
.authwrap{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--paper)}
.auth-intro{position:relative;overflow:hidden;background:var(--navy-900);color:#fff;display:flex;align-items:flex-end}
.auth-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.auth-intro::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgb(21 26 61/.1),rgb(21 26 61/.85))}
.auth-copy{position:relative;z-index:1;padding:48px clamp(24px,5vw,64px);max-width:640px}
.auth-logo{width:170px;background:#fff;border-radius:16px;padding:8px 12px;margin-bottom:24px}
.auth-copy .eyebrow{color:rgb(255 255 255/.7)}
.auth-copy h1{font-size:clamp(34px,4.4vw,56px);margin:8px 0 14px;color:#fff}
.auth-copy p{font-size:18px;color:rgb(255 255 255/.86);margin:0 0 10px}
.auth-detail{font-weight:800;color:#ffe08a!important}
.auth-card{display:flex;flex-direction:column;justify-content:center;padding:40px clamp(20px,5vw,72px);max-width:620px;width:100%;margin:0 auto;box-sizing:border-box}
.auth-tabs{display:inline-flex;gap:4px;padding:5px;border-radius:999px;background:#fff;border:2px solid var(--line);align-self:flex-start;margin-bottom:18px}
.auth-tabs button{border:0;background:transparent;font:inherit;font-weight:800;padding:9px 18px;border-radius:999px;color:var(--ink-3);cursor:pointer}
.auth-tabs button[aria-pressed="true"]{background:var(--violet-600);color:#fff}
.auth-card h2{font-size:34px;margin:0 0 14px}
.auth-form{display:flex;flex-direction:column;gap:14px}
.auth-form label{display:flex;flex-direction:column;gap:6px;font-weight:800;color:var(--ink)}
.auth-form input:not([type=checkbox]),.auth-form select,.account-card input:not([type=checkbox]){font:inherit;font-weight:700;padding:13px 15px;border-radius:14px;border:2.5px solid var(--lav-300);background:#fff;color:var(--ink);min-height:50px;width:100%;box-sizing:border-box}
.auth-form input:focus,.auth-form select:focus,.account-card input:focus{outline:none;border-color:var(--violet-500);box-shadow:0 0 0 4px var(--lav-200)}
.auth-form small{font-weight:700;color:var(--ink-3);font-size:14px}
.auth-form .pw{display:flex;gap:8px}
.auth-form .pw input{flex:1}
.auth-form .pw button{border:2px solid var(--line);background:#fff;border-radius:12px;font:inherit;font-weight:800;padding:0 14px;cursor:pointer}
.auth-form .check,.account-card .check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:700;color:var(--ink-2);display:flex}
.auth-form .check input,.account-card .check input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--violet-600)}
.auth-form .btn.big{min-height:56px;font-size:18px;justify-content:center;margin-top:4px}
.auth-err{margin:0;padding:12px 14px;border-radius:14px;background:#fff1ee;color:#b3261e;font-weight:800}
.auth-ok{margin:0;padding:12px 14px;border-radius:14px;background:var(--success-100);color:#0c6e48;font-weight:800}
.auth-note{margin:0;color:var(--ink-2);font-weight:700}
.auth-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:14px}
.auth-links button{border:0;background:none;color:var(--violet-700);font:inherit;font-weight:800;cursor:pointer;padding:4px 0;text-decoration:underline;text-underline-offset:3px}
.auth-rules{margin-top:14px;color:var(--ink-2)}
.auth-rules summary{font-weight:800;cursor:pointer}
.auth-foot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:22px;font-weight:700;font-size:14px}
.auth-foot a{color:var(--ink-3)}
@media (max-width:900px){.authwrap{grid-template-columns:1fr}.auth-intro{min-height:250px}.auth-copy{padding:26px 18px}.auth-copy h1{font-size:32px}.auth-logo{width:130px;margin-bottom:14px}.auth-detail{display:none}.auth-card{padding:24px 16px 40px}}
/* stan zapisu i punkty */
.cloud{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:13px;color:var(--success-500);padding:6px 10px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s)}
.cloud[hidden]{display:none}
.cloud .i{width:16px;height:16px}
.cloud.busy{color:var(--ink-3)}
.cloud.busy .i{animation:pulseop 1s ease-in-out infinite}
.cloud.err{color:#b3261e;background:#fff1ee}
@keyframes pulseop{50%{opacity:.35}}
.stat.pts[hidden]{display:none}
.stat.pts .i{color:var(--gold-500)}
@media (max-width:760px){.cloud span{display:none}.stat.pts{display:none!important}}
/* ilustracje tematów */
.topic-art{display:block;width:100%;height:100%}
.ph.art{background:none!important;display:flex;align-items:center;justify-content:center;overflow:hidden}
.continue .ph.art::after,.intro-card .ph.art::after{display:none}
.intro-card .ph.art span{background:rgb(29 33 67/.55)}
.detail .ph.art{height:170px}
.hero-art{width:180px;height:auto;flex:none}
.more-mats{border:2px dashed var(--lav-300);border-radius:18px;padding:10px 14px}
.more-mats summary{font-weight:800;cursor:pointer;color:var(--violet-700)}
.more-mats .mats{margin-top:10px}
/* polecenie: więcej wskazówek */
.instr-more summary{font-weight:800;color:var(--violet-700);cursor:pointer;font-size:15px}
.instr-more p{margin:6px 0 0}
/* słowotwórstwo */
.wf{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border-radius:14px;background:var(--lav-100);border:2px solid var(--lav-300);margin:0 0 12px;font-weight:800}
.wf span{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3)}
.wf b{font-family:var(--display);font-size:22px;letter-spacing:.04em;color:var(--violet-700)}
.wf em{font-style:normal;font-family:var(--display);font-size:22px;color:var(--gold-500)}
.wf .i{width:18px;height:18px;color:var(--ink-3)}
/* który nie pasuje */
.oddtiles{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 14px}
.odd{font:inherit;font-weight:800;font-size:18px;padding:12px 18px;border-radius:16px;border:2.5px solid var(--line);background:#fff;box-shadow:0 4px 0 var(--line);cursor:pointer;color:var(--ink);transition:transform .15s var(--spring)}
.odd:hover:not(:disabled){transform:translateY(-2px)}
.odd.picked{border-color:var(--amber-500);background:var(--amber-100)}
.odd.ok{border-color:var(--success-500);background:var(--success-100);color:#0c6e48;text-decoration:line-through;text-decoration-thickness:3px}
.odd.bad{border-color:var(--amber-500)}
.odd-label{font-size:13px;font-weight:800;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em;margin-right:8px}
/* dialog jako czat */
.qcard.chat .leads{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.bub{position:relative;max-width:88%;padding:12px 16px;border-radius:20px;line-height:1.5;font-weight:700}
.bub .spk{display:block;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px;opacity:.7}
.bub.in{align-self:flex-start;background:#fff;border:2px solid var(--line);border-bottom-left-radius:6px}
.rich.bub.out{margin-left:auto;background:var(--lav-100);border:2px solid var(--lav-300);border-bottom-right-radius:6px;display:block;width:fit-content;max-width:92%}
/* układanie zdania z kafelków */
.builder{margin-top:10px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.bwords{display:flex;flex-wrap:wrap;gap:8px}
.bw{font:inherit;font-weight:800;padding:9px 14px;border-radius:12px;border:2px solid var(--lav-300);background:#fff;cursor:pointer;box-shadow:0 3px 0 var(--lav-300)}
.bw:disabled{opacity:.35;box-shadow:none;cursor:default}
/* wskazówka „dlaczego” */
.note .ex.tip{display:flex;gap:6px;align-items:flex-start;font-weight:800;color:#8a5a00;background:#fff6d8;border-radius:10px;padding:6px 10px;margin-top:6px}
.note .ex.tip .i{flex:none;width:18px;height:18px;color:var(--gold-500)}
/* nagroda w zagadce obrazkowej */
.riddle-pic{display:flex;align-items:center;gap:16px;padding:14px 18px;border-radius:20px;background:linear-gradient(135deg,#fff7df,#ffe8b0);border:2px solid #ffd76a;margin-bottom:10px;animation:pop .5s var(--spring) both}
.riddle-pic .emo{font-size:64px;line-height:1}
.riddle-pic small{display:block;font-weight:800;color:#8a5a00;text-transform:uppercase;letter-spacing:.06em;font-size:12px}
.riddle-pic b{font-family:var(--display);font-size:26px}
/* ranking */
.rk-head{text-align:center;max-width:760px;margin:0 auto 18px}
.rk-head h2{font-size:clamp(28px,4vw,42px);margin:6px 0 10px}
.rk-head h2 em{font-style:normal;color:var(--violet-600)}
.rk-head p{color:var(--ink-2);margin:0 0 14px}
.rk-filters{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.rk-filters select{font:inherit;font-weight:800;padding:8px 12px;border-radius:12px;border:2px solid var(--line);background:#fff}
.seg{display:inline-flex;gap:3px;padding:4px;border-radius:999px;background:#fff;border:2px solid var(--line)}
.seg button{border:0;background:transparent;font:inherit;font-weight:800;padding:7px 14px;border-radius:999px;color:var(--ink-3);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--violet-600);color:#fff}
.rk-me{text-align:center;font-size:20px;margin:6px 0 14px}
.rk-off{max-width:620px;margin:0 auto 14px}
.rk-off p{margin:6px 0 10px;color:var(--ink-2)}
.lrow .nm small{color:var(--ink-3);font-weight:700}
.big-emo{font-size:48px;color:var(--gold-500)}
/* ustawienia konta */
.account-card{display:flex;flex-direction:column;gap:12px}
.acc-top{display:flex;align-items:center;gap:14px}
.avatar.big{width:58px;height:58px;font-size:20px}
.account-card .fld{display:flex;flex-direction:column;gap:6px;font-weight:800}
.acc-actions{display:flex;flex-wrap:wrap;gap:8px}
.acc-msg{margin:0;font-weight:800;color:var(--violet-700);min-height:1em}
.acc-note{color:var(--ink-3);font-weight:700}
/* trener egzaminu */
.exam-hero{display:flex;gap:20px;align-items:center;justify-content:space-between;margin-bottom:18px}
.exam-hero h2{font-size:32px;margin:6px 0 8px}
.exam-hero p{color:var(--ink-2);margin:0}
.exam-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.exam-task{display:flex;flex-direction:column;gap:10px}
.et-top{display:flex;gap:12px;align-items:center}
.et-top small{display:block;color:var(--ink-3);font-weight:700}
.et-n{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700);font-family:var(--display);font-size:24px;font-weight:800;flex:none}
.et-bars{height:56px;display:flex;align-items:flex-end;gap:6px;padding:6px;border-radius:12px;background:var(--paper)}
.et-bars i{flex:1;max-width:26px;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,#8b5cf6,#6d3fd1)}
.et-bars span{margin:auto;color:var(--ink-3);font-weight:700;font-size:14px}
.et-meta{margin:0;color:var(--ink-2);font-weight:700;font-size:14px}
.exam-score{display:flex;flex-direction:column;align-items:center;gap:4px;margin:14px auto;max-width:420px}
.exam-score b{font-family:var(--display);font-size:44px;color:var(--violet-700)}
.exam-score small{color:var(--ink-3);font-weight:700}
@media (max-width:600px){.hero-art{display:none}}
/* panel lektora */
.t-head{display:flex;gap:20px;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;margin-bottom:16px}
.t-head h2{font-size:34px;margin:6px 0 6px}
.t-head p{color:var(--ink-2);margin:0;max-width:560px}
.t-stats{display:flex;gap:10px;flex-wrap:wrap}
.t-stats div{background:#fff;border-radius:16px;padding:10px 16px;box-shadow:var(--shadow-s);min-width:110px}
.t-stats b{display:block;font-family:var(--display);font-size:26px}
.t-stats small{color:var(--ink-3);font-weight:700}
.t-filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.t-filters input,.t-filters select{font:inherit;font-weight:700;padding:10px 14px;border-radius:12px;border:2px solid var(--line);background:#fff}
.t-filters input{flex:1;min-width:200px}
.t-list{display:flex;flex-direction:column;gap:8px}
.t-row{display:grid;grid-template-columns:46px minmax(0,1.6fr) repeat(3,minmax(0,1fr)) auto;gap:12px;align-items:center;text-decoration:none;color:inherit;padding:12px 16px}
.t-name b{display:block}
.t-name small,.t-cell small{color:var(--ink-3);font-weight:700;font-size:13px}
.t-cell b{display:block}
.t-open{min-width:30px;height:30px;border-radius:99px;background:var(--gold-400);color:#5a3d00;display:grid;place-items:center;font-weight:800;padding:0 8px}
@media (max-width:760px){.t-row{grid-template-columns:40px 1fr auto}.t-row .t-cell{display:none}}
.t-student{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:14px 0}
.t-student h2{font-size:28px}
.t-student p{margin:4px 0 0;color:var(--ink-2)}
.t-student .t-stats{margin-left:auto}
.t-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-bottom:10px}
.t-grid h3{margin:6px 0 4px}
.t-grid p{margin:0;color:var(--ink-2)}
.t-sub{margin:22px 0 10px;font-size:22px}
.t-sub small{color:var(--ink-3)}
.t-open-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.t-ans small{color:var(--ink-3);font-weight:700}
.t-ans p{margin:6px 0 0;white-space:pre-wrap;font-weight:700}
.t-draw{max-width:100%;border-radius:10px;border:1px solid var(--line)}
.t-mats{margin-bottom:10px}
.t-mat{display:grid;grid-template-columns:22px 1fr auto;gap:10px;padding:7px 0;border-top:1px solid var(--line);align-items:center}
.t-mat small{color:var(--ink-3);font-weight:700}
.t-muted{color:var(--ink-3);font-weight:700}
/* szybka runda: 2 odpowiedzi obok siebie, większe */
.opts:has(> .opt:nth-child(2):last-child){display:grid;grid-template-columns:1fr 1fr;gap:12px}
.opts:has(> .opt:nth-child(2):last-child) .opt{min-height:78px;justify-content:center;font-size:20px}
body.auth .app{display:block}
body.auth .page{padding:0!important}
/* górny pasek: mieści się na tablecie i telefonie */
@media (max-width:1100px){.topbar .crumb{display:none}.klasa .kl-long{display:none}.klasa button{min-width:34px;padding:6px 10px}}
@media (max-width:620px){.topbar .stat.fire,.topbar .stat.xp{display:none}.topbar{gap:8px}}
.klasa.big{flex-wrap:wrap;border-radius:18px}
.topbar{min-width:0}
.klasa{max-width:100%;overflow-x:auto;scrollbar-width:none}
.cloud.err{cursor:pointer}
/* poprawki z przeglądu */
.mt{flex-wrap:nowrap;align-items:flex-start}
.mt span{flex:1;min-width:0}
.mt b{margin-top:1px}
.chatbox{display:flex;flex-direction:column;gap:8px;margin:0 0 12px}
.bub.in2{align-self:flex-end;background:var(--lav-100);border:2px solid var(--lav-300);border-bottom-right-radius:6px}
/* ilustracje w tekście: nie rozciągają się na cały ekran */
.ctx figure img{display:block;max-width:100%;width:auto;max-height:380px;margin:0 auto;border-radius:16px}

/* ───────── Kokpit 2.0: prosto, obrazkowo, okrągło ───────── */
.home{display:flex;flex-direction:column;gap:22px;max-width:1080px}
.hi{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:6px}
.hi h1{font-size:clamp(28px,4vw,40px);color:var(--ink)}
.hi p{margin:4px 0 0;color:var(--ink-3);font-weight:700;font-size:16px}
.hi-stats{display:flex;align-items:center;gap:12px}
.hs-week{display:flex;align-items:center;gap:5px;padding:7px 8px 7px 12px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s)}
.hs-week i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:800;color:var(--ink-3);background:var(--lav-100)}
.hs-week i.on{background:linear-gradient(180deg,#ff9d5c,#f2683f);color:#fff}
.hs-week i.today{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--gold-400)}
.hs-week b{display:inline-flex;align-items:center;gap:3px;margin-left:4px;padding:3px 9px 3px 6px;border-radius:99px;background:#fff1e6;color:#e0561b;font-weight:800}
.hs-week b svg{width:18px;height:18px}
.hs-lvl{position:relative;width:50px;height:50px;border-radius:50%;background:#fff;box-shadow:var(--shadow-s);display:grid;place-items:center}
.hs-lvl .ring{position:absolute;inset:0}
.hs-lvl b{font-family:var(--display);font-size:20px;color:var(--ink)}
/* duża karta następnej lekcji */
.next{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:8px;min-height:250px;padding:18px;border-radius:36px;text-decoration:none;color:var(--ink);background:radial-gradient(120% 140% at 0% 0%,#fff 0%,var(--b1) 45%,var(--b2) 100%);box-shadow:0 22px 50px -24px rgb(21 26 61/.45);overflow:hidden;transition:transform .2s var(--ease),box-shadow .2s}
.next::before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;right:-80px;top:-120px;background:rgb(255 255 255/.35)}
.next:hover{transform:translateY(-3px);box-shadow:0 28px 60px -24px rgb(21 26 61/.5)}
.nx-art{grid-column:2;grid-row:1;position:relative;display:block;max-width:420px;justify-self:center;width:100%;filter:drop-shadow(0 16px 22px rgb(21 26 61/.18));animation:float 6s ease-in-out infinite}
.nx-art .topic-art{height:auto}
.nx-body{grid-column:1;grid-row:1;position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:14px 10px 14px 20px}
.nx-tag{font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:6px 13px;border-radius:99px;background:rgb(255 255 255/.75);color:var(--violet-700)}
.nx-title{font-family:var(--display);font-weight:800;font-size:clamp(26px,3.4vw,38px);line-height:1.08}
.nx-bar{width:min(100%,280px);height:10px;border-radius:99px;background:rgb(255 255 255/.7);overflow:hidden}
.nx-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--violet-500),var(--c5))}
.nx-go{display:inline-flex;align-items:center;gap:12px;margin-top:4px;padding:8px 24px 8px 8px;border-radius:99px;background:linear-gradient(180deg,var(--violet-500),var(--violet-600));color:#fff;font-weight:800;font-size:18px;box-shadow:0 10px 22px -8px rgb(109 63 209/.7)}
.nx-go svg{width:42px;height:42px;padding:11px 10px 11px 13px;border-radius:50%;background:#fff;color:var(--violet-600);fill:currentColor;stroke:none}
@keyframes float{50%{transform:translateY(-8px)}}
/* okrągłe skróty */
.sc-row{display:flex;justify-content:flex-start;gap:clamp(10px,3vw,34px);flex-wrap:wrap}
.sc{display:flex;flex-direction:column;align-items:center;gap:7px;text-decoration:none;color:var(--ink-2);font-weight:800;font-size:14px;min-width:70px}
.sc-ic{position:relative;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--bg);color:var(--fg);transition:transform .18s var(--spring)}
.sc-ic svg{width:28px;height:28px;stroke-width:2.2}
.sc-ic em{position:absolute;top:-3px;right:-3px;min-width:24px;height:24px;padding:0 6px;border-radius:99px;background:var(--coral);color:#fff;font-style:normal;font-size:13px;display:grid;place-items:center;box-shadow:0 0 0 3px var(--paper)}
.sc:hover .sc-ic{transform:translateY(-3px) scale(1.06)}
/* lekcje */
.les-head h2{font-size:24px}
.stage-tabs{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 6px;margin:-8px 0 -4px}
.stage-tabs::-webkit-scrollbar{display:none}
.stage-tabs button{flex:none;display:inline-flex;align-items:center;gap:9px;padding:6px 14px 6px 6px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);font-weight:800;color:var(--ink-2);transition:background .2s,color .2s}
.stage-tabs button b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700);font-family:var(--display)}
.stage-tabs button small{font-weight:800;color:var(--ink-3)}
.stage-tabs button[aria-selected="true"]{background:var(--ink);color:#fff}
.stage-tabs button[aria-selected="true"] b{background:var(--gold-400);color:var(--ink)}
.stage-tabs button[aria-selected="true"] small{color:rgb(255 255 255/.7)}
.ltiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:18px}
.ltile{display:flex;flex-direction:column;gap:9px;text-decoration:none;color:var(--ink);animation:pop .35s var(--ease) both}
.lt-art{position:relative;display:block;border-radius:28px;overflow:hidden;box-shadow:0 10px 24px -14px rgb(21 26 61/.4);transition:transform .2s var(--spring),box-shadow .2s}
.lt-art .topic-art{height:auto;aspect-ratio:160/110}
.ltile:hover .lt-art{transform:translateY(-4px) rotate(-1deg);box-shadow:0 16px 30px -14px rgb(21 26 61/.45)}
.lt-n{position:absolute;left:10px;top:10px;min-width:34px;height:34px;padding:0 8px;border-radius:99px;display:grid;place-items:center;background:#fff;font-family:var(--display);font-weight:800;font-size:18px;color:var(--ink);box-shadow:var(--shadow-s)}
.lt-st{position:absolute;right:10px;top:10px;width:34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center}
.lt-st .ring{display:block}
.lt-st.ok{background:var(--success-500);color:#fff}
.lt-st.ok svg{width:20px;height:20px;stroke-width:3}
.lt-t{font-weight:800;font-size:15px;line-height:1.3;padding:0 6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ltile.done .lt-art{opacity:.82}
.ltile.cur .lt-art{box-shadow:0 0 0 4px var(--paper),0 0 0 7px var(--gold-400),0 14px 28px -14px rgb(21 26 61/.45)}
@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.98)}}
/* wybór klasy */
.klasa{border:0;padding:0;background:none;overflow:visible}
.kchip{display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);font-weight:800;font-size:15px;color:var(--ink);white-space:nowrap}
.kchip .chev{width:18px;height:18px;color:var(--ink-3);stroke-width:2.6}
.kchip:hover{box-shadow:var(--shadow-m)}
.kdot{flex:none;display:inline-grid;place-items:center;border-radius:50%;background:linear-gradient(160deg,var(--a),var(--b));color:#fff;font-family:var(--display);font-weight:800;line-height:1;box-shadow:inset 0 -3px 0 rgb(0 0 0/.12)}
.kpick{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:16px;background:rgb(15 19 48/.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:fadein .2s}
.kp-box{width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#fff;border-radius:32px;padding:22px 22px 18px;box-shadow:var(--shadow-l);animation:pop .25s var(--spring)}
.kp-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.kp-head h3{font-size:24px}
.kp-x{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--lav-100)}
.kp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.kp-c{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px 14px;border-radius:26px;background:var(--paper);font-weight:800;text-align:center;transition:transform .18s var(--spring),background .2s}
.kp-c:hover{transform:translateY(-3px);background:var(--lav-100)}
.kp-c.on{background:var(--lav-100);box-shadow:inset 0 0 0 3px var(--violet-500)}
.kp-c small{font-weight:800;color:var(--violet-700);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.kp-box>p{margin:14px 0 0;text-align:center;color:var(--ink-3);font-weight:700;font-size:14px}
@keyframes fadein{from{opacity:0}}
/* start lekcji */
.intro2{max-width:760px;display:flex;flex-direction:column;gap:16px}
.back-chip{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:8px 16px 8px 10px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink-2);font-weight:800}
.li-hero{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:18px 24px 26px;border-radius:36px;background:radial-gradient(120% 120% at 50% 0%,#fff 0%,var(--b1) 50%,var(--b2) 100%);box-shadow:0 22px 50px -26px rgb(21 26 61/.45);overflow:hidden}
.li-art{display:block;width:min(340px,80%);filter:drop-shadow(0 14px 20px rgb(21 26 61/.16))}
.li-art .topic-art{height:auto}
.li-tag{font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:6px 13px;border-radius:99px;background:rgb(255 255 255/.75);color:var(--violet-700)}
.li-hero h1{font-size:clamp(28px,4.4vw,42px)}
.li-hero .goal-line{margin:0;max-width:560px;color:var(--ink-2);font-weight:700}
.li-meta{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.li-meta span{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:99px;background:rgb(255 255 255/.7);font-weight:800;font-size:14px;color:var(--ink-2)}
.li-meta svg{width:18px;height:18px}
.li-start{min-height:60px;font-size:19px;padding:0 34px;border-radius:99px;margin-top:4px}
.li-start svg{fill:currentColor;stroke:none;width:20px;height:20px}
.li-bar{width:min(260px,70%);height:8px;border-radius:99px;background:rgb(255 255 255/.7);overflow:hidden}
.li-bar i{display:block;height:100%;background:var(--success-500);border-radius:inherit}
.li-note{margin:0;padding:12px 18px;border-radius:22px;background:var(--amber-100);color:#7a4d00;font-weight:700}
.lms{display:flex;flex-direction:column;gap:10px}
.lm{display:flex;align-items:center;gap:14px;padding:10px 16px 10px 10px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink);transition:transform .15s var(--ease),box-shadow .2s}
.lm:hover{transform:translateX(3px);box-shadow:var(--shadow-m)}
.lm-ic{position:relative;width:54px;height:54px;flex:none;display:grid;place-items:center}
.lm-ic .ring{position:absolute;inset:0}
.lm-ic b{font-family:var(--display);font-size:20px;color:var(--c5)}
.lm.done .lm-ic b{color:var(--success-500)}
.lm-ic b svg{width:24px;height:24px;stroke-width:3}
.lm-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.lm-t strong{font-size:16px;line-height:1.25}
.lm-t small{display:flex;align-items:center;gap:5px;flex-wrap:wrap;color:var(--ink-3);font-weight:700;font-size:13px}
.lm-t small svg{width:15px;height:15px}
.lm-t em{font-style:normal;padding:1px 8px;border-radius:99px;background:var(--amber-100);color:#9a6200;margin-right:4px}
.lm-go{width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700)}
.lm.extra{background:rgb(255 255 255/.7)}
@media (max-width:760px){
  .home{gap:18px}
  .hi{flex-direction:column;align-items:flex-start}
  .next{grid-template-columns:1fr;min-height:0;padding:14px;border-radius:30px}
  .nx-art{grid-column:1;grid-row:1;max-width:300px}
  .nx-body{grid-column:1;grid-row:2;padding:4px 8px 10px;align-items:stretch}
  .nx-tag{align-self:flex-start}
  .nx-bar{width:100%}
  .nx-go{justify-content:center;padding-right:28px}
  .sc-row{justify-content:space-between;gap:6px;flex-wrap:nowrap}
  .sc{min-width:0;flex:1;font-size:12.5px}
  .sc-ic{width:56px;height:56px}
  .ltiles{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:0 -16px;padding:4px 16px 12px;scrollbar-width:none}
  .ltiles::-webkit-scrollbar{display:none}
  .ltile{flex:0 0 46%;scroll-snap-align:start}
  .kp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kchip span{max-width:38vw;overflow:hidden;text-overflow:ellipsis}
  .li-hero{padding:14px 16px 22px;border-radius:30px}
  .lm{border-radius:26px}
}
@media (prefers-reduced-motion:reduce){.nx-art,.ltile,.kp-box,.kpick{animation:none}}
.hs-lvl{width:auto;height:auto;padding:4px 16px 4px 4px;border-radius:99px;display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);font-weight:800;font-size:15px;line-height:1.1}
.hs-lvl .hl-r{position:relative;width:44px;height:44px;display:grid;place-items:center}
.hs-lvl .hl-r .ring{position:absolute;inset:0}
.hs-lvl .hl-r b{font-size:18px}
.hs-lvl small{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.nx-art{max-width:380px;padding:10px}
.nx-art .topic-art.bare,.li-art .topic-art.bare{overflow:visible}
.sc-row{gap:12px}
.sc-pill{display:inline-flex;align-items:center;gap:12px;padding:8px 20px 8px 8px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink);transition:transform .15s var(--ease),box-shadow .2s}
.sc-pill:hover{transform:translateY(-2px);box-shadow:var(--shadow-m)}
.sc-pill>span{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--amber-100);color:var(--amber-500)}
.sc-pill.exam>span{background:var(--c5-soft);color:var(--c5)}
.sc-pill b{font-size:16px}
.sc-pill small{color:var(--ink-3);font-weight:700}
@media (max-width:760px){
  .nx-art{max-width:230px}
  .sc-row{flex-wrap:wrap}
  .sc-pill{flex:1 1 100%}
  .hi-stats{width:100%;justify-content:space-between}
}
@media (max-width:400px){.hs-lvl>span:last-child{display:none}.hs-lvl{padding:4px}}
.lm-s{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.kp-c b{text-wrap:balance}
.nx-title{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
/* miękkie, okrągłe kształty w całej aplikacji */
.card{border:0;border-radius:28px;box-shadow:0 1px 2px rgb(21 26 61/.04),0 10px 28px -16px rgb(21 26 61/.22)}
.lrow{border:0;border-radius:99px;box-shadow:var(--shadow-s);padding:8px 20px 8px 10px}
.lrow.you{border:0;box-shadow:inset 0 0 0 3px var(--violet-500)}
.mat{border-radius:26px}
/* przycisk „Aplikacja” (PWA) */
html:not(.le-install-ready) [data-le-install]{display:none!important}
.appbtn{display:inline-flex;align-items:center;gap:7px;padding:7px 14px 7px 9px;border-radius:99px;background:linear-gradient(180deg,#8b5cf6,var(--violet-600));color:#fff;font-weight:800;font-size:14px;box-shadow:0 6px 14px -6px rgb(109 63 209/.6);white-space:nowrap;transition:transform .15s var(--ease)}
.appbtn:hover{transform:translateY(-1px)}
.appbtn .i{width:19px;height:19px}
@media (max-width:620px){.appbtn span{display:none}.appbtn{padding:8px}}
.auth-app{display:flex;align-items:center;gap:12px;width:100%;margin-top:14px;padding:10px 16px 10px 10px;border-radius:99px;background:var(--lav-100);color:var(--violet-700);text-align:left}
.auth-app .i{width:42px;height:42px;padding:10px;border-radius:50%;background:#fff;flex:none}
.auth-app b{display:block;font-size:16px}
.auth-app small{display:block;color:var(--ink-3);font-weight:700;font-size:13px}
.auth-app:hover{background:var(--lav-200)}
/* podsumowanie: jeden jasny następny krok */
.next-step{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:30px;width:100%}
.ns-card{--b1:#efe8ff;--b2:#d9c9ff;display:flex;align-items:center;gap:14px;width:min(560px,100%);padding:12px 14px 12px 12px;border-radius:32px;text-decoration:none;color:var(--ink);text-align:left;background:radial-gradient(120% 160% at 0% 0%,#fff 0%,var(--b1) 50%,var(--b2) 100%);box-shadow:0 18px 40px -22px rgb(21 26 61/.5);transition:transform .2s var(--spring),box-shadow .2s;animation:pop .45s .35s var(--ease) both}
.ns-card:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 24px 50px -22px rgb(21 26 61/.55)}
.ns-art{width:96px;flex:none;filter:drop-shadow(0 8px 10px rgb(21 26 61/.15))}
.ns-art .topic-art{height:auto}
.ns-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.ns-t small{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--violet-700)}
.ns-t b{font-family:var(--display);font-size:21px;line-height:1.15}
.ns-play{width:56px;height:56px;flex:none;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,var(--violet-500),var(--violet-600));color:#fff;box-shadow:0 10px 20px -8px rgb(109 63 209/.7);animation:nsPulse 2.4s ease-in-out infinite}
.ns-play svg{width:24px;height:24px;fill:currentColor;stroke:none;margin-left:3px}
@keyframes nsPulse{50%{box-shadow:0 10px 20px -8px rgb(109 63 209/.7),0 0 0 10px rgb(139 92 246/.15)}}
.ns-go{min-height:58px;padding:0 32px;border-radius:99px;font-size:18px}
.ns-go svg{fill:currentColor;stroke:none}
.ns-more{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.ns-more .btn{border-radius:99px}
.summary .sumgrid .card{border-radius:30px;text-align:center}
.summary .lvlcard{border-radius:30px}
.summary .todo .card{border-radius:24px}
@media (max-width:560px){.ns-art{width:72px}.ns-t b{font-size:18px}.ns-play{width:48px;height:48px}}
@media (prefers-reduced-motion:reduce){.ns-card,.ns-play{animation:none}}
/* mikro-interakcje */
.ltile{animation-delay:calc(var(--i,0) * 35ms)}
.ltile:active .lt-art,.sc-pill:active,.lm:active,.kp-c:active,.ns-card:active{transform:scale(.97)}
.next:active{transform:scale(.99)}
.nx-go{position:relative;overflow:hidden}
.nx-go::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgb(255 255 255/.35) 50%,transparent 70%);transform:translateX(-120%);animation:goShine 3.6s 1.2s ease-in-out infinite}
@keyframes goShine{0%,60%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}
.next-step + .sum-missions,.next-step ~ .todo{margin-top:22px}
@media (prefers-reduced-motion:reduce){.nx-go::after{animation:none;display:none}}
/* ikony słówek — jednakowe kafelki dla rysunków, emoji i obrazków z arkusza */
.wpic{display:inline-grid;place-items:center;flex:none;border-radius:8px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);vertical-align:middle;font-style:normal;line-height:1;overflow:hidden}
.wpic svg{display:block}
.wpic.emo{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
.gloss b{display:flex;align-items:center;gap:8px}
.wchip.used .wpic,.wchip.used .mini{opacity:.45}
/* pasek kroków w odtwarzaczu: nigdy nie wchodzi na przyciski po prawej */
.ptop>*:not(.steps){flex:none}
.steps{min-width:0;overflow:hidden;padding:3px 2px}
.steps button{min-width:0;padding:0;flex:1 1 0}
@media (max-width:620px){
  .steps button.om{display:none}
  .steps button.mstart{margin-left:0}
  .steps button{height:10px}
}
.wpic.flag img{display:block;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px rgb(0 0 0/.08)}
.lvl-banner{position:fixed;left:50%;top:calc(76px + env(safe-area-inset-top));z-index:90;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:8px 22px 8px 10px;border-radius:99px;background:#fff;box-shadow:0 18px 40px -14px rgb(21 26 61/.45);pointer-events:none;animation:lvlIn .45s var(--spring) both;transition:opacity .4s,transform .4s}
.lvl-banner.out{opacity:0;transform:translate(-50%,-12px)}
.lvl-banner small{display:block;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-500)}
.lvl-banner b{font-family:var(--display);font-size:18px;white-space:nowrap}
@keyframes lvlIn{from{opacity:0;transform:translate(-50%,-20px) scale(.9)}}
/* iPhone/iPad: pola nigdy mniejsze niż 16 px, żeby Safari nie przybliżał ekranu przy pisaniu */
@supports (-webkit-touch-callout:none){.gi input,.gi textarea,.gi select,.tbl .gi input,input,textarea,select{font-size:max(16px,1em)}.gi input,.gi textarea{font-size:max(16px,.92em)}}
/* wylogowanie */
.logoutbtn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px 7px 9px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);color:var(--ink-2);font-weight:800;font-size:14px;white-space:nowrap}
.logoutbtn:hover{color:#c0392b}
.logoutbtn .i{width:19px;height:19px}
.logoutbtn[hidden],.me-logout[hidden]{display:none!important}
@media (max-width:900px){.logoutbtn span{display:none}.logoutbtn{padding:8px}}
.me-logout{display:flex;align-items:center;gap:8px;width:100%;margin-top:12px;padding:8px 10px;border-radius:12px;color:rgb(255 255 255/.75);font-weight:800;font-size:14px}
.me-logout:hover{background:rgb(255 255 255/.1);color:#fff}
.me-logout .i{width:18px;height:18px}
.lo-ic{width:64px;height:64px;margin:0 auto 10px;border-radius:50%;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700)}
.lo-ic svg{width:30px;height:30px}
.inter[aria-label="Wylogowanie"] p{color:var(--ink-2);margin:8px 0 0}
.lo-btns{display:flex;gap:10px;margin-top:18px}
.lo-btns .btn{flex:1}
.me-logout{grid-column:1/-1}
.gi.aim input{border-color:var(--gold-400)!important;box-shadow:0 0 0 4px rgb(244 197 66/.3)}
/* telefon: nic nie może wystawać w bok, kafelki z oddechem u góry */
@supports (overflow:clip){.app{overflow-x:clip}}
@media (max-width:760px){
  .hi-stats{width:100%;gap:8px;flex-wrap:nowrap;min-width:0}
  .hs-week{flex:1 1 auto;min-width:0;justify-content:space-between;gap:3px;padding:6px 8px}
  .hs-week i{flex:none;width:22px;height:22px;font-size:10px}
  .hs-lvl{flex:none}
  .stage-tabs{margin:-6px -16px 0;padding:4px 16px 10px;scroll-padding-inline:16px}
  .ltiles{margin:-4px -16px 0;padding:14px 16px 18px;scroll-padding-inline:16px}
}
@media (max-width:480px){.hs-lvl>span:last-child{display:none}.hs-lvl{padding:4px}}
@media (max-width:360px){.hs-week i{width:19px;height:19px;font-size:9px}.hs-week b{padding:2px 6px 2px 4px;font-size:13px}.hs-week b svg{width:15px;height:15px}}
@media (max-width:760px){.topbar{background:rgb(247 245 251/.97);box-shadow:0 1px 0 var(--line)}}
/* logowanie: jasne, radosne zdjęcie (bez przyciemniania) z delikatnym cieniem tylko pod tekstem */
.auth-photo{opacity:1;object-position:50% 22%;animation:authZoom 18s ease-out both}
.auth-intro::after{background:linear-gradient(180deg,rgb(21 26 61/0) 35%,rgb(21 26 61/.55) 62%,rgb(21 26 61/.9) 100%)}
@keyframes authZoom{from{transform:scale(1.08)}to{transform:scale(1)}}
@media (max-width:900px){.auth-intro{min-height:330px}.auth-photo{object-position:50% 18%}}
@media (prefers-reduced-motion:reduce){.auth-photo{animation:none}}
@media (max-width:900px){
  .auth-intro{min-height:340px}
  .auth-photo{object-position:50% 30%}
  .auth-intro::after{background:linear-gradient(180deg,rgb(21 26 61/0) 50%,rgb(21 26 61/.75) 100%)}
  .auth-copy{padding:0 18px 18px!important}
  .auth-copy .eyebrow,.auth-copy p{display:none}
  .auth-copy h1{font-size:28px!important;text-shadow:0 2px 12px rgb(0 0 0/.35)}
  .auth-logo{position:absolute;top:14px;left:14px;width:110px!important;margin:0!important;padding:6px 10px;border-radius:12px;background:rgb(255 255 255/.92)}
}
@media (max-width:900px){.auth-logo{display:none!important}.auth-photo{object-position:50% 24%}}@media (min-width:600px) and (max-width:900px){.auth-intro{min-height:400px}}
/* dotyk: bez powiększania przy szybkim stukaniu, bez zaznaczania tekstu przy przytrzymaniu, bez „przyklejonych” efektów najechania */
button,a,.opt,.wchip,.bucket,.odd,[data-l],[data-r],[data-w],[data-i],[data-v],.ltile,.lm,.kchip,.kp-c,.next,.ns-card,.steps button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.wchip,.opt,.bucket,.odd,[data-l],[data-r],.steps button,.qdots button,.ltile,.kp-c{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
@media (hover:none){
  .ltile:hover .lt-art,.sc:hover .sc-ic,.lm:hover,.next:hover,.ns-card:hover,.kp-c:hover,.sc-pill:hover,.nx-go:hover,.steps button:hover,.btn:hover,.wchip:hover,.opt:hover,.node button:hover,.card.hover:hover{transform:none}
}
/* 1. tekst do zadania pod ręką */
.ctx-fab{position:fixed;right:16px;bottom:calc(92px + env(safe-area-inset-bottom));z-index:35;display:inline-flex;align-items:center;gap:8px;padding:11px 18px 11px 13px;border-radius:99px;background:var(--ink);color:#fff;font-weight:800;font-size:15px;box-shadow:0 12px 26px -10px rgb(21 26 61/.6);opacity:0;transform:translateY(16px) scale(.9);pointer-events:none;transition:opacity .2s,transform .25s var(--spring)}
.ctx-fab.on{opacity:1;transform:none;pointer-events:auto}
.ctx-fab svg{width:20px;height:20px}
.ctx-sheet{position:fixed;inset:0;z-index:85;display:flex;align-items:flex-end;justify-content:center;background:rgb(15 19 48/.4);animation:fadein .2s}
.ctx-sheet.out{opacity:0;transition:opacity .2s}
.cs-box{width:min(760px,100%);max-height:78vh;display:flex;flex-direction:column;background:#fff;border-radius:26px 26px 0 0;box-shadow:var(--shadow-l);animation:csUp .3s var(--ease);padding-bottom:env(safe-area-inset-bottom)}
@keyframes csUp{from{transform:translateY(40px);opacity:0}}
.cs-head{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 18px 10px;border-bottom:1px solid var(--line)}
.cs-grip{position:absolute;top:7px;left:50%;width:44px;height:5px;margin-left:-22px;border-radius:99px;background:var(--lav-300)}
.cs-head b{font-family:var(--display);font-size:18px}
.cs-x{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700);flex:none}
.cs-body{overflow:auto;-webkit-overflow-scrolling:touch;padding:14px 18px 22px;font-size:17px;line-height:1.6}
@media (min-width:900px){.ctx-sheet{align-items:center}.cs-box{border-radius:26px;max-height:82vh}}
/* 2. przycisk „×” w wypełnionej luce */
.gi{position:relative}
.gi-x{display:none;position:absolute;top:-9px;right:-7px;width:26px;height:26px;border-radius:50%;place-items:center;background:#fff;color:var(--ink-2);box-shadow:0 2px 6px rgb(21 26 61/.25);border:1.5px solid var(--line);z-index:2;padding:0}
.gi-x svg{width:14px;height:14px;stroke-width:2.6}
.gi.has:not(.ok):not(.near):not(.half):not(.shown):not(.open) .gi-x{display:grid}
.gi-x:hover{color:#c0392b}
@media (pointer:coarse){.gi-x{width:30px;height:30px;top:-11px;right:-9px}}
/* 6. słowniczek */
#qstage .qcard .body,.ctx-body{cursor:default}
.dict-pop{position:fixed;z-index:95;max-width:min(320px,calc(100vw - 20px));display:flex;flex-direction:column;gap:2px;padding:10px 14px;border-radius:16px;background:var(--ink);color:#fff;box-shadow:0 14px 30px -10px rgb(0 0 0/.45);animation:pop .2s var(--ease);pointer-events:auto}
.dict-pop b{font-family:var(--display);font-size:17px;color:var(--gold-300)}
.dict-pop span{font-weight:700;font-size:15px;line-height:1.35}
/* 7. podpowiedzi: ile zostało (na telefonie widać samą żarówkę — dokładamy licznik) */
.pbar [data-hint]{position:relative}
.pbar [data-hint][data-left]:not(:disabled)::after{content:attr(data-left);position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:var(--gold-400);color:var(--ink);font-size:12px;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 2px #fff}
.hint-cost{display:block;margin-top:6px;color:var(--ink-3);font-weight:700;font-size:13px}
.pbar [data-hint]{overflow:visible}
/* 8. wielkość tekstu i łatwiejsze czytanie */
html[data-text="1"] .pbody,html[data-text="1"] .cs-body{zoom:1.12}
html[data-text="2"] .pbody,html[data-text="2"] .cs-body{zoom:1.25}
html.easy-read .pbody,html.easy-read .cs-body{letter-spacing:.035em;word-spacing:.16em}
html.easy-read .pbody p,html.easy-read .pbody .rich,html.easy-read .cs-body p,html.easy-read .ctx-body p{line-height:1.8}
.seg-pick{display:inline-flex;gap:4px;padding:4px;border-radius:99px;background:var(--lav-100);flex:none}
.seg-pick button{min-width:46px;height:40px;border-radius:99px;font-weight:800;color:var(--ink-2)}
.seg-pick button[aria-checked=true]{background:#fff;color:var(--violet-700);box-shadow:var(--shadow-s)}
/* 9. zadania domowe */
.hw-card{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:28px;background:linear-gradient(135deg,#fff8e1,#fff);box-shadow:0 10px 28px -16px rgb(21 26 61/.3)}
.hw-ch{display:flex;align-items:center;gap:10px;padding:0 4px}
.hw-ch b{font-family:var(--display);font-size:19px}
.hw-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--gold-400);color:var(--ink);flex:none}
.hw-ic svg{width:22px;height:22px}
.hw-item{display:flex;align-items:center;gap:12px;padding:10px 12px 10px 10px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink)}
.hw-st{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;font-weight:800;background:var(--lav-100);color:var(--violet-700)}
.hw-st svg{width:18px;height:18px;stroke-width:3}
.hw-item.done .hw-st{background:var(--success-500);color:#fff}
.hw-item.soon .hw-st{background:var(--gold-400);color:var(--ink)}
.hw-item.late .hw-st{background:#ffd9d4;color:#b4321f}
.hw-t{flex:1;min-width:0;display:flex;flex-direction:column}
.hw-t b{font-size:15px;line-height:1.25}
.hw-t small{color:var(--ink-3);font-weight:700;font-size:13px}
.hw-item.late .hw-t small{color:#b4321f}
.hw-item.done{opacity:.75}
.hw-go{width:36px;height:36px;flex:none;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,var(--violet-500),var(--violet-600));color:#fff}
.hw-go svg{width:16px;height:16px;fill:currentColor;stroke:none;margin-left:2px}
.hw-teacher{display:flex;flex-direction:column;gap:12px;margin-bottom:14px}
.hw-th{display:flex;gap:12px;align-items:center}
.hw-th b{display:block;font-size:17px}
.hw-th small{color:var(--ink-3);font-weight:700}
.hw-form{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) auto minmax(0,1fr) auto;gap:8px}
.hw-form select,.hw-form input{min-height:44px;padding:0 12px;border-radius:14px;border:2px solid var(--line);background:#fff;font:inherit;font-weight:700;min-width:0}
.hw-msg{margin:0;color:var(--success-500);font-weight:800}
.hw-list{display:flex;flex-direction:column;gap:8px}
.hw-row{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:18px;background:var(--paper)}
.hw-main{flex:1;min-width:0}
.hw-main small{display:block;color:var(--ink-3);font-weight:700}
.hw-who{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.hw-who span{font-weight:800;font-size:13px;margin-right:2px}
.hw-who .ok{color:var(--success-500)}.hw-who .no{color:var(--ink-3);margin-left:6px}
.hw-who i{font-style:normal;font-size:12px;font-weight:700;padding:2px 8px;border-radius:99px;background:#fff;color:var(--ink-2)}
.hw-who i.d{background:var(--success-100);color:#0c7a50}
.hw-empty{margin:0;color:var(--ink-3);font-weight:700}
@media (max-width:900px){.hw-form{grid-template-columns:1fr 1fr}.hw-form button{grid-column:1/-1}}
/* album naklejek */
.album{margin-bottom:22px;display:flex;flex-direction:column;gap:16px}
.al-head h2{font-size:28px;margin-top:4px}
.al-head p{margin:4px 0 0;color:var(--ink-2);font-weight:600}
.al-stage h3{font-size:18px;margin-bottom:10px}
.al-stage h3 small{font-family:var(--font);font-weight:800;color:var(--ink-3);font-size:14px;margin-left:6px}
.al-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:14px}
.stk{position:relative;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 25%,#fff,var(--b1) 55%,var(--b2));box-shadow:0 0 0 4px #fff,0 8px 18px -8px rgb(21 26 61/.45);transform:rotate(var(--r,0deg));transition:transform .2s var(--spring);text-decoration:none;padding:12%}
.stk:hover{transform:rotate(0) scale(1.06)}
.stk .topic-art{width:100%;height:auto}
.stk i{position:absolute;right:-2px;bottom:-2px;min-width:26px;height:26px;padding:0 6px;border-radius:99px;background:var(--ink);color:#fff;font-style:normal;font-weight:800;font-size:13px;display:grid;place-items:center;box-shadow:0 0 0 3px #fff}
.stk.empty{background:var(--paper);box-shadow:inset 0 0 0 3px var(--lav-200);transform:none;border:0}
.stk.empty b{font-family:var(--display);font-size:22px;color:var(--lav-300)}
.stk-reveal{display:flex;flex-direction:column;align-items:center;gap:6px;margin:18px 0 6px;text-align:center}
.stk-reveal p{margin:0;color:var(--ink-2);font-weight:700}
.stk.big{width:150px;animation:stkIn .7s var(--spring) both}
@keyframes stkIn{from{transform:scale(.2) rotate(-40deg);opacity:0}}
@media (prefers-reduced-motion:reduce){.stk.big{animation:none}}
/* fiszki */
.fc-cta{display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:99px;background:linear-gradient(135deg,#efe8ff,#fff);box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink)}
.fc-cta[hidden]{display:none}
.fc-cta>svg{width:44px;height:44px;padding:11px;border-radius:50%;background:var(--violet-600);color:#fff;flex:none}
.fc-cta span:not(.lm-go){flex:1;min-width:0;display:flex;flex-direction:column}
.fc-cta small{color:var(--ink-3);font-weight:700}
.fcards .fc-pic{display:grid;place-items:center;margin-bottom:10px}
.fcards .fc-pic .wpic{transform:scale(1.6);transform-origin:center}
.fcards .fc-wrap{width:100%;align-self:center}
/* egzamin próbny */
.next-step[hidden]{display:none!important}
.mock-card{display:flex;gap:20px;align-items:stretch;justify-content:space-between;flex-wrap:wrap;margin-bottom:18px;background:linear-gradient(135deg,#fff8e1,#fff)}
.mk-l{flex:1 1 320px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.mk-l h3{font-size:24px}
.mk-l p{margin:0;color:var(--ink-2);font-weight:600}
.mk-hist{flex:0 1 240px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px}
.mk-hist small{color:var(--ink-3);font-weight:700}
.mk-hist .et-bars{height:80px}
.mock-timer{position:fixed;bottom:calc(92px + env(safe-area-inset-bottom));left:16px;z-index:60;display:inline-flex;align-items:center;gap:8px;padding:7px 16px 7px 12px;border-radius:99px;background:var(--ink);color:#fff;box-shadow:0 10px 24px -10px rgb(0 0 0/.5);font-variant-numeric:tabular-nums}
.mock-timer svg{width:18px;height:18px}
.mock-timer b{font-family:var(--display);font-size:18px}
.mock-timer small{opacity:.7;font-weight:700}
.mock-timer.warn{background:#c0392b;animation:pulse 1.4s ease-in-out infinite}
body.focus .ptop{padding-top:max(12px,calc(env(safe-area-inset-top) + 4px))}
.mock-res h1{font-size:72px}
.mk-per{display:flex;flex-direction:column;gap:8px;width:min(520px,100%);margin:22px auto 8px}
.mk-row{display:grid;grid-template-columns:110px 1fr 54px;align-items:center;gap:10px;padding:10px 14px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink)}
.mk-bar{height:12px;border-radius:99px;background:var(--lav-100);overflow:hidden}
.mk-bar i{display:block;height:100%;border-radius:inherit}
.mk-row small{font-weight:800;color:var(--ink-2);text-align:right}
.mock-timer.warn{animation:none}
/* wymowa 🔊 */
.say{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--lav-100);color:var(--violet-700);vertical-align:middle;flex:none;transition:transform .15s var(--spring)}
.say svg{width:22px;height:22px}
.say.sm{width:30px;height:30px;margin-left:8px;background:rgb(255 255 255/.15);color:var(--gold-300)}
.say.sm svg{width:18px;height:18px}
.say.big{width:58px;height:58px;background:linear-gradient(180deg,var(--violet-500),var(--violet-600));color:#fff;box-shadow:0 10px 20px -8px rgb(109 63 209/.6)}
.say.big svg{width:28px;height:28px}
.say.playing{animation:sayPulse .8s ease-in-out infinite}
@keyframes sayPulse{50%{transform:scale(1.12)}}
.dict-pop b{display:flex;align-items:center}
.fc-say{margin-top:14px;min-height:58px;display:grid;place-items:center}
.fc .face.front{display:flex;flex-direction:column;align-items:center;justify-content:center}
/* Lektorka: „Przeczytaj polecenie” / „Posłuchaj tekstu” — drugie stuknięcie zatrzymuje */
.listen{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:6px 14px 6px 8px;margin:8px 0 2px;border-radius:999px;background:var(--lav-100);color:var(--violet-700);font:inherit;font-size:14px;font-weight:800;line-height:1.2;border:1px solid rgb(109 63 209/.14);cursor:pointer;transition:background .15s,transform .15s var(--spring)}
.listen svg{width:22px;height:22px;flex:none;padding:3px;border-radius:50%;background:#fff;box-sizing:content-box}
.listen:active{transform:scale(.97)}
@media (hover:hover){.listen:hover{background:var(--lav-200,#e4dcfb)}}
.listen.playing{background:linear-gradient(180deg,var(--violet-500),var(--violet-600));color:#fff;border-color:transparent}
.listen.playing svg{color:var(--violet-700);animation:sayPulse .8s ease-in-out infinite}
.listen.playing span::after{content:" · Zatrzymaj";opacity:.85;font-weight:700}
.ctx-body>.listen{margin:0 0 8px}
#shead .listen{margin-top:10px}
/* Ekran logowania: grafika Love English (logo jest już w grafice) — cała widoczna, napisy na ciemnym dole */
.auth-intro{background:#0e1140;align-items:flex-end}
.auth-photo{inset:0 0 auto 0!important;height:auto!important;aspect-ratio:1/1;object-fit:cover;object-position:0 0!important;opacity:1;animation:none!important}
.auth-intro::after{background:linear-gradient(180deg,rgb(14 17 64/0) 0%,rgb(14 17 64/0) 48%,rgb(14 17 64/.72) 70%,rgb(14 17 64/.94) 100%)!important}
.auth-copy{padding-bottom:44px}
.auth-copy .eyebrow{color:#ffe08a}
.auth-copy h1,.auth-copy p{text-shadow:0 2px 14px rgb(8 8 40/.75)}
@media (max-width:900px){
  .auth-intro{min-height:0!important;aspect-ratio:1/1;max-height:none}
  .auth-photo{position:absolute;width:100%}
  .auth-intro::after{background:linear-gradient(180deg,rgb(14 17 64/0) 62%,rgb(14 17 64/.85) 100%)!important}
  .auth-copy{padding:0 18px 14px!important}
}
/* Fiszki: niewidoczna strona karty nie przechwytuje stuknięć (inaczej 🔊 na przodzie był zasłonięty przez tył) */
.fc:not(.flip) .face.back,.fc.flip .face.front{pointer-events:none}
/* Odpowiedzi zawsze pod ręką (wysokie karty: długie tabele, listy pól, dużo par) */
.bankrow .bchips{display:flex;flex-wrap:wrap;gap:8px;width:100%}
.bankrow.dock{position:sticky;bottom:calc(74px + env(safe-area-inset-bottom));z-index:8;margin:12px -6px 14px;padding:8px 10px 10px;background:rgb(240 235 255/.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--lav-300);box-shadow:0 -10px 24px -14px rgb(21 26 61/.45)}
.bankrow.dock small{font-size:12px;margin:0 0 6px}
.bankrow.dock .bchips{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,auto);grid-auto-columns:max-content;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;padding-bottom:4px;-webkit-overflow-scrolling:touch}
.bankrow.dock .wchip{min-height:42px;padding:6px 12px}
@media (min-width:901px){.bankrow.dock .bchips{grid-template-rows:repeat(3,auto)}}
.qcard.tall .match .mcol[data-right]{position:sticky;top:76px;max-height:calc(100vh - 180px);max-height:calc(100dvh - 180px);overflow-y:auto;overscroll-behavior:contain;padding:2px 2px 8px}
.qcard.tall #gbank{position:sticky;top:70px;z-index:8;max-height:34vh;overflow-y:auto;background:rgb(255 255 255/.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 10px 22px -16px rgb(21 26 61/.45);border-radius:16px}
.ctx-fab{bottom:calc(92px + var(--dockh,0px) + env(safe-area-inset-bottom))}
.toast{bottom:calc(110px + var(--dockh,0px))}
.opts.dock{position:sticky;bottom:calc(74px + env(safe-area-inset-bottom));z-index:8;margin:12px -6px 14px;padding:8px;border-radius:18px;background:rgb(240 235 255/.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--lav-300);box-shadow:0 -10px 24px -14px rgb(21 26 61/.45);max-height:46vh;max-height:46dvh;overflow-y:auto;overscroll-behavior:contain}
.opts.dock .opt{min-height:44px;padding-top:8px;padding-bottom:8px}
.opts.dock .opt{font-size:16px;line-height:1.3}
/* Wygląd zadań: kafelki par nie kurczą się w przyklejonej kolumnie; wyrazy dzielone z łącznikiem, nie litera po literze */
.mcol>.mt,.mcol>.match-done{flex-shrink:0}
.mt,.opt,.odd,.wchip,.bucket h4,.placed{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
.mt span,.mt em{min-width:0;flex:1 1 auto}
@media (max-width:420px){.match{gap:8px}.mt{font-size:15px;padding:9px 10px;gap:6px}.mt b{width:22px;height:22px;font-size:12px;border-radius:7px}}

/* Wygląd zadań (audyt): zwarta tabela na telefonie, tytuły tekstów, intruz bez zbędnego pola */
@media (max-width:700px){
  .tbl.compact table{display:table;table-layout:fixed}.tbl.compact thead{display:table-header-group}.tbl.compact tbody{display:table-row-group}
  .tbl.compact tr{display:table-row;padding:0}.tbl.compact td{display:table-cell;padding:8px 6px;border-top:1px solid var(--line);vertical-align:middle}
  .tbl.compact th{display:table-cell;padding:8px 6px;font-size:12px}
  .tbl.compact td[data-col]::before{display:none}
  .tbl.compact .gi{display:flex;width:100%}.tbl.compact .gi input,.tbl.compact .gi select{width:100%!important;min-width:0}
}
.text-title{font-family:var(--display);font-weight:800;font-size:clamp(18px,2.2vw,22px);letter-spacing:.01em;line-height:1.3;margin:4px 0 6px;color:var(--violet-700)}
.odd-hidden{display:none}
/* Audyt: odpowiedzi A/B nie wychodzą poza kartę; lista „wybierz…” nie szersza niż karta */
.opts{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.opt{min-width:0}.opt span{min-width:0;overflow-wrap:break-word}
.gi{max-width:100%}.gi .sel{max-width:100%;text-overflow:ellipsis}
@media (max-width:520px){.opts.long{grid-template-columns:1fr!important}.opts.long .opt{min-height:56px;justify-content:flex-start;font-size:18px}}
@media (max-width:380px){.opts:has(> .opt:nth-child(2):last-child) .opt{font-size:18px;padding:8px 10px;gap:8px;min-height:68px}.opts:has(> .opt:nth-child(2):last-child) .opt b{width:26px;height:26px}}
/* Ścieżka: w kółkach ilustracja tematu lekcji + numer w plakietce */
.node button{position:relative;width:86px;height:86px;background:linear-gradient(145deg,var(--b1,#fff),var(--b2,#f1ecff))!important;overflow:visible}
.node .node-art{width:68px;height:47px;pointer-events:none}
.node .node-n{position:absolute;right:-6px;bottom:-4px;min-width:30px;height:30px;padding:0 6px;border-radius:99px;display:grid;place-items:center;background:#fff;border:2.5px solid var(--lav-300);color:var(--ink);font-size:15px;line-height:1;box-shadow:0 3px 8px -4px rgb(21 26 61/.35)}
.node .node-n .i{width:16px;height:16px}
.node.done .node-n{background:var(--success-500);border-color:var(--success-500);color:#fff}
.node.cur .node-n{background:var(--violet-600);border-color:var(--violet-600);color:#fff}
/* Podsumowanie na telefonie: kółko wyniku nie jest ucinane, napisy mieszczą się w kafelkach */
.sumgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
.sumgrid .card{min-width:0;overflow:hidden}
.sumgrid .acc{max-width:100%;height:auto;display:block}
.sumgrid small{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
.sumgrid small i{display:block;font-style:normal;font-size:.85em;opacity:.8}
@media (max-width:560px){
  .sumgrid{grid-template-columns:1fr 1fr;gap:10px}
  .sumgrid .card:first-child{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:16px;text-align:left}
  .sumgrid .card:first-child .acc{width:96px;height:96px;margin:0;flex:none}
  .sumgrid .card:first-child small{font-size:18px;margin:0}
  .summary .sumgrid .card{padding:14px 12px;border-radius:24px}
  .sumgrid b{font-size:32px}.sumgrid small{font-size:14px}
  .card.talk{flex-direction:column;align-items:flex-start;gap:6px}
  .card.talk>span:last-child{width:100%}
}

.hintbox.flash{box-shadow:0 0 0 4px rgb(247 200 70/.5);transition:box-shadow .3s}

.rich .hintslot.above{display:block;margin:12px 0 2px;font-size:16px;line-height:1.45}
.rich .hintslot.above .hintbox{margin:0}

/* ═════════ C1 Advanced (CAE): nagrania, Part 4, kolejność, siatki, „Dlaczego?” ═════════ */
.player.has-aud .pbody{padding-bottom:240px}
.aud-dock{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom));z-index:34;width:min(880px,calc(100% - 24px));display:flex;align-items:center;gap:12px;padding:10px 14px 10px 10px;border-radius:22px;background:var(--navy-900);color:#fff;box-shadow:0 18px 40px -16px rgb(15 19 48/.65)}
.aud-play{flex:none;width:52px;height:52px;border-radius:50%;border:0;display:grid;place-items:center;background:linear-gradient(135deg,var(--violet-500),var(--violet-600));color:#fff;cursor:pointer;box-shadow:0 8px 20px -8px rgb(109 63 209/.9)}
.aud-play .i{width:24px;height:24px;fill:currentColor;stroke:none}
.aud-dock.on .aud-play{background:linear-gradient(135deg,var(--gold-400),var(--gold-500));color:var(--navy-900)}
.aud-play:disabled{opacity:.45;cursor:default}
.aud-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.aud-main b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aud-main small{font-size:13px;font-weight:700;opacity:.8}
.aud-bar{height:8px;border-radius:99px;background:rgb(255 255 255/.18);cursor:pointer;overflow:hidden}
.aud-bar i{display:block;height:100%;width:0;border-radius:inherit;background:var(--gold-400);transition:width .25s linear}
.aud-back{flex:none;border:0;border-radius:12px;padding:9px 10px;background:rgb(255 255 255/.12);color:#fff;font-weight:800;font-size:13px;cursor:pointer}
.aud-note{margin-bottom:10px}
.recbox{margin:0 0 14px;padding:12px;border-radius:18px;background:var(--paper);border:1.5px solid var(--line)}
.rec-row{display:flex;align-items:center;gap:12px}
.rec-go{flex:none;width:52px;height:52px;border-radius:50%;border:0;display:grid;place-items:center;background:linear-gradient(135deg,var(--violet-500),var(--violet-600));color:#fff;cursor:pointer;box-shadow:0 8px 20px -8px rgb(109 63 209/.9)}
.rec-go .i{width:24px;height:24px;fill:currentColor}
.recbox.on .rec-go{background:linear-gradient(135deg,#f05d5d,#d63b3b);animation:recpulse 1.2s ease-in-out infinite}
@keyframes recpulse{50%{box-shadow:0 0 0 9px rgb(214 59 59/.18)}}
.rec-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.rec-main b{font-size:15px}
.rec-main small{font-size:13px;font-weight:700;color:var(--ink-3)}
.rec-out{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.rec-out:not(:empty){margin-top:10px}
.rec-out audio{width:min(100%,340px);height:40px}
@media (prefers-reduced-motion:reduce){.recbox.on .rec-go{animation:none}}
.aud-tr{margin-top:8px;border-radius:14px;background:var(--paper)}
.aud-tr summary{display:flex;align-items:center;gap:8px;padding:10px 14px;font-weight:800;cursor:pointer;list-style:none}
.aud-tr summary::-webkit-details-marker{display:none}
.aud-tr summary small{margin-left:auto;font-weight:700;color:var(--ink-3)}
.aud-tr-body{padding:4px 14px 12px}
.aud-tr-body p{margin:0 0 8px;line-height:1.55}
.kwt-src{margin:0 0 8px;font-size:17px;font-weight:700;color:var(--ink-2)}
.kwt-kw{display:inline-flex;align-items:baseline;gap:8px;margin:0 0 10px;padding:4px 12px;border-radius:10px;background:var(--navy-900);color:#fff}
.kwt-kw span{font-size:12px;font-weight:700;opacity:.7}
.kwt-kw b{font-size:16px;letter-spacing:.06em}
input.masked::placeholder{letter-spacing:.08em;color:var(--violet-500);opacity:.75}
.tickbtn{display:inline-flex;align-items:center;margin:8px 0 0 6px;padding:8px 14px;border-radius:12px;border:1.5px solid var(--success-500);background:#fff;color:#0b6443;font-weight:800;font-size:14px;cursor:pointer}
.tickbtn:hover{background:var(--success-100)}
.gi.gi-set{display:block;margin:10px 0}
.ord-picked{margin:0 0 10px;padding:10px 14px 10px 34px;border-radius:14px;background:var(--paper);min-height:44px}
.ord-picked li{margin:4px 0;line-height:1.45}
.ord-picked li.ph{list-style:none;margin-left:-20px;color:var(--ink-3);font-weight:700}
.ord-opts{display:flex;flex-direction:column;gap:8px}
.ord-o{display:flex;gap:10px;align-items:flex-start;text-align:left;padding:10px 12px;border-radius:14px;border:1.5px solid var(--line);background:#fff;font:inherit;font-size:15px;cursor:pointer}
.ord-o b{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700)}
.ord-o:hover{border-color:var(--violet-500)}
.ord-clear{margin-top:10px}
.multiset{display:flex;flex-wrap:wrap;gap:8px}
.ms-o{padding:9px 14px;border-radius:99px;border:1.5px solid var(--line);background:#fff;font:inherit;font-weight:800;font-size:15px;cursor:pointer}
.ms-o.on{background:var(--violet-600);border-color:var(--violet-600);color:#fff}
.ms-o:disabled{cursor:default}
.note.why{background:#fff8e6;color:#6b4a00}
.note.why b{margin-right:4px}
.gloss-ex{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.gloss .gex{display:block;margin-top:3px;font-size:13px;font-weight:600;color:var(--ink-2)}
.fc-ex{margin-top:10px;font-size:15px;font-weight:700;opacity:.75;font-style:italic;text-align:center;padding:0 12px}
@media (max-width:640px){
  .aud-dock{bottom:calc(74px + env(safe-area-inset-bottom));gap:10px;padding:8px 10px 8px 8px;border-radius:18px}
  .aud-play{width:46px;height:46px}
  .aud-main b{font-size:14px}
  .player.has-aud .pbody{padding-bottom:230px}
}
.ctx-carried{margin-top:12px;border-radius:14px;background:var(--paper)}
.ctx-carried>summary{display:flex;align-items:center;gap:8px;padding:10px 14px;font-weight:800;cursor:pointer;list-style:none}
.ctx-carried>summary::-webkit-details-marker{display:none}
.ctx-carried>summary small{margin-left:auto;font-weight:700;color:var(--ink-3)}
.ctx-carried-body{padding:2px 14px 12px}
/* CAE: podkreślenia z materiałów (struktury docelowe, słowo do zamiany) */
u.ul{text-decoration:underline;text-decoration-color:var(--violet-500);text-decoration-thickness:2px;text-underline-offset:3px;background:linear-gradient(transparent 62%,rgb(124 77 219/.12) 62%);border-radius:2px}
/* ═══ CAE: interakcje — eliminacja opcji, licznik Part 4, słowotwórstwo, kratki liter, asystent pisania, fala, sprint ═══ */
@keyframes caePop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.opt{position:relative}
.opt-x{position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--paper);color:var(--ink-3);opacity:.6;transition:opacity .2s,background .2s,transform .2s var(--spring)}
.opt-x .i{width:14px;height:14px}
.opt:hover .opt-x{opacity:1}
.opt-x:hover{background:#fde4e1;color:var(--coral);transform:scale(1.12)}
.opt.struck{opacity:.5;filter:grayscale(.7)}
.opt.struck span{text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:var(--coral)}
.opt.struck .opt-x{opacity:1;background:var(--coral);color:#fff}
.opt-tip{grid-column:1/-1;margin:2px 0 0;font-size:13px;font-weight:700;color:var(--ink-3)}
.kwt-meter{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:10px 0 0;font-size:14px;font-weight:800;color:var(--ink-3)}
.km-dots{display:inline-flex;gap:4px}
.km-dots i{width:16px;height:8px;border-radius:99px;background:var(--lav-100);transition:background .2s,transform .2s var(--spring)}
.km-dots i.z{box-shadow:inset 0 0 0 1.5px var(--lav-300)}
.km-dots i.on{background:var(--violet-500);transform:scaleY(1.3)}
.kwt-meter.good .km-dots i.on{background:var(--success-500)}
.kwt-meter.over .km-dots i.on{background:var(--coral)}
.kwt-meter.good .km-n{color:var(--success-500)}
.kwt-meter.over .km-n{color:var(--coral)}
.km-kw{padding:3px 10px;border-radius:99px;background:var(--lav-100);color:var(--ink-2);letter-spacing:.03em}
.km-kw.on{background:var(--success-100);color:var(--success-500);animation:caePop .3s var(--spring)}
.wf.done{border-color:var(--success-500);background:var(--success-100)}
.wf .wf-ans,.wf .wf-aff{text-transform:none}
.wf-ans{text-transform:none;letter-spacing:0;display:inline-flex;align-items:baseline;color:var(--ink);animation:wfIn .5s var(--spring) both}
.wf-aff{display:inline-block;padding:0 3px;margin:0 1px;border-radius:6px;animation:caePop .55s .3s var(--spring) both}
.wf-aff.pre{background:#e3ecff;color:#2f6fe4}
.wf-aff.suf{background:var(--amber-100);color:#b86b06}
@keyframes wfIn{from{opacity:0;transform:translateX(-8px)}}
.gi-mask{display:inline-flex;align-items:center;vertical-align:middle}
.gi-mask input{position:absolute;inset:0;width:100%!important;height:100%;min-height:0;opacity:0;cursor:text;z-index:2}
.gi-mask .gi-x{z-index:3}
.mboxes{display:inline-flex;flex-wrap:wrap;gap:6px 12px;padding:4px 2px}
.mw{display:inline-flex;gap:3px;white-space:nowrap}
.mw i{width:1.3em;height:1.7em;display:inline-grid;place-items:center;border-radius:7px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--lav-300);font-style:normal;font-weight:800;font-size:.88em;color:var(--violet-700);text-transform:lowercase;transition:box-shadow .15s,background .15s}
.mw i.g{color:var(--ink-3);background:var(--lav-100)}
.mw i.f{box-shadow:inset 0 0 0 2px var(--violet-500);animation:caePop .18s var(--spring)}
.mw i.cur{animation:boxBlink 1s steps(1) infinite}
.mw i.x{color:var(--coral);box-shadow:none;background:none}
.gi.ok .mw i,.gi.near .mw i,.gi.half .mw i,.gi.open .mw i{box-shadow:inset 0 0 0 2px var(--success-500);background:var(--success-100);color:var(--success-500)}
.gi.shown .mw i{box-shadow:inset 0 0 0 2px var(--amber-500);background:var(--amber-100);color:#b86b06}
.gi.bad .mw i.f{box-shadow:inset 0 0 0 2px var(--coral)}
@keyframes boxBlink{0%{box-shadow:inset 0 0 0 2.5px var(--violet-500)}50%{box-shadow:inset 0 0 0 1.5px var(--lav-300)}}
.wfly{position:fixed;z-index:95;pointer-events:none;margin:0!important}
.find-ins{margin:10px 0 2px}
.find-ins.done{color:var(--success-500)}
.wcoach{margin:10px 0 4px;display:grid;gap:9px;padding:12px 14px;border-radius:16px;background:var(--paper);border:1.5px solid var(--line)}
.wc-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.wc-lab{font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);min-width:118px}
.wc-chips{display:flex;flex-wrap:wrap;gap:6px}
.wc-chips i{font-style:normal;font-size:13px;font-weight:700;padding:4px 10px;border-radius:99px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--lav-200);color:var(--ink-3);transition:background .25s,color .25s,box-shadow .25s}
.wc-chips i.on{background:var(--success-100);box-shadow:inset 0 0 0 1.5px var(--success-500);color:var(--success-500);animation:caePop .3s var(--spring)}
.wc-stats{gap:6px 18px;font-size:13px;font-weight:700;color:var(--ink-3)}
.wc-stats b{color:var(--ink-2)}
.wc-stats .lo{color:var(--amber-500)}
.wc-stats .hi{color:var(--coral)}
.wc-stats .ok{color:var(--success-500)}
.wmeter .bar.in span{background:var(--success-500)}
.wmeter .bar.over span{background:var(--coral)}
.aud-wave{flex:none;display:inline-flex;align-items:center;gap:3px;height:28px}
.aud-wave i{width:3px;height:28%;border-radius:2px;background:rgb(255 255 255/.3);transition:height .3s}
.aud-dock.on .aud-wave i{background:var(--gold-400);animation:audWave 1s ease-in-out infinite}
.aud-wave i:nth-child(3n){animation-delay:-.3s}
.aud-wave i:nth-child(3n+1){animation-delay:-.65s}
.aud-wave i:nth-child(4n){animation-duration:.8s}
.aud-wave i:nth-child(5n){animation-duration:1.3s}
@keyframes audWave{0%,100%{height:25%}50%{height:95%}}
.rec-lv{display:none;align-items:center;gap:3px;height:32px;order:9;margin-left:auto}
.recbox.on .rec-lv{display:inline-flex}
.rec-lv i{width:4px;border-radius:2px;background:#d63b3b;height:calc(12% + var(--lv,0) * 88%);transition:height .08s}
.rec-lv i:nth-child(2n){height:calc(12% + var(--lv,0) * 60%)}
.rec-lv i:nth-child(3n){height:calc(12% + var(--lv,0) * 74%)}
.sprint-go{margin-top:10px;display:inline-flex;align-items:center;gap:6px;border:0;border-radius:99px;padding:8px 16px;font:inherit;font-weight:900;font-size:14px;color:var(--navy-900);background:linear-gradient(135deg,var(--gold-300),var(--gold-400));box-shadow:0 8px 18px -10px rgb(224 169 27/.9);cursor:pointer;transition:transform .2s var(--spring),box-shadow .2s}
.sprint-go:hover{transform:translateY(-2px);box-shadow:0 12px 22px -10px rgb(224 169 27/.95)}
.sprint{position:fixed;inset:0;z-index:120;background:rgb(15 19 48/.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:grid;place-items:center;padding:16px;animation:fade .2s}
.sp-card{width:min(640px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:#fff;border-radius:26px;padding:20px 22px 24px;box-shadow:0 30px 70px -20px rgb(15 19 48/.6);animation:caePop .3s var(--spring)}
.sp-top{display:flex;align-items:center;gap:12px}
.sp-top b{font-size:17px}
.sp-time{flex:1;height:8px;border-radius:99px;background:var(--lav-100);overflow:hidden}
.sp-time i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--violet-500),var(--violet-600));transition:width .2s linear}
.sp-time i.warn{background:var(--coral)}
.sp-score{min-width:40px;text-align:center;font-weight:900;font-size:19px;color:var(--violet-600)}
.sp-score.bump{animation:caePop .3s var(--spring)}
.sp-x{border:0;background:var(--paper);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:var(--ink-2)}
.sp-n{margin:16px 0 6px;font-size:13px;font-weight:800;color:var(--ink-3)}
.sp-run{color:var(--amber-500)}
.sp-q{font-size:21px;line-height:1.75;margin:4px 0 16px}
.sp-in{font:inherit;font-weight:800;color:var(--violet-700);border:0;border-bottom:3px solid var(--violet-500);background:var(--lav-100);border-radius:8px 8px 0 0;padding:2px 8px;outline:none;max-width:100%}
.sp-in.ok{border-color:var(--success-500);background:var(--success-100);color:var(--success-500)}
.sp-in.bad{border-color:var(--coral);background:#fde4e1}
.sp-row{display:flex;flex-wrap:wrap;gap:10px}
.sp-fb{min-height:22px;margin:10px 0 0;font-weight:800;color:var(--ink-3)}
.sp-end{text-align:center;padding:10px 0}
.sp-big{font-size:64px;font-weight:900;color:var(--violet-600);line-height:1;animation:caePop .45s var(--spring)}
.sp-big small{font-size:24px;color:var(--ink-3)}
.sp-end ul{list-style:none;padding:0;margin:14px 0 20px;display:grid;gap:4px;font-weight:700;color:var(--ink-2)}
@media (max-width:560px){.aud-wave{display:none}.sp-q{font-size:18px}.wc-lab{min-width:0;width:100%}.sp-card{padding:16px 16px 20px}}
@media (prefers-reduced-motion:reduce){.aud-dock.on .aud-wave i{animation:none;height:60%}.mw i.cur{animation:none;box-shadow:inset 0 0 0 2.5px var(--violet-500)}}
/* CAE: Łowca błędów */
.rich.bh .bh-w{cursor:pointer;border-radius:6px;padding:0 2px;margin:0 -2px;transition:background .15s,color .15s,box-shadow .15s}
.rich.bh .bh-w:hover{background:var(--lav-100)}
.rich.bh .bh-w.mark{background:#fde4e1;color:#c0392b;box-shadow:inset 0 -3px 0 var(--coral);animation:caePop .25s var(--spring)}
.bh-tip{margin:6px 0 4px;font-size:13px;font-weight:700;color:var(--ink-3)}
.bh-fix{margin:8px 0 6px;padding:10px 14px;border-radius:14px;background:var(--paper);font-size:17px;line-height:1.7;animation:wfIn .45s var(--spring) both}
.bh-fix del{color:#c0392b;text-decoration-thickness:2px;opacity:.75}
.bh-fix ins{text-decoration:none;font-weight:800;color:var(--success-500);background:var(--success-100);padding:1px 6px;border-radius:6px;animation:caePop .5s .25s var(--spring) both}
.bh-fix.ok{color:var(--success-500);font-weight:800}

/* ═════════ Klasy 4–8 i liceum: urozmaicenia (patch 13) ═════════ */
/* Prawda / Fałsz — dwa duże kafelki z ikoną */
.opts.tf{grid-template-columns:1fr 1fr}
.opt.tf-y,.opt.tf-n{justify-content:center;flex-direction:column;gap:4px;min-height:92px;text-align:center}
.opt.tf-y span,.opt.tf-n span{display:flex;flex-direction:column;align-items:center;font-size:20px}
.tf-i{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:21px;font-weight:900;color:#fff;transition:transform .25s var(--spring)}
.opt.tf-y .tf-i{background:var(--success-500)}
.opt.tf-n .tf-i{background:var(--coral)}
.opt.tf-y:hover{border-color:#8fd9b8}.opt.tf-n:hover{border-color:#f5b1a8}
.opt.tf-y:hover .tf-i,.opt.tf-n:hover .tf-i{transform:scale(1.12) rotate(-6deg)}
.tf-pl{display:block;font-size:12px;font-weight:800;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.opts.dock .opt.tf-y,.opts.dock .opt.tf-n{min-height:56px;flex-direction:row}
/* Sprint z odpowiedziami do wyboru */
.sp-opts{margin:0 0 14px}
.sp-opts .opt{min-height:56px;font-size:17px}
.sp-gap{display:inline-block;min-width:3.2em;padding:0 8px;border-radius:8px 8px 0 0;border-bottom:3px solid var(--violet-500);background:var(--lav-100);color:var(--violet-600);font-weight:900;text-align:center}
/* Ułóż z liter */
.tiles-go{font-size:14px}
.lettiles{margin:10px 0 12px;padding:12px 14px;border-radius:18px;background:var(--lav-100);border:2px dashed var(--lav-300);display:flex!important;flex-direction:column;align-items:flex-start;gap:10px;width:auto;animation:caePop .35s var(--spring)}
.lettiles small{font-weight:800;color:var(--ink-2);font-size:13px}
.lt-row{display:flex;flex-wrap:wrap;gap:8px;width:100%}
.lettiles .btn{flex:none;width:auto;min-height:0}
.lt{width:46px;height:50px;border-radius:12px;border:2px solid var(--lav-300);background:#fff;box-shadow:0 4px 0 var(--lav-300);font:inherit;font-family:var(--display);font-size:24px;font-weight:800;color:var(--violet-700);cursor:pointer;text-transform:none;transition:transform .15s,opacity .2s}
.lt:hover{transform:translateY(-2px)}
.lt:active{transform:translateY(3px);box-shadow:0 1px 0 var(--lav-300)}
.lt:disabled{opacity:.25;box-shadow:none;transform:scale(.9);cursor:default}
/* Seria: 5 / 10 / 15 z rzędu */
.cburst{position:fixed;left:50%;top:max(84px,14vh);z-index:90;transform:translateX(-50%);display:grid;justify-items:center;gap:2px;padding:14px 22px 12px;border-radius:22px;background:linear-gradient(135deg,#fff6dc,#ffe3c7);border:2px solid #ffc98a;box-shadow:0 18px 40px -14px rgb(224 86 27/.55);pointer-events:none;animation:cbIn 2s var(--spring) both}
.cburst span{font-size:34px;line-height:1}
.cburst b{font-family:var(--display);font-size:24px;color:#c2410c}
.cburst small{font-weight:800;color:#9a5b12;font-size:13px}
@keyframes cbIn{0%{opacity:0;transform:translate(-50%,-14px) scale(.6)}14%{opacity:1;transform:translate(-50%,0) scale(1.06)}22%{transform:translate(-50%,0) scale(1)}82%{opacity:1}100%{opacity:0;transform:translate(-50%,-10px) scale(.96)}}
/* Mini-cel: obrazek lekcji pod kafelkami i gwiazdki */
.inter .box.fun{padding:22px 24px 26px;width:min(380px,calc(100vw - 32px))}
.reveal{position:relative;width:100%;aspect-ratio:160/110;border-radius:22px;overflow:hidden;margin:0 0 6px;background:var(--lav-100)}
.reveal .reveal-art{position:absolute;inset:0;width:100%;height:100%}
.rv-tiles{position:absolute;inset:0;display:grid;gap:3px;padding:3px}
.rv-tiles i{border-radius:10px;background:linear-gradient(135deg,var(--lav-200),var(--lav-300));box-shadow:inset 0 0 0 2px rgb(255 255 255/.55);position:relative}
.rv-tiles i::after{content:'?';position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:20px;color:#fff;opacity:.85}
.rv-tiles i.off{visibility:hidden}
.rv-tiles i.go{animation:rvOff .55s var(--d,.3s) cubic-bezier(.5,0,.6,1) both}
@keyframes rvOff{0%{transform:none;opacity:1}45%{transform:rotateY(70deg) scale(.95);opacity:1}100%{transform:rotateY(90deg) scale(.6);opacity:0}}
.reveal.full{box-shadow:0 0 0 3px var(--gold-400),0 14px 30px -12px var(--gold-500)}
.rv-cap{margin:4px 0 10px!important;font-size:13px;color:var(--ink-3)!important}
.stars3{display:flex;justify-content:center;gap:6px;margin:8px 0 2px}
.stars3 svg{width:38px;height:38px;fill:var(--lav-200)}
.stars3 svg.on{fill:var(--gold-400);filter:drop-shadow(0 3px 0 var(--gold-500));animation:caePop .5s var(--d,.4s) var(--spring) both}
@media (prefers-reduced-motion:reduce){.cburst,.rv-tiles i.go,.stars3 svg.on,.lettiles{animation:none}.rv-tiles i.go{visibility:hidden}.cburst{animation:none;opacity:1}}
/* Powtórki: wpisz odpowiedź / dyktando */
.rv-type{display:flex;gap:8px;max-width:520px;margin:0 auto 6px;padding:0 4px}
.rv-type input{flex:1;min-width:0;font:inherit;font-weight:700;font-size:17px;padding:12px 14px;border-radius:14px;border:2px solid var(--line);background:#fff;color:var(--ink);outline:none}
.rv-type input:focus{border-color:var(--violet-500);box-shadow:0 0 0 4px var(--lav-200)}
.rv-type input:disabled{background:var(--lav-100)}
.rv-res{min-height:24px;text-align:center;font-weight:800;margin:4px 0 12px;color:var(--ink-3)}
.rv-res.ok{color:var(--success-500)}.rv-res.near{color:var(--amber-500)}.rv-res.bad{color:var(--coral)}
.btn.sugg{box-shadow:0 0 0 4px var(--gold-300)}
.rv-dict{margin:10px auto 0;display:inline-flex;align-items:center;gap:6px;border:2px solid var(--lav-300);background:#fff;color:var(--violet-700);font:inherit;font-weight:800;font-size:14px;padding:7px 14px;border-radius:99px;cursor:pointer}
.rv-dict[aria-pressed="true"]{background:var(--violet-600);border-color:var(--violet-600);color:#fff}
.fc.dict .front .big{font-size:22px!important;color:var(--ink-2)}

/* ═════════ UI 2.0 (patch 16): kokpit z planem dnia, mozaika rozdziałów, gwiazdki, mniej animacji ═════════ */
/* Kokpit: góra + prawa kolumna + lekcje */
.home{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "rail" "les";gap:22px;max-width:1080px}
.home-top{grid-area:top;display:flex;flex-direction:column;gap:22px;min-width:0}
.home-les{grid-area:les;display:flex;flex-direction:column;gap:22px;min-width:0}
.home-rail{grid-area:rail;min-width:0}
.home .hi-stats{display:none}
@media (min-width:1240px){
  .home{max-width:1420px;grid-template-columns:minmax(0,1fr) 312px;grid-template-areas:"top rail" "les rail";column-gap:28px;align-items:start}
  .home-rail{position:sticky;top:84px;display:flex;flex-direction:column;gap:14px}
}
@media (max-width:1239px){
  .home-rail{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:-6px -32px 0;padding:6px 32px 10px;scroll-padding-inline:32px}
  .home-rail::-webkit-scrollbar{display:none}
  .home-rail>.rl-card{flex:none;width:250px;scroll-snap-align:start}
  .home-rail>.rl-plan{width:min(330px,86vw)}
}
@media (max-width:760px){.home-rail{margin:-6px -16px 0;padding:6px 16px 10px;scroll-padding-inline:16px}}
.rl-card{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:24px;background:#fff;box-shadow:var(--shadow-s);border:1px solid var(--line);text-decoration:none;color:var(--ink);min-width:0}
a.rl-card{transition:transform .2s var(--spring),box-shadow .2s}
a.rl-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-m)}
.rl-head{display:flex;align-items:center;gap:12px}
.rl-head b{display:block;font-family:var(--display);font-size:19px;line-height:1.15}
.rl-head small,.rl-card small{display:block;font-weight:700;font-size:13px;color:var(--ink-3);line-height:1.35}
.rl-ring{position:relative;width:58px;height:58px;flex:none;display:grid;place-items:center}
.rl-ring .ring{position:absolute;inset:0}
.rl-ring b{font-family:var(--display);font-size:16px!important;color:var(--ink)}
.rl-task{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:16px;background:var(--paper);text-decoration:none;color:var(--ink);transition:background .2s,transform .15s}
.rl-task:hover{background:var(--lav-100)}
.rl-task:active{transform:scale(.98)}
.rl-ico{width:36px;height:36px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--lav-200);color:var(--violet-700)}
.rl-ico .i{width:18px;height:18px}
.rl-t{min-width:0;display:flex;flex-direction:column}
.rl-t b{font-size:15px;line-height:1.25}
.rl-t small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rl-task.done .rl-ico{background:var(--success-500);color:#fff}
.rl-task.done .rl-t b{color:var(--ink-3);text-decoration:line-through;text-decoration-color:rgb(20 160 106/.6);text-decoration-thickness:2px}
.rl-plan.all{background:linear-gradient(150deg,#effbf5,#fff 60%);border-color:#bfead6}
.rl-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.rl-row b{font-size:15px}
.rl-fire{display:inline-flex;align-items:center;gap:3px;padding:3px 9px 3px 6px;border-radius:99px;background:#fff1e6;color:#e0561b;font-weight:800;font-size:13px;white-space:nowrap}
.rl-fire .i{width:16px;height:16px}
.rl-week .hs-week{box-shadow:none;padding:0;background:none;justify-content:space-between;gap:4px}
.rl-week .hs-week i{width:30px;height:30px;font-size:12px}
.rl-lvl{flex-direction:row;align-items:center;gap:14px}
.rl-lvl .hl-r{position:relative;width:52px;height:52px;flex:none;display:grid;place-items:center}
.rl-lvl .hl-r .ring{position:absolute;inset:0}
.rl-lvl .hl-r b{font-family:var(--display);font-size:20px}
.rl-lvl b{display:block;font-size:16px}
.rl-album{flex-direction:row;align-items:center;gap:14px}
.rl-album b{display:block;font-size:16px}
.rl-stk{position:relative;width:70px;height:52px;flex:none}
.rl-stk i{position:absolute;top:2px;width:46px;height:46px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff,var(--b1) 55%,var(--b2));box-shadow:0 0 0 3px #fff,0 4px 10px -4px rgb(21 26 61/.4);transform:rotate(var(--r));overflow:hidden;display:grid;place-items:center}
.rl-stk i:nth-child(1){left:0}.rl-stk i:nth-child(2){left:12px;z-index:1}.rl-stk i:nth-child(3){left:24px;z-index:2}
.rl-stk .topic-art{width:100%;height:auto}
/* Kafelki lekcji: gwiazdki i „tu jesteś” */
.stars-row{font-size:15px;letter-spacing:1px;color:var(--gold-400);text-shadow:0 1px 0 #c9971d;line-height:1;white-space:nowrap}
.stars-row i{font-style:normal;color:rgb(255 255 255/.75);text-shadow:none}
.lt-stars{position:absolute;left:10px;bottom:9px;padding:4px 8px;border-radius:99px;background:rgb(21 26 61/.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.lt-here{position:absolute;left:50%;bottom:9px;transform:translateX(-50%);padding:4px 11px;border-radius:99px;background:var(--gold-400);color:var(--navy-900);font-weight:900;font-size:12px;letter-spacing:.04em;text-transform:uppercase;box-shadow:0 3px 0 #c9971d;white-space:nowrap}
/* Ścieżka: mozaika obrazków rozdziału (szare → kolorowe po ukończeniu lekcji) */
.chapter.mosaic-ch{background:linear-gradient(120deg,var(--navy-900),#2d3570)}
.mosaic{position:absolute;inset:0;display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,1fr);grid-auto-columns:minmax(74px,1fr);gap:6px;padding:8px;opacity:.95}
.mosaic span{border-radius:16px;background:linear-gradient(145deg,var(--b1),var(--b2));display:grid;place-items:center;overflow:hidden;filter:grayscale(.9) brightness(1.05);opacity:.6;transition:filter 1s,opacity 1s,transform .6s var(--spring)}
.mosaic span.on{filter:none;opacity:1;box-shadow:0 0 0 2.5px rgb(244 197 66/.9)}
.mosaic .topic-art{width:100%;height:100%;object-fit:cover}
.chapter.mosaic-ch::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgb(21 26 61/.92) 0%,rgb(21 26 61/.7) 38%,rgb(21 26 61/.08) 78%,transparent 100%);pointer-events:none}
@media (max-width:760px){.chapter.mosaic-ch::after{background:linear-gradient(180deg,rgb(21 26 61/.25) 0%,rgb(21 26 61/.88) 62%)}}
.chapter.mosaic-ch>*:not(.mosaic){position:relative;z-index:1}
/* Węzły ścieżki: podpisy w pigułce, maks. 3 wiersze */
.node .lbl{background:#fff;border-radius:12px;padding:4px 9px;box-shadow:0 4px 12px -8px rgb(21 26 61/.35);color:var(--ink);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-width:150px}
.node.sel .lbl{box-shadow:0 0 0 2.5px var(--violet-500),0 4px 12px -8px rgb(21 26 61/.35)}
.node-stars{font-size:14px;margin-top:-3px;text-shadow:0 1px 0 #c9971d}
.node-stars i{color:var(--lav-300);text-shadow:none}
@media (max-width:760px){.node .lbl{font-size:12px;max-width:132px}}
/* Podsumowanie: gwiazdki */
.sum-stars{display:flex;justify-content:center;align-items:center;gap:8px;margin:6px 0 4px;flex-wrap:wrap}
.sum-stars svg{width:48px;height:48px;fill:var(--lav-200)}
.sum-stars svg.on{fill:var(--gold-400);filter:drop-shadow(0 3px 0 var(--gold-500));animation:caePop .55s var(--d,.4s) var(--spring) both}
.sum-stars small{flex-basis:100%;font-weight:800;color:var(--ink-3)}
/* Dostępność: wyraźna obwódka przy obsłudze klawiaturą */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid var(--violet-500);outline-offset:2px;border-radius:inherit}
/* Mniej animacji (Ustawienia) */
html.calm *,html.calm *::before,html.calm *::after{animation-duration:.001ms!important;animation-delay:0s!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
html.calm .node.cur button{animation:none}
@media (prefers-reduced-motion:reduce){.sum-stars svg.on{animation:none}}

/* Karta „Następna lekcja”: dwie kolumny także na średnich ekranach (561–760 px) */
@media (min-width:561px) and (max-width:760px){
  .next{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);padding:16px}
  .nx-art{grid-column:2;grid-row:1;max-width:240px}
  .nx-body{grid-column:1;grid-row:1;align-items:flex-start;padding:8px 4px 8px 10px}
  .nx-go{justify-content:flex-start}
}
@media (min-width:1700px){.home{max-width:1560px;grid-template-columns:minmax(0,1fr) 340px}}
/* Album: zakryta naklejka pokazuje szary zarys obrazka lekcji */
.stk.empty{position:relative;overflow:hidden}
.stk.empty .topic-art{position:absolute;inset:12%;width:76%;height:76%;filter:grayscale(1);opacity:.22;transition:opacity .3s,filter .3s}
.stk.empty:hover .topic-art{opacity:.5;filter:grayscale(.3)}
.stk.empty b{position:relative;z-index:1}
/* Ustawienia: wiersz z wyborem klasy pod opisem, nie obok */
.setrow:has(.klasa.big){flex-direction:column;align-items:stretch}
.setrow:has(.klasa.big) .klasa.big{justify-content:flex-start}

/* Pelne kadrowanie gwaszowych okladek w kolach sciezki i albumu. */
.node button:has(> .topic-art.a3){background:transparent!important}
.node .topic-art.a3,.stk .topic-art.a3,.rl-stk .topic-art.a3{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;overflow:hidden;pointer-events:none}
.node .ring{z-index:1}
.node .node-n,.stk i{z-index:2}
.stk:has(> .topic-art.a3){padding:0;background:transparent}
/* Mozaika rozdziału na większych ekranach: tylko prawa część banera, tekst na pełnym tle */
@media (min-width:761px){
  .mosaic{left:42%;grid-auto-columns:minmax(64px,1fr)}
  .chapter.mosaic-ch::after{background:linear-gradient(90deg,var(--navy-900) 0%,var(--navy-900) 40%,rgb(21 26 61/.55) 46%,rgb(21 26 61/0) 62%)}
}
@media (min-width:761px){.chapter.mosaic-ch>small,.chapter.mosaic-ch>h2,.chapter.mosaic-ch>.bar{max-width:39%}}

/* ═════════ Kokpit i ekran lekcji od nowa (patch 18) ═════════ */
/* Kokpit */
.k2-hi h1{font-size:clamp(26px,3.4vw,36px);color:var(--ink)}
.k2-hi p{margin:4px 0 0;color:var(--ink-3);font-weight:700;font-size:16px}
.k2-now{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);min-height:300px;border-radius:32px;overflow:hidden;text-decoration:none;color:var(--ink);background:#fff;box-shadow:0 24px 50px -28px rgb(21 26 61/.45);border:1px solid var(--line);isolation:isolate;transition:transform .25s var(--spring),box-shadow .25s}
.k2-now:hover{transform:translateY(-3px);box-shadow:0 30px 60px -28px rgb(21 26 61/.5)}
.k2-cover{position:relative;display:block;overflow:hidden;background:linear-gradient(145deg,var(--b1),var(--b2))}
.k2-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:k2Ken 18s ease-in-out infinite alternate}
.k2-cover .cover-svg{position:absolute;inset:0;display:grid;place-items:center;padding:12px}
@keyframes k2Ken{from{transform:scale(1.02)}to{transform:scale(1.1) translate(-1.5%,-1%)}}
.k2-body{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;padding:26px 28px;background:radial-gradient(120% 100% at 100% 0%,var(--lav-100),#fff 60%)}
.k2-tag{font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:99px;background:var(--lav-100);color:var(--violet-700)}
.k2-title{font-family:var(--display);font-weight:800;font-size:clamp(24px,2.6vw,34px);line-height:1.08;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.k2-step{display:inline-flex;align-items:center;gap:8px;font-weight:800;color:var(--ink-2);font-size:15px}
.k2-step .i{width:28px;height:28px;padding:5px;border-radius:9px;background:var(--lav-200);color:var(--violet-700)}
.k2-segs{display:flex;gap:5px;width:100%;max-width:360px}
.k2-segs>i{flex:1;height:8px;border-radius:99px;background:var(--lav-200);overflow:hidden;position:relative}
.k2-segs>i>i{display:block;height:100%;border-radius:inherit;background:var(--violet-500);transition:width .8s var(--ease)}
.k2-segs>i.done>i{background:var(--success-500)}
.k2-segs>i.cur{box-shadow:0 0 0 2px var(--gold-400)}
.k2-go{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:12px;margin-top:4px;padding:8px 24px 8px 8px;border-radius:99px;background:linear-gradient(180deg,var(--violet-500),var(--violet-600));color:#fff;font-weight:800;font-size:18px;box-shadow:0 10px 22px -10px rgb(109 63 209/.8)}
.k2-go svg{width:42px;height:42px;padding:11px 10px 11px 13px;border-radius:50%;background:#fff;color:var(--violet-600);fill:currentColor;stroke:none}
.k2-go::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgb(255 255 255/.35) 50%,transparent 70%);transform:translateX(-120%);animation:goShine 3.6s 1.2s ease-in-out infinite}
.k2-plan{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.k2-p{position:relative;height:100%;box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:14px 14px 13px;border-radius:22px;background:#fff;border:2px solid var(--line);text-decoration:none;color:var(--ink);transition:transform .2s var(--spring),border-color .2s,box-shadow .2s}
.k2-p:hover{transform:translateY(-2px);box-shadow:var(--shadow-m)}
.k2-pi{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700);margin-bottom:4px}
.k2-pi .i{width:19px;height:19px}
.k2-p b{font-size:16px;line-height:1.2}
.k2-p small{font-weight:800;color:var(--ink-3);font-size:13px}
.k2-pb{display:block;width:100%;height:6px;border-radius:99px;background:var(--lav-100);overflow:hidden;margin-top:4px}
.k2-pb i{display:block;height:100%;background:var(--gold-400);border-radius:inherit}
.k2-p em{position:absolute;top:-10px;right:12px;padding:3px 10px;border-radius:99px;background:var(--gold-400);color:var(--navy-900);font-style:normal;font-weight:900;font-size:11px;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 3px 0 #c9971d}
.k2-p.now{border-color:var(--violet-500);box-shadow:0 0 0 5px rgb(139 92 246/.16);animation:k2Glow 2.6s ease-in-out infinite}
.k2-p.now .k2-pi{background:var(--violet-600);color:#fff}
.k2-p.done .k2-pi{background:var(--success-500);color:#fff}
.k2-p.done b{color:var(--ink-3)}
@keyframes k2Glow{50%{box-shadow:0 0 0 9px rgb(139 92 246/.08)}}
.k2-plan.all .k2-p{background:linear-gradient(160deg,#effbf5,#fff 70%);border-color:#bfead6}
.k2-exam{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:20px;background:linear-gradient(135deg,#fff7df,#fff);border:1.5px solid #f6e3a3;text-decoration:none;color:var(--ink)}
.k2-exam>.i:first-child{width:40px;height:40px;padding:10px;border-radius:12px;background:var(--gold-400);color:var(--navy-900)}
.k2-exam>span{flex:1;display:flex;flex-direction:column}
.k2-exam small{font-weight:700;color:var(--ink-3)}
.k2-prog{gap:14px}
.k2-lv{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.k2-lv .hl-r{position:relative;width:56px;height:56px;flex:none;display:grid;place-items:center}
.k2-lv .hl-r .ring{position:absolute;inset:0}
.k2-lv .hl-r b{font-family:var(--display);font-size:21px}
.k2-lv b{display:block;font-size:16px}
.k2-prog .hs-week{box-shadow:none;padding:0;background:none;justify-content:space-between}
.k2-prog .hs-week i{width:30px;height:30px;font-size:12px}
.k2-wk{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.k2-wk .i{width:15px;height:15px;color:#e0561b}
.k2-album{display:flex;align-items:center;gap:12px;padding-top:12px;border-top:1px solid var(--line);text-decoration:none;color:var(--ink)}
.k2-album>span:nth-child(2){flex:1}
.k2-album b{display:block;font-size:15px}
.k2-album>.i,.k2-exam>.i:last-child{width:20px;height:20px;color:var(--ink-3)}
@media (max-width:1239px){.k2-rail{display:none!important}}
@media (max-width:640px){
  .k2-now{grid-template-columns:1fr;min-height:0;border-radius:28px}
  .k2-cover{height:190px}
  .k2-body{padding:18px 18px 20px;gap:10px}
  .k2-go{align-self:stretch;justify-content:center;padding-right:28px}
  .k2-plan{gap:8px}
  .k2-p{padding:12px 10px 11px;border-radius:18px}
  .k2-pi{width:32px;height:32px;border-radius:10px}
  .k2-p b{font-size:14px}
  .k2-p small{font-size:12px}
  .k2-p em{right:8px;font-size:10px;padding:2px 8px}
}
/* Ekran lekcji: okładka, jeden przycisk, plan kroków */
.lp{max-width:1120px;display:flex;flex-direction:column;gap:18px}
.lp-hero{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);border-radius:34px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:0 24px 50px -30px rgb(21 26 61/.45)}
.lp-cover{position:relative;display:block;min-height:290px;overflow:hidden;background:linear-gradient(145deg,var(--b1),var(--b2))}
.lp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:k2Ken 18s ease-in-out infinite alternate}
.lp-cover .cover-svg{position:absolute;inset:0;display:grid;place-items:center;padding:14px}
.lp-head{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;padding:28px 30px;background:radial-gradient(120% 100% at 100% 0%,var(--lav-100),#fff 60%)}
.lp-tag{font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:99px;background:var(--lav-100);color:var(--violet-700)}
.lp-head h1{font-size:clamp(26px,3.2vw,40px);line-height:1.08}
.lp-head p{margin:0;color:var(--ink-2);font-weight:700;font-size:16px;line-height:1.5}
.lp-meta{display:flex;gap:8px;flex-wrap:wrap}
.lp-meta span{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:99px;background:var(--paper);font-weight:800;font-size:14px;color:var(--ink-2)}
.lp-meta span.ok{background:var(--success-100);color:#0c7a50}
.lp-meta .i{width:17px;height:17px}
.lp-cta{min-height:58px;font-size:18px;padding:0 28px;border-radius:99px;margin-top:4px}
.lp-cta svg{fill:currentColor;stroke:none;width:20px;height:20px}
.lp-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px;align-items:start}
.lp-plan h2{font-size:22px;margin:0 0 12px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.lp-plan h2 small{font-size:13px;font-weight:700;color:var(--ink-3)}
.lp-plan ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.lp-mis{margin:10px 0 0;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.lp-step{width:100%;display:flex;align-items:center;gap:14px;padding:11px 14px 11px 11px;border-radius:20px;border:2px solid var(--line);background:#fff;color:var(--ink);text-align:left;font:inherit;cursor:pointer;transition:transform .15s var(--ease),border-color .2s,box-shadow .2s;animation:pop .35s calc(var(--i,0) * 30ms) var(--ease) both}
.lp-step:hover{transform:translateX(3px);border-color:var(--lav-300)}
.lp-n{width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:17px;background:var(--lav-100);color:var(--violet-700)}
.lp-n .i{width:20px;height:20px;stroke-width:3}
.lp-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.lp-t small{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3)}
.lp-t small .i{width:14px;height:14px}
.lp-t b{font-size:16px;line-height:1.3}
.lp-step em{flex:none;padding:4px 10px;border-radius:99px;background:var(--gold-400);color:var(--navy-900);font-style:normal;font-weight:900;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.lp-p{flex:none;font-weight:900;color:var(--violet-700);font-size:14px}
.lp-go{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700)}
.lp-go .i{width:16px;height:16px}
.lp-step.done .lp-n{background:var(--success-500);color:#fff}
.lp-step.done b{color:var(--ink-2)}
.lp-stars{flex:none;font-size:15px}
.lp-stars i{color:var(--lav-300);text-shadow:none}
.lp-step.now{border-color:var(--violet-500);background:linear-gradient(90deg,var(--lav-100),#fff 70%);box-shadow:0 0 0 5px rgb(139 92 246/.12)}
.lp-step.now .lp-n{background:var(--violet-600);color:#fff}
.lp-more{display:flex;flex-direction:column;gap:10px;position:sticky;top:84px}
.lp-more h3{font-size:15px;margin:8px 0 0;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.lp-x{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:#fff;border:1.5px solid var(--line);text-decoration:none;color:var(--ink);transition:transform .15s var(--ease),box-shadow .2s}
.lp-x:hover{transform:translateY(-2px);box-shadow:var(--shadow-m)}
.lp-x>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
.lp-x b{font-size:15px;line-height:1.25}
.lp-x small{font-weight:700;color:var(--ink-3);font-size:13px}
.lp-x>.i{width:18px;height:18px;color:var(--ink-3)}
.lp-xi{width:40px;height:40px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700)}
.lp-x.lp-fc .lp-xi{background:var(--violet-600);color:#fff}
.lp-x.done .lp-xi{background:var(--success-500);color:#fff}
@media (max-width:999px){.lp-grid{grid-template-columns:1fr}.lp-more{position:static}}
@media (max-width:700px){
  .lp-hero{grid-template-columns:1fr;border-radius:28px}
  .lp-cover{min-height:0;height:200px}
  .lp-head{padding:18px 18px 20px;gap:10px}
  .lp-cta{align-self:stretch;justify-content:center}
  .lp-step{gap:11px;padding:10px 12px 10px 9px}
  .lp-n{width:36px;height:36px;font-size:16px}
  .lp-t b{font-size:15px}
}
/* Literowanie i „Ułóż ze słów”, wskazanie pola przez podpowiedź */
.lettiles.words .lt{width:auto;min-width:46px;height:46px;padding:0 14px;font-family:var(--body,inherit);font-size:17px}
.lettiles.spell{margin-top:12px}
.gi.hint-target input,.gi.hint-target textarea,.opts.hint-target{animation:hintPing 1.2s ease-in-out 2}
@keyframes hintPing{0%,100%{box-shadow:0 0 0 0 rgb(244 197 66/0)}50%{box-shadow:0 0 0 7px rgb(244 197 66/.55)}}
@media (prefers-reduced-motion:reduce){.k2-img,.lp-img,.k2-p.now,.k2-go::after,.gi.hint-target input,.opts.hint-target{animation:none}}
html.calm .k2-img,html.calm .lp-img{animation:none}
@media (max-width:640px){.k2-cover{height:150px}.k2-title{-webkit-line-clamp:2;font-size:22px}.k2-hi p{font-size:15px}.home.k2{gap:16px}.home.k2 .home-top{gap:14px}}
/* Zegar przy godzinach i flaga po odgadnięciu kraju */
.clock-row{display:inline-flex;align-items:center;gap:12px;margin:0 0 10px;padding:8px 16px 8px 8px;border-radius:20px;background:var(--lav-100)}
.clock-face{width:84px;height:84px;filter:drop-shadow(0 4px 8px rgb(21 26 61/.15))}
.clock-row b{font-family:var(--display);font-size:24px;color:var(--ink)}
.flag-pic img{width:96px;height:64px;object-fit:cover;border-radius:8px;box-shadow:0 0 0 1px var(--line),0 6px 14px -6px rgb(21 26 61/.35)}
.wpic.img img{width:100%;height:100%;object-fit:cover;border-radius:22%}
.riddle-pic .rp-img{width:96px;height:96px;border-radius:20px;object-fit:cover;box-shadow:0 6px 14px -6px rgb(21 26 61/.35)}
.qimg.cue img{max-width:min(100%,420px);border-radius:18px}
/* Safari: tył karty nie może prześwitywać przez przód (backface w 3D) */
.fc{-webkit-transform-style:preserve-3d}
.fc .face.front{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}
.fc .face.back{-webkit-transform:rotateY(180deg)}
.fc-pic .wpic.img{width:96px!important;height:96px!important;margin-bottom:4px}
.fc .face.front .big{font-size:clamp(28px,7vw,42px)!important;line-height:1.1}
.fc .face.front{gap:6px;padding:18px}
/* Karta fiszki/powtórki: ukryta strona nie prześwituje w żadnej przeglądarce — przełączenie w połowie obrotu */
.fc .face{transition:visibility 0s linear .32s}
.fc:not(.flip) .face.back,.fc.flip .face.front{visibility:hidden}
.fcards .fc-pic .wpic.img{transform:none}

/* ═════════ Pozostałe ekrany (patch 25): górny pasek, podsumowanie, ustawienia ═════════ */
/* Górny pasek: mniej elementów — wylogowanie zostaje w menu bocznym i w Ustawieniach, punkty rankingu w Lidze, „zapisano” jako ikonka */
.topbar .logoutbtn{display:none!important}
.topbar .stat.pts{display:none!important}
.topbar .cloud span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.topbar .cloud{padding:7px;border-radius:50%}
@media (max-width:1100px){.topbar .appbtn span{display:none}.topbar .appbtn{padding:8px}}
/* Podsumowanie: okładka lekcji na górze */
.sum-cover{position:relative;width:min(100%,560px);aspect-ratio:16/9;margin:0 auto 14px;border-radius:28px;overflow:hidden;box-shadow:0 22px 44px -26px rgb(21 26 61/.5)}
.sum-cover .sum-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:k2Ken 18s ease-in-out infinite alternate}
.sum-cover .cover-svg{position:absolute;inset:0;display:grid;place-items:center;background:var(--lav-100)}
@media (max-width:640px){.sum-cover{border-radius:22px;aspect-ratio:16/10}}
/* Ustawienia: sekcje z nagłówkami */
.set-h{margin:18px 2px 2px;font-size:13px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.settings > .set-h:first-child{margin-top:0}
html.calm .sum-cover .sum-img{animation:none}
@media (prefers-reduced-motion:reduce){.sum-cover .sum-img{animation:none}}

/* ═════════ patch27: Powtórki, Odznaki, Liga od nowa ═════════ */
/* wspólne */
.rv2,.bd2,.lg2{display:flex;flex-direction:column;gap:18px;max-width:1080px;margin:0 auto;width:100%}
.rv2 h1,.bd2 h1,.lg2 h1{font-size:clamp(28px,3.6vw,40px);color:var(--ink)}
.rv2-card,.lg2-me{background:#fff;border:1px solid var(--line);border-radius:26px;padding:22px;box-shadow:var(--shadow-s)}
.rv2-card h2,.lg2-me h2{font-size:21px;margin:0 0 14px}
.bd2-pb{display:block;height:8px;border-radius:9px;background:var(--lav-100);overflow:hidden}
.bd2-pb i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,var(--violet-500),var(--c5));transition:width .8s var(--ease)}

/* ── Powtórki: start ── */
.rv2-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);align-items:center;gap:20px;padding:30px 32px;border-radius:32px;background:radial-gradient(120% 140% at 100% 0,#efe7ff 0,#fff 55%);border:1px solid var(--line);box-shadow:0 24px 50px -30px rgb(21 26 61/.45);overflow:hidden}
.rv2-txt{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.rv2-txt p{margin:0;color:var(--ink-2);font-weight:700;font-size:16px;max-width:52ch}
.rv2-modes{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 4px}
.rv2-modes button{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;text-align:left;padding:10px 16px 10px 12px;border-radius:18px;background:#fff;border:2px solid var(--line);color:var(--ink);transition:border-color .2s,transform .2s var(--spring),box-shadow .2s}
.rv2-modes button .i{grid-row:1/3;width:34px;height:34px;padding:7px;border-radius:11px;background:var(--lav-100);color:var(--violet-700)}
.rv2-modes button b{font-size:15px}
.rv2-modes button small{color:var(--ink-3);font-weight:700;font-size:12px}
.rv2-modes button:hover{transform:translateY(-2px)}
.rv2-modes button[aria-checked=true]{border-color:var(--violet-500);box-shadow:0 0 0 4px var(--lav-200)}
.rv2-modes button[aria-checked=true] .i{background:var(--violet-600);color:#fff}
.rv2-go{border:0;cursor:pointer;font:inherit;font-weight:800;font-size:18px;text-decoration:none}
.rv2-deck{position:relative;height:210px;display:grid;place-items:center}
.rv2-deck i{position:absolute;width:150px;height:190px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-m)}
.rv2-deck i:nth-child(1){transform:rotate(-12deg) translateX(-26px);background:var(--lav-100)}
.rv2-deck i:nth-child(2){transform:rotate(7deg) translateX(22px);background:#e8f0ff}
.rv2-deck i:nth-child(3){display:grid;place-items:center;align-content:center;gap:2px;background:linear-gradient(150deg,var(--violet-500),var(--violet-700));color:#fff;font-style:normal;animation:rvFloat 4s ease-in-out infinite}
.rv2-deck i:nth-child(3) b{font-family:var(--display);font-size:64px;line-height:1}
.rv2-deck i:nth-child(3) small{font-weight:800;opacity:.85}
.rv2-deck i:nth-child(3) .i{width:64px;height:64px}
@keyframes rvFloat{50%{transform:translateY(-8px) rotate(-2deg)}}
.rv2-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.rv2-card,.rv2-hero>*,.lg2-me,.bd2-panel{min-width:0}
.rv2-boxes{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;align-items:end}
.rv2-box{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.rv2-col{display:flex;align-items:flex-end;width:100%;height:110px;border-radius:14px;background:var(--paper);overflow:hidden}
.rv2-col i{display:block;width:100%;border-radius:14px 14px 0 0;background:var(--c);transition:height .8s var(--ease)}
.rv2-box b{font-family:var(--display);font-size:22px}
.rv2-box small{font-size:11.5px;font-weight:800;color:var(--ink-3);line-height:1.2}
.rv2-box.b1{--c:linear-gradient(180deg,#ff9b8a,var(--coral))}.rv2-box.b2{--c:linear-gradient(180deg,#ffc56b,var(--amber-500))}.rv2-box.b3{--c:linear-gradient(180deg,#8fb4ff,var(--c5))}.rv2-box.b4{--c:linear-gradient(180deg,#b79cff,var(--violet-600))}.rv2-box.b5{--c:linear-gradient(180deg,#5fdcaa,var(--success-500))}
.rv2-note{margin:14px 0 0;color:var(--ink-3);font-weight:700;font-size:13.5px}
.rv2-days{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.rv2-days li{display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 0;border-radius:14px;background:var(--lav-100)}
.rv2-days li small{font-size:11.5px;font-weight:800;color:var(--ink-3)}
.rv2-days li b{font-family:var(--display);font-size:22px;color:var(--violet-700)}
.rv2-days li.today{background:linear-gradient(180deg,var(--violet-500),var(--violet-600))}
.rv2-days li.today small,.rv2-days li.today b{color:#fff}
.rv2-days li.zero{background:var(--paper)}.rv2-days li.zero b{color:var(--lav-300)}
.rv2-card h3{font-size:15px;margin:18px 0 8px;color:var(--ink-2)}
.rv2-src{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.rv2-src a{display:flex;align-items:center;gap:12px;padding:6px 12px 6px 6px;border-radius:16px;text-decoration:none;color:var(--ink);transition:background .2s}
.rv2-src a:hover{background:var(--lav-100)}
.rv2-si{width:42px;height:42px;border-radius:12px;flex:none;overflow:hidden;display:grid;place-items:center;background:linear-gradient(140deg,var(--b1),var(--b2))}
.rv2-si .topic-art{width:100%;height:auto}
.rv2-st{display:flex;flex-direction:column;min-width:0;flex:1}
.rv2-st b{font-size:14px}.rv2-st small{color:var(--ink-3);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv2-src em{font-style:normal;font-weight:800;min-width:30px;height:28px;padding:0 9px;border-radius:99px;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700)}

/* ── Powtórki: sesja (pełny ekran) ── */
.rv2s{max-width:672px;margin:0 auto;width:100%;display:flex;flex-direction:column;gap:12px;padding:0 16px 24px}
.rv2s-stage{margin-top:clamp(0px,3vh,28px)}
.rv2s-top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;padding:12px 0;background:var(--paper)}
.rv2s-x{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s);color:var(--ink-2);flex:none}
.rv2s-bar{flex:1;height:12px;border-radius:99px;background:var(--lav-200);overflow:hidden}
.rv2s-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--success-500),#4fd69c);transition:width .45s var(--ease)}
.rv2s-n{font-weight:800;color:var(--ink-3);font-variant-numeric:tabular-nums;min-width:44px;text-align:right}
.rv2s-xp{display:inline-flex;align-items:center;gap:5px;padding:7px 12px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);font-weight:800;color:var(--violet-700)}
.rv2s-xp .i{width:18px;height:18px;color:var(--gold-500)}
.rv2s-meta{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;min-height:30px}
.rv2s-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 12px;border-radius:99px;background:#fff;border:1px solid var(--line);font-size:13px;font-weight:800;color:var(--ink-2);text-decoration:none;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
a.rv2s-chip{display:inline-block}
a.rv2s-chip:hover{border-color:var(--violet-500);color:var(--violet-700)}
.rv2s-chip.box i{width:7px;height:7px;border-radius:50%;background:var(--lav-200);flex:none}
.rv2s-chip.box i.on{background:var(--violet-600)}
.rv2s-chip.box i:last-of-type{margin-right:5px}
.rv2s-stage{perspective:1400px;padding:4px 0}
.rv2s-drag{position:relative;touch-action:pan-y;transition:transform .25s var(--ease)}
.fc2{display:grid;transform-style:preserve-3d;transition:transform .6s var(--ease);cursor:pointer;outline:none;border-radius:30px}
.fc2:focus-visible{box-shadow:0 0 0 4px var(--lav-300)}
.fc2.flip{transform:rotateY(180deg)}
.fc2-face{grid-area:1/1;min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:30px 26px;border-radius:30px;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:var(--shadow-l)}
.fc2-face.front{background:#fff;border:1px solid var(--line)}
.fc2-face.back{background:linear-gradient(150deg,var(--navy-900),var(--violet-700));color:#fff;transform:rotateY(180deg)}
.fc2 .fc2-face{transition:visibility 0s linear .3s}
.fc2:not(.flip) .fc2-face.back,.fc2.flip .fc2-face.front{visibility:hidden}
.fc2-q{font-family:var(--display);color:var(--ink);line-height:1.3;overflow-wrap:anywhere;max-width:100%}
.fc2-q.q-s{font-size:clamp(30px,6vw,40px)}.fc2-q.q-m{font-size:clamp(23px,4.4vw,28px)}.fc2-q.q-l{font-size:clamp(19px,3.6vw,22px)}.fc2-q.q-xl{font-size:clamp(17px,3vw,19px);line-height:1.45}
.fc2-q.word{font-size:clamp(34px,7vw,46px)}
.fc2-q .gap{display:inline-grid;place-items:center;min-width:2.6em;height:1.25em;padding:0 .3em;margin:0 .1em;border-radius:.35em;background:var(--lav-100);border:2px dashed var(--lav-300);color:var(--violet-600);vertical-align:-.12em;font-size:.9em}
.fc2-tip{color:var(--ink-3);font-weight:800;font-size:13px}
.fc2-tip:empty,.fc2-say:empty,.fc2-full:empty{display:none}
.fc2-face.back>small{font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:12px;opacity:.7}
.fc2-a{font-family:var(--display);font-size:clamp(28px,6vw,40px);line-height:1.2;overflow-wrap:anywhere}
.fc2-full{max-width:46ch;font-weight:700;font-size:16px;line-height:1.5;color:rgb(255 255 255/.85)}
.fc2-full mark{background:var(--gold-300);color:var(--navy-900);border-radius:6px;padding:0 5px;font-weight:800}
.rv2s-stamp{position:absolute;top:22px;padding:6px 14px;border-radius:12px;border:3px solid;font-family:var(--display);font-size:22px;background:#fff;opacity:0;pointer-events:none;transition:opacity .15s}
.rv2s-stamp.yes{left:22px;color:var(--success-500);transform:rotate(-12deg)}
.rv2s-stamp.no{right:22px;color:var(--coral);transform:rotate(12deg)}
.rv2s-drag.go-yes .rv2s-stamp.yes,.rv2s-drag.go-no .rv2s-stamp.no{opacity:1}
.rv2s .rv-type{display:flex;gap:10px;margin:0}
.rv2s .rv-type[hidden]{display:none}
.rv2s .rv-type input{flex:1;min-width:0;font:inherit;font-size:18px;font-weight:700;padding:14px 18px;border-radius:18px;border:2px solid var(--line);background:#fff;color:var(--ink)}
.rv2s .rv-type input:focus{outline:none;border-color:var(--violet-500);box-shadow:0 0 0 4px var(--lav-200)}
.rv2s .rv-type .btn{border-radius:18px;padding:0 22px}
.rv2s .rv-res{margin:0;text-align:center;min-height:0}
.rv2s .rv-res:empty{display:none}
.rv2s-act{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rv2s-show{grid-column:1/-1;min-height:58px;font-size:18px}
.rv2s-k{display:none;align-items:center;justify-content:center;gap:10px;min-height:66px;padding:10px 14px;border-radius:22px;font:inherit;color:var(--ink);background:#fff;border:2.5px solid var(--line);box-shadow:0 5px 0 var(--line);cursor:pointer;transition:transform .15s var(--spring),box-shadow .15s}
.rv2s-k span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15}
.rv2s-k b{font-size:17px}.rv2s-k small{font-weight:800;font-size:12px;color:var(--ink-3)}
.rv2s-k .i{width:30px;height:30px;padding:5px;border-radius:50%;color:#fff;flex:none}
.rv2s-k.no .i{background:var(--coral)}.rv2s-k.yes .i{background:var(--success-500)}
.rv2s-k:active{transform:translateY(3px);box-shadow:0 2px 0 var(--line)}
.rv2s-k.yes.sugg{border-color:var(--success-500);box-shadow:0 5px 0 #0e7d52;background:var(--success-100)}
.rv2s-k.no.sugg{border-color:var(--coral);box-shadow:0 5px 0 #c4483a;background:#ffeeeb}
.rv2s.shown .rv2s-k{display:flex}
.rv2s.shown .rv2s-show,.rv2s.shown .rv-type button{display:none}
.rv2s-keys,.rv2s-swipe{margin:0;text-align:center;color:var(--ink-3);font-weight:700;font-size:12.5px}
.rv2s-swipe,.rv2s:not(.shown) .rv2s-keys{display:none}
@media (pointer:coarse),(max-width:760px){.rv2s-keys{display:none!important}.rv2s.shown .rv2s-swipe{display:block}}
.rv2-done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:40px 10px}
.rv2-ring{position:relative;width:156px;height:156px;animation:pop .6s var(--spring) both}
.rv2-ring b{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--display);font-size:48px;line-height:1}
.rv2-ring b small{font-family:var(--font);font-size:14px;font-weight:800;color:var(--ink-3)}
.rv2-done p{margin:0;color:var(--ink-2);font-weight:700;font-size:17px}
.rv2-done-act{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:10px}

/* ── Odznaki ── */
.bd2-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:26px 30px;border-radius:32px;color:#fff;background:radial-gradient(120% 160% at 0 0,#3a2a8f 0,var(--navy-900) 60%);box-shadow:0 24px 50px -28px rgb(21 26 61/.6);overflow:hidden;position:relative}
.bd2-hero::after{content:"";position:absolute;right:-60px;top:-80px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgb(244 197 66/.25),transparent 70%);pointer-events:none}
.bd2-lv{display:flex;align-items:center;gap:18px;min-width:0}
.bd2-ring{position:relative;width:116px;height:116px;flex:none}
.bd2-ring .ring circle:first-child{stroke:rgb(255 255 255/.12)}
.bd2-ring b{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-size:46px;color:var(--gold-300)}
.bd2-lvt{display:flex;flex-direction:column;gap:3px;min-width:0}
.bd2-lvt .eyebrow{color:var(--gold-300)}
.bd2 .bd2-lvt h1{color:#fff}
.bd2-lvt small{color:rgb(255 255 255/.75);font-weight:700;font-size:14px}
.bd2-stats{display:flex;gap:10px;position:relative;z-index:1}
.bd2-stats>*{display:flex;flex-direction:column;align-items:flex-start;min-width:104px;padding:12px 16px;border-radius:20px;background:rgb(255 255 255/.09);border:1px solid rgb(255 255 255/.14);color:#fff;text-decoration:none;font:inherit;cursor:pointer;transition:background .2s,transform .2s var(--spring)}
.bd2-stats>*:hover{background:rgb(255 255 255/.16);transform:translateY(-2px)}
.bd2-stats b{font-family:var(--display);font-size:30px;line-height:1.1}
.bd2-stats b small{font-size:16px;opacity:.6}
.bd2-stats span{font-weight:800;font-size:13px;opacity:.8}
.bd2-tabs{display:flex;gap:6px;padding:5px;border-radius:99px;background:#fff;border:1px solid var(--line);align-self:center;box-shadow:var(--shadow-s);scroll-margin-top:80px}
.bd2-tabs button{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:99px;font-weight:800;color:var(--ink-3);font-size:15px}
.bd2-tabs button .i{width:20px;height:20px}
.bd2-tabs button[aria-selected=true]{background:var(--violet-600);color:#fff;box-shadow:0 8px 18px -10px rgb(109 63 209/.8)}
.bd2-panel{display:flex;flex-direction:column;gap:16px}
.bd2-panel[hidden]{display:none}
.bd2-near{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}
.bd2-n{display:flex;align-items:center;gap:14px;padding:14px 18px 14px 14px;border-radius:24px;background:linear-gradient(135deg,#fff8e1,#fff 60%);border:2px solid #f6e2a6;text-decoration:none;color:var(--ink);transition:transform .2s var(--spring),box-shadow .2s}
.bd2-n:hover{transform:translateY(-2px);box-shadow:var(--shadow-m)}
.bd2-nm{flex:none;filter:grayscale(.35)}
.bd2-nt{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.bd2-nt>small{font-weight:800;color:var(--ink-3);font-size:12.5px}
.bd2-nt>small:first-child{color:var(--gold-500);letter-spacing:.1em;text-transform:uppercase;font-size:11px}
.bd2-nt b{font-size:17px}
.bd2-go{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:var(--violet-700);font-size:14px;white-space:nowrap}
.bd2-go .i{width:18px;height:18px}
.bd2-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.bd2-b{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:18px 14px 16px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s);animation:screenIn .45s var(--d) both}
.bd2-m{width:84px;height:84px;margin-bottom:6px;transition:transform .5s var(--spring)}
.bd2-b:not(.on) .bd2-m{filter:grayscale(1);opacity:.45}
.bd2-b.on:hover .bd2-m{transform:rotate(-8deg) scale(1.08)}
.bd2-b h3{font-size:16.5px}
.bd2-b p{margin:0 0 6px;font-size:12.5px;color:var(--ink-3);font-weight:700;line-height:1.35}
.bd2-b .bd2-pb{width:80%;margin-top:auto}
.bd2-c{font-weight:800;color:var(--ink-3);font-size:12px;margin-top:4px}
.bd2-when{margin-top:auto;display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:99px;background:var(--success-100);color:#0e7d52;font-weight:800;font-size:12.5px}
.bd2-when .i{width:14px;height:14px}
.bd2-b.on{background:linear-gradient(180deg,#fffdf4,#fff)}
.bd2-foot,.bd2-ah{margin:0;text-align:center;color:var(--ink-3);font-weight:700;font-size:13.5px}
.bd2-ch{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-s);overflow:hidden}
.bd2-ch summary{display:flex;align-items:center;gap:14px;padding:16px 20px;cursor:pointer;list-style:none}
.bd2-ch summary::-webkit-details-marker{display:none}
.bd2-chn{width:40px;height:40px;border-radius:13px;flex:none;display:grid;place-items:center;background:var(--lav-100);color:var(--violet-700);font-family:var(--display);font-size:20px}
.bd2-ch.full .bd2-chn{background:var(--success-500);color:#fff}
.bd2-chn .i{width:22px;height:22px}
.bd2-cht{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}
.bd2-cht b{font-size:16px}
.bd2-ch summary em{font-style:normal;font-weight:800;color:var(--ink-3)}
.bd2-chev{width:22px;height:22px;color:var(--ink-3);transition:transform .25s var(--ease);fill:none;stroke:currentColor;stroke-width:2.4}
.bd2-ch[open] .bd2-chev{transform:rotate(180deg)}
.bd2-ch .al-grid{padding:4px 20px 22px}
.stk.cur{box-shadow:inset 0 0 0 3px var(--violet-500)}
.stk.empty.cur{box-shadow:inset 0 0 0 4px var(--violet-500),0 0 0 5px var(--lav-200)}
.stk.empty.cur b{color:var(--violet-600)}

/* ── Liga ── */
.lg2-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:26px 30px;border-radius:32px;background:radial-gradient(120% 160% at 100% 0,#fff3c9 0,#fff 55%);border:1px solid var(--line);box-shadow:0 24px 50px -30px rgb(21 26 61/.45)}
.lg2-ht{display:flex;flex-direction:column;gap:6px;max-width:56ch}
.lg2-ht p{margin:0;color:var(--ink-2);font-weight:700}
.lg2-filters{display:flex;gap:10px;flex-wrap:wrap}
.lg2-filters select{font:inherit;font-weight:800;padding:9px 14px;border-radius:99px;border:2px solid var(--line);background:#fff;color:var(--ink)}
.lg2-off{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;border-radius:18px;background:var(--amber-100);color:var(--ink-2);font-weight:700;font-size:14px}
.lg2-off>.i{width:22px;height:22px;color:var(--amber-500);flex:none}
.lg2-off span{flex:1;min-width:200px}
.lg2-pod{display:grid;grid-template-columns:1fr 1.15fr 1fr;align-items:end;gap:12px;max-width:620px;width:100%;margin:12px auto 0}
.lg2-pod>div{display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center;min-width:0}
.lg2-pod .avatar{width:60px;height:60px;font-size:20px;margin-bottom:6px}
.lg2-pod .p1 .avatar{width:74px;height:74px;font-size:24px;box-shadow:0 0 0 4px var(--gold-400),0 10px 24px -8px rgb(224 169 27/.7)}
.lg2-pod .p1::before{content:"";width:34px;height:22px;margin-bottom:-4px;background:var(--gold-400);clip-path:polygon(0 100%,0 20%,25% 60%,50% 0,75% 60%,100% 20%,100% 100%)}
.lg2-pod .p2 .avatar{box-shadow:0 0 0 4px #c9d0de}.lg2-pod .p3 .avatar{box-shadow:0 0 0 4px #e39a62}
.lg2-pod b{font-size:15px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lg2-pod small{color:var(--ink-3);font-weight:800;font-size:12.5px}
.lg2-step{width:100%;margin-top:8px;border-radius:18px 18px 6px 6px;display:grid;place-items:center;font-family:var(--display);font-size:34px;color:#fff;box-shadow:var(--shadow-m)}
.lg2-pod .p1 .lg2-step{height:130px;background:linear-gradient(180deg,#ffd862,var(--gold-500));color:var(--navy-900)}
.lg2-pod .p2 .lg2-step{height:96px;background:linear-gradient(180deg,#d9dde8,#9aa3bb)}
.lg2-pod .p3 .lg2-step{height:74px;background:linear-gradient(180deg,#f1b88a,#c27a45)}
.lg2-pod .you b{color:var(--violet-700)}
.lg2-list{list-style:none;margin:6px auto 0;padding:0;max-width:620px;width:100%;display:flex;flex-direction:column;gap:8px}
.lg2-list li{display:grid;grid-template-columns:34px 42px minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px 18px 8px 10px;border-radius:99px;background:#fff;box-shadow:var(--shadow-s);font-weight:800;animation:screenIn .4s var(--d) both}
.lg2-list .r{color:var(--ink-3);text-align:center}
.lg2-list .avatar{width:42px;height:42px;box-shadow:none;font-size:15px}
.lg2-list .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lg2-list .nm small{color:var(--ink-3);font-weight:700;margin-left:6px}
.lg2-list li.you{box-shadow:inset 0 0 0 3px var(--violet-500);background:var(--lav-100)}
.lg2-empty{text-align:center;padding:30px 16px;background:#fff;border:1px dashed var(--lav-300);border-radius:26px}
.lg2-empty h3{font-size:20px;margin:6px 0}
.lg2-empty p{margin:0 auto;color:var(--ink-2);max-width:48ch}
.lg2-meh{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.lg2-me h2{margin:4px 0 0}
.lg2-tot{display:flex;gap:8px}
.lg2-tot span{display:flex;flex-direction:column;align-items:center;padding:8px 14px;border-radius:16px;background:var(--paper)}
.lg2-tot span.now{background:var(--lav-100)}
.lg2-tot small{font-size:11.5px;font-weight:800;color:var(--ink-3)}
.lg2-tot b{font-family:var(--display);font-size:24px}
.lg2-tot .now b{color:var(--violet-700)}
.lg2-bars{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.lg2-bars>div{display:flex;flex-direction:column;align-items:center;gap:6px}
.lg2-col{position:relative;width:100%;max-width:56px;height:140px;border-radius:14px;background:var(--paper);overflow:hidden}
.lg2-col i{position:absolute;bottom:0;border-radius:10px 10px 0 0}
.lg2-col .pv{left:0;right:0;background:var(--lav-200)}
.lg2-col .nw{left:22%;right:22%;background:linear-gradient(180deg,var(--violet-500),var(--violet-700));animation:barUp .8s var(--ease) both}
@keyframes barUp{from{transform:scaleY(0);transform-origin:bottom}}
.lg2-bars small{font-weight:800;color:var(--ink-3);font-size:12px}
.lg2-bars .today small{color:var(--violet-700)}
.lg2-bars .today .lg2-col{box-shadow:inset 0 0 0 2px var(--violet-500)}
.lg2-bars .fut .lg2-col{opacity:.55}
.lg2-leg{display:flex;gap:16px;justify-content:center;margin:12px 0 0;font-weight:800;font-size:12.5px;color:var(--ink-3)}
.lg2-leg span{display:inline-flex;align-items:center;gap:6px}
.lg2-leg i{width:12px;height:12px;border-radius:4px;display:inline-block}
.lg2-leg .nw{background:var(--violet-600)}.lg2-leg .pv{background:var(--lav-200)}

/* telefon i tablet */
@media (max-width:760px){
  .rv2-hero{grid-template-columns:1fr;padding:22px 18px;border-radius:26px}
  .rv2-deck{display:none}
  .rv2-modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));width:100%}
  .rv2-go{align-self:stretch;justify-content:center}
  .rv2-grid{grid-template-columns:minmax(0,1fr)}
  .rv2-card,.lg2-me{padding:18px 16px;border-radius:22px}
  .rv2-col{height:84px}
  .rv2-box small{font-size:10.5px}
  .bd2-hero{padding:20px 18px;border-radius:26px}
  .bd2-ring{width:84px;height:84px}.bd2-ring svg{width:84px;height:84px}.bd2-ring b{font-size:34px}
  .bd2-stats{width:100%}.bd2-stats>*{flex:1;min-width:0;padding:10px 12px}.bd2-stats b{font-size:24px}.bd2-stats span{font-size:12px}
  .bd2-tabs{align-self:stretch}.bd2-tabs button{flex:1;justify-content:center;padding:10px 8px;font-size:14px}
  .bd2-near{grid-template-columns:1fr}
  .bd2-n{display:grid;grid-template-columns:56px minmax(0,1fr);gap:4px 12px;padding:14px}.bd2-nm svg{width:56px;height:56px}.bd2-go{grid-column:1/-1;justify-self:end}
  .bd2-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .bd2-m,.bd2-m svg{width:68px;height:68px}
  .bd2-ch summary{padding:14px}.bd2-ch .al-grid{padding:4px 14px 18px;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:10px}
  .lg2-hero{padding:20px 18px;border-radius:26px}
  .lg2-list li{padding:6px 14px 6px 8px;gap:8px;grid-template-columns:28px 36px minmax(0,1fr) auto}.lg2-list .avatar{width:36px;height:36px}
  .lg2-pod .avatar{width:48px;height:48px;font-size:16px}.lg2-pod .p1 .avatar{width:58px;height:58px}
  .lg2-col{height:110px}
  .rv2s{padding:0 14px 12px}
  .fc2-face{min-height:250px;padding:24px 18px;border-radius:26px}
  .rv2s-k{min-height:62px}
}
@media (prefers-reduced-motion:reduce){.rv2-deck i:nth-child(3),.lg2-col .nw,.bd2-b,.lg2-list li{animation:none}.fc2,.fc2 .fc2-face{transition:none}}
.calm .rv2-deck i:nth-child(3),.calm .lg2-col .nw{animation:none}

/* ═════════ patch28: pakiet 1 — poprawki obsługi i wyglądu ═════════ */
/* konto i ustawienia na telefonie (w bocznym menu są tylko na komputerze) */
.mebtn{display:none;position:relative;flex:none;text-decoration:none}
.mebtn .avatar{width:40px;height:40px;font-size:14px;box-shadow:0 0 0 3px #fff,var(--shadow-s)}
.mebtn .i{position:absolute;right:-4px;bottom:-4px;width:20px;height:20px;padding:3px;border-radius:50%;background:#fff;color:var(--violet-700);box-shadow:var(--shadow-s)}
@media (max-width:860px){.mebtn{display:inline-flex}}
/* ekran lekcji: wyśrodkowany, z marginesami */
.lesson-bg>.lp{margin:0 auto;padding:22px 28px 64px;box-sizing:border-box;width:100%}
@media (max-width:760px){.lesson-bg>.lp{padding:14px 16px 40px}}
/* przełączniki nie zwężają się przy długim opisie */
.switch{flex:none}
/* „Enter też sprawdza” tylko przy klawiaturze */
.chk-enter{color:var(--ink-3);font-weight:700;font-size:14px}
@media (pointer:coarse),(max-width:760px){.chk-enter{display:none}}
/* wskazówka o słowniczku — chmurka nad zadaniem */
.coach{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:10px 10px 10px 14px;border-radius:16px;background:var(--navy-900);color:#fff;font-weight:700;font-size:14px;line-height:1.35;position:relative;animation:pop .4s var(--spring) both}
.coach::after{content:"";position:absolute;left:28px;bottom:-7px;width:14px;height:14px;background:var(--navy-900);transform:rotate(45deg);border-radius:3px}
.coach>.i{width:22px;height:22px;color:var(--gold-300);flex:none}
.coach span{flex:1}
.coach b{color:var(--gold-300)}
.coach button{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgb(255 255 255/.12);flex:none}
.coach button .i{width:16px;height:16px}
/* podpisy kroków nad zadaniem */
.steps{position:relative}
.steps-tip{position:absolute;top:calc(100% + 10px);left:0;transform:translateX(-50%) translateY(-4px);padding:6px 11px;border-radius:10px;background:var(--navy-900);color:#fff;font-size:12.5px;font-weight:800;white-space:nowrap;max-width:min(360px,80vw);overflow:hidden;text-overflow:ellipsis;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;z-index:40}
.steps-tip.on{opacity:1;transform:translateX(-50%)}
.steps button{cursor:pointer}
/* polecenie: „Przeczytaj polecenie” i „Sprint” w jednym rzędzie */
#shead .listen,#shead .sprint-go{margin:10px 8px 0 0;min-height:40px;vertical-align:middle}
/* panel z tekstem: dłuższe nazwy tekstów nie łamią nagłówka */
.ctx>summary{min-width:0}
/* nagrody w podsumowaniu: jeden rząd kart */
.sum-rewards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;width:100%;max-width:680px;margin:6px auto}
.sum-rw{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:16px 12px 14px;border-radius:22px;background:linear-gradient(180deg,#fffaf0,#fff);border:1px solid #f3e3b5;box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink);animation:pop .55s var(--spring) var(--d) both;transition:transform .2s var(--spring)}
.sum-rw:hover{transform:translateY(-3px)}
.sum-rw .stk{width:76px;margin-bottom:6px}
.sum-md{width:76px;height:76px;margin-bottom:6px}
.sum-rw small{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-500)}
.sum-rw b{font-family:var(--display);font-size:17px;line-height:1.15}
.sum-rw em{font-style:normal;font-size:12.5px;font-weight:700;color:var(--ink-3);line-height:1.3}
/* telefon: krótszy sprint, numerki zadań w jednym przewijanym pasku */
@media (max-width:760px){
  .sp-long{display:none}
  .qdots{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -14px 14px;padding:4px 14px;scroll-behavior:smooth}
  .qdots::-webkit-scrollbar{display:none}
  .qdots button{flex:none;width:36px;height:36px}
  .shead{gap:12px;margin-bottom:14px}
  .shead .stype{width:42px;height:42px;border-radius:13px}
  .shead h2{font-size:23px}
  .sum-rewards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* szeroki ekran: tekst po lewej (przyklejony), zadania po prawej */
@media (min-width:1200px){
  .player.split .pbody{max-width:1340px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:30px;align-items:start}
  .player.split #shead{grid-column:1/-1}
  .player.split #ctx{grid-column:1;grid-row:2/span 2;position:sticky;top:86px;max-height:calc(100vh - 190px);overflow:auto;border-radius:22px;overscroll-behavior:contain}
  .player.split #ctx .ctx{margin:0}
  .player.split #qdots{grid-column:2;grid-row:2}
  .player.split #qstage{grid-column:2;grid-row:3}
  .player.split .ctx-fab{display:none!important}
  .player.split #ctx .ctx>summary{pointer-events:none}
  .player.split #ctx .ctx>summary small{display:none}
}
#shead .sprint-go{display:inline-block;line-height:24px}
@media (max-width:480px){
  #shead .listen span{font-size:0}#shead .listen span::after{content:"Posłuchaj";font-size:15px}
  .ctx-fab{padding:11px 16px 11px 12px}.ctx-fab span{font-size:0}.ctx-fab span::after{font-size:15px;content:"Tekst"}.ctx-fab[data-k="Słowa"] span::after{content:"Słowa"}.ctx-fab[data-k="Ściąga"] span::after{content:"Ściąga"}
}

/* ═════════ patch29: pakiet 2 — ścieżka, kokpit, fiszki, logowanie ═════════ */
/* Ścieżka: nagłówek z wyszukiwarką, zakładki rozdziałów */
.path2{display:flex;flex-direction:column;gap:16px}
.pt-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.pt-t h1{font-size:clamp(26px,3.2vw,36px);margin-top:4px}
.pt-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pt-search{position:relative;display:flex;align-items:center;min-width:min(340px,100%)}
.pt-search>.i{position:absolute;left:14px;width:20px;height:20px;color:var(--ink-3);pointer-events:none}
.pt-search input{width:100%;font:inherit;font-weight:700;font-size:15px;padding:12px 42px 12px 42px;border-radius:99px;border:2px solid var(--line);background:#fff;color:var(--ink);-webkit-appearance:none;appearance:none}
.pt-search input::-webkit-search-cancel-button{display:none}
.pt-search input:focus{outline:none;border-color:var(--violet-500);box-shadow:0 0 0 4px var(--lav-200)}
.pt-clear{position:absolute;right:6px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:var(--ink-3);background:var(--lav-100)}
.pt-clear .i{width:16px;height:16px}
.pt-here{display:inline-flex;align-items:center;gap:8px;padding:11px 18px 11px 14px;border-radius:99px;background:linear-gradient(180deg,var(--violet-500),var(--violet-600));color:#fff;font-weight:800;box-shadow:0 10px 22px -12px rgb(109 63 209/.8);white-space:nowrap}
.pt-here .i{width:20px;height:20px}
.pt-tabs{margin:0}
.path2 .path-wrap{margin-top:2px}
.path2.searching .path-wrap{align-items:start}
.node .pt-here-tag{position:absolute;left:50%;top:-30px;transform:translateX(-50%);padding:3px 10px;border-radius:99px;background:var(--gold-400);color:var(--navy-900);font-weight:900;font-size:11px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;box-shadow:var(--shadow-s);z-index:2}
.pt-res{display:flex;flex-direction:column;gap:8px}
.pt-rh{margin:0 0 4px;color:var(--ink-2);font-weight:700}
.pt-res a{display:flex;align-items:center;gap:14px;padding:8px 16px 8px 8px;border-radius:20px;background:#fff;border:2px solid var(--line);text-decoration:none;color:var(--ink);transition:border-color .2s,transform .2s var(--spring)}
.pt-res a:hover,.pt-res a.sel{border-color:var(--violet-500)}
.pt-res a:hover{transform:translateY(-2px)}
.pt-ri{width:64px;height:64px;border-radius:14px;overflow:hidden;flex:none;display:grid;place-items:center;background:linear-gradient(140deg,var(--b1),var(--b2))}
.pt-ri .pt-img{width:100%;height:100%;object-fit:cover}
.pt-ri .cover-svg{display:grid;place-items:center;width:100%;height:100%}
.pt-ri .cover-svg .topic-art{width:100%;height:auto}
.pt-rt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pt-rt small{color:var(--ink-3);font-weight:800;font-size:12.5px}
.pt-rt b{font-size:15.5px;line-height:1.25}
.pt-res a>.i{width:20px;height:20px;color:var(--violet-600);flex:none}
.pt-ok{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--success-500);color:#fff;flex:none}
.pt-ok .i{width:16px;height:16px}
.detail .ph.art .pt-dimg{width:100%;height:100%;object-fit:cover;border-radius:inherit}
@media (max-width:760px){
  .pt-tools{width:100%}.pt-search{flex:1;min-width:0}
  .pt-here span{display:none}.pt-here{padding:12px}
}
/* Kokpit: „Dalej w kursie” + link do całej ścieżki */
.les-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.les-all{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:var(--violet-700);text-decoration:none;padding:8px 14px;border-radius:99px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s);white-space:nowrap}
.les-all .i{width:18px;height:18px}
.les-all:hover{border-color:var(--violet-500)}
/* Fiszki w stylu Powtórek */
.fc2-pic:empty{display:none}
.fc2-pic .wpic{border-radius:24px}
.fc2-pic .wpic img{width:100%;height:100%;object-fit:cover}
.fc2-pic .wpic.img{background:#f6f4fb}
.fc2s .fc2-face{min-height:340px}
.fc2s .fc2-face.back .fc2-a{font-size:clamp(26px,5.4vw,36px)}
.fc2s .fc2-full{font-style:italic}
@media (max-width:760px){.fc2s .fc2-face{min-height:300px}}
/* Logowanie na telefonie: niższa grafika — formularz od razu na ekranie */
@media (max-width:600px){.auth-intro{aspect-ratio:16/9!important}.auth-card{padding-top:18px!important}.auth-tabs{margin-bottom:10px}.auth-card h2{font-size:26px;margin:0 0 8px}.auth-form{gap:10px}}
.path2.searching .pt-tabs{opacity:.5}

/* ═════════ patch30: pakiet 3a — awatar, powitanie, Moje słówka, Mój postęp ═════════ */
/* awatar z obrazkiem */
.avatar.has-img{background:#fff;padding:0;overflow:hidden}
.avatar .av-img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.av-set{display:flex;flex-direction:column;gap:12px}
.av-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:10px}
.av-grid button{aspect-ratio:1;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#f6f4fb;border:3px solid transparent;box-shadow:var(--shadow-s);transition:transform .15s var(--spring),border-color .2s}
.av-grid button:hover{transform:scale(1.06)}
.av-grid button[aria-checked=true]{border-color:var(--violet-600);box-shadow:0 0 0 4px var(--lav-200)}
.av-grid img{width:100%;height:100%;object-fit:cover}
.av-grid span{font-weight:800;color:var(--violet-700)}
/* kokpit: postęp kursu (liceum, CAE) i link „Mój postęp” */
.k2-cp{position:relative;width:44px;height:44px;flex:none}
.k2-more{display:flex;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;border-radius:14px;background:var(--lav-100);color:var(--violet-700);font-weight:800;text-decoration:none}
.k2-more span{flex:1}
.k2-more .i{width:20px;height:20px}
.k2-more:hover{background:var(--lav-200)}
/* Powtórki: linki do słówek i postępu */
.rv2-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rv2-links a{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink);transition:transform .2s var(--spring),border-color .2s}
.rv2-links a:hover{transform:translateY(-2px);border-color:var(--violet-500)}
.rv2-links a>.i:first-child{width:40px;height:40px;padding:9px;border-radius:12px;background:var(--lav-100);color:var(--violet-700)}
.rv2-links a>.i:last-child{width:18px;height:18px;color:var(--ink-3)}
.rv2-links span{flex:1;display:flex;flex-direction:column}
.rv2-links small{color:var(--ink-3);font-weight:700}
/* powitanie nowego ucznia */
.hello{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:16px;background:rgb(15 19 48/.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:fadeIn .25s both}
.hello.out{opacity:0;transition:opacity .2s}
.hl-box{width:min(420px,100%);background:#fff;border-radius:30px;padding:30px 26px 22px;text-align:center;box-shadow:var(--shadow-l);display:flex;flex-direction:column;align-items:center;gap:10px}
.hl-ico{width:76px;height:76px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(150deg,var(--violet-500),var(--violet-700));color:#fff;box-shadow:0 16px 30px -14px rgb(109 63 209/.8)}
.hl-ico .i{width:38px;height:38px}
.hl-box h2{font-size:24px;margin-top:6px}
.hl-box p{margin:0;color:var(--ink-2);font-weight:700;line-height:1.5}
.hl-dots{display:flex;gap:6px;margin:6px 0}
.hl-dots i{width:8px;height:8px;border-radius:99px;background:var(--lav-200);transition:width .25s var(--ease),background .25s}
.hl-dots i.on{width:24px;background:var(--violet-600)}
.hl-act{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:6px}
@keyframes fadeIn{from{opacity:0}}
/* Moje słówka */
.vc2{display:flex;flex-direction:column;gap:16px;max-width:1080px;margin:0 auto;width:100%}
.vc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.vc-head h1{font-size:clamp(26px,3.2vw,36px);margin-top:4px}
.vc-head p{margin:4px 0 0;color:var(--ink-2);font-weight:700}
.vc-seg{align-self:flex-start}
.vc-g{background:#fff;border:1px solid var(--line);border-radius:24px;padding:16px 18px;box-shadow:var(--shadow-s)}
.vc-gh{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.vc-gh>a:first-child{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);min-width:0}
.vc-gh small{color:var(--ink-3);font-weight:800}
.vc-gh b{font-size:16px}
.vc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.vc-w{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:16px;background:var(--paper);min-width:0}
.vc-w.rev{background:var(--amber-100)}
.vc-w .wpic{flex:none;border-radius:12px}
.vc-np{width:52px;height:35px;background:var(--lav-100)!important;box-shadow:none!important;font-family:var(--display);font-size:20px;color:var(--violet-600)}
.vc-t{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.vc-t b{overflow-wrap:anywhere}
.vc-t small{color:var(--ink-3);font-weight:700;overflow-wrap:anywhere}
.say.sm2{width:36px;height:36px}
.say.sm2 svg{width:18px;height:18px}
.vc-empty{text-align:center;padding:40px 16px;background:#fff;border:1px dashed var(--lav-300);border-radius:26px;display:flex;flex-direction:column;align-items:center;gap:10px}
.vc-empty p{margin:0;color:var(--ink-2);font-weight:700;max-width:48ch}
.vc-empty.small{padding:24px 16px}
/* Mój postęp */
.pg2{display:flex;flex-direction:column;gap:18px;max-width:1080px;margin:0 auto;width:100%}
.pg-head h1{font-size:clamp(28px,3.6vw,40px);margin-top:4px}
.pg-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.pg-stats>*{display:flex;flex-direction:column;gap:2px;padding:16px 18px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink)}
.pg-stats>a:hover{border-color:var(--violet-500)}
.pg-stats b{font-family:var(--display);font-size:32px;line-height:1.1;color:var(--violet-700)}
.pg-stats b small{font-size:17px;color:var(--ink-3)}
.pg-stats span{font-weight:800;font-size:13px;color:var(--ink-3)}
.pg-bars{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;align-items:end}
.pg-bars>div{display:flex;flex-direction:column;align-items:center;gap:6px}
.pg-bars b{font-size:12px;font-weight:800;color:var(--ink-3);min-height:16px}
.pg-col{width:100%;max-width:58px;height:150px;border-radius:14px;background:var(--paper);display:flex;align-items:flex-end;overflow:hidden}
.pg-col i{display:block;width:100%;border-radius:12px 12px 0 0;background:linear-gradient(180deg,#b79cff,var(--violet-600));animation:barUp .8s var(--ease) both}
.pg-bars .now .pg-col i{background:linear-gradient(180deg,var(--gold-300),var(--gold-500))}
.pg-bars .now b{color:var(--ink)}
.pg-bars small{font-size:11.5px;font-weight:800;color:var(--ink-3);white-space:nowrap}
.pg-note{margin:-6px 0 14px;color:var(--ink-3);font-weight:700;font-size:14px}
.pg-sk{display:flex;flex-direction:column;gap:12px}
.pg-row{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr) 48px;align-items:center;gap:14px}
.pg-l{display:flex;flex-direction:column}
.pg-l small{color:var(--ink-3);font-weight:700;font-size:12.5px}
.pg-bar{height:14px;border-radius:99px;background:var(--lav-100);overflow:hidden}
.pg-bar i{display:block;height:100%;border-radius:99px;background:hsl(var(--h) 62% 48%);transition:width .8s var(--ease)}
.pg-row em{font-style:normal;font-weight:800;text-align:right}
.pg-tip{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;padding:12px 14px;border-radius:16px;background:var(--amber-100);font-weight:700;color:var(--ink-2)}
.pg-tip>.i{width:22px;height:22px;color:var(--amber-500);flex:none}
.pg-tip span{flex:1;min-width:200px}
.pg-tip.ok{background:var(--success-100)}.pg-tip.ok>.i{color:var(--success-500)}
@media (max-width:760px){
  .rv2-links{grid-template-columns:1fr}
  .pg-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pg-stats b{font-size:26px}
  .pg-col{height:110px}
  .pg-bars{gap:4px}.pg-bars small{font-size:10px}
  .pg-row{grid-template-columns:minmax(0,1fr) 44px;gap:6px 10px}.pg-bar{grid-column:1/-1;grid-row:2}
  .vc-grid{grid-template-columns:1fr}
  .vc-g{padding:14px}
}
@media (max-width:480px){.setrow:has(>.btn){flex-wrap:wrap}}

/* ═════════ patch31: tryb ciemny (opcjonalny, w Ustawieniach) — tylko html.dark, jasny wygląd bez zmian ═════════ */
html.dark{color-scheme:dark;--paper:#0f1226;--card:#191d38;--line:#2d3259;--ink:#ecebf8;--ink-2:#c7c7e2;--ink-3:#9fa1c4;--lav-100:#252750;--lav-200:#34366c;--lav-300:#4d4a94;--c5-soft:#1b2752;--success-100:#123b2d;--amber-100:#3a2e15;
  --shadow-s:0 1px 2px rgb(0 0 0/.35),0 2px 8px rgb(0 0 0/.25);--shadow-m:0 10px 30px -8px rgb(0 0 0/.55);--shadow-l:0 24px 60px -18px rgb(0 0 0/.7)}
html.dark body{background:var(--paper)}

:where(html.dark) .side{background:var(--card)}
:where(html.dark) .nav-item.on{color:#c9b8ff}
:where(html.dark) .topbar{background:rgb(15 18 38/.8)}
:where(html.dark) .stat{background:var(--card)}
:where(html.dark) .stat.xp{color:#c9b8ff}
:where(html.dark) .btn.ghost{background:var(--card)}
:where(html.dark) .mini-trail .n{background:var(--card)}
:where(html.dark) .node button{background:var(--card)}
:where(html.dark) .node .lbl{background:rgb(15 18 38/.9)}
:where(html.dark) .node.sel .lbl{color:#c9b8ff}
:where(html.dark) .checklist li i{color:#c9b8ff}
:where(html.dark) .linkbtn{color:#c9b8ff}
:where(html.dark) .ptop{background:rgb(15 18 38/.86)}
:where(html.dark) .qdots button{background:var(--card)}
:where(html.dark) .qdots button.cur{color:#c9b8ff}
:where(html.dark) .qcard{background:var(--card)}
:where(html.dark) .say{color:#c9b8ff}
:where(html.dark) .gap{color:#c9b8ff}
:where(html.dark) .gap.filled{background:var(--card)}
:where(html.dark) .tinput{background:var(--card)}
:where(html.dark) .wchip{background:var(--card)}
:where(html.dark) .tile{background:var(--card)}
:where(html.dark) .pic{background:var(--card)}
:where(html.dark) .feedback .fbi{background:var(--card)}
:where(html.dark) .pbar{background:rgb(25 29 56/0.92)}
:where(html.dark) .bucket{background:var(--card)}
:where(html.dark) .drawer{background:var(--card)}
:where(html.dark) .inter .box{background:var(--card)}
:where(html.dark) .todo .tag.open{color:#c9b8ff}
:where(html.dark) .podium .p3 .col{background:var(--card)}
:where(html.dark) .lrow{background:var(--card)}
:where(html.dark) .fc .front{background:var(--card)}
:where(html.dark) .mini{background:var(--card)}
:where(html.dark) .hintbox{background:var(--card)}
:where(html.dark) .hintbox .lv{background:var(--card)}
:where(html.dark) .choice{background:var(--card)}
:where(html.dark) .rule b{color:#c9b8ff}
:where(html.dark) .skeleton{background:var(--card)}
:where(html.dark) .ctx{background:var(--card)}
:where(html.dark) .ctx summary .ico{color:#9dbbff}
:where(html.dark) .qlabel{color:#c9b8ff}
:where(html.dark) .gi input,:where(html.dark) .gi textarea{color:#c9b8ff}
:where(html.dark) .gi input:focus,:where(html.dark) .gi textarea:focus{background:var(--card)}
:where(html.dark) .gi.shown input,:where(html.dark) .gi.shown .sel{background:var(--card)}
:where(html.dark) .gi .sel{color:#c9b8ff}
:where(html.dark) .opt{background:var(--card)}
:where(html.dark) .opt b{color:#c9b8ff}
:where(html.dark) .writer textarea{background:var(--card)}
:where(html.dark) .draw{background:var(--card)}
:where(html.dark) .story{background:var(--card)}
:where(html.dark) .story mark{color:#c9b8ff}
:where(html.dark) .xw span.c{background:var(--card)}
:where(html.dark) .mat{background:var(--card)}
:where(html.dark) .mat .go{color:#c9b8ff}
:where(html.dark) .tagpill{color:#c9b8ff}
:where(html.dark) .tagpill.gold{background:#332b16}
:where(html.dark) .src-link:hover{color:#c9b8ff}
:where(html.dark) a.nav-item.on{color:#c9b8ff}
:where(html.dark) .klasa{background:var(--card)}
:where(html.dark) .gloss span{background:var(--card)}
:where(html.dark) .note .ex mark{background:#332b16}
:where(html.dark) .mhead{color:#c9b8ff}
:where(html.dark) .mt{background:var(--card)}
:where(html.dark) .mt b{color:#c9b8ff}
:where(html.dark) .mt.hint{background:#332b16}
:where(html.dark) .card.talk .mine{color:#c9b8ff}
:where(html.dark) .ctx-note{background:#332b16}
:where(html.dark) .ctx-model{background:var(--card)}
:where(html.dark) .qimg img{background:var(--card)}
:where(html.dark) .lead.grp{color:#c9b8ff}
:where(html.dark) .auth-tabs{background:var(--card)}
:where(html.dark) .auth-form input:not([type=checkbox]),:where(html.dark) .auth-form select,:where(html.dark) .account-card input:not([type=checkbox]){background:var(--card)}
:where(html.dark) .auth-form .pw button{background:var(--card)}
:where(html.dark) .auth-err{background:#3b2329}
:where(html.dark) .auth-links button{color:#c9b8ff}
:where(html.dark) .cloud{background:var(--card)}
:where(html.dark) .cloud.err{background:#3b2329}
:where(html.dark) .more-mats summary{color:#c9b8ff}
:where(html.dark) .instr-more summary{color:#c9b8ff}
:where(html.dark) .wf b{color:#c9b8ff}
:where(html.dark) .odd{background:var(--card)}
:where(html.dark) .bub.in{background:var(--card)}
:where(html.dark) .bw{background:var(--card)}
:where(html.dark) .note .ex.tip{background:#332b16}
:where(html.dark) .rk-head h2 em{color:#c9b8ff}
:where(html.dark) .rk-filters select{background:var(--card)}
:where(html.dark) .seg{background:var(--card)}
:where(html.dark) .acc-msg{color:#c9b8ff}
:where(html.dark) .et-n{color:#c9b8ff}
:where(html.dark) .exam-score b{color:#c9b8ff}
:where(html.dark) .t-stats div{background:var(--card)}
:where(html.dark) .t-filters input,:where(html.dark) .t-filters select{background:var(--card)}
:where(html.dark) .hs-week{background:var(--card)}
:where(html.dark) .hs-week b{background:#332b16}
:where(html.dark) .hs-lvl{background:var(--card)}
:where(html.dark) .next{background:var(--card)}
:where(html.dark) .nx-tag{background:rgb(25 29 56/0.75)}
:where(html.dark) .nx-tag{color:#c9b8ff}
:where(html.dark) .nx-bar{background:rgb(25 29 56/0.7)}
:where(html.dark) .nx-go svg{background:var(--card)}
:where(html.dark) .nx-go svg{color:#c9b8ff}
:where(html.dark) .stage-tabs button{background:var(--card)}
:where(html.dark) .stage-tabs button b{color:#c9b8ff}
:where(html.dark) .stage-tabs button[aria-selected="true"]{background:#30366e}
:where(html.dark) .lt-n{background:var(--card)}
:where(html.dark) .lt-st{background:var(--card)}
:where(html.dark) .kchip{background:var(--card)}
:where(html.dark) .kp-box{background:var(--card)}
:where(html.dark) .kp-c small{color:#c9b8ff}
:where(html.dark) .back-chip{background:var(--card)}
:where(html.dark) .li-hero{background:var(--card)}
:where(html.dark) .li-tag{background:rgb(25 29 56/0.75)}
:where(html.dark) .li-tag{color:#c9b8ff}
:where(html.dark) .li-meta span{background:rgb(25 29 56/0.7)}
:where(html.dark) .li-bar{background:rgb(25 29 56/0.7)}
:where(html.dark) .lm{background:var(--card)}
:where(html.dark) .lm-ic b{color:#9dbbff}
:where(html.dark) .lm-go{color:#c9b8ff}
:where(html.dark) .lm.extra{background:rgb(25 29 56/0.7)}
:where(html.dark) .sc-pill{background:var(--card)}
:where(html.dark) .sc-pill.exam>span{color:#9dbbff}
:where(html.dark) .auth-app{color:#c9b8ff}
:where(html.dark) .auth-app .i{background:var(--card)}
:where(html.dark) .ns-card{background:var(--card)}
:where(html.dark) .ns-t small{color:#c9b8ff}
:where(html.dark) .logoutbtn{background:var(--card)}
:where(html.dark) .lo-ic{color:#c9b8ff}
:where(html.dark) .ctx-fab{background:#30366e}
:where(html.dark) .cs-box{background:var(--card)}
:where(html.dark) .cs-x{color:#c9b8ff}
:where(html.dark) .gi-x{background:var(--card)}
:where(html.dark) .seg-pick button[aria-checked=true]{background:var(--card)}
:where(html.dark) .seg-pick button[aria-checked=true]{color:#c9b8ff}
:where(html.dark) .hw-card{background:var(--card)}
:where(html.dark) .hw-item{background:var(--card)}
:where(html.dark) .hw-st{color:#c9b8ff}
:where(html.dark) .hw-item.late .hw-st{background:#3b2329}
:where(html.dark) .hw-form select,:where(html.dark) .hw-form input{background:var(--card)}
:where(html.dark) .hw-who i{background:var(--card)}
:where(html.dark) .stk{background:var(--card)}
:where(html.dark) .stk i{background:#30366e}
:where(html.dark) .fc-cta{background:var(--card)}
:where(html.dark) .mock-card{background:var(--card)}
:where(html.dark) .mock-timer{background:#30366e}
:where(html.dark) .mk-row{background:var(--card)}
:where(html.dark) .say{color:#c9b8ff}
:where(html.dark) .listen{color:#c9b8ff}
:where(html.dark) .listen svg{background:var(--card)}
:where(html.dark) .listen.playing svg{color:#c9b8ff}
:where(html.dark) .qcard.tall #gbank{background:rgb(25 29 56/0.97)}
:where(html.dark) .text-title{color:#c9b8ff}
:where(html.dark) .node button{background:var(--card)!important}
:where(html.dark) .node .node-n{background:var(--card)}
:where(html.dark) .recbox.on .rec-go{background:var(--card)}
:where(html.dark) .tickbtn{background:var(--card)}
:where(html.dark) .ord-o{background:var(--card)}
:where(html.dark) .ord-o b{color:#c9b8ff}
:where(html.dark) .ms-o{background:var(--card)}
:where(html.dark) .note.why{background:#332b16}
:where(html.dark) .opt-x:hover{background:#3b2329}
:where(html.dark) .mw i{background:var(--card)}
:where(html.dark) .mw i{color:#c9b8ff}
:where(html.dark) .wc-chips i{background:var(--card)}
:where(html.dark) .sp-score{color:#c9b8ff}
:where(html.dark) .sp-in{color:#c9b8ff}
:where(html.dark) .sp-in.bad{background:#3b2329}
:where(html.dark) .sp-big{color:#c9b8ff}
:where(html.dark) .rich.bh .bh-w.mark{background:#3b2329}
:where(html.dark) .sp-gap{color:#c9b8ff}
:where(html.dark) .lt{background:var(--card)}
:where(html.dark) .lt{color:#c9b8ff}
:where(html.dark) .rv-type input{background:var(--card)}
:where(html.dark) .rv-dict{background:var(--card)}
:where(html.dark) .rv-dict{color:#c9b8ff}
:where(html.dark) .rl-card{background:var(--card)}
:where(html.dark) .rl-ico{color:#c9b8ff}
:where(html.dark) .rl-plan.all{background:var(--card)}
:where(html.dark) .rl-fire{background:#332b16}
:where(html.dark) .rl-stk i{background:var(--card)}
:where(html.dark) .node .lbl{background:var(--card)}
:where(html.dark) .k2-now{background:var(--card)}
:where(html.dark) .k2-body{background:var(--card)}
:where(html.dark) .k2-tag{color:#c9b8ff}
:where(html.dark) .k2-step .i{color:#c9b8ff}
:where(html.dark) .k2-go svg{background:var(--card)}
:where(html.dark) .k2-go svg{color:#c9b8ff}
:where(html.dark) .k2-p{background:var(--card)}
:where(html.dark) .k2-pi{color:#c9b8ff}
:where(html.dark) .k2-plan.all .k2-p{background:var(--card)}
:where(html.dark) .k2-exam{background:var(--card)}
:where(html.dark) .lp-hero{background:var(--card)}
:where(html.dark) .lp-head{background:var(--card)}
:where(html.dark) .lp-tag{color:#c9b8ff}
:where(html.dark) .lp-step{background:var(--card)}
:where(html.dark) .lp-n{color:#c9b8ff}
:where(html.dark) .lp-p{color:#c9b8ff}
:where(html.dark) .lp-go{color:#c9b8ff}
:where(html.dark) .lp-step.now{background:var(--card)}
:where(html.dark) .lp-x{background:var(--card)}
:where(html.dark) .lp-xi{color:#c9b8ff}
:where(html.dark) .rv2-card,:where(html.dark) .lg2-me{background:var(--card)}
:where(html.dark) .rv2-hero{background:var(--card)}
:where(html.dark) .rv2-modes button{background:var(--card)}
:where(html.dark) .rv2-modes button .i{color:#c9b8ff}
:where(html.dark) .rv2-deck i{background:var(--card)}
:where(html.dark) .rv2-days li b{color:#c9b8ff}
:where(html.dark) .rv2-src em{color:#c9b8ff}
:where(html.dark) .rv2s-x{background:var(--card)}
:where(html.dark) .rv2s-xp{background:var(--card)}
:where(html.dark) .rv2s-xp{color:#c9b8ff}
:where(html.dark) .rv2s-chip{background:var(--card)}
:where(html.dark) a.rv2s-chip:hover{color:#c9b8ff}
:where(html.dark) .fc2-face.front{background:var(--card)}
:where(html.dark) .fc2-q .gap{color:#c9b8ff}
:where(html.dark) .rv2s-stamp{background:var(--card)}
:where(html.dark) .rv2s .rv-type input{background:var(--card)}
:where(html.dark) .rv2s-k{background:var(--card)}
:where(html.dark) .rv2s-k.no.sugg{background:#3b2329}
:where(html.dark) .bd2-tabs{background:var(--card)}
:where(html.dark) .bd2-n{background:var(--card)}
:where(html.dark) .bd2-go{color:#c9b8ff}
:where(html.dark) .bd2-b{background:var(--card)}
:where(html.dark) .bd2-b.on{background:var(--card)}
:where(html.dark) .bd2-ch{background:var(--card)}
:where(html.dark) .bd2-chn{color:#c9b8ff}
:where(html.dark) .stk.empty.cur b{color:#c9b8ff}
:where(html.dark) .lg2-hero{background:var(--card)}
:where(html.dark) .lg2-filters select{background:var(--card)}
:where(html.dark) .lg2-pod .p3 .lg2-step{background:var(--card)}
:where(html.dark) .lg2-pod .you b{color:#c9b8ff}
:where(html.dark) .lg2-list li{background:var(--card)}
:where(html.dark) .lg2-empty{background:var(--card)}
:where(html.dark) .lg2-tot .now b{color:#c9b8ff}
:where(html.dark) .lg2-bars .today small{color:#c9b8ff}
:where(html.dark) .mebtn .i{background:var(--card)}
:where(html.dark) .mebtn .i{color:#c9b8ff}
:where(html.dark) .sum-rw{background:var(--card)}
:where(html.dark) .pt-search input{background:var(--card)}
:where(html.dark) .pt-res a{background:var(--card)}
:where(html.dark) .pt-res a>.i{color:#c9b8ff}
:where(html.dark) .les-all{color:#c9b8ff}
:where(html.dark) .les-all{background:var(--card)}
:where(html.dark) .k2-more{color:#c9b8ff}
:where(html.dark) .rv2-links a{background:var(--card)}
:where(html.dark) .rv2-links a>.i:first-child{color:#c9b8ff}
:where(html.dark) .hl-box{background:var(--card)}
:where(html.dark) .vc-g{background:var(--card)}
:where(html.dark) .vc-np{color:#c9b8ff}
:where(html.dark) .vc-empty{background:var(--card)}
:where(html.dark) .pg-stats>*{background:var(--card)}
:where(html.dark) .pg-stats b{color:#c9b8ff}
@media (max-width:860px){
  :where(html.dark) .tabbar{background:rgb(25 29 56/0.94)}
  :where(html.dark) .tabbar button.on{color:#c9b8ff}
}
@media (max-width:760px){
  :where(html.dark) .topbar{background:rgb(15 18 38/.97)}
}
/* ręczne poprawki trybu ciemnego */
html.dark .stage-tabs button[aria-selected="true"]{background:var(--violet-600);color:#fff}
html.dark .stage-tabs button[aria-selected="true"] small{color:rgb(255 255 255/.8)}
html.dark .wpic,html.dark .av-grid button,html.dark .avatar.has-img{background:#f6f4fb}
html.dark input,html.dark textarea,html.dark select{color-scheme:dark}
html.dark .logo img{filter:brightness(0) invert(1) opacity(.92)}
html.dark .dict-pop,html.dark .toast{background:#2c3266}
html.dark .coach{background:#2c3266}
html.dark .coach::after{background:#2c3266}
html.dark .gloss b,html.dark .story mark{color:#d9ccff}
html.dark mark{background:#5a4a16;color:#ffe7a3}
html.dark .fc2-full mark{background:var(--gold-300);color:var(--navy-900)}
html.dark .rv2s-k.yes.sugg{background:#123b2d}
html.dark .rv2s-k.no.sugg{background:#3b2329}
html.dark .lt-here,html.dark .k2-p em,html.dark .lp-step em,html.dark .node .pt-here-tag{color:var(--navy-900)}
html.dark .qcard .body,html.dark .rich{color:var(--ink)}
html.dark .chk-enter{color:var(--ink-3)}
html.dark .detail .ph,html.dark .lp-cover,html.dark .k2-cover,html.dark .sum-cover{background-color:#20244a}

html.dark .mat.main{background:linear-gradient(135deg,var(--card),#1e2b5a)}
html.dark .ctx-fab{background:#30366e;color:#fff}
html.dark .mat .ring circle:first-child{stroke:var(--lav-200)}

/* ═════════ patch32: paski ekranu zadania + ilustracje po odpowiedzi ═════════ */
/* górny pasek: białe pigułki na jasnym tle */
.ptop{gap:12px;padding:10px 22px;background:rgb(247 245 251/.92);border-bottom:0;box-shadow:0 1px 0 var(--line),0 10px 24px -20px rgb(21 26 61/.4)}
.ptop .iconbtn{width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s);color:var(--ink-2)}
.ptop .iconbtn:hover{background:#fff;color:var(--violet-700);border-color:var(--lav-300)}
.ptop .iconbtn[aria-pressed=false]{opacity:1;color:var(--ink-3)}
.ptop .iconbtn[aria-pressed=false] svg{opacity:.45}
.steps{padding:7px 9px;gap:5px;border-radius:99px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s)}
.steps button{height:12px;background:var(--lav-100)}
.steps button span{background:linear-gradient(90deg,var(--violet-500),var(--c5))}
.steps button.full span{background:linear-gradient(90deg,#3fd197,var(--success-500))}
.steps button.cur{outline:0;box-shadow:0 0 0 3px #fff,0 0 0 5px var(--gold-400)}
.steps button.mstart{margin-left:6px}
.ptop .stat.xp{gap:6px;padding:8px 14px 8px 10px;border-radius:99px;background:linear-gradient(180deg,#fff9e2,#ffedb0);border:1px solid #f1d27f;color:#6b4300;box-shadow:0 6px 14px -10px rgb(224 169 27/.9)}
.ptop .stat.xp svg{color:var(--gold-500);fill:var(--gold-400)}
.ptop .combo{padding:7px 12px;border-radius:99px;background:#fff1e8;border:1px solid #ffd2b8}
/* dolny pasek: pływający, z podpisami pod ikonami */
.pbar{left:50%;right:auto;bottom:calc(10px + env(safe-area-inset-bottom));width:min(900px,calc(100% - 24px));transform:translateX(-50%);padding:8px 10px;border:1px solid var(--line);border-radius:24px;background:rgb(255 255 255/.95);box-shadow:0 20px 40px -20px rgb(21 26 61/.38),0 2px 6px rgb(21 26 61/.06)}
.pbar .in{gap:8px}
.pbar .btn.small{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:74px;height:54px;padding:4px 12px;border-radius:16px;border:0;background:transparent;box-shadow:none;color:var(--ink-2);font-size:12.5px;font-weight:800}
.pbar .btn.small svg{width:22px;height:22px}
.pbar .btn.small span{display:block!important;line-height:1.1}
.pbar .btn.small:hover{background:var(--lav-100);color:var(--violet-700)}
.pbar .btn.hint.small{background:linear-gradient(180deg,#fff7d6,#ffe9a6);color:#6b4300;box-shadow:inset 0 0 0 1px #f1d27f}
.pbar .btn.hint.small:disabled{opacity:.5}
.pbar .btn.primary{height:54px;padding:0 24px;border-radius:16px;font-size:16px}
@media (max-width:640px){
  .ptop{padding:8px 12px;gap:8px}
  .ptop .iconbtn{width:40px;height:40px}
  .steps{padding:6px 7px}
  .ptop .stat.xp{padding:6px 11px 6px 8px}
  .pbar{width:calc(100% - 16px);bottom:calc(8px + env(safe-area-inset-bottom));padding:6px 8px;border-radius:22px}
  .pbar .btn.small{min-width:0;flex:1;max-width:96px;height:52px;padding:4px 6px;font-size:11px}
  .pbar .btn.small{min-width:0}
  .pbar .spacer{display:none}
  .pbar .btn.primary{flex:1.4;height:52px;padding:0 14px}
}
/* obrazek słowa po dobrej odpowiedzi */
.fb-pics{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 10px}
.fb-pics figure{display:flex;align-items:center;gap:12px;margin:0;padding:8px 16px 8px 8px;border-radius:20px;background:linear-gradient(135deg,#fff8e1,#fff);border:1px solid #f3e1a8;box-shadow:var(--shadow-s);animation:fbPic .55s var(--spring) both}
.fb-pics figure+figure{animation-delay:.08s}
.fb-pics img{width:72px;height:72px;border-radius:16px;object-fit:cover;background:#f6f4fb}
.fb-pics figcaption{font-family:var(--display);font-size:20px;color:var(--ink)}
@keyframes fbPic{from{opacity:0;transform:translateY(8px) scale(.9)}}
@media (prefers-reduced-motion:reduce){.fb-pics figure{animation:none}}
/* grupy: obrazek przy przeniesionym słowie */
.placed{display:flex;align-items:center;gap:10px}
.placed b{flex:1;font-weight:800}
.placed .wpic{flex:none}
/* pary: obrazek przy połączonym słowie */
.mt .mt-pic{width:40px;height:40px;border-radius:10px;margin-right:4px;flex:none}
.mt .mt-pic img{width:100%;height:100%;object-fit:cover}
.mt.done{display:flex;align-items:center;gap:8px}
/* okładka lekcji w nagłówku kroku */
.shead{position:relative}
.shead>div:nth-child(2){flex:1;min-width:0}
.shead-cover{flex:none;width:132px;aspect-ratio:4/3;border-radius:18px;overflow:hidden;box-shadow:0 14px 26px -16px rgb(21 26 61/.45);border:3px solid #fff;transform:rotate(2.5deg);margin-left:auto}
.shead-cover .shead-img{display:block;width:100%;height:100%;object-fit:cover}
@media (max-width:760px){.shead-cover{display:none}}
.player.split .shead-cover{width:150px}
.mt.done{flex-wrap:wrap}
.mt.done span{flex:1;min-width:0}
.mt.done em{flex-basis:100%;white-space:normal}
.mt.done .mt-pic+span+em{padding-left:52px}
@media (max-width:640px){.pbar [data-hint].small{flex:1.5;max-width:none}.pbar [data-hint] span{font-size:10.5px}}

/* ═════════ patch33: obrazki słów z treści zdania, okładka nad tekstem ═════════ */
.s-pics{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 4px}
.s-pics figure{display:flex;align-items:center;gap:8px;margin:0;padding:5px 12px 5px 5px;border-radius:16px;background:var(--paper);border:1px solid var(--line)}
.s-pics img{width:44px;height:44px;border-radius:12px;object-fit:cover;background:#f6f4fb}
.s-pics figcaption{font-weight:800;font-size:14px;color:var(--ink-2)}
@media (min-width:900px){
  .qcard.has-spics{padding-right:150px;min-height:calc(76px + var(--np,1) * 134px)}
  .qcard.has-spics .s-pics{position:absolute;top:58px;right:22px;flex-direction:column;gap:12px;margin:0;width:112px}
  .qcard.has-spics .s-pics figure{flex-direction:column;padding:8px 8px 6px;gap:4px;text-align:center;background:#fff;box-shadow:var(--shadow-s)}
  .qcard.has-spics .s-pics img{width:84px;height:84px;border-radius:14px}
  .qcard.has-spics .s-pics figure:nth-child(2){transform:rotate(2deg)}
  .qcard.has-spics .s-pics figure:nth-child(1){transform:rotate(-2deg)}
}
.player.split .qcard.has-spics{padding-right:30px}
.player.split .qcard.has-spics .s-pics{position:static;flex-direction:row;width:auto;margin:14px 0 4px}
.player.split .qcard.has-spics .s-pics figure{flex-direction:row;padding:5px 12px 5px 5px;transform:none}
.player.split .qcard.has-spics .s-pics img{width:44px;height:44px}
.ctx-cover{margin:0 0 14px;border-radius:18px;overflow:hidden;aspect-ratio:16/7;box-shadow:0 12px 24px -16px rgb(21 26 61/.4)}
.ctx-cover .ctx-cover-img{display:block;width:100%;height:100%;object-fit:cover}
html.dark .s-pics figure{background:var(--card)}

/* ═════════ patch34: tekst z podziałem na linie (tabela planowania, bank słów, e-mail) ═════════ */
.lb{display:flex;flex-direction:column;gap:6px}
.lb-line{margin:0;line-height:1.6}
.lb-h{margin:12px 0 2px;font-family:var(--display);font-size:17px;color:var(--ink)}
.lb-h:first-child{margin-top:0}
.lb-table{margin:4px 0 8px}
.lb-table table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
.lb-table th{padding:8px 12px;background:var(--lav-100);color:var(--violet-700);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;text-align:left}
.lb-table td{padding:9px 12px;border-top:1px solid var(--line);font-weight:700;color:var(--ink);vertical-align:top}
.lb-table td.lb-note{width:55%;background:repeating-linear-gradient(180deg,transparent 0 22px,var(--line) 22px 23px)}
.lb-bank{display:grid;grid-template-columns:minmax(110px,max-content) 1fr;gap:6px 12px;align-items:start;padding:8px 0;border-top:1px dashed var(--line)}
.lb-bank b{font-size:13px;color:var(--ink-2);padding-top:5px}
.lb-bank span{display:flex;flex-wrap:wrap;gap:6px}
.lb-bank i{font-style:normal;font-weight:700;font-size:14px;padding:4px 10px;border-radius:99px;background:var(--lav-100);color:var(--ink)}
@media (max-width:640px){.lb-bank{grid-template-columns:1fr}.lb-bank b{padding-top:0}.lb-table td.lb-note{width:45%}}
html.dark .lb-table table{background:var(--card)}

/* ═════════ patch35: kafelki „ułóż zdanie”, dialog jak na czacie ═════════ */
.sb{display:flex;flex-direction:column;gap:12px}
.sb .qlabel{align-self:flex-start}
.sb-line{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-height:62px;padding:10px 12px;border-radius:18px;background:repeating-linear-gradient(180deg,transparent 0 50px,var(--lav-300) 50px 52px);background-color:var(--lav-50,#faf8ff);border:2px dashed var(--lav-300);transition:border-color .2s,background-color .2s}
.sb-line.ok,.sb-line.near{border-style:solid;border-color:var(--success-500);background:#effaf3}
.sb-line.half,.sb-line.shown{border-style:solid;border-color:#e0a91b;background:#fff8e6}
.sb-line.bad{border-color:#ef4f5f}
.sb-ph{color:var(--ink-3);font-weight:700;font-size:15px;padding-left:4px}
.sb-chip,.sb-tile{font:inherit;font-weight:800;font-size:18px;line-height:1.2;padding:10px 14px;border-radius:14px;border:2px solid var(--line);background:#fff;color:var(--ink);box-shadow:0 3px 0 var(--line);cursor:pointer;transition:transform .15s var(--spring),box-shadow .15s;touch-action:manipulation}
.sb-tile:active,.sb-chip:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
.sb-chip{background:var(--lav-100);border-color:var(--lav-300);box-shadow:0 3px 0 var(--lav-300);color:var(--violet-700)}
.sb-chip.hint{background:#fff3c4;border-color:#f4c542;box-shadow:0 3px 0 #e0a91b;color:#6b4e00;cursor:default}
.sb-chip.new{animation:sbIn .28s var(--spring)}
@keyframes sbIn{from{transform:scale(.6) translateY(10px);opacity:.2}}
.sb.done .sb-chip{cursor:default;background:#fff;border-color:transparent;box-shadow:none;padding:6px 4px;color:var(--ink)}
.sb-end{font-weight:800;font-size:18px;margin-left:-6px}
.sb-pool{display:flex;flex-wrap:wrap;gap:10px;padding:4px 0}
.sb-tile.used{visibility:hidden;pointer-events:none}
.sb-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.sb-tools small{color:var(--ink-3);font-weight:700}
.sb-type{background:none;border:0;padding:6px 2px;font:inherit;font-weight:800;font-size:14px;color:var(--violet-700);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
@media (max-width:640px){.sb-chip,.sb-tile{font-size:17px;padding:9px 12px}.sb-line{min-height:56px}}

.qcard.chat .thread,.qcard.chat .leads{display:flex;flex-direction:column;gap:8px}
.qcard.chat .thread{margin:0 0 8px}
.qcard.chat .leads:empty{display:none}
.bub .spk{display:flex;align-items:center;gap:7px;opacity:1;color:var(--ink-2)}
.bav{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;font-style:normal;font-size:12px;font-weight:900;letter-spacing:0;color:#fff;background:var(--violet-600,#6d3fd1);flex:none}
.sp1 .bav{background:#e0a91b}.sp2 .bav{background:#1f9e8f}.sp3 .bav{background:#e2576a}
.bub.l{align-self:flex-start;background:#fff;border:2px solid var(--line);border-bottom-left-radius:6px}
.bub.r{align-self:flex-end;background:var(--lav-100);border:2px solid var(--lav-300);border-bottom-right-radius:6px}
.bub.sp2.l{background:#eefaf7;border-color:#bfe7df}.bub.sp3.r{background:#fff0f2;border-color:#f6c3cb}
.rich.bub{display:block;width:fit-content;max-width:92%}
.rich.bub.l{margin-right:auto}.rich.bub.r{margin-left:auto}
.rich.bub.cur{box-shadow:0 0 0 4px rgba(244,197,66,.28)}
.bub.todo{opacity:.62}
.thread.clip .bub.old{display:none}
.th-more{align-self:center;background:none;border:0;font:inherit;font-weight:800;font-size:14px;color:var(--violet-700);padding:4px 8px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.bub .fill{color:var(--violet-700);background:rgba(109,63,209,.1);padding:0 5px;border-radius:6px}
.bub .fill-gap{letter-spacing:.1em;color:var(--ink-3)}
.say.mini{width:28px;height:28px;margin-left:auto}
.say.mini svg{width:16px;height:16px}
.gapno{display:inline-block;font-size:11px;font-weight:800;line-height:1;padding:3px 5px;border-radius:6px;background:var(--lav-100);color:var(--violet-700);vertical-align:2px}
.lb .bub{max-width:88%}
:where(html.dark) .bub.l,:where(html.dark) .sb-chip,:where(html.dark) .sb-tile{background:var(--card)}
:where(html.dark) .bub.sp2.l{background:#173a36;border-color:#24584f}:where(html.dark) .bub.sp3.r{background:#3d2128;border-color:#6a3440}
:where(html.dark) .sb-line{background-color:transparent}
:where(html.dark) .sb.done .sb-chip{background:transparent}

/* ═════════ patch36: symbole słów, sceny sytuacji, obrazek tematu, wynik dziesiątki ═════════ */
.sym-i{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#f6f4fb;flex:none;overflow:hidden}
.sym-i.emo{font-size:28px;line-height:1}
.sym-i svg{width:84%;height:84%}
.sym-i.flag img{width:80%;height:auto;border-radius:3px;box-shadow:0 0 0 1px rgb(0 0 0/.08)}
.fb-pics figure.sym .sym-i{width:88px;height:88px;border-radius:16px}
.fb-pics figure.sym .sym-i.emo{font-size:54px}
.wpic.symw svg{width:100%;height:100%}
@media (min-width:1100px){
  .qcard.has-spics .s-pics figure.sym .sym-i{width:84px;height:84px;border-radius:14px}
  .qcard.has-spics .s-pics figure.sym .sym-i.emo{font-size:52px}
}
.shead-cover.topic{aspect-ratio:1;width:112px;background:#f6f4fb}
.tenscore{position:fixed;left:50%;bottom:calc(var(--pbarh, 96px) + 18px);transform:translate(-50%,24px) scale(.96);opacity:0;z-index:60;display:flex;align-items:center;gap:12px;padding:12px 20px 12px 12px;border-radius:22px;background:#fff;border:2px solid var(--lav-300);box-shadow:0 20px 40px -18px rgb(21 26 61/.45);transition:opacity .3s,transform .35s var(--spring);pointer-events:none;max-width:calc(100vw - 24px)}
.tenscore{width:min(380px,calc(100vw - 24px))}
.tenscore.in{opacity:1;transform:translate(-50%,0) scale(1)}
.tenscore svg{width:64px;height:64px;transform:rotate(-90deg);flex:none}
.tenscore .ts-bg{fill:none;stroke:var(--lav-100);stroke-width:7}
.tenscore .ts-fg{fill:none;stroke:#f4c542;stroke-width:7;stroke-linecap:round;transition:stroke-dashoffset 1.1s cubic-bezier(.2,.8,.2,1) .15s}
.tenscore > b{position:absolute;left:12px;width:64px;text-align:center;font-family:var(--display);font-size:22px;color:var(--ink)}
.tenscore > b small{font-size:12px;color:var(--ink-3)}
.tenscore span{display:flex;flex-direction:column;gap:2px}
.tenscore strong{font-family:var(--display);font-size:18px;color:var(--ink)}
.tenscore span small{font-weight:700;color:var(--ink-3);font-size:13px}
:where(html.dark) .tenscore{background:var(--card)}
:where(html.dark) .sym-i{background:#2a2748}
@media (prefers-reduced-motion:reduce){.tenscore,.tenscore .ts-fg{transition:none}}

/* ═════════ patch37: głosy w dialogach, „Posłuchaj rozmowy”, ułóż rozmowę ═════════ */
.conv-play{align-self:flex-start;margin:0 0 6px}
.conv-play.playing{background:var(--violet-700,#5b2fc2);color:#fff}
.bub.speaking{box-shadow:0 0 0 4px rgba(244,197,66,.55);transform:scale(1.015);transition:transform .2s,box-shadow .2s}
.lb .conv-play{margin-bottom:8px}
.ob{display:flex;flex-direction:column;gap:12px}
.ob-conv{display:flex;flex-direction:column;gap:8px}
.ob-slot{min-height:46px;border-radius:16px;border:2px dashed var(--lav-300);display:flex;align-items:center;padding:0 14px;color:var(--ink-3);font-weight:800;opacity:.55}
.ob-slot.next{opacity:1;border-color:#f4c542;background:#fffbea}
.ob-slot span{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--lav-100);font-size:13px}
.ob.chat .ob-slot{max-width:88%}
.ob-b{cursor:pointer}
.ob-b.fixed,.ob-item.fixed{cursor:default}
.ob-b.fixed{border-color:var(--success-500)}
.ob-b.new,.ob-item.new{animation:sbIn .28s var(--spring)}
.ob-item{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:16px;background:#fff;border:2px solid var(--line);font-weight:700;line-height:1.45;cursor:pointer}
.ob-item b{display:inline-grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--lav-100);color:var(--violet-700);font-size:14px}
.ob-item.fixed{border-color:var(--success-500)}
.ob-item.fixed b{background:var(--success-500);color:#fff}
.ob-pool-h{font-weight:800;font-size:14px;color:var(--ink-3);margin-top:4px}
.ob-pool{display:flex;flex-direction:column;gap:8px}
.ob-card{display:flex;align-items:center;gap:10px;text-align:left;font:inherit;font-weight:700;font-size:16px;line-height:1.4;padding:12px 14px;border-radius:16px;border:2px solid var(--line);background:#fff;color:var(--ink);box-shadow:0 3px 0 var(--line);cursor:pointer;touch-action:manipulation;transition:transform .15s var(--spring)}
.ob-card:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
.ob-card b{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);flex:none}
.ob.done .ob-b,.ob.done .ob-item{cursor:default}
:where(html.dark) .ob-item,:where(html.dark) .ob-card{background:var(--card)}
:where(html.dark) .ob-slot.next{background:transparent}
.ob-slot em{font-style:normal;font-weight:800;font-size:14px;color:#8a6a00;margin-left:10px}

/* ═════════ patch38: wzór po wykonaniu kroku ═════════ */
.ctx-model.locked{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:14px;border:2px dashed var(--lav-300);background:transparent;color:var(--ink-2);margin:10px 0}
.ctx-model.locked b{display:block;font-size:14px;color:var(--ink)}
.ctx-model.locked small{display:block;font-weight:700;color:var(--ink-3);font-size:13px}
.ctx-model.locked svg{flex:none;width:22px;height:22px;color:var(--violet-700)}

/* patch42: dalsza część rozmowy po ostatnim zadaniu */
.tail-bubs{display:flex;flex-direction:column;gap:8px;margin:10px 0 4px}

/* patch43: odpowiedź drugiej osoby pod bieżącą kwestią */
.tail-bubs.next .bub{opacity:.9}

/* patch59: kurs chwilowo wyłączony */
.kp-c.lock{opacity:.5;filter:grayscale(1)}
.kp-c.lock small{color:var(--ink-3)}
.klasa button.lock{opacity:.5}
.unl-form{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 4px}
.unl-form input{flex:1 1 180px;min-width:0;font:inherit;font-size:16px;padding:12px 14px;border-radius:14px;border:2px solid var(--lav-200,#ddd);background:var(--paper)}
.unl-msg{color:var(--coral-600,#c0392b);font-weight:700;min-height:1.2em;margin:4px 0 0}

/* patch60: „Jedna droga” — bez bocznego menu i dolnych zakładek; start z jednym przyciskiem; zadanie bez zbędnych przycisków */
html.simple .app{grid-template-columns:1fr}
html.simple .side,html.simple #tabbar{display:none!important}
html.simple .topbar .stat,html.simple .topbar .klasa,html.simple .topbar .appbtn,html.simple .topbar .logoutbtn{display:none!important}
html.simple .topbar{padding:10px 20px;max-width:none}
html.simple .topbar .crumb{display:block!important}
html.simple .sm-logo img{height:38px;display:block}
html.simple .mebtn{display:flex!important}
html.simple .page{max-width:760px;margin:0 auto;padding:8px 20px 48px}
@media (max-width:760px){html.simple .page{padding:4px 16px 40px}}
html.simple body.focus .page{max-width:none;padding:0}
.today{display:flex;flex-direction:column;gap:16px;margin-top:4px}
.today h1{font-family:var(--display);font-size:clamp(28px,6vw,40px);line-height:1.1;margin:6px 0 0}
.td-sub{margin:-6px 0 0;color:var(--ink-2);font-size:18px;font-weight:700}
.td-card{display:block;border-radius:28px;overflow:hidden;background:var(--card);box-shadow:var(--shadow-m);text-decoration:none;color:inherit;transition:transform .2s var(--ease)}
.td-card:hover{transform:translateY(-2px)}
.td-cover{display:block;aspect-ratio:2/1;background:linear-gradient(135deg,var(--b1),var(--b2));overflow:hidden}
.td-cover .cover-svg,.td-img{display:block;width:100%;height:100%;object-fit:cover}
.td-body{display:flex;flex-direction:column;gap:6px;padding:16px 22px 22px}
.td-body small{color:var(--violet-700);font-weight:800;text-transform:uppercase;letter-spacing:.07em;font-size:13px}
.td-body b{font-family:var(--display);font-size:clamp(24px,5vw,30px);line-height:1.15}
.td-meta{color:var(--ink-3);font-weight:700}
.td-bar{height:10px;border-radius:99px;background:var(--lav-100);overflow:hidden;margin-top:6px}
.td-bar i{display:block;height:100%;background:var(--success-500);border-radius:inherit}
.btn.td-go{width:100%;min-height:62px;font-size:20px;justify-content:center;border-radius:20px;gap:10px}
.td-foot{display:flex;flex-direction:column;gap:14px;margin-top:4px}
.td-week{display:flex;gap:6px;justify-content:center}
.td-week i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:800;color:var(--ink-3);background:var(--lav-100)}
.td-week i.on{background:var(--success-500);color:#fff}
.td-week i.today{box-shadow:0 0 0 2px var(--violet-500)}
.td-all{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:18px;background:var(--card);color:var(--ink);text-decoration:none;font-weight:800;box-shadow:var(--shadow-s)}
.td-all span{flex:1}
.td-all .i{width:20px;height:20px;color:var(--violet-600)}
.lsn h1{font-family:var(--display);font-size:clamp(28px,6vw,38px);margin:6px 0 4px}
.ls-sub{color:var(--ink-2);font-weight:700;margin:0 0 8px}
.ls-st{font-size:15px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);margin:22px 0 8px}
.ls-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ls-row{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:18px;background:var(--card);box-shadow:var(--shadow-s);text-decoration:none;color:var(--ink)}
.ls-row.now{box-shadow:inset 0 0 0 3px var(--violet-500),var(--shadow-s)}
.ls-row.lock{opacity:.5;box-shadow:none;background:transparent;border:1.5px dashed var(--line)}
.ls-n{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:var(--lav-100);color:var(--violet-700)}
.ls-row.done .ls-n{background:var(--success-500);color:#fff}
.ls-row.done .ls-n .i{width:20px;height:20px}
.ls-row.now .ls-n{background:var(--violet-600);color:#fff}
.ls-t{flex:1;min-width:0;display:flex;flex-direction:column}
.ls-t small{color:var(--ink-3);font-weight:700}
.ls-row em{font-style:normal;font-weight:800;font-size:13px;color:#fff;background:var(--violet-600);padding:4px 10px;border-radius:99px}
.ls-again{font-size:13px;font-weight:800;color:var(--ink-3)}
.lsn .td-go{margin-top:22px;position:sticky;bottom:12px}
.msheet{position:fixed;inset:0;z-index:90;background:rgb(15 18 38/.42);display:flex;justify-content:flex-end}
.ms-box{width:min(380px,100%);height:100%;overflow-y:auto;background:var(--paper);padding:18px 16px calc(18px + env(safe-area-inset-bottom));box-shadow:var(--shadow-l);animation:msIn .22s var(--ease)}
@keyframes msIn{from{transform:translateX(30px);opacity:0}}
.ms-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.ms-head .avatar{width:46px;height:46px;flex:none}
.ms-head div{flex:1;min-width:0;display:flex;flex-direction:column}
.ms-head small{color:var(--ink-3);font-weight:700}
.ms-list{display:flex;flex-direction:column;gap:6px}
.ms-list a,.ms-list button{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:16px;background:var(--card);border:0;font:inherit;text-align:left;color:var(--ink);text-decoration:none;cursor:pointer}
.ms-list a[aria-current]{box-shadow:inset 0 0 0 2px var(--violet-500)}
.ms-list .i{width:22px;height:22px;flex:none;color:var(--violet-600)}
.ms-list span{display:flex;flex-direction:column}
.ms-list small{color:var(--ink-3);font-weight:700}
.ms-list button[data-out]{margin-top:10px}
html.simple .ptop .steps{flex:1;display:flex;align-items:center}
.sbar{flex:1;height:12px;border-radius:99px;background:var(--lav-100);overflow:hidden}
.sbar i{display:block;height:100%;background:var(--success-500);border-radius:inherit;transition:width .4s var(--ease)}
html.simple .ptop .combo,html.simple .ptop .stat.xp,html.simple .ptop [data-sound]{display:none!important}
html.simple .qdots{display:none!important}
html.simple .pbar [data-all],html.simple .pbar [data-skip]{display:none!important}
html.simple .lp-grid,html.simple .lp .li-note{display:none!important}
html.simple .summary .lvlcard,html.simple .ns-more>a:not(.ns-extra){display:none!important}
html.simple .mebtn .i{display:none}
html.simple .pbar{background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;pointer-events:none}
html.simple .pbar .in{justify-content:flex-end}
html.simple .pbar .in>*{pointer-events:auto}
html.simple .pbar .spacer{display:none}
html.simple .pbar .btn.hint.small{flex:0 0 auto;flex-direction:row;height:44px;min-width:0;padding:0 16px;border-radius:99px;font-size:14px;gap:8px;box-shadow:inset 0 0 0 1px #f1d27f,var(--shadow-s)}
html.simple .pbar .btn.hint.small svg{width:18px;height:18px}
html.simple .pbar [data-next]{flex:1;height:58px;font-size:18px;justify-content:center;box-shadow:var(--shadow-m)}
html.simple .summary .next-step{margin:14px 0 6px}
.sum-rv{display:flex;align-items:center;gap:10px;justify-content:center;color:var(--ink-2);font-weight:700;margin:6px 0}
.sum-rv .i{width:20px;height:20px;color:var(--violet-600);flex:none}
html.dark .sm-logo img{background:#fff;border-radius:12px;padding:3px 8px;box-sizing:content-box;height:32px}
html.dark .td-body small,html.dark .ls-st{color:#b9a6ff}

/* patch62: Droga — mapa lekcji na starcie */
.droga{max-width:760px;margin:0 auto;padding-bottom:24px}
.dr-head h1{margin:0}
.dr-head p{color:var(--ink-2);font-weight:700;margin:6px 0 14px;line-height:1.45}
.droga .dr-ch{margin-top:18px;min-height:132px}
.droga .dr-ch .eyebrow{color:rgb(255 255 255/.72)}
.droga .dr-ch small{margin-top:8px;font-weight:700;opacity:.85}
.droga .map{margin-top:6px}
.node.lock button{filter:grayscale(1);opacity:.5;box-shadow:0 6px 0 var(--lav-200)!important;cursor:not-allowed}
.node.lock button:hover{transform:none}
.node.lock .lbl{opacity:.6}
.node.lock .node-n{font-size:13px}
.node.cur .lbl{color:var(--violet-700);box-shadow:0 0 0 2.5px var(--violet-500),0 4px 12px -8px rgb(21 26 61/.35)}
.node.fresh button{animation:drPop 1s var(--spring) both,pulse 2.2s 1.1s ease-in-out infinite}
@keyframes drPop{0%{transform:scale(.4);filter:grayscale(1)}60%{transform:scale(1.18)}100%{transform:none;filter:none}}
.node.shake button{animation:drShake .4s}
@keyframes drShake{25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}
.dr-bar{position:sticky;bottom:14px;z-index:6;display:flex;justify-content:center;margin-top:8px;pointer-events:none}
.dr-go{pointer-events:auto;width:min(100%,520px);min-height:66px;border-radius:20px;display:flex;align-items:center;justify-content:center;gap:12px;padding:10px 20px;box-shadow:0 16px 30px -12px rgb(91 33 182/.6)}
.dr-go .i{width:26px;height:26px;flex:none}
.dr-go span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15;min-width:0}
.dr-go b{font-size:19px}
.dr-go small{font-weight:700;opacity:.88;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
html.calm .node.fresh button{animation:none}
@media (prefers-reduced-motion:reduce){.node.fresh button,.node.shake button{animation:none}}
html.simple .summary .sum-cover,html.simple .cburst{display:none}
html.simple .summary .next-step{margin:18px 0 14px}
html.simple .rv2-modes,html.simple .rv2-grid,html.simple .rv2-links{display:none}
html.simple .rv2-go{margin-top:6px}

/* patch65: minutnik / stoper (matura) */
.tmr-go{margin:4px 0 10px;background:var(--ink);color:#fff;border-color:var(--ink)}
:where(html.dark) .tmr-go{background:var(--violet-600);border-color:var(--violet-600)}
.tmr{position:fixed;top:calc(14px + env(safe-area-inset-top));right:16px;z-index:60;display:flex;align-items:center;gap:8px;padding:8px 16px;border-radius:99px;background:var(--ink);color:#fff;font-weight:800;border:0;box-shadow:0 12px 26px -10px rgb(21 26 61/.6);cursor:pointer}
.tmr b{font-variant-numeric:tabular-nums;font-size:18px;min-width:3.2em;text-align:center}
.tmr small{opacity:.7;font-size:12px;font-weight:700}
.tmr.low{background:#d9443b}

/* ═════════ patch67: wygląd 2.0 — logowanie ═════════
   Wcześniej reguła html.simple .page{max-width:760px} ściskała logowanie na komputerze do wąskiego paska.
   Komputer/tablet poziomo: jedna karta (zdjęcie | formularz) na miękkim tle; tablet pionowo: karta ze zdjęciem u góry; telefon: biały arkusz nachodzący na zdjęcie. */
body.auth .page,html.simple body.auth .page{max-width:none!important;margin:0!important;padding:0!important}
body.auth{background:radial-gradient(1100px 620px at 8% -12%,#ece3ff 0,rgb(236 227 255/0) 62%),radial-gradient(900px 560px at 108% 112%,#e2ebff 0,rgb(226 235 255/0) 62%),var(--paper)!important;min-height:100vh}
body.auth .authwrap{background:#fff}
.auth-tabs{display:grid!important;grid-template-columns:1fr 1fr;width:100%;align-self:stretch!important;background:var(--lav-100);border:0!important;padding:5px!important;margin-bottom:20px!important}
.auth-tabs button{padding:11px 10px!important;font-size:16px;transition:background .2s,color .2s}
.auth-tabs button[aria-pressed="true"]{box-shadow:0 6px 16px -8px rgb(91 33 182/.6)}
.auth-card h2{font-size:clamp(26px,3vw,32px)!important;margin:0 0 16px!important;letter-spacing:-.01em}
.auth-form input:not([type=checkbox]),.auth-form select{border-width:2px!important;background:#fbfaff!important;transition:border-color .15s,box-shadow .15s,background .15s}
.auth-form input:focus,.auth-form select:focus{background:#fff!important}
.auth-links{gap:4px 22px!important;margin-top:16px!important}
.auth-links button{text-decoration:none!important;font-weight:700!important;font-size:15px}
.auth-links button:hover{text-decoration:underline!important}
.auth-foot{display:flex;flex-wrap:wrap;gap:6px 20px;margin:18px 0 0;font-size:14px}
.auth-foot a{color:var(--ink-3);font-weight:700;text-decoration:none}
.auth-foot a:hover{color:var(--violet-700);text-decoration:underline}
.auth-app{margin-top:18px!important}
@media (min-width:900px){
  body.auth .authwrap{max-width:1160px;width:calc(100% - 64px);min-height:min(780px,calc(100vh - 64px));margin:32px auto!important;border-radius:32px;overflow:hidden;box-shadow:0 40px 80px -40px rgb(40 24 110/.45),0 0 0 1px rgb(91 33 182/.06);grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)!important}
  body.auth .auth-card{max-width:520px;padding:44px clamp(28px,4vw,56px)!important}
  body.auth .auth-copy{padding:0 clamp(28px,4vw,52px) 40px!important}
  body.auth .auth-copy h1{font-size:clamp(34px,3.4vw,46px)!important}
}
@media (min-width:600px) and (max-width:899px){
  body.auth .authwrap{display:block!important;max-width:620px;margin:28px auto!important;border-radius:30px;overflow:hidden;box-shadow:0 36px 70px -40px rgb(40 24 110/.45)}
  body.auth .auth-intro{aspect-ratio:16/9!important;min-height:0!important}
  body.auth .auth-photo{aspect-ratio:auto!important;height:100%!important;object-position:0 18%!important}
  body.auth .auth-card{padding:28px 36px 36px!important;max-width:none}
}
@media (max-width:599px){
  body.auth .authwrap{display:block!important}
  body.auth .auth-card{position:relative;z-index:2;margin-top:-26px;border-radius:26px 26px 0 0;background:#fff;padding:24px 18px 36px!important}
}
:where(html.dark) body.auth{background:var(--paper)!important}
:where(html.dark) body.auth .authwrap,:where(html.dark) body.auth .auth-card{background:var(--card)}
:where(html.dark) .auth-tabs{background:rgb(255 255 255/.06)!important}
:where(html.dark) .auth-form input:not([type=checkbox]),:where(html.dark) .auth-form select{background:rgb(255 255 255/.04)!important}
@media (min-width:600px) and (max-width:899px){body.auth .auth-photo{object-position:50% 0!important}}
@media (max-width:599px){body.auth .auth-copy{padding-bottom:40px!important}}
body.auth{background-attachment:fixed!important}
.auth-form .check a{color:var(--violet-700);font-weight:800}
:where(html.dark) .auth-form .check a{color:#c9b8ff}

/* ═════════ patch68: start 2.0 ═════════ */
html.simple body:not(.auth):not(.focus){background:radial-gradient(1000px 520px at 50% -260px,#ece4ff 0,rgb(236 228 255/0) 70%) fixed,var(--paper)}
:where(html.dark) html.simple body:not(.auth):not(.focus),html.dark.simple body:not(.auth):not(.focus){background:var(--paper)}
.dr-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:8px 0 6px}
.dr-hi{min-width:0}
.dr-head h1{font-size:clamp(26px,4.4vw,34px)!important;line-height:1.12}
.dr-head p{margin:4px 0 0!important;font-size:16px!important;color:var(--ink-3)!important;font-weight:700}
.dr-ring{position:relative;width:66px;height:66px;flex:none;display:grid;place-items:center}
.dr-ring svg{position:absolute;inset:0;width:100%;height:100%}
.dr-ring b{position:relative;font-size:15px;font-weight:900;color:var(--violet-700)}
.dr-ch2{display:flex;align-items:center;gap:14px;padding:14px 16px;margin:24px 0 2px;background:#fff;border-radius:22px;box-shadow:0 12px 30px -20px rgb(40 24 110/.4),0 0 0 1px rgb(91 33 182/.07)}
.dr-chn{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;flex:none;background:linear-gradient(135deg,var(--violet-500),#5b6cff);color:#fff;font:900 21px/1 var(--display);box-shadow:0 8px 16px -10px rgb(91 33 182/.8)}
.dr-ch2.done .dr-chn{background:linear-gradient(135deg,#2fbf71,#16a34a);box-shadow:0 8px 16px -10px rgb(22 163 74/.8)}
.dr-chn .i{width:22px;height:22px}
.dr-cht{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.dr-cht small{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.dr-cht b{font:800 clamp(17px,2.4vw,20px)/1.2 var(--display);color:var(--ink)}
.dr-chbar{display:block;height:6px;border-radius:9px;background:var(--lav-100);overflow:hidden;margin-top:6px}
.dr-chbar i{display:block;height:100%;min-width:6px;border-radius:9px;background:linear-gradient(90deg,var(--violet-500),#5b6cff)}
.dr-ch2.done .dr-chbar i{background:#2fbf71}
.dr-chart{display:flex;flex:none;padding-left:4px}
.dr-chart i{width:42px;height:42px;border-radius:50%;overflow:hidden;border:3px solid #fff;margin-left:-15px;background:linear-gradient(145deg,var(--b1),var(--b2));box-shadow:0 4px 10px -6px rgb(0 0 0/.35);filter:grayscale(.65) brightness(1.06)}
.dr-chart i.on{filter:none}
.dr-chart i:first-child{margin-left:0}
.dr-chart img,.dr-chart svg,.dr-chart .topic-art{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:420px){.dr-chart{display:none}}
.droga .map{max-width:600px}
.droga .map .trail .base{stroke:var(--lav-200)!important;stroke-width:12!important;stroke-dasharray:none!important;stroke-linecap:round}
.droga .map .trail .prog{stroke-width:12!important}
.droga .node .lbl{font-size:13.5px;box-shadow:0 6px 16px -10px rgb(21 26 61/.4)}
@media (min-width:700px){.droga .node{width:190px}.droga .node button{width:106px!important;height:106px!important}.droga .node .node-art:not(.a3){width:86px;height:60px}.droga .node .lbl{font-size:14.5px;max-width:180px}}
.dr-bar{margin:0 -20px!important;padding:16px 20px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--paper) 58%,transparent);bottom:0!important}
@media (max-width:760px){.dr-bar{margin:0 -16px!important;padding-left:16px;padding-right:16px}}
.dr-go{max-width:480px;margin:0 auto}
:where(html.dark) .dr-ch2{background:var(--card)}
:where(html.dark) .dr-chart i{border-color:var(--card)}

/* ═════════ patch69: zadanie 2.0 ═════════ */
html.simple .qhead:has(.qnum:empty){display:none}
html.simple #shead{gap:14px}
html.simple #shead .stype{width:44px;height:44px;border-radius:14px;box-shadow:0 8px 18px -10px rgb(21 26 61/.5)}
html.simple #shead .stype .i{width:22px;height:22px}
html.simple #shead .eyebrow{font-size:12px;letter-spacing:.08em}
html.simple #shead h2{font-size:clamp(21px,2.7vw,28px)!important;line-height:1.18;margin:2px 0 6px}
html.simple #shead p{font-size:16.5px;line-height:1.5;color:var(--ink-2)}
html.simple #shead .listen{min-height:38px!important;padding:5px 14px 5px 5px;font-size:15px}
html.simple #shead .listen .ic,html.simple #shead .listen>span:first-child{transform:scale(.9)}
html.simple .shead-cover{border-radius:18px;overflow:hidden}
html.simple .qcard{border-radius:24px;box-shadow:0 14px 34px -24px rgb(40 24 110/.45),0 0 0 1px rgb(91 33 182/.06)}
html.simple details.ctx{border-radius:20px;box-shadow:0 10px 26px -22px rgb(40 24 110/.4),0 0 0 1px rgb(91 33 182/.06)}
@media (max-width:600px){html.simple #shead>.stype{display:none}html.simple #shead p{font-size:16px}}
/* patch69b: menu — miękkie podświetlenie bieżącej pozycji, ikony w kafelkach */
.ms-list a[aria-current]{box-shadow:none!important;background:var(--lav-100)!important}
.ms-list a:focus,.ms-list button:focus{outline:none}
.ms-list a:focus-visible,.ms-list button:focus-visible{outline:3px solid var(--violet-500);outline-offset:2px}
.ms-list a>.i,.ms-list button>.i{width:40px!important;height:40px!important;padding:9px;border-radius:13px;background:var(--lav-100);box-sizing:border-box}
.ms-list a[aria-current]>.i{background:#fff}
.ms-list a:hover,.ms-list button:hover{background:var(--lav-100)}
:where(html.dark) .ms-list a[aria-current]{background:rgb(255 255 255/.08)!important}
:where(html.dark) .ms-list a>.i,:where(html.dark) .ms-list button>.i{background:rgb(255 255 255/.06)}
:where(html.dark) .dr-ring b{color:#c9b8ff}
:where(html.dark) .droga .node.cur .lbl{color:#d9ccff}
:where(html.dark) .dr-cht b{color:#f1edff}

/* ═════════ patch70: strona lekcji i odznaki ═════════ */
/* strona lekcji na tablecie w pionie: zdjęcie nad tekstem, karta na środku ekranu (wcześniej 2/3 ekranu puste) */
@media (min-width:600px) and (max-width:1023px) and (orientation:portrait){
  html.simple .lesson-bg>.lp{min-height:calc(100vh - 20px);justify-content:center;max-width:680px}
  html.simple .lp-hero{grid-template-columns:1fr}
  html.simple .lp-cover{min-height:0;aspect-ratio:16/9}
  html.simple .lp-head{padding:28px 34px 34px;gap:14px}
  html.simple .lp-head .lp-cta{width:100%;justify-content:center;min-height:60px;font-size:19px}
}
html.simple .lp-head .lp-cta{box-shadow:0 14px 28px -14px rgb(91 33 182/.6)}
/* odznaki: zamiast prawie czarnego bloku — żywy fiolet, jak przyciski platformy */
html.simple .bd2-hero{background:radial-gradient(120% 160% at 0 0,#8b5cf6 0,#6d4aff 38%,#4f46e5 100%)!important;box-shadow:0 24px 48px -28px rgb(79 70 229/.7)}
html.simple .bd2-stats>*{background:rgb(255 255 255/.15);border-color:rgb(255 255 255/.24)}

/* ═════════ patch71: nagrody ═════════ */
.dr-chips{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 2px}
.dr-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 13px 7px 10px;border-radius:99px;background:#fff;color:var(--ink-2);font-weight:700;font-size:14px;text-decoration:none;box-shadow:0 6px 16px -12px rgb(40 24 110/.5),0 0 0 1px rgb(91 33 182/.08);transition:transform .15s}
.dr-chip:hover{transform:translateY(-1px)}
.dr-chip b{color:var(--ink);font-weight:900;font-size:15px}
.dr-chip span{font-size:16px;line-height:1}
.dr-chip.fire.on{background:linear-gradient(135deg,#fff4e0,#ffe2c2);box-shadow:0 6px 16px -10px rgb(234 120 30/.55),0 0 0 1px rgb(234 120 30/.25)}
.dr-chip.fire:not(.on) span{filter:grayscale(1);opacity:.6}
:where(html.dark) .dr-chip{background:var(--card);color:#c7c3e6}
:where(html.dark) .dr-chip b{color:#fff}
:where(html.dark) .dr-chip.fire.on{background:rgb(234 120 30/.18)}
.bd2-cat{margin-top:26px}
.bd2-cat h2{display:flex;align-items:center;gap:10px;font-size:clamp(18px,2.4vw,21px);margin:0 0 12px}
.bd2-cat h2 .i{width:34px;height:34px;padding:7px;border-radius:11px;background:var(--lav-100);color:var(--violet-600);box-sizing:border-box}
.bd2-cat h2 em{margin-left:auto;font-style:normal;font-size:14px;font-weight:800;color:var(--ink-3);background:#fff;padding:4px 10px;border-radius:99px;box-shadow:0 0 0 1px var(--line)}
.bd2-b.t-diamond.on{background:linear-gradient(160deg,#f3f0ff,#e7f1ff);box-shadow:0 0 0 2px rgb(109 74 255/.35),0 14px 30px -20px rgb(109 74 255/.6)}
.bpop .box{text-align:center;max-width:420px}
.bpop-m{display:flex;justify-content:center;gap:4px;margin-bottom:6px}
.bpop-m span{display:inline-block;animation:bpopIn .7s var(--spring) both;animation-delay:var(--d)}
@keyframes bpopIn{0%{transform:scale(.3) rotate(-25deg);opacity:0}70%{transform:scale(1.12) rotate(4deg);opacity:1}100%{transform:none}}
.bpop h3{margin:6px 0 4px;font-size:22px}
.bpop h3 small{display:block;font-size:14px;color:var(--ink-3);margin-top:4px}
.bpop p{margin:0;color:var(--ink-2);font-weight:700}
.bpop-act{display:flex;gap:10px;margin-top:20px}
.bpop-act .btn{flex:1;justify-content:center}
@media (prefers-reduced-motion:reduce){.bpop-m span{animation:none}}
.sum-near{display:flex;align-items:center;gap:14px;margin:14px 0 4px;padding:12px 16px;border-radius:20px;background:#fff;text-decoration:none;color:var(--ink);box-shadow:0 10px 26px -20px rgb(40 24 110/.45),0 0 0 1px rgb(91 33 182/.07);text-align:left}
.sum-near-m{flex:none}
.sum-near-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.sum-near-t small{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-500)}
.sum-near-t b{font-size:17px}
.sum-near-t em{font-style:normal;font-size:13px;font-weight:700;color:var(--ink-3)}
.sum-near>.i{width:20px;height:20px;color:var(--violet-600);flex:none}
:where(html.dark) .sum-near{background:var(--card)}
.sum-more{justify-content:center;align-items:center;text-align:center}
.sum-more b{font-size:30px;color:var(--violet-600)}
.bpop-act .btn{white-space:nowrap;font-size:16px;padding-left:12px;padding-right:12px}

.fc-left{margin:6px 0 0;color:var(--ink-2);font-weight:700}
.fc-left b{color:var(--violet-700)}

/* ═════════ patch73: menu 2.0 ═════════ */
.ms-card{background:linear-gradient(140deg,#8b5cf6,#6d4aff 45%,#4f46e5);color:#fff;border-radius:24px;padding:14px 14px 14px;margin-bottom:10px;box-shadow:0 18px 36px -22px rgb(79 70 229/.8)}
.ms-card .ms-head{margin:0 0 12px}
.ms-card .ms-head b{color:#fff}
.ms-card .ms-head small{color:rgb(255 255 255/.8)}
.ms-card .kp-x{background:rgb(255 255 255/.16);color:#fff}
.ms-lv{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 10px;font-weight:800}
.ms-lv small{font-weight:700;opacity:.8;font-size:13px}
.ms-lv i{flex-basis:100%;height:8px;border-radius:9px;background:rgb(255 255 255/.22);overflow:hidden;margin-top:6px}
.ms-lv i b{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,#ffe08a,#f4c542)}
.ms-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.ms-chips a{display:flex;flex-direction:column;align-items:center;gap:0;padding:8px 4px;border-radius:16px;background:rgb(255 255 255/.14);color:#fff;text-decoration:none;line-height:1.15}
.ms-chips a span{font-size:18px}
.ms-chips a b{font-size:18px;font-weight:900}
.ms-chips a small{font-size:12px;opacity:.85;font-weight:700}
.ms-chips a.fire{background:rgb(255 170 80/.3)}
.ms-g{margin:12px 6px 4px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.ms-list a .ms-n{margin-left:auto;font-style:normal;min-width:26px;height:26px;padding:0 8px;border-radius:99px;background:#ef6b5b;color:#fff;font-weight:900;font-size:13px;display:grid;place-items:center;box-sizing:border-box}
.ms-list a>span{flex:1;min-width:0}
:where(html.dark) .ms-card{background:linear-gradient(140deg,#5b3fc4,#4338ca)}
/* patch74: plakietki na starcie w jednym rzędzie na telefonie */
@media (max-width:600px){.dr-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.dr-chip{flex-direction:column;gap:0;padding:7px 4px;border-radius:16px;font-size:12px;text-align:center;line-height:1.2}.dr-chip span{font-size:17px}.dr-chip b{font-size:16px}}

/* patch75: większe głośniczki w dialogach i czytelniejszy drobny tekst na telefonie */
.say.mini{min-width:36px;min-height:36px}
@media (max-width:600px){
  .qcard table th,.qcard .tbl th,#ctx table th{font-size:14px!important}
  .bub .spk{font-size:13px!important}
  .qcard small,.qcard .note,#ctx small{font-size:max(13px,1em)}
}
.th-more{min-height:38px;padding:8px 16px!important}
@media (max-width:600px){.wc-lab,.note-proto,.bankrow>small{font-size:13px!important}}
/* patch76: drobne etykiety 13 px wszędzie (ramka słów, imiona w dialogach, dopiski) */
.bankrow>small,.note-proto,.wc-lab{font-size:13px!important}
.bub .spk b,.bub .spk{font-size:13px!important}
.wf>span{font-size:13px!important}
.sb-type{min-height:38px;padding:8px 14px!important}
[data-undo]{min-height:38px}
.gapno{font-size:12px!important}

/* ═════════ patch79: Liga 3.0 — globalny + klasy, podium w złocie, srebrze i miedzi ═════════ */
.lg3{display:flex;flex-direction:column;gap:18px;max-width:1180px;margin:0 auto;width:100%;container-type:inline-size}
.lg3 h1{font-size:clamp(28px,3.6vw,40px);color:var(--ink)}
.lg3-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:26px 30px;border-radius:32px;background:radial-gradient(90% 150% at 100% 0,#fff0c0 0,#fff8e6 30%,#fff 62%);border:1px solid var(--line);box-shadow:0 24px 50px -30px rgb(224 169 27/.55),var(--shadow-s)}
.lg3-ht{display:flex;flex-direction:column;gap:6px;max-width:60ch;min-width:0}
.lg3-ht p{margin:0;color:var(--ink-2);font-weight:700}
.lg3-mine{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.lg3-mine:empty{display:none}
.lg3-mine span{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:99px;background:rgb(255 255 255/.85);border:1px solid var(--line);font-weight:700;font-size:13.5px;color:var(--ink-2);box-shadow:var(--shadow-s)}
.lg3-mine b{color:var(--ink);font-weight:900}
.lg3-mine svg.i{width:16px;height:16px;color:var(--gold-500)}
.lg3-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:5px;border-radius:99px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-s)}
.lg3-tabs button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:99px;font-weight:900;font-size:15px;color:var(--ink-2);transition:background var(--dur),color var(--dur)}
.lg3-tabs button svg.i{width:18px;height:18px}
.lg3-tabs button[aria-selected=true]{background:linear-gradient(135deg,var(--navy-800),var(--navy-950));color:#fff;box-shadow:0 8px 18px -8px rgb(21 26 61/.6)}
.lg3-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start}
@container (min-width:860px){.lg3-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}.lg3-tabs{display:none}}
@container (max-width:859.98px){.lg3-grid[data-tabv=all] [data-b=cls],.lg3-grid[data-tabv=cls] [data-b=all]{display:none}}
.lg3-board{display:flex;flex-direction:column;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:30px;box-shadow:var(--shadow-m);overflow:hidden}
.lg3-bh{display:flex;align-items:center;justify-content:space-between;gap:10px 14px;flex-wrap:wrap;padding:18px 20px 14px}
.lg3-bh h2{font-size:23px;color:var(--ink)}
.lg3-count{padding:6px 12px;border-radius:99px;background:var(--paper);font-weight:800;font-size:13px;color:var(--ink-2)}
.lg3-chips{display:flex;align-items:center;gap:3px;padding:4px;border-radius:99px;background:var(--paper);border:1px solid var(--line)}
.lg3-chl{font-size:12.5px;font-weight:800;color:var(--ink-3);padding:0 4px 0 8px}
.lg3-chips button{min-width:38px;height:36px;border-radius:99px;font-weight:900;font-size:15px;color:var(--ink-2);transition:background var(--dur),color var(--dur)}
.lg3-chips button:hover{background:var(--lav-100)}
.lg3-chips button[aria-pressed=true]{background:linear-gradient(135deg,var(--violet-500),var(--violet-700));color:#fff;box-shadow:0 6px 14px -6px rgb(90 47 194/.7)}
.lg3-body{display:flex;flex-direction:column;padding-bottom:12px;min-height:120px}
/* scena z reflektorami */
.lg3-stage{position:relative;margin:0 12px;padding:30px 14px 0;border-radius:24px;overflow:hidden;isolation:isolate;
  background:radial-gradient(55% 75% at 50% 0,rgb(255 214 102/.38),transparent 72%),radial-gradient(45% 70% at 8% 0,rgb(167 139 250/.42),transparent 72%),radial-gradient(45% 70% at 92% 0,rgb(96 165 250/.36),transparent 72%),linear-gradient(180deg,#161a44 0,#251d63 62%,#3b2a8c 100%);
  box-shadow:inset 0 1px 0 rgb(255 255 255/.12),inset 0 -30px 40px -20px rgb(0 0 0/.35)}
.lg3-stage::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:conic-gradient(from 180deg at 50% -6%,transparent 0 158deg,rgb(255 244 200/.13) 166deg,transparent 176deg,rgb(255 244 200/.13) 184deg,transparent 194deg,rgb(255 244 200/.1) 200deg,transparent 210deg 360deg)}
.lg3-stage::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;animation:lg3Tw 3.4s ease-in-out infinite;
  background:radial-gradient(1.6px 1.6px at 12% 22%,#fff,transparent),radial-gradient(1.4px 1.4px at 26% 58%,#fff,transparent),radial-gradient(2px 2px at 78% 18%,#fff,transparent),radial-gradient(1.4px 1.4px at 88% 52%,#fff,transparent),radial-gradient(1.8px 1.8px at 64% 34%,#ffe9a8,transparent),radial-gradient(1.4px 1.4px at 40% 12%,#fff,transparent),radial-gradient(1.6px 1.6px at 6% 70%,#ffe9a8,transparent),radial-gradient(1.4px 1.4px at 95% 80%,#fff,transparent)}
.lg3-stage.quiet{padding:30px 22px}
.lg3-wait{margin:0;text-align:center;color:#fff;font-weight:800;line-height:1.5}
.lg3-wait span{display:block;font-size:30px;color:var(--gold-300);margin-bottom:6px}
.lg3-pod{display:grid;grid-template-columns:1fr 1.18fr 1fr;align-items:end;gap:8px;max-width:460px;margin:0 auto}
.lg3-pod .m1{grid-column:2;grid-row:1}.lg3-pod .m2{grid-column:1;grid-row:1}.lg3-pod .m3{grid-column:3;grid-row:1}
.lg3-m{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;min-width:0;color:#fff}
.lg3-m.m1{--metal:linear-gradient(135deg,#fff8d6 0%,#ffd84d 20%,#e5a50f 44%,#fff0a3 58%,#d18e0b 80%,#ffe27a 100%);--glow:rgb(255 196 40/.8);--engr:#7a4f00}
.lg3-m.m2{--metal:linear-gradient(135deg,#ffffff 0%,#e3e8f0 20%,#a3adc0 44%,#f7f9fc 58%,#8d99ae 80%,#dfe5ee 100%);--glow:rgb(196 212 240/.65);--engr:#465165}
.lg3-m.m3{--metal:linear-gradient(135deg,#ffe6cc 0%,#f2a96a 20%,#b85f28 44%,#ffd0a1 58%,#96461a 80%,#eea36a 100%);--glow:rgb(244 140 70/.65);--engr:#5a2708}
.lg3-av{position:relative;display:grid;place-items:center;padding:4px;margin-bottom:8px;border-radius:50%;background:var(--metal);animation:lg3Glow 3s ease-in-out infinite}
.lg3-m.m2 .lg3-av{animation-delay:-1s}.lg3-m.m3 .lg3-av{animation-delay:-2s}
.lg3-av .avatar{width:58px;height:58px;font-size:20px;box-shadow:inset 0 0 0 2px rgb(255 255 255/.35)}
.lg3-m.m1 .lg3-av{padding:5px}
.lg3-m.m1 .lg3-av .avatar{width:78px;height:78px;font-size:26px}
.lg3-crown{position:relative;z-index:1;width:46px;height:31px;margin-bottom:-7px;filter:drop-shadow(0 4px 10px rgb(255 190 30/.7));animation:lg3Bob 3s ease-in-out infinite}
.lg3-rays{position:absolute;top:-62px;left:50%;width:250px;height:250px;margin-left:-125px;z-index:-1;pointer-events:none;border-radius:50%;
  background:repeating-conic-gradient(from 0deg,rgb(255 222 120/.32) 0 7deg,transparent 7deg 20deg);
  -webkit-mask:radial-gradient(circle,#000 14%,transparent 64%);mask:radial-gradient(circle,#000 14%,transparent 64%);animation:lg3Spin 30s linear infinite}
.lg3-nm{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:900;color:#fff;text-shadow:0 1px 8px rgb(0 0 0/.35)}
.lg3-m.m1 .lg3-nm{font-size:16.5px}
.lg3-nm em,.lg3-list em{font-style:normal;font-size:11px;font-weight:900;padding:2px 7px;border-radius:99px;margin-left:5px;vertical-align:2px}
.lg3-nm em{background:#fff;color:var(--violet-700)}
.lg3-m>small{font-size:12px;font-weight:700;color:rgb(255 255 255/.72)}
.lg3-pts{margin-top:6px;padding:4px 12px;border-radius:99px;background:rgb(255 255 255/.12);border:1px solid rgb(255 255 255/.24);font-weight:900;font-size:15px;white-space:nowrap;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.lg3-pts small{font-size:11px;opacity:.8}
.lg3-m.m1 .lg3-pts{background:linear-gradient(135deg,rgb(255 216 77/.35),rgb(229 165 15/.25));border-color:rgb(255 216 77/.6);color:#fff6cf;box-shadow:0 0 18px -4px rgb(255 200 40/.7)}
.lg3-plinth{position:relative;width:100%;margin-top:12px;padding-top:10px;display:grid;place-items:start center;overflow:hidden;border-radius:16px 16px 0 0;background:var(--metal);transform-origin:bottom;animation:lg3Rise .7s var(--spring) both;
  box-shadow:inset 0 2px 0 rgb(255 255 255/.75),inset 0 -14px 26px rgb(0 0 0/.2),0 -12px 44px -10px var(--glow)}
.lg3-plinth>span{font-family:var(--display);font-size:40px;line-height:1;color:var(--engr);text-shadow:0 1px 0 rgb(255 255 255/.65),0 -1px 0 rgb(0 0 0/.18)}
.lg3-plinth::after{content:"";position:absolute;top:-10%;bottom:-10%;left:-70%;width:45%;background:linear-gradient(100deg,transparent,rgb(255 255 255/.8),transparent);transform:skewX(-18deg);animation:lg3Sheen 4.6s ease-in-out infinite}
.lg3-m.m1 .lg3-plinth{height:120px}.lg3-m.m2 .lg3-plinth{height:86px;animation-delay:.08s}.lg3-m.m3 .lg3-plinth{height:66px;animation-delay:.16s}
.lg3-m.m2 .lg3-plinth::after{animation-delay:1.3s}.lg3-m.m3 .lg3-plinth::after{animation-delay:2.4s}
/* lista */
.lg3-list{list-style:none;margin:0;padding:14px 14px 2px;display:flex;flex-direction:column;gap:6px}
.lg3-list li{display:grid;grid-template-columns:30px 40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px 16px 8px 8px;border-radius:18px;background:var(--paper);font-weight:800;animation:screenIn .4s var(--d) both}
.lg3-list .r{font-family:var(--display);font-size:17px;color:var(--ink-3);text-align:center}
.lg3-list .avatar{width:40px;height:40px;font-size:14px;box-shadow:none}
.lg3-list .nm{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:5px;min-width:0}
.lg3-list .nm b{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;color:var(--ink)}
.lg3-list .nm small{font-size:12.5px;font-weight:700;color:var(--ink-3)}
.lg3-list em{background:var(--violet-600);color:#fff}
.lg3-bar{display:block;flex-basis:100%;height:5px;border-radius:99px;background:var(--lav-200);overflow:hidden}
.lg3-bar>i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--violet-500),#5b8cff);animation:lg3Bar .9s var(--ease) both}
.lg3-list .pt{font-family:var(--display);font-size:18px;color:var(--ink);white-space:nowrap}
.lg3-list .pt small{font-family:var(--font);font-size:12px;color:var(--ink-3)}
.lg3-list li.you{background:var(--lav-100);box-shadow:inset 0 0 0 2px var(--violet-500)}
.lg3-list li.zero:not(.you){opacity:.6}
.lg3-list li.zero .lg3-bar{display:none}
.lg3-list li.lg3-gap{display:block;padding:0;background:none;text-align:center;color:var(--ink-3);line-height:1;font-size:18px;animation:none}
.lg3-more{align-self:center;margin:10px auto 6px}
.lg3-empty{padding:30px 20px;text-align:center;color:var(--ink-2);font-weight:700}
@keyframes lg3Sheen{0%,58%{left:-70%}88%,100%{left:135%}}
@keyframes lg3Spin{to{transform:rotate(360deg)}}
@keyframes lg3Glow{0%,100%{box-shadow:0 0 0 2px rgb(255 255 255/.28),0 0 20px -2px var(--glow)}50%{box-shadow:0 0 0 2px rgb(255 255 255/.5),0 0 40px 4px var(--glow)}}
@keyframes lg3Bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes lg3Tw{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes lg3Rise{from{transform:scaleY(.15);opacity:0}}
@keyframes lg3Bar{from{transform:translateX(-100%)}}
@container (max-width:520px){
  .lg3-bh{padding:16px 16px 12px}.lg3-bh h2{font-size:21px}
  .lg3-stage{margin:0 8px;padding:24px 8px 0;border-radius:20px}
  .lg3-pod{gap:6px}
  .lg3-av .avatar{width:48px;height:48px;font-size:17px}
  .lg3-m.m1 .lg3-av .avatar{width:64px;height:64px;font-size:22px}
  .lg3-nm{font-size:13.5px}.lg3-m.m1 .lg3-nm{font-size:14.5px}
  .lg3-pts{font-size:13.5px;padding:3px 9px}
  .lg3-m.m1 .lg3-plinth{height:100px}.lg3-m.m2 .lg3-plinth{height:74px}.lg3-m.m3 .lg3-plinth{height:58px}
  .lg3-plinth>span{font-size:32px}
  .lg3-rays{width:200px;height:200px;margin-left:-100px;top:-50px}
  .lg3-list{padding:12px 8px 2px}
  .lg3-list li{grid-template-columns:26px 36px minmax(0,1fr) auto;gap:10px;padding:8px 12px 8px 6px}
  .lg3-list .avatar{width:36px;height:36px;font-size:13px}
  .lg3-list .pt{font-size:16.5px}
}
@media (max-width:600px){.lg3-hero{padding:20px 18px;border-radius:26px}.lg3-period{width:100%}.lg3-period button{flex:1}}
@media (prefers-reduced-motion:reduce){.lg3 *,.lg3 *::before,.lg3 *::after{animation:none!important}}
:where(html.dark) .lg3-hero{background:radial-gradient(90% 150% at 100% 0,rgb(224 169 27/.18) 0,var(--card) 60%)}
:where(html.dark) .lg3-mine span{background:rgb(255 255 255/.06)}
:where(html.dark) .lg3-mine b,:where(html.dark) .lg3-list .nm b,:where(html.dark) .lg3-list .pt{color:var(--ink)}
:where(html.dark) .lg3-list li{background:rgb(255 255 255/.05)}
:where(html.dark) .lg3-list li.you{background:rgb(139 92 246/.2)}
:where(html.dark) .lg3-chips,:where(html.dark) .lg3-count{background:rgb(255 255 255/.05)}
:where(html.dark) .lg3-bar{background:rgb(255 255 255/.1)}
/* patch79b: w uproszczonym układzie strona rankingu jest szeroka — dwie kolumny obok siebie na komputerze */
html.simple .page:has(.lg3){max-width:1240px}
/* patch80: wolne miejsca na podium (mniej niż 3 osoby z punktami) i szerszy panel „Uczniowie” w uproszczonym układzie */
.lg3-m.free{--metal:linear-gradient(135deg,rgb(255 255 255/.22),rgb(255 255 255/.08));--glow:transparent;--engr:rgb(255 255 255/.55);opacity:.7}
.lg3-m.free .lg3-av{animation:none;box-shadow:0 0 0 2px rgb(255 255 255/.18)}
.lg3-m.free .avatar{background:rgb(255 255 255/.1);color:rgb(255 255 255/.75);border:2px dashed rgb(255 255 255/.4)}
.lg3-m.free .lg3-nm{font-weight:800;color:rgb(255 255 255/.85);text-shadow:none}
.lg3-m.free .lg3-plinth{box-shadow:inset 0 1px 0 rgb(255 255 255/.3);border:1px dashed rgb(255 255 255/.3);border-bottom:0}
.lg3-m.free .lg3-plinth::after{display:none}
.lg3-m.free .lg3-plinth>span{text-shadow:none}
html.simple .page:has(.teacher){max-width:1240px}
.t-row .t-cell small{display:block;line-height:1.35}
/* patch80b: „moje miejsca” — na komputerze pigułki, na telefonie trzy kafelki w jednym rzędzie */
.lg3-mine small{font-size:inherit;font-weight:700}
.lg3-mine small::after{content:":"}
@media (max-width:600px){
  .lg3-mine{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:6px}
  .lg3-mine span{flex-direction:column;align-items:flex-start;gap:2px;padding:9px 10px;border-radius:16px;min-width:0}
  .lg3-mine small{font-size:11.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .lg3-mine small::after{content:none}
  .lg3-mine b{font-family:var(--display);font-size:17px;white-space:nowrap}
  .lg3-mine svg.i{width:15px;height:15px}
}

/* ═════════ patch81: nagłówki-sceny (ilustracja gwasz po prawej, tytuł na spokojnym tle po lewej, falista krawędź) ═════════ */
.scn{position:relative!important;isolation:isolate;overflow:hidden;display:flex!important;flex-direction:column;align-items:flex-start;justify-content:center;gap:14px;min-height:310px;padding:34px 36px 52px!important;border:0!important;border-radius:34px 34px 0 0!important;background:var(--scn-bg)!important;box-shadow:none!important;margin-bottom:0!important}
.scn::before,.scn::after{display:none!important}
.scn-art{position:absolute;inset:0;z-index:-1;background:var(--scn-img) right center/cover no-repeat;-webkit-mask-image:linear-gradient(90deg,transparent 20%,#000 50%);mask-image:linear-gradient(90deg,transparent 20%,#000 50%);animation:scnIn 1.1s var(--ease) both}
.scn-wave{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:30px;fill:var(--paper);pointer-events:none}
.scn>:not(.scn-art):not(.scn-wave){position:relative;max-width:min(620px,55%)}
.scn h1,.scn h2{font-size:clamp(30px,3.8vw,44px)!important;line-height:1.05;letter-spacing:-.015em}
.scn p{font-weight:700;font-size:16px;max-width:46ch}
.scn .eyebrow{font-weight:900;letter-spacing:.14em}
.scn-light h1,.scn-light h2{color:var(--navy-900)!important;text-shadow:0 2px 0 rgb(255 255 255/.45)}
.scn-light p{color:#3b3f66!important}
.scn-light .eyebrow{color:#5a2fc2!important}
.scn-dark,.scn-dark h1,.scn-dark h2,.scn-dark p{color:#fff!important}
.scn-dark p,.scn-dark small{color:rgb(255 255 255/.82)!important}
.scn-dark .eyebrow{color:var(--gold-300)!important}
.scn-dark h1{text-shadow:0 3px 18px rgb(0 0 0/.35)}
@keyframes scnIn{from{opacity:0;transform:scale(1.04)}}
/* poszczególne sekcje */
.scn .rv2-deck,.scn .hero-art{display:none!important}
.scn.rv2-hero{grid-template-columns:none}
.scn .rv2-txt{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.scn .rv2-modes button{background:rgb(255 255 255/.75)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.scn.vc-head .pt-search{background:#fff;border-radius:99px;box-shadow:0 10px 24px -14px rgb(21 26 61/.4);width:min(420px,100%)}
.scn.vc-empty{align-items:flex-start;text-align:left}
.scn.vc-empty .big-emo{display:none}
.scn.bd2-hero .bd2-lv{gap:20px}
.scn.lg3-hero{align-items:flex-start}
.scn.lg3-hero .lg3-period{background:rgb(255 255 255/.12);border-color:rgb(255 255 255/.25)}
.scn.lg3-hero .lg3-period button{color:#fff}
.scn.lg3-hero .lg3-period button[aria-pressed=true]{background:linear-gradient(135deg,#ffd75e,#e09a12);color:var(--navy-900)}
.scn.exam-hero{margin-bottom:18px!important}
.pg2 .pg-hero{display:flex;flex-direction:column;gap:16px}
.pg-head p{margin:6px 0 0}
/* medaliony zamiast prostokątów */
.md-row{display:flex;flex-wrap:wrap;gap:10px}
.md{display:flex;align-items:center;gap:12px;padding:7px 18px 7px 7px;border-radius:99px;background:rgb(255 255 255/.8);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgb(255 255 255/.95);box-shadow:0 12px 26px -16px rgb(21 26 61/.55);text-decoration:none;color:var(--ink);font:inherit;text-align:left;cursor:default;transition:transform .35s var(--spring),box-shadow var(--dur)}
a.md,button.md{cursor:pointer}
a.md:hover,button.md:hover{transform:translateY(-3px) rotate(-1.2deg);box-shadow:0 18px 30px -16px rgb(21 26 61/.6)}
.md-ic{position:relative;flex:none;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(140deg,var(--md-a),var(--md-b));box-shadow:inset 0 2px 0 rgb(255 255 255/.5),inset 0 -7px 12px rgb(0 0 0/.16),0 7px 14px -6px var(--md-b)}
.md-ic svg.i{width:24px;height:24px;stroke-width:2.2;filter:drop-shadow(0 1px 1px rgb(0 0 0/.2))}
.md-t{display:flex;flex-direction:column;line-height:1.12;min-width:0}
.md-t b{font-family:var(--display);font-size:27px;color:var(--navy-900)}
.md-t b small{font-size:15px;color:var(--ink-3)}
.md-t>small,.md-t>span{font-size:12.5px;font-weight:800;color:#4a5078;opacity:1}
.md-v{--md-a:#a07bff;--md-b:#5a2fc2}.md-g{--md-a:#ffd75e;--md-b:#e0950f}.md-t2{--md-a:#56dccf;--md-b:#0f9488}.md-o{--md-a:#ffb26b;--md-b:#ec5a35}.md-p{--md-a:#d59bff;--md-b:#8b3fe0}
.md-v .md-ic::before{content:"";position:absolute;inset:-5px;border-radius:50%;background:conic-gradient(#ffc93a var(--p,0%),rgb(90 47 194/.16) 0);-webkit-mask:radial-gradient(closest-side,transparent calc(100% - 5px),#000 calc(100% - 4.5px));mask:radial-gradient(closest-side,transparent calc(100% - 5px),#000 calc(100% - 4.5px));z-index:-1}
.md-o .md-ic svg.i{animation:mdFlame 1.6s ease-in-out infinite;transform-origin:50% 90%}
.md-g .md-ic svg.i{animation:mdStar 4s ease-in-out infinite}
@keyframes mdFlame{0%,100%{transform:scale(1) rotate(-3deg)}50%{transform:scale(1.12) rotate(3deg)}}
@keyframes mdStar{0%,80%,100%{transform:rotate(0)}88%{transform:rotate(-18deg) scale(1.1)}94%{transform:rotate(14deg)}}
.scn-dark .md{background:rgb(255 255 255/.13);border-color:rgb(255 255 255/.24);color:#fff;box-shadow:0 14px 28px -18px rgb(0 0 0/.7)}
.scn-dark .md-t b{color:#fff}.scn-dark .md-t b small{color:rgb(255 255 255/.6)!important}.scn-dark .md-t>small,.scn-dark .md-t>span{color:rgb(255 255 255/.8)!important}
.scn .bd2-stats{flex-wrap:wrap}
.scn .bd2-stats>.md{flex-direction:row;align-items:center;min-width:0;padding:7px 18px 7px 7px;border-radius:99px}
/* liga: „moje miejsca” jako medaliony */
.scn .lg3-mine span{display:grid;grid-template-columns:auto 1fr;column-gap:11px;align-items:center;padding:6px 18px 6px 6px;border-radius:99px;background:rgb(255 255 255/.13);border:1px solid rgb(255 255 255/.24);color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.scn .lg3-mine svg.i{grid-row:1/3;width:44px;height:44px;padding:10px;border-radius:50%;color:#fff;background:linear-gradient(140deg,#ffd75e,#e0950f);box-shadow:inset 0 2px 0 rgb(255 255 255/.5),0 6px 12px -6px #e0950f}
.scn .lg3-mine span:nth-child(2) svg.i{background:linear-gradient(140deg,#a07bff,#5a2fc2);box-shadow:inset 0 2px 0 rgb(255 255 255/.5),0 6px 12px -6px #5a2fc2}
.scn .lg3-mine span:nth-child(3) svg.i{background:linear-gradient(140deg,#56dccf,#0f9488);box-shadow:inset 0 2px 0 rgb(255 255 255/.5),0 6px 12px -6px #0f9488}
.scn .lg3-mine small{font-size:12px!important;color:rgb(255 255 255/.75)!important}
.scn .lg3-mine small::after{content:none}
.scn .lg3-mine b{font-family:var(--display);font-size:21px;color:#fff;line-height:1.1}
/* tablet: obraz zajmuje mniej, tekst szerzej */
@media (max-width:900px){.scn>:not(.scn-art):not(.scn-wave){max-width:62%}.scn-art{-webkit-mask-image:linear-gradient(90deg,transparent 30%,#000 62%);mask-image:linear-gradient(90deg,transparent 30%,#000 62%)}}
/* telefon: ilustracja jako pas u góry, tekst pod nią na kolorze sceny */
@media (max-width:600px){
  .scn{min-height:0;padding:178px 18px 40px!important;border-radius:28px 28px 0 0!important;gap:12px}
  .scn-art{bottom:auto;height:210px;background-position:right center;-webkit-mask-image:linear-gradient(180deg,#000 58%,transparent 98%);mask-image:linear-gradient(180deg,#000 58%,transparent 98%)}
  .scn>:not(.scn-art):not(.scn-wave){max-width:100%}
  .scn h1,.scn h2{font-size:30px!important}
  .scn p{font-size:15px}
  .md-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .md{padding:6px 10px 6px 6px;gap:9px}
  .md-ic{width:42px;height:42px}.md-ic svg.i{width:20px;height:20px}
  .md-t b{font-size:22px}.md-t>small,.md-t>span{font-size:11.5px}
  .scn .lg3-mine{display:grid;grid-template-columns:1fr;gap:6px}
  .scn .lg3-mine span{grid-template-columns:auto 1fr;flex-direction:row}
  .scn .lg3-mine svg.i{width:38px;height:38px;padding:9px}
  .scn .bd2-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
}
@media (prefers-reduced-motion:reduce){.scn-art,.md-ic svg.i{animation:none!important}}
/* patch81b: ekrany z nagłówkiem-sceną są szersze na komputerze (tekst nie wchodzi na ilustrację); liga na telefonie: trzy kafelki w rzędzie */
html.simple .page:has(.scn){max-width:1180px}
@media (max-width:600px){
  .scn .lg3-mine{grid-template-columns:repeat(3,minmax(0,1fr))}
  .scn .lg3-mine span{grid-template-columns:1fr;row-gap:2px;padding:8px 9px;border-radius:18px;justify-items:start}
  .scn .lg3-mine svg.i{grid-row:auto;width:32px;height:32px;padding:7px;margin-bottom:3px}
  .scn .lg3-mine b{font-size:17px;white-space:nowrap}
}

/* ═════════ patch82: start o porze dnia, puste stany, dwie kolumny, miniatury w menu, ekran awansu ═════════ */
.scn.dr-head{margin:6px 0 12px!important;min-height:270px}
.scn.dr-head .dr-hi h1{font-size:clamp(30px,3.6vw,42px)!important}
.scn.dr-head .dr-hi p{margin-top:6px!important;font-size:16px!important}
.scn-light.dr-head .dr-hi p{color:#3b3f66!important}
.scn.dr-head .dr-ring{position:absolute!important;top:22px;right:24px;width:82px;height:82px;max-width:none!important;border-radius:50%;background:rgb(255 255 255/.9);box-shadow:0 10px 26px -12px rgb(21 26 61/.5);padding:8px}
.scn.dr-head .dr-ring svg{inset:8px;width:calc(100% - 16px);height:calc(100% - 16px)}
.dr-meds{margin-top:4px}
.md.off .md-ic{filter:grayscale(.85);opacity:.7}
.md.off .md-ic svg.i{animation:none}
.droga>.dr-head:not(.scn) .dr-meds{width:100%}
/* puste stany */
.pg-empty{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);align-items:center;gap:20px;padding:6px 0}
.pg-empty img{width:100%;aspect-ratio:900/560;object-fit:cover;border-radius:20px;-webkit-mask-image:radial-gradient(120% 120% at 50% 50%,#000 60%,transparent 100%);mask-image:radial-gradient(120% 120% at 50% 50%,#000 60%,transparent 100%)}
.pg-empty b{display:block;font-family:var(--display);font-size:21px;color:var(--ink);margin-bottom:4px}
.pg-empty p{margin:0 0 12px;color:var(--ink-2);font-weight:700;line-height:1.45}
@media (max-width:600px){.pg-empty{grid-template-columns:1fr;text-align:center;justify-items:center}.pg-empty img{max-width:280px}}
/* Mój postęp: dwie kolumny na komputerze */
@media (min-width:1000px){html.simple .pg2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}html.simple .pg2>.pg-hero{grid-column:1/-1}html.simple .pg2>.rv2-card{height:100%;margin:0}}
/* menu: miniatury scen */
.ms-th{position:relative;flex:none;width:52px;height:52px;border-radius:15px;background:var(--th) 82% center/auto 100% no-repeat,var(--lav-100);box-shadow:inset 0 0 0 1px rgb(21 26 61/.06),0 6px 14px -10px rgb(21 26 61/.5);font-style:normal}
.ms-list .ms-th .i{position:absolute;right:-6px;bottom:-6px;width:26px!important;height:26px!important;padding:5px;border-radius:9px;background:#fff;color:var(--violet-600);box-shadow:0 3px 8px -3px rgb(21 26 61/.35);box-sizing:border-box}
.ms-list a[aria-current] .ms-th{box-shadow:0 0 0 3px var(--violet-500)}
/* ekran awansu */
.lvup{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:16px;background:rgb(15 19 48/.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:lvIn .3s var(--ease) both}
.lvup.out{animation:lvOut .26s var(--ease) both}
.lvup-box{width:min(460px,100%);border-radius:30px;overflow:hidden;background:var(--card);box-shadow:0 40px 90px -30px rgb(0 0 0/.6);animation:lvPop .55s var(--spring) both}
.lvup-art{position:relative;aspect-ratio:3/2;background:var(--img) center/cover no-repeat,linear-gradient(180deg,#ffd9a0,#c9a8ff)}
.lvup-medal{position:absolute;left:50%;bottom:-46px;transform:translateX(-50%);filter:drop-shadow(0 12px 18px rgb(224 149 15/.55));animation:lvMedal .8s .2s var(--spring) both}
.lvup-txt{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:56px 26px 26px}
.lvup-txt .eyebrow{color:var(--gold-500);font-weight:900;letter-spacing:.16em}
.lvup-txt h2{font-size:30px;color:var(--ink)}
.lvup-txt p{margin:0 0 12px;color:var(--ink-2);font-weight:700}
.lvup-txt .btn{width:100%;justify-content:center}
@keyframes lvIn{from{opacity:0}}@keyframes lvOut{to{opacity:0}}
@keyframes lvPop{from{transform:translateY(30px) scale(.92);opacity:0}}
@keyframes lvMedal{from{transform:translateX(-50%) scale(.3) rotate(-30deg);opacity:0}}
@media (prefers-reduced-motion:reduce){.lvup,.lvup-box,.lvup-medal{animation:none!important}}
@media (max-width:600px){
  .scn.dr-head{min-height:0}
  .scn.dr-head .dr-ring{top:14px;right:14px;width:68px;height:68px;padding:6px}
  .scn.dr-head .dr-ring svg{inset:6px;width:calc(100% - 12px);height:calc(100% - 12px)}
  .dr-meds{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .dr-meds .md{flex-direction:column;align-items:flex-start;border-radius:18px;padding:8px 10px;gap:4px}
  .dr-meds .md-ic{width:34px;height:34px}.dr-meds .md-ic svg.i{width:17px;height:17px}
  .dr-meds .md-t b{font-size:20px}
}
/* patch82b: czytelność tekstu na scenach wieczornych i dziennych */
.scn-start-wieczor h1,.scn-start-wieczor p,.scn-start-wieczor .md-t b,.scn-start-wieczor .md-t>small{text-shadow:0 1px 2px rgb(60 20 80/.55),0 2px 14px rgb(60 20 80/.45)}
.scn-start-wieczor .md,.scn-start-noc .md{background:rgb(30 16 60/.28)}
.scn-start-dzien .md,.scn-start-rano .md{background:rgb(255 255 255/.86)}
/* patch82c: start na telefonie — niski nagłówek: tekst na niebie sceny (bez osobnego pasa z obrazem), żeby mapa nie chowała powitania; komputer: medaliony w jednym rzędzie */
.scn.dr-head .dr-meds{max-width:100%!important}
@media (max-width:600px){
  .scn.dr-head{padding:18px 16px 34px!important;gap:8px}
  .scn.dr-head .scn-art{inset:0;height:auto;background-position:42% bottom;background-size:cover;-webkit-mask-image:linear-gradient(180deg,transparent 0,rgb(0 0 0/.35) 40%,#000 100%);mask-image:linear-gradient(180deg,transparent 0,rgb(0 0 0/.35) 40%,#000 100%)}
  .scn.dr-head .dr-hi{padding-right:76px}
  .scn.dr-head .dr-hi h1{font-size:27px!important}
  .scn.dr-head .dr-hi p{font-size:14.5px!important}
  .scn.dr-head .dr-ring{top:16px;right:14px;width:62px;height:62px}
  .scn.dr-head .dr-meds .md{background:rgb(255 255 255/.86);padding:7px 9px}
  .scn-dark.dr-head .dr-meds .md{background:rgb(20 16 50/.42)}
}
/* patch82d: start na telefonie — medaliony jako niskie pigułki w jednym rzędzie */
@media (max-width:600px){
  .scn.dr-head .dr-meds .md{flex-direction:row;align-items:center;gap:6px;padding:5px 8px 5px 5px;border-radius:99px}
  .scn.dr-head .dr-meds .md-ic{width:30px;height:30px}.scn.dr-head .dr-meds .md-ic svg.i{width:15px;height:15px}
  .scn.dr-head .dr-meds .md-t b{font-size:17px}
  .scn.dr-head .dr-meds .md-t>small{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media (max-width:600px){.scn.dr-head .dr-meds .md-t>small{white-space:normal;line-height:1.05}}

/* ═════════ patch83: gwiazdki, kroki w lekcji, przewodnik, cel na dziś, aplikacja, pochwała ═════════ */
/* 1. gwiazdki */
.sum-stars{gap:4px;margin:10px 0 6px;align-items:flex-end}
.sum-stars svg{width:62px;height:62px;fill:var(--lav-200);stroke:rgb(21 26 61/.06);stroke-width:.6}
.sum-stars svg:nth-child(2){width:82px;height:82px;margin-bottom:10px}
.sum-stars svg.on{fill:#ffcc33;stroke:#d48a00;stroke-width:.8;filter:drop-shadow(0 0 12px rgb(255 196 40/.65)) drop-shadow(0 3px 0 #d48a00)}
.sum-stars small{font-size:15px;color:var(--ink-2);margin-top:4px}
.dr-stz{font-style:normal;margin-left:8px;padding:1px 8px;border-radius:99px;background:#fff4d1;color:#9a6400;font-weight:900;letter-spacing:0}
/* 3. kroki w lekcji */
.sseg{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0}
.sseg-l{font-size:12.5px;font-weight:900;color:var(--ink-3);letter-spacing:.02em;line-height:1}
.sseg-b{display:flex;gap:5px}
.sseg-b i{position:relative;flex:1;height:11px;border-radius:99px;background:var(--lav-100);overflow:hidden}
.sseg-b u{display:block;height:100%;border-radius:inherit;background:var(--success-500);text-decoration:none;transition:width .45s var(--ease)}
.sseg-b i.cur{box-shadow:0 0 0 2px var(--violet-500),0 0 12px -2px rgb(139 92 246/.6)}
.sseg-b i.cur:not(.full) u{background:linear-gradient(90deg,var(--violet-500),var(--c5))}
.sseg-b i.full::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgb(255 255 255/.55) 50%,transparent 70%);animation:ssegShine 2.6s ease-in-out 1}
@keyframes ssegShine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
/* 4. przewodnik */
.guide{position:fixed;inset:0;z-index:330;animation:lvIn .25s var(--ease) both}
.guide.out{animation:lvOut .22s var(--ease) both}
.guide-hole{position:fixed;border-radius:24px;box-shadow:0 0 0 3px rgb(255 255 255/.9),0 0 0 9999px rgb(15 19 48/.64);transition:left .35s var(--ease),top .35s var(--ease),width .35s var(--ease),height .35s var(--ease);pointer-events:none}
.guide-bub{position:fixed;width:min(330px,calc(100vw - 20px));padding:16px 18px 14px;border-radius:22px;background:var(--card);color:var(--ink);box-shadow:0 26px 60px -20px rgb(0 0 0/.55);transition:top .35s var(--ease),left .35s var(--ease)}
.guide-bub small{display:block;font-weight:900;font-size:12px;color:var(--violet-600);letter-spacing:.08em;text-transform:uppercase}
.guide-bub b{display:block;font-family:var(--display);font-size:21px;margin:2px 0 4px}
.guide-bub p{margin:0 0 12px;color:var(--ink-2);font-weight:700;line-height:1.45}
.guide-act{display:flex;justify-content:space-between;gap:8px}
/* 5. cel na dziś + tydzień */
.dr-goal{text-decoration:none;color:inherit;flex-direction:column}
.dr-goal b{font-size:19px!important;line-height:1;color:var(--violet-700)}
.dr-goal b svg.i{width:24px;height:24px;stroke-width:3;color:var(--gold-500)}
.dr-goal small{position:relative;font-size:10.5px;font-weight:900;color:var(--ink-3);line-height:1;margin-top:2px}
.dr-goal.ok{animation:goalPop .7s var(--spring) both}
.scn.dr-head .dr-goal{display:flex!important;align-items:center;justify-content:center}
@keyframes goalPop{50%{transform:scale(1.12)}}
.dr-week{display:flex;gap:6px;flex-wrap:wrap}
.dr-week span{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;font-weight:900;color:var(--ink-3)}
.dr-week i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:13px;color:#fff;background:rgb(255 255 255/.7);box-shadow:inset 0 0 0 2px rgb(21 26 61/.1)}
.dr-week .on i{background:linear-gradient(140deg,#ffb26b,#ec5a35);box-shadow:0 4px 10px -4px #ec5a35}
.dr-week .today i{box-shadow:inset 0 0 0 2px var(--violet-500),0 0 0 3px rgb(139 92 246/.25)}
.dr-week .today.on i{box-shadow:0 0 0 3px rgb(255 255 255/.9),0 4px 10px -4px #ec5a35}
.dr-week .fut{opacity:.6}
.scn-dark .dr-week span{color:rgb(255 255 255/.85)}
.scn-dark .dr-week i{background:rgb(255 255 255/.16);box-shadow:inset 0 0 0 2px rgb(255 255 255/.25)}
@media (max-width:600px){.dr-week{gap:4px}.dr-week i{width:22px;height:22px;font-size:11px}.dr-week span{font-size:10px}}
/* 6. aplikacja na telefon */
html.simple .page:has(.appi){max-width:760px}
.appi-card{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:28px;border-radius:30px;background:radial-gradient(120% 140% at 100% 0,#f3eeff 0,var(--card) 60%);border:1px solid var(--line);box-shadow:var(--shadow-m)}
.appi-ic{width:84px;height:84px;border-radius:22px;box-shadow:0 12px 26px -12px rgb(109 63 209/.6)}
.appi-card h1{font-size:clamp(26px,3.4vw,36px)}
.appi-card p{margin:0;color:var(--ink-2);font-weight:700;line-height:1.5}
.appi-steps{margin:4px 0;padding:0;list-style:none;counter-reset:a;display:flex;flex-direction:column;gap:10px;width:100%}
.appi-steps li{counter-increment:a;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:var(--paper);font-weight:700;color:var(--ink-2)}
.appi-steps li::before{content:counter(a);flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(140deg,#a07bff,#5a2fc2);color:#fff;font-weight:900}
.appi-steps b{color:var(--ink)}
.appi-ok{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;background:var(--success-100);color:#0c6e48;font-weight:800}
/* 7. pochwała */
.yay{position:fixed;z-index:250;transform:translate(-50%,0);display:flex;align-items:center;gap:8px;padding:8px 16px 8px 8px;border-radius:99px;background:linear-gradient(135deg,#1fbf7d,#0f9c63);color:#fff;font-family:var(--display);font-size:20px;box-shadow:0 14px 30px -12px rgb(15 156 99/.7);pointer-events:none;animation:yayUp 1.25s var(--spring) both}
.yay span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#0f9c63}
.yay svg.i{width:20px;height:20px;stroke-width:3}
@keyframes yayUp{0%{opacity:0;transform:translate(-50%,14px) scale(.7)}18%{opacity:1;transform:translate(-50%,0) scale(1.06)}30%{transform:translate(-50%,0) scale(1)}78%{opacity:1;transform:translate(-50%,-18px)}100%{opacity:0;transform:translate(-50%,-34px)}}

/* ═════════ patch86: krainy pod mapą ═════════ */
.droga .map{--lx:90px}
.land{position:absolute;left:calc(var(--lx) * -1);right:calc(var(--lx) * -1);z-index:0;pointer-events:none;background:var(--land) center top/100% auto repeat-y;opacity:.82;filter:saturate(.82);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 140px,#000 calc(100% - 140px),transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 140px,#000 calc(100% - 140px),transparent 100%);border-radius:40px}
.land.first{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 60px,#000 calc(100% - 140px),transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 60px,#000 calc(100% - 140px),transparent 100%)}
.land-tag{position:absolute;left:0;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:99px;background:rgb(255 255 255/.88);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 8px 20px -12px rgb(21 26 61/.45);font-weight:900;font-size:13.5px;color:var(--ink);pointer-events:none}
@media (max-width:760px){.droga .map{--lx:16px}.land{border-radius:0}}
@media (max-width:600px){.land-tag{font-size:12.5px;padding:5px 11px}}
:where(html.dark) .land{opacity:.28}
:where(html.dark) .land-tag{background:rgb(25 29 56/.85);color:var(--ink)}

/* ═════════ patch87: panel lektora 2.0 ═════════ */
html.simple .page:has(.tp){max-width:1240px}
.tp{display:flex;flex-direction:column;gap:16px;max-width:1180px;margin:0 auto;width:100%}
.tp-h{display:flex;align-items:center;gap:10px;font-size:22px;color:var(--ink);margin:10px 0 0}
.tp-h svg.i{width:26px;height:26px;padding:5px;border-radius:10px;background:var(--lav-100);color:var(--violet-600);box-sizing:border-box}
.tp-h small{font-family:var(--font);font-size:15px;color:var(--ink-3);font-weight:800}
.tp-av{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:18px;color:#fff;background:linear-gradient(140deg,var(--a),var(--b));box-shadow:inset 0 2px 0 rgb(255 255 255/.45),0 6px 14px -8px var(--b)}
.tp-av.sm{width:30px;height:30px;font-size:11px;box-shadow:0 0 0 2px #fff}
.tp-av.lg{width:84px;height:84px;font-size:30px;box-shadow:0 0 0 4px rgb(255 255 255/.85),0 12px 26px -12px var(--b)}
/* na dziś */
.tp-today{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.tp-do{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:16px 16px 14px;border-radius:24px;border:0;text-align:left;font:inherit;color:var(--ink);cursor:pointer;background:var(--card);box-shadow:0 12px 30px -20px rgb(21 26 61/.5),inset 0 0 0 1px var(--line);overflow:hidden;transition:transform .3s var(--spring),box-shadow var(--dur)}
.tp-do::after{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,var(--glow),transparent 70%);pointer-events:none}
.tp-do:not(:disabled):hover{transform:translateY(-3px) rotate(-.6deg);box-shadow:0 18px 34px -20px rgb(21 26 61/.6),inset 0 0 0 1px var(--line)}
.tp-do:disabled{cursor:default;opacity:.8}
.tp-do-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(140deg,var(--a),var(--b));box-shadow:0 8px 16px -8px var(--b)}
.tp-do-t{display:flex;flex-direction:column;gap:1px}
.tp-do-t small{font-size:12.5px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.tp-do-t b{font-family:var(--display);font-size:24px;line-height:1.15}
.tp-do-t em{font-style:normal;font-weight:700;font-size:14px;color:var(--ink-2)}
.c-open{--a:#ffb26b;--b:#ec5a35;--glow:rgb(255 178 107/.35)}.c-idle{--a:#9fb4ff;--b:#4a63d8;--glow:rgb(159 180 255/.35)}.c-top{--a:#ffd75e;--b:#e0950f;--glow:rgb(255 215 94/.4)}.c-unver{--a:#ff8fa3;--b:#d63a5c;--glow:rgb(255 143 163/.3)}
.tp-stack{display:flex;align-items:center;padding-left:6px}
.tp-stack .tp-av{margin-left:-8px}
.tp-stack em{font-style:normal;margin-left:6px;font-weight:900;font-size:13px;color:var(--ink-3)}
/* zadania domowe */
.hw-teacher{border-radius:26px!important;padding:18px 20px!important}
.hw-th{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hw-th>div{flex:1;min-width:200px}
.hw-cls{display:flex;align-items:center;gap:8px;font-weight:800;color:var(--ink-2)}
.hw-cls select{font:inherit;font-weight:900;padding:8px 12px;border-radius:12px;border:2px solid var(--line);background:var(--card);color:var(--ink)}
.hw-due{display:flex;flex-direction:column;gap:6px}
.hw-quick{display:flex;gap:4px;flex-wrap:wrap}
.hw-quick button{padding:4px 10px;border-radius:99px;border:0;background:var(--lav-100);color:var(--violet-700);font-weight:800;font-size:12.5px;cursor:pointer}
.hw-quick button.on{background:var(--violet-600);color:#fff}
.hw-row{display:flex;align-items:center;gap:14px}
.hw-ring{position:relative;flex:none;width:54px;height:54px;display:grid;place-items:center}
.hw-ring svg{position:absolute;inset:0}
.hw-ring b{position:relative;font-size:13px;font-weight:900;color:var(--ink)}
/* filtry */
.tp-filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap;scroll-margin-top:80px}
.tp-filters .pt-search{flex:1;min-width:220px;background:var(--card);border-radius:99px}
.tp-chips{display:flex;gap:4px;flex-wrap:wrap;padding:4px;border-radius:99px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.tp-chips button{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:99px;border:0;font:inherit;font-weight:900;font-size:14px;color:var(--ink-2);background:none;cursor:pointer}
.tp-chips button em{font-style:normal;font-size:12px;padding:0 6px;border-radius:99px;background:var(--lav-100);color:var(--ink-3)}
.tp-chips button[aria-pressed=true]{color:#fff;background:linear-gradient(140deg,var(--a,#a07bff),var(--b,#5a2fc2))}
.tp-chips button[aria-pressed=true] em{background:rgb(255 255 255/.25);color:#fff}
.tp-filters select{font:inherit;font-weight:800;padding:9px 14px;border-radius:99px;border:2px solid var(--line);background:var(--card);color:var(--ink)}
.tp-only{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-radius:16px;background:var(--lav-100);font-weight:700}
/* karty uczniów */
.tp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.tp-st{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;column-gap:12px;row-gap:10px;padding:16px;border-radius:24px;background:var(--card);color:var(--ink);text-decoration:none;box-shadow:0 10px 26px -20px rgb(21 26 61/.55),inset 0 0 0 1px var(--line);transition:transform .3s var(--spring),box-shadow var(--dur)}
.tp-st:hover{transform:translateY(-3px);box-shadow:0 18px 32px -20px rgb(21 26 61/.6),inset 0 0 0 2px var(--violet-500)}
.tp-nm{display:flex;flex-direction:column;min-width:0}
.tp-nm b{font-size:16.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tp-nm small{font-size:13px;font-weight:700;color:var(--ink-3)}
.tp-nm em{font-style:normal;color:#d63a5c}
.tp-badge{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:99px;background:linear-gradient(140deg,#ffb26b,#ec5a35);color:#fff;font-weight:900;font-size:13px;box-shadow:0 6px 12px -6px #ec5a35}
.tp-badge svg.i{width:14px;height:14px;stroke-width:2.6}
.tp-act{display:inline-flex;align-items:center;gap:7px;font-weight:800;font-size:13.5px;color:var(--ink-2)}
.tp-act i{width:10px;height:10px;border-radius:50%;background:#b7bbd3}
.st-today .tp-act i,.tp-act.st-today i{background:#14a06a;box-shadow:0 0 0 4px rgb(20 160 106/.18)}
.st-week .tp-act i,.tp-act.st-week i{background:#7bcf9f}
.st-old .tp-act i,.tp-act.st-old i{background:#f0a23a}
.st-gone .tp-act i,.tp-act.st-gone i,.st-never .tp-act i{background:#e07a7a}
.tp-st>.tp-act{grid-column:1/-1}
.tp-week{grid-column:1/-1;display:flex;gap:5px}
.tp-week i{flex:1;height:26px;border-radius:9px;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:900;color:var(--ink-3);background:var(--paper)}
.tp-week i.on{background:linear-gradient(140deg,#ffb26b,#ec5a35);color:#fff}
.tp-week i.t{box-shadow:inset 0 0 0 2px var(--violet-500)}
.tp-week i.f{opacity:.5}
.tp-prog{grid-column:1/-1;display:flex;flex-direction:column;gap:5px}
.tp-bar{height:8px;border-radius:99px;background:var(--lav-100);overflow:hidden}
.tp-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#56dccf,#14a06a)}
.tp-prog small,.tp-pts small{font-size:12.5px;font-weight:700;color:var(--ink-3)}
.tp-pts{grid-column:1/-1;font-weight:700;font-size:14px;color:var(--ink-2)}
.tp-pts b{font-family:var(--display);font-size:20px;color:var(--ink)}
.tp-empty{padding:26px;text-align:center;border-radius:22px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.tp-empty b{font-family:var(--display);font-size:19px}
.tp-empty p{margin:4px 0 0;color:var(--ink-2);font-weight:700}
/* karta ucznia */
.tp-sh{gap:16px!important}
.tp-back{display:inline-flex;align-items:center;gap:6px;padding:7px 14px 7px 10px;border-radius:99px;background:rgb(255 255 255/.85);color:var(--ink);font-weight:800;text-decoration:none;box-shadow:0 6px 14px -10px rgb(21 26 61/.5)}
.tp-back svg.i{transform:rotate(180deg);width:18px;height:18px}
.tp-sh-id{display:flex;align-items:center;gap:18px}
.tp-sh-id h1{margin:2px 0}
.tp-sh-id p{margin:0;font-weight:700}
.tp-courses{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.tp-course{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:20px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.tp-course b{font-family:var(--display);font-size:18px}
.tp-course span{font-size:13.5px;font-weight:700;color:var(--ink-2)}
.tp-tabs{display:inline-flex;gap:4px;padding:5px;border-radius:99px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);align-self:flex-start}
.tp-tabs button{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:99px;border:0;font:inherit;font-weight:900;color:var(--ink-2);background:none;cursor:pointer}
.tp-tabs button svg.i{width:18px;height:18px}
.tp-tabs button em{font-style:normal;font-size:12px;padding:1px 7px;border-radius:99px;background:var(--lav-100)}
.tp-tabs button[aria-selected=true]{background:linear-gradient(135deg,var(--navy-800),var(--navy-950));color:#fff}
.tp-tabs button[aria-selected=true] em{background:rgb(255 255 255/.2)}
.tp-ansl{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.tp-ans{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:22px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.tp-ans-h small{display:block;font-size:12px;font-weight:800;color:var(--ink-3)}
.tp-ans-h b{font-size:15px}
.tp-bub{position:relative;padding:12px 14px;border-radius:18px 18px 18px 6px;background:var(--lav-100);font-weight:600;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.tp-bub .t-draw{max-width:100%;border-radius:12px;background:#fff}
.tp-seen{align-self:flex-end}
.tp-seenl{margin-top:12px}
.tp-seenl summary{cursor:pointer;font-weight:900;color:var(--ink-2);padding:8px 0}
.tp-seenl summary em{font-style:normal;padding:1px 8px;border-radius:99px;background:var(--lav-100);font-size:12.5px}
.tp-seenl .tp-ans{opacity:.7}
.tp-mats{padding:16px;border-radius:24px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);margin-bottom:12px}
.tp-mats h3{font-size:18px;margin:0 0 8px}
.tp-mat{display:flex;align-items:center;gap:12px;padding:10px 4px;border-top:1px solid var(--line)}
.tp-mat:first-of-type{border-top:0}
.tp-mi{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:900;background:#fff1d9;color:#9a5a00}
.tp-mat.ok .tp-mi{background:var(--success-100);color:var(--success-500)}
.tp-mi svg.i{width:18px;height:18px;stroke-width:2.6}
.tp-mt{flex:1;display:flex;flex-direction:column;min-width:0}
.tp-mt b{font-size:15px}
.tp-mt small{font-size:12.5px;font-weight:700;color:var(--ink-3)}
.tp-mat em{font-style:normal;font-size:12.5px;font-weight:900;padding:3px 10px;border-radius:99px;background:var(--success-100);color:#0c6e48}
.tp-mat em.p{background:#fff1d9;color:#9a5a00}
@media (max-width:600px){
  .tp-today{grid-template-columns:1fr 1fr;gap:8px}
  .tp-do{padding:12px;border-radius:20px;gap:6px}
  .tp-do-ic{width:36px;height:36px;border-radius:12px}
  .tp-do-t b{font-size:18px}.tp-do-t em{font-size:12.5px}
  .tp-stack{display:none}
  .tp-grid,.tp-ansl{grid-template-columns:1fr}
  .tp-filters .pt-search{min-width:100%}
  .tp-sh-id{gap:12px}.tp-av.lg{width:64px;height:64px;font-size:22px}
  .hw-form{grid-template-columns:1fr!important}
}
:where(html.dark) .tp-back{background:var(--card)}
:where(html.dark) .tp-week i{background:rgb(255 255 255/.06)}
.hw-form{align-items:start}
.tp-only[hidden],.tp-seenl[hidden]{display:none!important}

/* patch83b: aplikacja — kroki jako zwykły tekst z numerem; ukryty przycisk instalacji naprawdę ukryty */
.appi-steps li{display:block;position:relative;padding:12px 14px 12px 56px;line-height:1.45}
.appi-steps li::before{position:absolute;left:14px;top:50%;transform:translateY(-50%)}
.appi-go[hidden]{display:none!important}
.guide-bub b{color:var(--ink)}
.guide-act .btn{flex:none;white-space:nowrap}
/* patch89: pełne nazwy lekcji na mapie (bez ucinania „…”), długie nazwy mniejszą czcionką i szerzej */
.node .lbl{display:block;-webkit-line-clamp:unset;overflow:visible;max-width:170px;overflow-wrap:anywhere}
.droga .node .lbl.long{font-size:12.5px;line-height:1.2}
@media (min-width:700px){.droga .node .lbl{max-width:210px}.droga .node .lbl.long{font-size:13px}.droga .node{width:220px}}
@media (max-width:760px){.node .lbl{max-width:150px}}

/* patch90: „Zajrzyj do tekstu” i podświetlenie fragmentu z odpowiedzią */
.fb-look{display:inline-flex;align-items:center;gap:6px;margin-top:8px;background:#fff;color:var(--violet-700);box-shadow:inset 0 0 0 2px var(--violet-500)}
.fb-look svg.i{width:17px;height:17px}
.ctx-hl{background:rgb(255 214 102/.45);box-shadow:0 0 0 6px rgb(255 214 102/.45);border-radius:6px;animation:ctxHl 1.2s ease-in-out 2}
@keyframes ctxHl{50%{background:rgb(255 214 102/.8);box-shadow:0 0 0 8px rgb(255 214 102/.6)}}
.ctx-hl-tag{display:inline-block;margin:8px 0 6px;padding:4px 12px;border-radius:99px;background:#ffd75e;color:#5a3d00;font-weight:900;font-size:13px}
:where(html.dark) .ctx-hl{background:rgb(255 214 102/.25);box-shadow:0 0 0 6px rgb(255 214 102/.25)}
:where(html.dark) .fb-look{background:var(--card)}
@media (prefers-reduced-motion:reduce){.ctx-hl{animation:none}}
mark.ctx-hl{color:inherit;padding:1px 2px}
/* patch91: czytelność drobnych etykiet (przegląd karta po karcie): numer luki i imię w układaniu rozmowy min. 13 px */
.gapno{font-size:13px!important}
.ob-card b{font-size:13px}
/* patch92: rundy w dopasowaniu (ponad 12 par → po ok. 10) */
.match-round{display:inline-block;margin-right:6px;padding:2px 10px;border-radius:99px;background:var(--violet-50,#f1ecff);color:var(--violet-700,#5b3fd1);font-size:13px;font-weight:800}
/* patch93: stuknij błędne słowo i popraw */
.tapfix{display:grid;gap:12px}
.tf-tip{margin:0;font-weight:700;color:var(--ink-3);font-size:15px}
.tf-sent{display:flex;flex-wrap:wrap;gap:8px;font-size:21px;line-height:1.3}
.tf-w{font:inherit;font-weight:700;color:var(--ink);background:var(--card,#fff);border:2px solid var(--line,#e6e1f5);border-radius:12px;padding:6px 10px;min-width:44px;min-height:44px;cursor:pointer;transition:transform .12s,background .12s,border-color .12s}
.tf-w:hover{border-color:var(--violet-300,#b9a8f5)}
.tf-w.sel{background:#fff1f1;border-color:#e5484d;color:#b4232a;text-decoration:line-through;text-decoration-thickness:2px}
.tf-edit{display:grid;gap:8px;padding:12px;border-radius:16px;background:var(--violet-50,#f1ecff)}
.tf-edit[hidden]{display:none}
.tf-lab{font-weight:700;color:var(--ink-2,#3b3560)}
.tf-lab b{color:#b4232a;text-decoration:line-through}
.tf-row{display:flex;gap:8px;flex-wrap:wrap}
.tf-row input{flex:1 1 160px;min-width:0;font-size:19px;padding:10px 12px;border-radius:12px;border:2px solid var(--violet-300,#b9a8f5);background:#fff;color:var(--ink)}
.tf-type{justify-self:start;background:none;border:0;padding:10px 0;min-height:44px;color:var(--ink-3);font-weight:700;text-decoration:underline;cursor:pointer;font-size:15px}
html.dark .tf-w{background:#1f1b33;border-color:#3a3360;color:#ece8ff}
html.dark .tf-w.sel{background:#3a1d22;border-color:#e5484d;color:#ffb3b3}
html.dark .tf-edit{background:#241f3d}
html.dark .tf-row input{background:#15122a;color:#ece8ff;border-color:#5b4fa0}
html.dark .tf-lab{color:#d9d3ff}
/* patch94: lista kontrolna pod polem pisania */
.wchk{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.wchk li{padding:4px 10px;border-radius:99px;background:var(--lav-100,#eee9fb);color:var(--ink-3);font-weight:700;font-size:13.5px}
.wchk li.ok{background:#e3f7ec;color:#137a4a}
.wchk small{font-weight:600;opacity:.8}
html.dark .wchk li{background:#2a2445;color:#cfc8f5}
html.dark .wchk li.ok{background:#173a2a;color:#7be0a8}

/* patch102: próbna matura — tryb egzaminu */
.qdots button.exr{display:none}
.qdots button.ans{background:var(--lav-100);border-color:var(--violet-500);color:var(--violet-700)}
.opts .opt.picked{border-color:var(--violet-500);background:var(--lav-100);box-shadow:0 5px 0 var(--lav-300)}
.mt.picked{border-color:var(--violet-500);background:var(--lav-100);box-shadow:0 4px 0 var(--lav-300);flex-wrap:wrap}
.mt.picked span{flex:1;min-width:0}
.mt.picked em{flex-basis:100%;font-style:normal;font-weight:800;color:var(--violet-700);white-space:normal}
.feedback.exam{background:var(--lav-100);color:var(--violet-700)}
.exam-timer{position:fixed;bottom:calc(92px + env(safe-area-inset-bottom));left:16px;z-index:60;display:inline-flex;align-items:center;gap:8px;padding:7px 16px 7px 12px;border-radius:99px;background:var(--ink);color:#fff;box-shadow:0 10px 24px -10px rgb(0 0 0/.5);font-variant-numeric:tabular-nums;border:0;cursor:pointer;font:inherit;font-weight:700}.exam-timer svg{width:18px;height:18px}.exam-timer b{font-family:var(--display);font-size:18px}.exam-timer small{opacity:.8;font-weight:800}.exam-timer.warn{background:#c0392b;animation:pulse 1.4s ease-in-out infinite}@media (prefers-reduced-motion:reduce){.exam-timer.warn{animation:none}}:where(html.dark) .exam-timer{background:#30366e}
.exam-timer small{border-left:1px solid rgb(255 255 255/.35);padding-left:8px}
.exam-gate .eg-top{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.exam-gate .eg-top b{display:block;font-family:var(--display);font-size:26px;line-height:1.1}
.exam-gate .eg-top small{color:var(--ink-2);font-weight:800}
.exam-gate .eg-clock{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--gold-300);color:var(--navy-900);flex:none}
.exam-gate .eg-clock svg{width:28px;height:28px}
.exam-gate .eg-list{margin:0 0 14px;padding-left:20px;display:grid;gap:8px;line-height:1.45}
.exam-gate .eg-warn{margin:0 0 14px;padding:10px 14px;border-radius:14px;background:var(--amber-100);font-weight:700}
.exam-gate .eg-go{display:flex;flex-wrap:wrap;gap:10px}
.exam-gate .eg-go .btn{min-height:48px}
.exam-end .ee-miss{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.exam-end p{margin:8px 0 0;color:var(--ink-2)}
.inter .box.exam-res{max-width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;padding:28px 24px}
.exam-res .er-pct{font-family:var(--display);font-size:56px;margin:6px 0 0;line-height:1}
.exam-res .er-sum{margin:4px 0 0;color:var(--ink-2);font-weight:800}
.exam-res .mk-per{margin:16px auto 10px}
.exam-res .mk-row{grid-template-columns:96px 1fr 44px;padding:8px 12px}
.exam-res .er-blog{color:var(--ink-2);font-weight:700;font-size:14px;text-align:left}
.exam-res .er-note{color:var(--ink-2);font-size:14px;line-height:1.45;margin:6px 0 14px}
.ex-badge{margin-top:8px;display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:99px;border:1.5px solid var(--gold-400);background:var(--gold-300);color:var(--navy-900);font:inherit;font-weight:800;font-size:14px;cursor:pointer}
.ex-badge svg{width:16px;height:16px}
.note.shown s{color:var(--coral);text-decoration-thickness:2px}
:where(html.dark) .feedback.exam,:where(html.dark) .qdots button.ans,:where(html.dark) .opts .opt.picked,:where(html.dark) .mt.picked{background:#2c2f5c;color:#d9d6ff}
:where(html.dark) .ex-badge{background:#4a3c12;color:#ffe9a8}