/* Card-only additions leave the parallel quiz and shared styles unchanged. */
#storage-status{margin:0;font-size:.78rem;color:var(--sub)}.recall-hint{font-size:.86rem;color:var(--sub);margin:12px 0}#word-rating{margin:8px 0}#keyword{display:block;width:100%;box-sizing:border-box;min-height:48px;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink);font:inherit}.card-results{padding:20px}.completion-banner{text-align:center;padding:24px 16px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,var(--soft),var(--card));position:relative}.completion-banner h2{font-size:clamp(1.4rem,5vw,2rem);color:var(--pri);margin:12px 0}.completion-banner p{margin:8px 0}.completion-medal{display:inline-grid;place-items:center;width:64px;height:64px;border:2px solid #b48a30;border-radius:50%;background:var(--card);color:var(--ok);font-size:2rem;font-weight:bold}.completion-stars{color:#997124;font-size:1.2rem}.card-counts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.card-counts>div{border:1px solid var(--line);border-radius:12px;padding:16px 10px;background:var(--soft);min-width:0}.card-counts dt{font-size:.85rem;color:var(--sub)}.card-counts dd{margin:8px 0 0;font-size:1.6rem;font-weight:700;color:var(--pri)}.result-actions{display:grid;gap:12px;margin-top:20px}.result-actions .btn{width:100%;min-height:48px;white-space:normal}#next-set{background:var(--pri);color:var(--pri-ink)}#all-complete{font-weight:bold;color:var(--pri)}[hidden]{display:none!important}#interactive .tn{font-size:.75rem}#card-results p{overflow-wrap:anywhere}@media(max-width:400px){.card-results{padding:16px}.completion-banner{padding:20px 10px}.card-counts{gap:10px}.card-counts dt{font-size:.8rem}}

.result-navigation{display:grid;grid-template-columns:1fr 1fr;gap:12px}.result-navigation a{display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;box-sizing:border-box}.result-navigation :focus-visible,.resume-cards:focus-visible{outline:3px solid var(--pri);outline-offset:3px}@media(max-width:400px){.result-navigation{grid-template-columns:1fr}}

/* Keep translations inside the card lane without clipping keyboard focus rings. */
.gesture-stage{overflow:clip;margin:-8px;padding:8px}
#card{position:relative;touch-action:pan-y pinch-zoom;transform-origin:center 25%;box-shadow:0 4px 12px rgb(0 0 0 / .07)}
#card-content{cursor:pointer}
#card-content a,#card-content summary{cursor:pointer}
.gesture-hint{font-size:.78rem;color:var(--sub);display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;margin:8px 0 16px}
.swipe-feedback{pointer-events:none;position:fixed;top:calc(16px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);width:min(360px,calc(100% - 32px));box-sizing:border-box;display:flex;align-items:center;gap:12px;padding:12px 16px;margin:0;border:2px solid var(--pri);border-radius:18px;background:var(--card);color:var(--pri);box-shadow:0 8px 28px rgb(0 0 0 / .18);z-index:1000}
.swipe-feedback[data-action=known]{border-color:var(--ok);color:var(--ok)}
.swipe-symbol{flex:0 0 42px;display:grid;place-items:center;width:42px;height:42px;border:2px solid currentColor;border-radius:50%;font-size:1.9rem;line-height:1;font-weight:800;background:var(--soft)}
.swipe-message{display:grid;gap:3px;min-width:0}
.swipe-title{font-size:1.65rem;line-height:1.2;font-weight:800;letter-spacing:.025em}
.swipe-copy{font-size:.875rem;line-height:1.45;font-weight:600;color:var(--sub);overflow-wrap:anywhere}
#word,#result-title{scroll-margin-top:calc(8rem + env(safe-area-inset-top,0px))}
#card[data-swipe=known]{outline:2px solid var(--ok);outline-offset:-2px}
#card[data-swipe=again]{outline:2px solid var(--pri);outline-offset:-2px}
#card.card-dragging{user-select:none;transition:none;will-change:transform}
#card.card-settling{transition:transform 180ms ease-out,opacity 180ms ease-out}
#card.card-entering{animation:card-arrive 160ms ease-out}
#card.card-flipping{animation:card-turn 140ms ease-out}
@keyframes card-arrive{from{opacity:.4}to{opacity:1}}
@keyframes card-turn{0%{transform:perspective(1000px) rotateY(5deg);opacity:.75}100%{transform:perspective(1000px) rotateY(0deg);opacity:1}}
@media(prefers-reduced-motion:reduce){#card.card-settling{transition:none}#card.card-entering,#card.card-flipping{animation:none}}

/* A small paper fold invites turning; the corner uses the same card tap action. */
#card-content{padding-bottom:14px}
#card-content::before,#card-content::after{content:"";position:absolute;right:0;bottom:0;width:36px;height:36px;pointer-events:none}
#card-content::before{background:var(--bg);clip-path:polygon(100% 0,100% 100%,0 100%)}
#card-content::after{background:linear-gradient(135deg,var(--soft),var(--line));clip-path:polygon(0 0,100% 0,0 100%);filter:drop-shadow(-2px -2px 2px rgb(0 0 0 / .12));border-top-left-radius:5px}

/* Decorative remaining cards never receive input or replace the active card. */
.gesture-stage{position:relative;isolation:isolate;padding-bottom:20px}
#card{z-index:1}
#card-stack{position:absolute;inset:8px 8px 20px;pointer-events:none;z-index:0}
.stack-sheet{position:absolute;inset:0;border:1px solid var(--line);border-radius:14px;background:var(--soft);box-shadow:0 2px 5px rgb(0 0 0 / .05);transform-origin:bottom center}
.stack-next{transform:translateY(5px) scaleX(.985);z-index:1}
.stack-after{transform:translateY(10px) scaleX(.97)}
#card-stack[data-count="1"] .stack-after{display:none}
.undo-action{display:flex;justify-content:flex-end;margin:4px 0 12px}
#undo-rating{font-size:.86rem;min-height:48px;white-space:normal}
.gesture-hint.hint-active{color:var(--pri);font-weight:700}
#card.card-first-hint{animation:first-card-hint 1400ms ease-in-out 1}
@keyframes first-card-hint{0%,100%{transform:none}25%{transform:translateX(6px) rotate(.5deg)}65%{transform:translateX(-6px) rotate(-.5deg)}}
@media(prefers-reduced-motion:reduce){#card.card-first-hint{animation:none}}

/* The footer has no final position until asynchronous card restoration finishes.
   Defer its paint without fixing the card height; failures reveal it too. */
.cards-loading .return-nav{visibility:hidden}
