.kviz{position:relative;display:inline-flex;flex-direction:column;gap:4px;padding:10px 12px 16px;background:#00000059;border:1px solid rgba(var(--skin-ink-rgb),.15);border-radius:12px;-webkit-user-select:none;user-select:none}.kviz-row{display:flex;gap:4px;justify-content:center}.kviz-key{--kf: rgba(var(--skin-ink-rgb),.35);width:2.1rem;height:2.1rem;display:flex;align-items:center;justify-content:center;font-family:inherit;font-weight:800;font-size:.95rem;color:var(--skin-text, #fff);background:rgba(var(--skin-ink-rgb),.1);border:1px solid rgba(var(--skin-ink-rgb),.18);border-bottom:3px solid var(--kf);border-radius:7px;transition:background .15s,opacity .15s,transform .1s}.kviz-key--wide{width:4.6rem;font-size:1.1rem}.kviz-key--space{width:13rem}.kviz-key--locked{opacity:.22;border-bottom-color:rgba(var(--skin-ink-rgb),.15)}.kviz-key--bump:after{content:"";position:absolute;width:.7rem;height:2px;border-radius:2px;background:rgba(var(--skin-ink-rgb),.7);transform:translateY(.62rem)}.kviz-key--bump{position:relative}.kviz-key--target{background:var(--kf);color:#1a1a2e;box-shadow:0 0 12px var(--kf);animation:kvizTargetPulse 1s ease-in-out infinite}@keyframes kvizTargetPulse{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}.kviz-key--pressed{animation:kvizPress .34s ease-out;background:var(--kf);color:#1a1a2e}@keyframes kvizPress{0%{transform:translateY(2px) scale(.94)}to{transform:translateY(0) scale(1)}}.kviz-key--wrong{animation:kvizWrong .34s ease-out;background:#f871718c}@keyframes kvizWrong{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.kviz-hands{position:absolute;inset:0;pointer-events:none}.kviz-hands.hidden{display:none}.kviz-fingertip{position:absolute;width:1.15rem;height:1.15rem;border-radius:50%;border:2px solid rgba(var(--skin-ink-rgb),.85);box-shadow:0 2px 6px #00000073;transform:translate(-50%,-50%);opacity:.92}.kviz--strip{gap:3px;padding:7px 10px 10px;border-radius:10px}.kviz--strip .kviz-row{gap:3px}.kviz--strip .kviz-key{width:1.5rem;height:1.5rem;font-size:.72rem;border-radius:5px;border-bottom-width:2px}.kviz--strip .kviz-key--wide{width:3.3rem}.kviz--strip .kviz-key--space{width:9rem}@media(max-width:820px){.kviz--strip{gap:2px;padding:6px 8px 9px}.kviz--strip .kviz-row{gap:2px}.kviz--strip .kviz-key{width:1.1rem;height:1.1rem;font-size:.55rem}.kviz--strip .kviz-key--wide{width:2.4rem}.kviz--strip .kviz-key--space{width:6.5rem}}.fl-overlay{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:1.5rem;overflow-y:auto;background:#0a0c1cd1;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.fl-overlay.hidden{display:none}.fl-card{background:var(--skin-surface, rgba(30, 32, 55, .97));border:1px solid rgba(var(--skin-ink-rgb),.18);border-radius:1.5rem;padding:1.5rem 2rem;max-width:min(92vw,640px);max-height:calc(100dvh - 3rem);overflow-y:auto;text-align:center;box-shadow:0 18px 50px #00000080}.fl-title{font-size:1.35rem;font-weight:900;margin:0 0 .4rem}.fl-text{font-size:1rem;opacity:.9;margin:0 0 1rem;text-align:left}.fl-kviz-mount{display:flex;justify-content:center;margin-bottom:.9rem}.fl-sequence{min-height:2.4rem;display:flex;gap:.45rem;justify-content:center}.fl-chip{display:inline-flex;align-items:center;justify-content:center;min-width:2rem;height:2rem;padding:0 .4rem;font-weight:900;font-size:1.05rem;background:rgba(var(--skin-ink-rgb),.1);border:1px solid rgba(var(--skin-ink-rgb),.25);border-radius:8px;transition:background .15s,transform .15s}.fl-chip--next{border-color:var(--skin-accent,#fbbf24);box-shadow:0 0 10px rgba(var(--skin-accent-rgb),.5)}.fl-chip--done{background:#4ade8059;border-color:#4ade80}.fl-chip--shake{animation:kvizWrong .3s ease-out}.fl-footer{display:flex;gap:.8rem;justify-content:center;margin-top:1.1rem}.fl-footer .hidden{display:none}@media(prefers-reduced-motion:reduce){.kviz-key--target,.fl-chip--shake,.kviz-key--pressed,.kviz-key--wrong{animation:none}}@media(max-width:640px){.kviz--lesson .kviz-key{width:1.55rem;height:1.55rem;font-size:.72rem}.kviz--lesson .kviz-key--wide{width:3.3rem}.kviz--lesson .kviz-key--space{width:9rem}.fl-card{padding:1.1rem 1rem}}
