/*! UX by Example — © 2026 Chris Daniels. All rights reserved. */
.flashcards{margin-block-start:var(--space-l)}.flashcards__bar{display:flex;flex-wrap:wrap;gap:var(--space-m);justify-content:space-between;align-items:flex-start}.flashcards__filters{display:flex;flex-wrap:wrap;gap:var(--space-3xs)}.flashcards__chip{padding:var(--space-3xs) var(--space-s);font-size:var(--step--1);font-weight:600;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-button);transition:border-color .15s,background .15s}.flashcards__chip:hover{border-color:var(--accent)}.flashcards__chip[aria-pressed=true]{color:var(--on-accent);background:var(--accent);border-color:var(--accent)}.flashcards__tools{display:flex;flex-wrap:wrap;gap:var(--space-2xs)}.flashcards__tool{min-block-size:2.25rem;padding-block:var(--space-3xs);font-size:var(--step--1)}.flashcards__progress{margin-block-start:var(--space-m);color:var(--muted);font-size:var(--step--1)}.flashcards__stage{margin-block-start:var(--space-s)}.flashcard{perspective:1200px}.flashcard__inner{display:grid}.flashcard__face{grid-area:1/1;display:flex;flex-direction:column;gap:var(--space-s);min-block-size:11rem;padding:clamp(var(--space-m),4vw,var(--space-xl));background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-l);backface-visibility:hidden;-webkit-backface-visibility:hidden;transition:transform .5s}.flashcard__face--front{transform:rotateY(0)}.flashcard__face--back{transform:rotateY(180deg);background:var(--accent-soft)}.flashcard.is-flipped .flashcard__face--front{transform:rotateY(180deg)}.flashcard.is-flipped .flashcard__face--back{transform:rotateY(360deg)}.flashcard__role{color:var(--accent-strong)}.flashcard__content{font-size:var(--step-2);line-height:var(--leading-snug);color:var(--ink)}.flashcard__face--back .flashcard__content{font-family:var(--font-body);font-size:var(--step-1);line-height:var(--leading-body);font-weight:400}.flashcard__demo{margin-block-start:auto;font-weight:600}.flashcards__controls{display:flex;flex-wrap:wrap;gap:var(--space-s);margin-block-start:var(--space-m)}.flashcards__rate{display:flex;flex-wrap:wrap;gap:var(--space-s)}.flashcards__nav{display:flex;justify-content:space-between;gap:var(--space-s);margin-block-start:var(--space-m)}.flashcards__navbtn{padding:var(--space-2xs) var(--space-s);font-size:var(--step--1);font-weight:600;color:var(--muted);background:0 0;border:1px solid transparent;border-radius:var(--radius-button)}.flashcards__navbtn:not(:disabled):hover{color:var(--accent-strong);border-color:var(--line)}.flashcards__navbtn:disabled{opacity:.4;cursor:default}.flashcard--summary{display:flex;flex-direction:column;gap:var(--space-2xs);padding:clamp(var(--space-m),4vw,var(--space-xl));text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-l)}.flashcards__summary-score{font-family:var(--font-display);font-weight:700;font-size:var(--step-3);color:var(--accent-strong)}.flashcards__summary-msg{color:var(--muted)}.flashcards__reset{display:block;margin-block-start:var(--space-m);margin-inline:auto;font-size:var(--step--1);color:var(--muted)}@media (prefers-reduced-motion:reduce){.flashcard__face{transition:none}}