.my-flashcards {
  --fc-ink: #1d2945;
  --fc-muted: #566079;
  --fc-line: #d9dce5;
  --fc-purple: #65578b;
  color: var(--fc-ink);
  max-width: 850px;
  margin: 0 auto;
  font-family: inherit;
  line-height: 1.6;
}
.my-flashcards *, .my-flashcards *::before, .my-flashcards *::after { box-sizing: border-box; }
.my-flashcards [hidden] { display: none !important; }
.my-flashcards button, .my-flashcards input, .my-flashcards select { font: inherit; }
.my-flashcards button, .my-flashcards select, .my-flashcards input { max-width: 100%; }
.my-flashcards :focus-visible { outline: 3px solid #a68a40; outline-offset: 4px; }
.my-fc-toolbar { display: flex; align-items: end; gap: 12px; margin-bottom: 14px; }
.my-fc-search-label { display: grid; gap: 5px; flex: 1; font-size: 13px; font-weight: 700; min-width: 0; color: var(--fc-muted); }
.my-fc-search { width: 100%; min-height: 46px; padding: 10px 14px; border: 1px solid var(--fc-line); border-radius: 12px; background: #fff; color: var(--fc-ink); font-size: 16px !important; }
.my-fc-search::placeholder { color: #737988; opacity: 1; }
.my-fc-button { min-height: 46px; padding: 10px 17px; border: 1px solid var(--fc-line); border-radius: 12px; background: #fff; color: var(--fc-ink); font-weight: 700 !important; cursor: pointer; transition: border-color .18s, background .18s, transform .18s; touch-action: manipulation; }
.my-fc-button:hover:not(:disabled) { border-color: #aa9bc5; background: #f5f1fc; }
.my-fc-button:active:not(:disabled) { transform: translateY(1px); }
.my-fc-button:disabled { cursor: default; opacity: .45; }
.my-fc-deckline { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.my-fc-select-label { display: grid; gap: 4px; flex: 1; min-width: 0; color: var(--fc-muted); font-size: 12px; font-weight: 600; }
.my-fc-select { appearance: none; width: 100%; min-height: 44px; border: 1px solid transparent; border-radius: 12px; background: #f0edf5; color: var(--fc-ink); padding: 8px 12px; font-size: 14px !important; }
.my-fc-counter { font-size: 14px; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; padding: 9px 2px 9px 10px; color: var(--fc-purple); }
.my-fc-card { position: relative; perspective: 1600px; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; border-radius: 24px; }
.my-fc-inner { display: grid; transform-style: preserve-3d; transition: transform .55s cubic-bezier(.2,.65,.2,1); }
.my-fc-card.is-flipped .my-fc-inner { transform: rotateY(180deg); }
.my-fc-face { grid-area: 1 / 1; min-width: 0; min-height: 390px; padding: 34px 40px; border-radius: 24px; border: 1px solid #d9d1be; background: #fffdf7; backface-visibility: hidden; -webkit-backface-visibility: hidden; overflow-wrap: anywhere; box-shadow: 0 12px 34px #1d29450b; }
.my-fc-front { display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; background: radial-gradient(ellipse at top left, #f4ead5 0, transparent 60%), #fffdf7; }
.my-fc-eyebrow { color: #7a6537; font-size: 11px; letter-spacing: .15em; font-weight: 800; }
.my-fc-term { font-size: clamp(27px, 4.8vw, 43px); font-weight: 800; line-height: 1.23; letter-spacing: -.025em; margin: 34px 0 15px; max-width: 620px; color: #1b2844; }
.my-fc-pos { display: inline-block; padding: 5px 14px; border-radius: 20px; background: #efeaf7; color: #63527e; font-size: 14px; }
.my-fc-tap { margin-top: 35px; font-size: 13px; color: #746b56; }
.my-fc-back { transform: rotateY(180deg); background: #fff; border-color: #d8d1e6; }
.my-fc-back-term { color: var(--fc-purple); font-size: 23px; font-weight: 800; line-height: 1.3; margin-bottom: 22px; }
.my-fc-detail + .my-fc-detail { margin-top: 18px; }
.my-fc-label { display: block; font-size: 10px; font-weight: 800; letter-spacing: .12em; color: #716a81; }
.my-fc-detail p { margin: 5px 0 0; font-size: 16px; line-height: 1.65; color: var(--fc-ink); }
.my-fc-meaning-block { padding: 12px 16px; border-left: 3px solid #bca063; background: #f9f5e9; border-radius: 0 10px 10px 0; }
.my-fc-meaning-block .my-fc-meaning { font-weight: 750; }
.my-fc-detail .my-fc-translation { color: #5f6678; font-size: 15px; margin-top: 8px; }
.my-fc-navigation { display: grid; grid-template-columns: 1fr 1.3fr 1fr; gap: 12px; margin-top: 20px; }
.my-fc-navigation .my-fc-flip { background: #eee7f8; border-color: #c9bcdd; color: #433359; }
.my-fc-navigation .my-fc-flip:hover:not(:disabled) { background: #e5dbf3; }
.my-fc-learning-tools { display: flex; justify-content: space-between; gap: 15px; padding-top: 22px; margin-top: 22px; border-top: 1px solid var(--fc-line); }
.my-fc-audio { display: flex; flex-direction: column; align-items: start; gap: 12px; }
.my-fc-auto-label { display: flex; align-items: center; gap: 8px; color: var(--fc-muted); cursor: pointer; font-size: 13px; }
.my-fc-auto { margin: 0; width: 18px; height: 18px; accent-color: var(--fc-purple); }
.my-fc-progress-buttons { display: flex; gap: 8px; flex-wrap: wrap; align-content: start; justify-content: end; }
.my-fc-known[aria-pressed="true"] { background: #e4f1e7; border-color: #789b82; color: #254c32; }
.my-fc-practice[aria-pressed="true"] { background: #fbefd7; border-color: #b59c63; color: #695024; }
.my-fc-progress-note { margin: 20px 0 0; color: var(--fc-muted); font-size: 12px; }
.my-fc-keyboard { margin: 6px 0 0; color: var(--fc-muted); font-size: 12px; }
.my-fc-status { min-height: 22px; font-size: 13px; color: #5f507d; margin: 12px 0 0; }
.my-fc-empty { padding: 65px 24px; border: 1px dashed #c8bdd6; border-radius: 20px; text-align: center; background: #f8f5fc; color: var(--fc-muted); }
@media (max-width: 580px) {
  .my-fc-face { min-height: 355px; padding: 27px 24px; border-radius: 20px; }
  .my-fc-term { margin-top: 28px; }
  .my-fc-back-term { font-size: 21px; margin-bottom: 18px; }
  .my-fc-detail p { font-size: 15px; }
  .my-fc-detail .my-fc-translation { font-size: 14px; }
  .my-fc-learning-tools { flex-direction: column; }
  .my-fc-audio { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .my-fc-progress-buttons { justify-content: stretch; }
  .my-fc-progress-buttons .my-fc-button { flex: 1; }
  .my-fc-button { padding: 10px 13px; font-size: 14px !important; }
  .my-fc-navigation { gap: 8px; }
  .my-fc-keyboard { display: none; }
}
@media (max-width: 360px) {
  .my-fc-face { padding: 24px 19px; }
  .my-fc-toolbar { gap: 8px; }
  .my-fc-shuffle { padding-right: 10px; padding-left: 10px; }
  .my-fc-eyebrow { font-size: 9px; letter-spacing: .1em; }
  .my-fc-navigation .my-fc-button { padding: 10px 7px; }
}
@media (prefers-reduced-motion: reduce) {
  .my-fc-inner, .my-fc-button { transition: none; }
}

@media(max-width:760px){.my-fc-select{font-size:16px!important}}