/* Both faces share grid space so long definitions cannot overlap controls. */
button.flip-card{display:block;width:100%;margin:20px 0 12px;padding:0;background:transparent;box-shadow:none;border-radius:20px;perspective:1000px;text-align:center;touch-action:manipulation;color:#edf5ff}
button.flip-card:active:not(:disabled){transform:none}
.flip-inner{display:grid;transform-style:preserve-3d;transition:transform .38s ease;position:relative}
.flip-card.is-flipped .flip-inner{transform:rotateY(180deg)}
.flip-face{grid-area:1/1;display:flex;align-items:center;justify-content:center;min-height:220px;padding:28px;border:1px solid #527aa6;border-radius:20px;background:linear-gradient(140deg,#173a63,#102744);white-space:pre-wrap;overflow-wrap:anywhere;min-width:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;font-size:clamp(20px,3vw,28px);line-height:1.5;box-shadow:0 6px 0 #041022}
.flip-back{transform:rotateY(180deg);background:linear-gradient(140deg,#164853,#102e45);border-color:#6fb8bd;font-size:clamp(18px,2.5vw,24px)}
.flip-card:focus-visible{outline:3px solid #a2d4ff;outline-offset:6px}
@media(prefers-reduced-motion:reduce){.flip-inner{transition:none}}

/* Compact mobile file choices and an honest empty study state. */
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
.file-picker{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 16px;border:1px solid #7894b7;border-radius:13px;background:#18375d;color:#e9f4ff;font-weight:650;cursor:pointer;text-align:center}
.file-picker:has(+.visually-hidden:focus-visible){outline:3px solid #fff;outline-offset:4px}
.flashcard-empty{margin:18px 0 4px;padding:28px 20px;border:1px dashed #527aa6;border-radius:18px;background:#0b203d;color:#bfd0e8;text-align:center}
.study-filter{display:grid;gap:8px}.study-filter label{margin:0}.study-filter select{width:100%;min-height:44px;margin:0}
.backup-card{display:grid;gap:12px}.backup-card h2,.backup-card p{margin:0}.backup-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.backup-actions>*{margin:0}
@media(max-width:480px){.backup-actions{display:grid;grid-template-columns:1fr}.backup-actions>*{width:100%}.file-picker{width:100%}}
