.segment-block.flashcard-mode{background:transparent!important;box-shadow:none!important;margin-top:0!important;margin-bottom:0!important;padding-top:0!important;padding-inline:0!important;padding-bottom:0!important;min-height:0!important}.segment-block.flashcard-mode:before{display:none!important}@media (min-width: 900px){#lesson-meta.quest-layout-harakat .segment-block.flashcard-mode{padding-bottom:clamp(180px,22vh,260px)!important}}.flashcard-question .fc-repetitions{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;margin-bottom:1rem;text-align:center}.flashcard-question .fc-repetitions-text{font-weight:700;color:#0f172a;text-align:center}.flashcard-question .fc-repetitions-progress{display:flex;gap:.45rem;align-items:center;justify-content:center}.flashcard-question .speaker-btn{width:clamp(42px,9vw,52px);height:clamp(42px,9vw,52px);padding:0;font-size:1rem;overflow:hidden}.flashcard-question .speaker-btn i{font-size:1.4rem!important;line-height:1}.flashcard-question .speaker-btn .fa-3x{font-size:1.4rem!important}.flashcard-question .speaker-btn .svg-inline--fa,.flashcard-question .speaker-btn svg{width:1.4rem;height:1.4rem;display:block}.flashcard-question .fc-tick{width:2.1rem;height:2.1rem;border-radius:50%;background:#e5e7eb;display:inline-flex;align-items:center;justify-content:center;font-size:1.3rem;color:#9ca3af;position:relative;transition:transform .25s ease,background-color .25s ease,box-shadow .25s ease,color .25s ease;will-change:transform}.flashcard-question .fc-tick:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.flashcard-question .fc-tick.completed{background:var(--success);color:#fff}.flashcard-question .fc-tick.tick-pop{animation:fcTickPop .45s ease}.flashcard-question .fc-tick.active{background:#3b82f638;color:#1d4ed8}.flashcard-question .fc-tick.celebrating{background:#10b9812e;color:var(--success);transform:scale(1.12);box-shadow:0 12px 26px #10b98140}@keyframes fcTickPop{0%{transform:scale(.45);opacity:0}60%{transform:scale(1.25);opacity:1}to{transform:scale(1);opacity:1}}.fc-stage{position:relative;width:min(560px,92vw);height:280px;margin:0 auto;perspective:1000px;display:flex;justify-content:center;align-items:center}.fc-card{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;cursor:pointer}.fc-face{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;justify-content:center;align-items:center;border-radius:16px;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 16px 40px #0003;padding:16px;font-size:2rem;font-weight:800}.fc-front.fc-letter{font-size:8rem}.fc-front{background:linear-gradient(180deg,#fff,#f5f7fb);color:#0f172a}.fc-back{background:linear-gradient(180deg,#0ea5e9,#38bdf8);color:#fff;transform:rotateY(180deg)}.fc-card{transform-style:preserve-3d;transition:transform .6s ease}.fc-card.fc-stacked .fc-face{border:3px solid rgba(0,0,0,.6)}.fc-card.flipped{transform:rotateY(180deg)}.fc-counter{position:absolute;top:0;left:50%;transform:translate(-50%);font-weight:600}.fc-actions{margin-top:16px;display:flex;justify-content:center;gap:16px}.fc-actions button{background:#38bdf8;border:none;border-radius:8px;padding:12px 20px;font-size:1.5rem;font-weight:900;color:#000;cursor:pointer;box-shadow:0 4px 10px #0003}.fc-actions .fc-wrong{background:#ef4444}.listen-btn{z-index:100}.fc-card.completed:after{content:"✓";position:absolute;top:10px;left:10px;background:var(--success);color:#fff;border-radius:50%;width:2.5rem;height:2.5rem;display:flex;justify-content:center;align-items:center;font-size:2rem}.fc-out-wrong{animation:fc-slide-left 1s linear forwards}.fc-out-right{animation:fc-slide-right 1s linear forwards}.fc-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:16px;pointer-events:none;opacity:0;z-index:10}.fc-flash-wrong:after{background:#ef4444;animation:fc-flash .5s ease}.fc-flash-right:after{background:var(--success);animation:fc-flash .5s ease}@keyframes fc-flash{0%{opacity:.8}to{opacity:0}}@keyframes fc-slide-left{to{transform:var(--rot, rotateY(0deg)) translate3d(-100vw,0,0)}}@keyframes fc-slide-right{to{transform:var(--rot, rotateY(0deg)) translate3d(100vw,0,0)}}@media (max-width: 480px){.fc-face{font-size:1.6rem}.fc-actions button{font-size:1.1rem;padding:10px 14px}.fc-stage{height:240px}}
