/* Two physical faces stay mounted while the card rotates through 180 degrees. */
.flash-deck{position:relative;margin:26px 12px 30px;isolation:isolate}
.flash-deck::before,.flash-deck::after{content:"";position:absolute;inset:0;border:1px solid #ded8f0;background:#f7f5fd;border-radius:20px;z-index:-1;pointer-events:none}
.flash-deck::before{transform:translateY(10px) rotate(-1.4deg)}
.flash-deck::after{transform:translateY(5px) rotate(.9deg);background:#fff}
.flash-deck .flash-card{display:block;position:relative;width:100%;padding:0;border:0;border-radius:20px;background:transparent;box-shadow:none;min-height:0;perspective:1600px;color:#272832;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent}
.flash-card-inner{display:grid;transform-style:preserve-3d;transition:transform 760ms cubic-bezier(.22,.7,.22,1);transform:rotateY(0deg);position:relative}
.flash-card.flipped .flash-card-inner{transform:rotateY(180deg)}
.flash-face{grid-area:1/1;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:350px;padding:74px 44px 35px;border-radius:20px;border:1.5px solid #b6a9ec;box-shadow:0 15px 35px -20px #45336d70;background:#fff;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:rotateY(0deg);position:relative}
.flash-back{transform:rotateY(180deg);background:#f8fafc;border-color:#8f7adc}
.flash-face-meta{position:absolute;top:23px;left:27px;right:27px;display:flex;justify-content:space-between;align-items:center;font-size:11px;line-height:1;letter-spacing:1.8px;font-weight:650;color:#8879b1}
.flash-face-meta>span:last-child{font-size:16px;letter-spacing:0;color:#a69ac3;font-variant-numeric:tabular-nums}
.flash-face .flash-kicker{font-size:11px;letter-spacing:1.8px;color:#7460b5;margin:0 0 19px}
.flash-face strong{font-size:22px;line-height:1.6;font-weight:550;white-space:pre-wrap;overflow-wrap:anywhere;width:100%;max-width:620px}
.flash-back strong{font-size:20px;line-height:1.7;font-weight:450}
.flash-face small{display:flex;gap:8px;justify-content:center;align-items:center;font-size:12px;line-height:1.5;color:#9384b4;margin-top:30px}
.flash-face small svg{width:17px;height:17px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.flash-card:focus-visible{outline:3px solid #4f46e5;outline-offset:7px}
.flash-card:not(.flipped):hover .flash-front,.flash-card.flipped:hover .flash-back{border-color:#7962c5}
.flash-actions{min-height:44px}
@media(max-width:600px){.flash-deck{margin:23px 5px 27px}.flash-face{padding:65px 23px 28px;min-height:325px}.flash-face strong{font-size:19px;line-height:1.65}.flash-back strong{font-size:17px;line-height:1.7}.flash-face-meta{left:21px;right:21px;top:22px}.flash-face small{font-size:11px;margin-top:25px;gap:6px}.flash-face .flash-kicker{font-size:10px;margin-bottom:16px}}
@media(prefers-reduced-motion:reduce){.flash-card-inner,.flash-count-options button{transition:none}}
.flash-actions .primary,.flash-done .primary{background:#4f46e5;background-image:none;box-shadow:none}
.flash-actions .primary:hover,.flash-done .primary:hover{background:#4338ca}
.flash-count-picker{margin-top:24px;padding:24px;border:1px solid #e2e8f0;border-radius:12px;background:#fff}
.flash-count-picker h3{margin:0;font-size:20px;line-height:28px;font-weight:600;color:#1e293b}
.flash-count-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}
.flash-count-options button{display:grid;grid-template-rows:30px 18px;align-content:center;justify-items:center;gap:6px;min-height:88px;padding:12px;border-radius:8px;transition:background-color .15s,border-color .15s}
.flash-count-options strong{font-size:24px;line-height:30px;font-weight:600}
.flash-count-options small{font-size:12px;line-height:18px}
.flash-count-options .flash-count-recommended{border-color:#4f46e5;background:#eef2ff;color:#4338ca}
.flash-count-options button:hover:not(:disabled){background:#eef2ff;border-color:#4f46e5}
.flash-count-picker p{margin:20px 0 0;color:#64748b;font-size:14px;line-height:22px}
@media(max-width:600px){.flash-count-picker{padding:20px 16px}.flash-count-options{gap:8px}.flash-count-options button{padding:12px 6px}.flash-count-options small{font-size:11px}}
