/* Polish Bhasa — XP, quiz, celebration, A2 card */
.xp-hint{color:var(--muted);font-size:.86rem}
.stars{display:inline-flex;gap:1px;font-size:1rem;line-height:1}
.stars i{font-style:normal;color:#DDD6E3}
.stars i.on{color:#F2B705;text-shadow:0 1px 0 rgba(158,16,48,.15)}
.anim .stars i.on{animation:pop .5s var(--spring) both}
.anim .stars i.on:nth-child(2){animation-delay:.12s}.anim .stars i.on:nth-child(3){animation-delay:.24s}

/* sticky lesson XP bar */
.lesson-xp{position:sticky;top:64px;z-index:40;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 16px;margin:0 0 18px;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.lesson-xp .lx-l{font-weight:700;color:var(--head);font-size:.9rem;white-space:nowrap}
.lesson-xp .xp{flex:1;min-width:120px}
.lesson-xp .lx-n{font-size:.9rem;color:var(--soft);white-space:nowrap}.lesson-xp .lx-n b{color:var(--head)}
.lesson-xp .lx-lv{font-size:.8rem;font-weight:600;color:#9E1030;background:#FCE8EB;border:1px solid #F7D3D9;border-radius:99px;padding:.2em .7em;white-space:nowrap}
@media (max-width:760px){.lesson-xp{top:66px;gap:8px;padding:8px 12px}.lesson-xp .lx-l{display:none}.lesson-xp .lx-lv{font-size:.72rem}}

/* heard words */
.speak.heard:not(.playing){border-color:#BBE5C8}
.speak.heard:not(.playing):after{content:"✓";position:absolute;right:-4px;top:-4px;width:15px;height:15px;border-radius:50%;background:var(--ok);color:#fff;font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:center;line-height:1}
.anim .speak.heard:not(.playing):after{animation:pop .4s var(--spring)}

/* fly-up XP */
.xpfly{position:fixed;z-index:150;font-weight:800;color:var(--ok);pointer-events:none;animation:fly 1s var(--ease) forwards;text-shadow:0 1px 0 #fff}
@keyframes fly{to{transform:translateY(-60px);opacity:0}}

/* lesson quiz */
.lquiz{padding:20px;margin:26px 0 0;position:relative;overflow:hidden}
.lquiz-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.lquiz-h h2{font-size:1.15rem;margin:0}.lquiz-h p{margin:0}
.lquiz .mascot{font-size:2.2rem}
.qdots{display:flex;gap:6px;list-style:none;margin:0 0 0 auto;padding:0}
.qdots li{width:12px;height:12px;border-radius:50%;background:#EEE9F2;border:1px solid var(--line2);transition:all .3s var(--spring)}
.qdots li.cur{transform:scale(1.3);border-color:var(--crimson)}
.qdots li.ok{background:var(--ok);border-color:var(--ok)}.qdots li.half{background:#F2B705;border-color:#F2B705}
.lquiz-b,.lquiz-end{text-align:center;margin-top:12px}
.qrow{display:flex;align-items:center;justify-content:center;gap:10px}
.lquiz .qw{font-family:var(--fd);font-size:1.9rem;font-weight:800;color:var(--head);margin:.1em 0}
.lquiz .opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.lquiz .opt{font:600 1rem var(--fn);padding:.85em .6em;border-radius:12px;border:1.5px solid var(--line2);background:#fff;color:var(--head);cursor:pointer;transition:transform .2s var(--spring),border-color .2s,background .2s;line-height:1.35}
.lquiz .opt:hover:not(:disabled){transform:translateY(-2px);border-color:#C9C1D0}
.lquiz .opt:disabled{cursor:default}
.lquiz .opt.ok{background:#EEFAF2;border-color:var(--ok);color:#14532D;opacity:1}
.lquiz .opt.no{background:#FFF0F3;border-color:var(--bad);color:#881337}
.anim .lquiz .opt.ok{animation:boing .6s var(--spring)}.anim .lquiz .opt.no{animation:shakeX .45s}
.lquiz .fb{min-height:1.6em;margin:10px 0 0;font-weight:700}.lquiz .fb.yay{color:var(--ok)}.lquiz .fb.no{color:var(--bad)}
.lquiz-end .big{font-family:var(--fd);font-size:1.6rem;font-weight:800;color:var(--head);margin:.2em 0}
@media (max-width:520px){.lquiz .opts{grid-template-columns:1fr}.qdots{margin:6px 0 0}}

/* celebration */
.celebrate{position:fixed;inset:0;z-index:250;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(31,42,92,.45);opacity:0;transition:opacity .3s}
.celebrate.on{opacity:1}
.cel-card{max-width:420px;width:100%;padding:28px 22px;text-align:center;transform:scale(.8) translateY(20px);transition:transform .45s var(--spring)}
.celebrate.on .cel-card{transform:none}
.cel-stars .stars{font-size:2.6rem;gap:6px}
.cel-card h2{margin:.3em 0 .1em}.cel-card .np{color:var(--soft)}
.cel-xp{font-size:1.05rem;color:var(--soft)}.cel-xp b{font-size:1.6rem;color:var(--crimson)}
.cel-b{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:14px}

/* level-up toast */
.lvlup{position:fixed;left:50%;top:84px;z-index:260;transform:translate(-50%,-30px);opacity:0;transition:all .45s var(--spring);background:linear-gradient(90deg,#C8102E,#3A2E6E);color:#fff;border-radius:16px;padding:12px 20px;display:flex;flex-direction:column;align-items:center;box-shadow:0 18px 40px -16px rgba(31,42,92,.6)}
.lvlup.on{transform:translate(-50%,0);opacity:1}.lvlup b{font-family:var(--fn);font-size:1.1rem}.lvlup span{font-size:.85rem;opacity:.9}

/* lessons list */
.lxp{display:flex;align-items:center;gap:8px;margin-bottom:8px;min-height:18px}
.lxp-bar{flex:1;height:6px;border-radius:99px;background:#F1EEF6;overflow:hidden}
.lxp-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#C8102E,#3A2E6E);transition:width .8s var(--spring)}
.lxp-n{font-size:.75rem;font-weight:700;color:var(--muted)}
.xp-level{display:flex;align-items:center;gap:16px;padding:16px 20px;margin-top:18px}
.xp-level .lv-badge{flex:none;width:68px;height:68px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;background:conic-gradient(from 180deg,#C8102E,#3A2E6E,#C8102E);box-shadow:0 10px 24px -12px rgba(200,16,46,.7)}
.anim .xp-level .lv-badge{animation:float 5s ease-in-out infinite}
.lv-badge b{font-family:var(--fd);font-size:1.7rem;line-height:1}.lv-badge span{font-size:.62rem;text-transform:uppercase;letter-spacing:.12em}
.lv-t{flex:1}.lv-t p{margin:0 0 6px;color:var(--head)}.lv-t .small{margin:6px 0 0;color:var(--muted)}

/* continue where you left off */
.resume{display:flex;align-items:center;gap:16px;padding:16px 20px;margin:18px 0 0;border-left:4px solid var(--crimson)}
.rs-ic{font-size:2rem;flex:none}
.anim .rs-ic{animation:float 5s ease-in-out infinite}
.rs-t{flex:1;min-width:0}.rs-t p{margin:0}
.rs-k{font-size:.76rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--crimson)}
.rs-h{color:var(--head);font-size:1.05rem;margin:.15em 0 .35em!important}
.rs-m{display:flex;align-items:center;gap:8px;max-width:420px}
@media (max-width:560px){.resume{flex-wrap:wrap}.resume .btn{width:100%}}

/* lesson flashcards */
.fcards-sec .dlg-h{flex-wrap:wrap}
.vsec-h0{font-family:var(--fb);font-size:1rem;margin:0;color:var(--head)}
.fcards{padding:16px}
.fcards .flip .f .L{font-size:2.1rem}
.fcards .flip .f .L.long{font-size:1.15rem;text-align:center;line-height:1.25}
.fcards .flip .b .w{font-size:.95rem;color:var(--head);font-weight:600}
.resume[hidden],.xp-level[hidden],.lquiz-b[hidden],.lquiz-end[hidden]{display:none}
.resume{flex-wrap:wrap}.rs-note{flex-basis:100%;margin:2px 0 0;font-size:.82rem;color:var(--muted)}.rs-note a{font-weight:700}
.rs-top .resume{margin:14px 0 6px}
@media (max-width:560px){.resume{padding:12px 14px;gap:8px 12px}.rs-ic{font-size:1.5rem}.rs-k{font-size:.66rem;letter-spacing:.06em}.rs-h{font-size:.98rem}.resume .btn{padding:10px 14px}.rs-note{font-size:.74rem}}
