@layer reset,tokens,base,layout;@layer components{.flashcards{--fc-scale:.7;--fc-blank:#000;gap:var(--space-3);display:grid;position:relative}.flashcards--message{justify-items:start}.flashcards__note,.flashcards__ways{color:var(--color-muted);margin:0}.flashcards__not-found{color:var(--color-muted);font-size:var(--text-sm);margin:0}.flashcards__token{color:var(--color-text)}.flashcards__stage{min-block-size:clamp(20rem,66dvh,52rem);padding:var(--space-5) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-sm);cursor:pointer;touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none;transition:background var(--duration-base) var(--ease-out);place-items:center;display:grid;position:relative;overflow:hidden}.flashcards__title{inset-block-start:var(--space-3);inset-inline:var(--space-4);color:var(--color-faint);font-size:var(--text-sm);text-overflow:ellipsis;white-space:nowrap;transition:opacity var(--duration-base) var(--ease-out);margin:0;font-weight:500;position:absolute;overflow:hidden}.flashcards__card-wrap{inline-size:100%}.flashcards__card{text-align:center;justify-items:center;gap:clamp(.5rem,2vmin,1.5rem);display:grid}.flashcards__face{max-inline-size:100%}.flashcards__face--hidden{visibility:hidden}.flashcards__hanzi{color:var(--color-text);overflow-wrap:anywhere;line-height:1.15;display:block}.flashcards__hanzi--len-1{font-size:clamp(5rem, calc(var(--fc-scale) * 50vmin), 40rem)}.flashcards__hanzi--len-2{font-size:clamp(3.5rem, calc(var(--fc-scale) * 38vmin), 30rem)}.flashcards__hanzi--len-3{font-size:clamp(3rem, calc(var(--fc-scale) * 28vmin), 22rem)}.flashcards__hanzi--len-4{font-size:clamp(2.5rem, calc(var(--fc-scale) * 21vmin), 17rem)}.flashcards__hanzi--len-long{font-size:clamp(2rem, calc(var(--fc-scale) * 13vmin), 11rem)}.flashcards__reading{color:var(--color-accent);font-size:clamp(1.5rem, calc(var(--fc-scale) * 8vmin), 5.5rem);margin:0;line-height:1.3}.flashcards__face--front .flashcards__reading{font-size:clamp(2rem, calc(var(--fc-scale) * 12vmin), 8rem)}.flashcards__reading .zhuyin{font-size:.55em}.flashcards__fallback{display:none}:root[data-lang=yue] .flashcards__fallback{color:var(--color-muted);font-size:max(var(--text-sm), .3em);display:block}.flashcards__meaning{max-inline-size:32ch;color:var(--color-text);font-size:clamp(1.125rem, calc(var(--fc-scale) * 5.5vmin), 4rem);text-wrap:balance;margin:0;line-height:1.3}.flashcards__face--front .flashcards__meaning{font-size:clamp(1.5rem, calc(var(--fc-scale) * 8vmin), 6rem)}.flashcards__meaning--none{color:var(--color-faint);font-style:italic}.flashcards--blank .flashcards__stage{border-color:var(--fc-blank);background:var(--fc-blank)}.flashcards--blank .flashcards__card-wrap,.flashcards--blank .flashcards__title{visibility:hidden}@media (prefers-reduced-motion:no-preference){.flashcards__card{animation:flashcards-in var(--duration-base) var(--ease-out)}.flashcards__face{transition:opacity var(--duration-base) var(--ease-out)}.flashcards__face--hidden{opacity:0}}@keyframes flashcards-in{0%{opacity:0;transform:translateY(.5rem)}}.flashcards__toolbar{justify-content:center;align-items:center;gap:var(--space-2) var(--space-4);transition:opacity var(--duration-base) var(--ease-out);flex-wrap:wrap;display:flex}.flashcards__group{justify-content:center;align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.flashcards__btn{block-size:44px;inline-size:44px}.flashcards__btn svg{block-size:1.25rem;inline-size:1.25rem}.flashcards__chevron--prev{transform:rotate(90deg)}.flashcards__chevron--next{transform:rotate(-90deg)}.flashcards__btn[aria-disabled=true]{opacity:.45;cursor:default}.flashcards__position{min-inline-size:4.5rem;color:var(--color-muted);font-variant-numeric:tabular-nums;text-align:center;font-weight:600}.flashcards__end{color:var(--color-jade)}.flashcards__toggle[aria-pressed=true]{border-color:var(--color-jade);background:var(--color-jade-soft);color:var(--color-jade)}.flashcards__help{z-index:var(--z-popover);inline-size:min(27rem, calc(100% - 2 * var(--space-3)));max-block-size:calc(100% - 2 * var(--space-3));padding:var(--space-3) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-lg);text-align:start;position:absolute;inset-block-start:var(--space-3);inset-inline-end:var(--space-3);overflow:auto}.flashcards__help-title{margin:0 0 var(--space-2);font-weight:600}.flashcards__keys{border-collapse:collapse;inline-size:100%;font-size:var(--text-sm)}.flashcards__keys th,.flashcards__keys td{padding:var(--space-1) 0;text-align:start;vertical-align:baseline;font-weight:400}.flashcards__keys th{padding-inline-end:var(--space-3)}.flashcards__keys kbd{border:1px solid var(--color-border-strong);border-radius:calc(var(--radius-sm) / 2);background:var(--color-bg);min-inline-size:1.75em;font:inherit;font-size:var(--text-xs);text-align:center;white-space:nowrap;border-block-end-width:2px;margin-block:1px;padding:0 .4em;line-height:1.7;display:inline-block}.flashcards__help-touch{margin:var(--space-2) 0 0;color:var(--color-muted);font-size:var(--text-xs)}:root[data-immersive],:root[data-immersive] body{overflow:hidden}:root[data-immersive] :is(.site-header,.site-footer,.skip-link,.page-header),:root[data-immersive] .flashcards__not-found{display:none}:root[data-immersive] .flashcards{--fc-scale:1;z-index:var(--z-overlay);background:var(--color-bg);gap:0;position:fixed;inset:0}:root[data-immersive] .flashcards__stage{block-size:100dvh;min-block-size:0;padding:var(--space-5) var(--space-4) var(--space-6);background:var(--color-bg);box-shadow:none;border:none;border-radius:0}:root[data-immersive] .flashcards--blank .flashcards__stage{background:var(--fc-blank)}:root[data-immersive] .flashcards__toolbar{padding:var(--space-2) var(--space-3) max(var(--space-2), env(safe-area-inset-bottom));background:color-mix(in srgb, var(--color-bg) 88%, transparent);position:absolute;inset-block-end:0;inset-inline:0}.flashcards--idle .flashcards__toolbar:not(:focus-within),.flashcards--idle .flashcards__title{opacity:0;pointer-events:none}.flashcards--idle .flashcards__stage{cursor:none}@media (width<=640px){.flashcards__stage{padding:var(--space-5) var(--space-3) var(--space-4)}.flashcards__toolbar{gap:var(--space-2)}:root[data-immersive] .flashcards__group--options{display:none}}}@layer utilities;