@font-face{font-family:NSimSun;src:local(NSimSun),url(./NSimSun-BwZI9zUb.woff2)format("woff2"),url(./NSimSun-DmoPpjre.woff)format("woff"),url(./NSimSun-B96PSfcD.ttf)format("truetype")}:root{--color-bg:#f5eedc;--color-bg-dark:#e8dfc8;--color-card:#fefcf7;--color-card-edge:#f2eddf;--color-border:#2d8f2d;--color-border-dark:#1a6b1a;--color-text:#2c2825;--color-text-muted:#6b635b;--color-accent:#2e5a8c;--color-correct:#3a8a5c;--color-incorrect:#d44040;--color-stat-header:#4a4a4a;--color-stat-border:#8b8178;--color-input-border:#a09888;--color-settings-bg:#faf8f2;--spacing-sm:.25rem;--spacing-md:.5rem;--spacing-lg:1rem;--spacing-xl:1.5rem;--card-height:calc(73px * 8);--card-width:calc(52px * 8)}body{background-color:var(--color-bg);color:var(--color-text);min-height:100vh;padding:var(--spacing-lg);box-sizing:border-box;background-image:radial-gradient(at 20%,#ffffff26 0%,#0000 50%),radial-gradient(at 80% 20%,#ffffff1a 0%,#0000 50%),repeating-linear-gradient(0deg,#0000,#0000 2px,#8b816d08 2px 4px),repeating-linear-gradient(90deg,#0000,#0000 2px,#8b816d05 2px 4px);margin:0;font-family:Hiragino Sans,Hiragino Kaku Gothic ProN,Noto Sans JP,Helvetica Neue,Arial,sans-serif}.row{text-align:center;margin-top:var(--spacing-lg);justify-content:center;align-items:center;gap:var(--spacing-lg);flex-wrap:wrap;display:flex}#mode{color:var(--color-text);padding:var(--spacing-md) var(--spacing-lg);letter-spacing:.05em;margin:0;font-size:20px;font-weight:600;line-height:1.5rem}#card-outer{vertical-align:middle;text-align:left;height:var(--card-height);width:var(--card-width);box-sizing:border-box;background:#2d8f2d;border:none;border-radius:6px;padding:0;display:inline-block;position:relative;overflow:hidden;box-shadow:0 2px 8px #00000026,0 8px 24px #0000001a}#card-inner{box-sizing:border-box;z-index:1;background:#fff;border-radius:0;width:calc(100% - 20px);height:calc(100% - 20px);margin:10px;font-size:0;transition:opacity .15s ease-out;position:relative}.card-flip{animation:.25s ease-out cardBriefFade}@keyframes cardBriefFade{0%{opacity:1}30%{opacity:.6}to{opacity:1}}#card-inner>.char{text-align:center;width:33.3333%;height:20%;display:inline-block}#card-inner>.char>p{color:var(--color-text);font-family:Hiragino Mincho ProN,Hiragino Mincho Pro,Yu Mincho,Yu Mincho i18n,MS Mincho,Segoe Print,serif;font-size:60pt;font-weight:700;line-height:0%;transform:translateY(-15pt)}#card-inner>.char>p[style*="color: #8a8aff"],#card-inner>.char>p{transition:color .2s}@keyframes flashCorrect{0%{background-color:#fff}30%{background-color:#4caf50}60%{background-color:#66bb6a}to{background-color:#fff}}@keyframes flashIncorrect{0%{background-color:#fff}30%{background-color:#ef5350}60%{background-color:#e57373}to{background-color:#fff}}@keyframes shakeError{0%,to{transform:translate(0)}15%{transform:translate(-6px)}30%{transform:translate(6px)}45%{transform:translate(-4px)}60%{transform:translate(4px)}75%{transform:translate(-2px)}90%{transform:translate(2px)}}.flash-correct{animation:.7s ease-out flashCorrect}.flash-incorrect{animation:.7s ease-out flashIncorrect,.5s ease-out shakeError}#stats{top:calc(var(--card-height) / 2 + var(--spacing-xl));left:calc(50% + var(--card-width) / 2 + 60px);background:var(--color-card);border:1px solid var(--color-stat-border);padding:var(--spacing-md) var(--spacing-lg);border-radius:8px;font-size:.85rem;position:absolute;box-shadow:0 2px 12px #00000014}#stats table{border-collapse:collapse;width:100%;font-family:inherit;font-size:.85rem}#stats th,#stats td{border:1px solid var(--color-stat-border);text-align:center;padding:5px 10px}#stats th{background:var(--color-stat-header);color:#fff;letter-spacing:.03em;font-size:.8rem;font-weight:600}#stats td{font-variant-numeric:tabular-nums}#stats tr:last-child td{border-bottom:none}#stats tfoot tr td{background:#2e5a8c0d;font-weight:600}#input{text-align:center;width:260px;padding:var(--spacing-md) var(--spacing-lg);border:2px solid var(--color-input-border);background:var(--color-card);color:var(--color-text);border-radius:8px;margin:0;font-size:22px;font-weight:600;line-height:1.5rem;transition:border-color .2s,box-shadow .2s;box-shadow:inset 0 1px 3px #0000000f,0 1px #ffffff80}#input:focus{border-color:var(--color-accent);outline:none;box-shadow:inset 0 1px 3px #0000000f,0 0 0 3px #2e5a8c26}#input::placeholder{color:var(--color-text-muted);opacity:.6;font-weight:400}#switch,#forgot{text-align:center;padding:var(--spacing-md) var(--spacing-lg);border:2px solid var(--color-input-border);background:var(--color-card);cursor:pointer;border-radius:8px;margin:0;font-size:20px;line-height:1.25rem;transition:all .15s;box-shadow:0 1px 3px #0000000f}#switch:hover,#forgot:hover{border-color:var(--color-accent);background:#f0ebe0;transform:translateY(-1px);box-shadow:0 2px 6px #0000001a}#switch:active,#forgot:active{transform:translateY(0);box-shadow:0 1px 2px #00000014}#remaining{color:var(--color-text-muted);text-align:center;min-width:40px;font-size:16px;font-weight:600;display:inline-block}#settings,#mode1-settings,#mode2-settings{background:var(--color-settings-bg);z-index:1000;border-left:3px solid #2d8f2d;width:300px;height:100%;padding:1.5rem;font-size:.9rem;transition:transform .3s cubic-bezier(.4,0,.2,1);display:block;position:fixed;top:0;right:0;overflow-y:auto;transform:translate(100%);box-shadow:-4px 0 16px #0000001f}#settings.open{transform:translate(0)}#settings fieldset{border:1px solid var(--color-stat-border);padding:var(--spacing-lg);margin-bottom:var(--spacing-lg);background:#ffffff80;border-radius:6px}#settings legend{color:var(--color-text);padding:0 var(--spacing-sm);letter-spacing:.03em;font-size:.85rem;font-weight:600}#settings label{color:var(--color-text);font-weight:400;display:inline}#settings input[type=checkbox],#settings input[type=radio]{accent-color:#2d8f2d;margin-right:6px}#reset-stats{margin-top:var(--spacing-lg);width:100%;padding:var(--spacing-md);border:2px solid var(--color-incorrect);color:var(--color-incorrect);cursor:pointer;letter-spacing:.03em;background:#d4404014;border-radius:6px;font-size:.85rem;font-weight:600;transition:all .15s}#reset-stats:hover{background:#d4404026;border-color:#8c1d1f}@media (width<=768px){body{padding:var(--spacing-md)}.row{gap:var(--spacing-md)}#card-outer{transform-origin:top;transform:scale(.85)}#stats{margin-top:var(--spacing-xl);position:relative;top:auto;left:auto}#input{width:220px;font-size:18px}#settings{width:260px}}@media (width<=480px){#card-outer{transform:scale(.7)}#mode{font-size:16px}#input{width:180px;font-size:16px}#stats{font-size:.75rem}}@media print{.row:not(:first-child),#settings,#switch,#forgot{display:none!important}}