/* Final-exam pass celebration + green "course complete" state (Oct 31 2026). */
.fc-ov{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 45%,rgba(10,30,80,.92),rgba(3,8,22,.96));opacity:0;transition:opacity .35s ease}
.fc-ov.in{opacity:1}.fc-ov.out{opacity:0;transition:opacity .4s ease}
.fc-logo{position:absolute;left:50%;top:50%;width:min(88vmin,760px);height:auto;transform:translate(-50%,-50%) scale(.92);opacity:.13;pointer-events:none;transition:transform 6s ease-out}
.fc-ov.in .fc-logo{transform:translate(-50%,-50%) scale(1.04)}
.fc-cv{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.fc-skip{position:absolute;right:18px;bottom:18px;padding:8px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.4);background:rgba(10,24,58,.7);color:#e3eeff;font:600 14px/1 var(--font-ui,system-ui);cursor:pointer}
.fc-skip:hover,.fc-skip:focus-visible{border-color:#46c8ff;outline:none}
.fc-live{position:fixed;left:-9999px;width:1px;height:1px;overflow:hidden}
.fc-card{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:18px 0 6px;padding:16px 18px;border-radius:16px;border:1px solid rgba(75,224,143,.6);background:linear-gradient(180deg,rgba(24,90,62,.55),rgba(12,50,36,.7));box-shadow:0 0 22px rgba(75,224,143,.3);animation:fcPop .5s cubic-bezier(.2,1.2,.4,1) both}
.fc-card-t{flex:1 1 220px;display:flex;flex-direction:column;gap:3px;color:#eafff3}.fc-card-t b{font:800 17px/1.25 var(--font-ui,system-ui)}.fc-card-t span{font-size:14px;color:#b9f0d3}
@keyframes fcPop{from{transform:translateY(14px) scale(.96);opacity:0}to{transform:none;opacity:1}}
/* course complete: the bar, the little license and the 100% all go neon green */
.top-progress.is-complete .tp-fill{background:linear-gradient(90deg,#0d9a52,#2ee287 60%,#6dffb0);box-shadow:0 0 14px rgba(46,226,135,.85),0 0 28px rgba(46,226,135,.45)}
.top-progress.is-complete .tp-track{border-color:rgba(46,226,135,.9);box-shadow:inset 0 0 8px rgba(0,0,0,.6),0 0 14px rgba(46,226,135,.45)}
.top-progress.is-complete .tp-tip{filter:drop-shadow(0 2px 4px rgba(0,0,0,.55)) drop-shadow(0 0 8px rgba(46,226,135,.95)) hue-rotate(-62deg) saturate(1.3);animation:fcGlow 2.2s ease-in-out infinite}
.top-progress.is-complete .tp-pct b{color:#6dffb0;text-shadow:0 0 10px rgba(46,226,135,.9),0 0 22px rgba(46,226,135,.6)}
@keyframes fcGlow{0%,100%{filter:drop-shadow(0 2px 4px rgba(0,0,0,.55)) drop-shadow(0 0 6px rgba(46,226,135,.8)) hue-rotate(-62deg) saturate(1.3)}50%{filter:drop-shadow(0 2px 4px rgba(0,0,0,.55)) drop-shadow(0 0 14px rgba(46,226,135,1)) hue-rotate(-62deg) saturate(1.3)}}
@media (prefers-reduced-motion:reduce){.fc-card,.top-progress.is-complete .tp-tip{animation:none}}

.fc-thanks{margin:14px 0 8px;padding:16px 18px;border-radius:16px;border:1px solid rgba(110,160,240,.4);background:rgba(14,30,66,.8)}
.fc-vid{display:block;width:100%;max-height:60vh;margin:0 0 14px;border-radius:12px;background:#000}
.fc-th{margin:0 0 4px;font:800 18px/1.25 var(--font-ui,system-ui);color:#fff}.fc-tp{margin:0 0 12px;font-size:14.5px;color:#b8cdf0}
.fc-share{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.fc-sm{font-size:13.5px;color:#86f0b4;word-break:break-all}
/* the player hides every <video> inside .player-wrap (it is the lesson player's own element); the thank-you video lives in the quiz stage, so put it back */
.player-wrap .fc-thanks video.fc-vid{display:block;position:static;inset:auto;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}

/* certificate that unrolls */
.fc-lic{position:relative;width:min(88vw,560px);opacity:0;transition:transform 1.05s cubic-bezier(.2,1.1,.35,1),opacity .2s;filter:drop-shadow(0 18px 40px rgba(0,0,0,.6)) drop-shadow(0 0 28px rgba(70,200,255,.4));z-index:1}
.fc-lic.shake{animation:fcShake .35s ease-in-out}
@keyframes fcShake{0%,100%{transform:translate(0,0)}20%{transform:translate(-7px,4px)}40%{transform:translate(6px,-4px)}60%{transform:translate(-4px,3px)}80%{transform:translate(3px,-2px)}}
.fc-scroll{display:block}
.fc-rod{height:22px;border-radius:11px;background:linear-gradient(180deg,#f6e7b4,#c99a3b 55%,#8a5f1b);box-shadow:0 3px 8px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.55);position:relative;z-index:2}
.fc-rod::before,.fc-rod::after{content:"";position:absolute;top:50%;width:14px;height:30px;border-radius:7px;background:linear-gradient(180deg,#f6e7b4,#a97724);transform:translateY(-50%);box-shadow:0 2px 5px rgba(0,0,0,.4)}
.fc-rod::before{left:-9px}.fc-rod::after{right:-9px}
.fc-paper{height:0;overflow:hidden;margin:-2px 14px;background:linear-gradient(180deg,#fffdf4,#f7f0da);border-left:1px solid #d9c690;border-right:1px solid #d9c690;transition:height 1.4s cubic-bezier(.3,.75,.2,1);position:relative;z-index:1}
.fc-paper-in{position:relative;padding:22px 20px 30px;text-align:center;color:#1a2a44;border:3px double #c99a3b;margin:8px}
.fc-cmark{display:block;width:54px;height:54px;margin:0 auto 6px;border-radius:50%}
.fc-c-sm{font:600 13px/1.5 var(--font-ui,system-ui);color:#4a5a78}.fc-c-d{margin-top:12px}
.fc-c-h{margin:6px 0 10px;font:800 clamp(20px,5.2vw,28px)/1.15 Georgia,'Times New Roman',serif;color:#14337f}
.fc-c-name{margin:8px 0 10px;min-height:1.3em;font:700 34px/1.2 Georgia,'Times New Roman',serif;color:#0e1e44;border-bottom:2px solid #c99a3b;display:inline-block;padding:0 14px 2px;max-width:100%;overflow-wrap:anywhere}
.fc-seal{position:absolute;right:16px;bottom:14px;width:64px;height:64px;border-radius:50%;padding:4px;background:radial-gradient(circle at 35% 30%,#fff2b8,#d9a73c 60%,#8a5f1b);box-shadow:0 3px 8px rgba(0,0,0,.4);opacity:0;transform:scale(3) rotate(-25deg)}
.fc-seal img{display:block;width:100%;height:100%;border-radius:50%}
.fc-scroll.sealed .fc-seal{animation:fcSeal .24s cubic-bezier(.2,.9,.3,1) forwards}
@keyframes fcSeal{0%{opacity:0;transform:scale(3) rotate(-25deg)}60%{opacity:1}100%{opacity:1;transform:scale(1) rotate(-8deg)}}
/* the little license on the progress bar throws sparks once the course is complete */
.top-progress.is-complete .tp-tip::before,.top-progress.is-complete .tp-tip::after{content:"";position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px;border-radius:50%;background:#fff;box-shadow:0 0 6px 2px rgba(255,233,160,.95);opacity:0;animation:fcSpark 1.8s ease-out infinite}
.top-progress.is-complete .tp-tip::after{animation-delay:.9s;background:#8dffc4;box-shadow:0 0 6px 2px rgba(110,255,180,.95)}
@keyframes fcSpark{0%{opacity:0;transform:translate(0,0) scale(.4)}15%{opacity:1}100%{opacity:0;transform:translate(22px,-26px) scale(1.2)}}
@media (prefers-reduced-motion:reduce){.top-progress.is-complete .tp-tip::before,.top-progress.is-complete .tp-tip::after{animation:none}}

/* big flashing Share bar (same energy as the Next button) */
.fc-share{flex-direction:column;align-items:stretch}
.fc-share-bar{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:64px;padding:16px 22px;border:0;border-radius:16px;cursor:pointer;color:#fff;font:800 clamp(19px,4.4vw,24px)/1.1 var(--font-ui,system-ui);letter-spacing:.02em;
  background:linear-gradient(90deg,#0a47d9,#2f8dff,#2ee287,#2f8dff,#0a47d9);background-size:300% 100%;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 0 2px rgba(70,200,255,.6),0 0 24px rgba(70,200,255,.6);animation:fcBar 1.6s ease-in-out infinite alternate,fcBarGlow 1.6s ease-in-out infinite alternate}
.fc-share-bar svg{width:28px;height:28px;flex:none}
.fc-share-bar:hover,.fc-share-bar:focus-visible{outline:3px solid #fff;outline-offset:3px}
@keyframes fcBar{from{background-position:0% 50%}to{background-position:100% 50%}}
@keyframes fcBarGlow{from{box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 0 2px rgba(70,200,255,.6),0 0 16px rgba(70,200,255,.5)}to{box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 0 3px rgba(110,255,180,.9),0 0 34px rgba(46,226,135,.8)}}
/* left panel: Print Certificate lights up green and flashes once the certificate is ready */
.nav-cert.cert-ready{position:relative;color:#fff;font-weight:800;border-radius:12px;background:linear-gradient(90deg,#0d9a52,#2ee287,#0d9a52);background-size:250% 100%;animation:fcBar 1.4s ease-in-out infinite alternate,fcCertGlow 1s ease-in-out infinite alternate;overflow:visible}
.nav-cert.cert-ready svg{color:#fff}
@keyframes fcCertGlow{from{box-shadow:0 0 0 1px rgba(110,255,180,.6),0 0 10px rgba(46,226,135,.5)}to{box-shadow:0 0 0 3px rgba(190,255,220,1),0 0 30px rgba(46,226,135,1)}}
.nav-cert.cert-ready::after{content:"Ready";position:absolute;right:8px;top:50%;transform:translateY(-50%);padding:2px 8px;border-radius:999px;background:#fff;color:#0d7a42;font:800 11px/1.4 var(--font-ui,system-ui);letter-spacing:.04em}
.nav-cert.cert-fanfare{animation:fcBar 1.4s ease-in-out infinite alternate,fcCertGlow .5s ease-in-out infinite alternate,fcCertJump .6s ease-in-out 6}
@keyframes fcCertJump{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.nav-cert.cert-ready::before{content:"";position:absolute;left:14px;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:#fff;box-shadow:0 0 8px 3px rgba(255,240,170,.95);animation:fcSpark 1.2s ease-out infinite}
@media (prefers-reduced-motion:reduce){.fc-share-bar,.nav-cert.cert-ready,.nav-cert.cert-fanfare,.nav-cert.cert-ready::before{animation:none}}