:root{--serif:ui-serif,"New York","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;--sans:-apple-system,BlinkMacSystemFont,ui-sans-serif,"Segoe UI",system-ui,sans-serif;--mono:ui-monospace,"SF Mono",Menlo,"Cascadia Code",Consolas,monospace;--ink:#2c2720;--soft:#857a66;--faint:#a99d86;--meta:#b8ad93;--card:#ebe1c9;--gbg:#ebe1c9;--radius:12px;--edge:#d8cbac;--edge2:#c9bda0;--accent:#2e5061;--accent-deep:#24404e;--on-accent:#f2ecdb;--you:#2e5061;--wife:#b3792f;--shadow:0 2px 1px #fff6 inset, 0 22px 42px -20px #000000b8}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}.app{background:radial-gradient(135% 100% at 50% -5%,#3a2f24 0%,#271f17 60%,#201a13 100%);flex-direction:column;align-items:center;min-height:100dvh;display:flex}.grain{pointer-events:none;z-index:60;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.topbar{z-index:2;justify-content:space-between;align-items:center;gap:10px;width:100%;max-width:500px;padding:15px 22px 4px;display:flex}.imprint{font-family:var(--serif);color:#e6dcc4;letter-spacing:.01em;font-size:1rem}.imprint b{font-weight:600}.help{color:#cfc3a8;font:inherit;letter-spacing:.04em;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff29;border-radius:999px;align-items:center;gap:8px;padding:7px 12px;font-size:.72rem;font-weight:600;display:flex}.help .sw{font-family:var(--mono);color:#9fc0d0;font-size:.66rem}.frame{width:100%;max-width:500px;padding:8px 22px calc(26px + env(safe-area-inset-bottom));z-index:1;flex-direction:column;flex:1;display:flex}.center{flex-direction:column;flex:1;justify-content:center;gap:18px;display:flex}.c-it{display:block}.c-en{font-family:var(--sans);letter-spacing:.1em;text-transform:uppercase;opacity:.6;margin-top:3px;font-size:.6rem;font-weight:600;display:block}[data-help=off] .c-en{display:none}.sub{justify-content:space-between;align-items:center;padding:2px 2px 0;display:flex}.count{font-family:var(--mono);color:var(--meta);font-variant-numeric:tabular-nums;letter-spacing:.04em;font-size:.74rem}.mode{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--meta);text-align:right;font-size:.66rem}.mode .c-en{text-align:right;color:var(--meta)}.card{background:var(--card);border:1px solid var(--edge);border-radius:var(--radius);text-align:center;box-shadow:var(--shadow);z-index:3;flex-direction:column;gap:16px;padding:36px 28px 32px;animation:.5s cubic-bezier(.2,.75,.3,1) deal;display:flex;position:relative}.card.tap{cursor:pointer}.deck{position:relative}.deck:before,.deck:after{content:"";border-radius:var(--radius);z-index:1;background:#e3d8be;border:1px solid #d3c6a5;position:absolute;inset:0}.deck:before{opacity:.8;transform:translateY(9px)rotate(1.4deg)scale(.985)}.deck:after{opacity:.9;transform:translateY(5px)rotate(-1deg)scale(.992)}.entry{flex-direction:column;align-items:center;gap:12px;display:flex}.abbr{font-family:var(--mono);letter-spacing:.14em;color:var(--soft);font-size:.72rem}.term{font-family:var(--serif);letter-spacing:.01em;text-wrap:balance;color:var(--ink);font-size:clamp(2.5rem,10.5vw,3.4rem);font-weight:500;line-height:1.03}.term.known{background:linear-gradient(var(--accent),var(--accent)) no-repeat 0 100%/100% 2px;padding-bottom:4px}.ipa{font-family:var(--mono);color:var(--soft);font-size:.9rem}.say{font-family:var(--serif);text-wrap:balance;color:var(--ink);font-size:clamp(1.55rem,6vw,2.05rem);font-weight:500}.cue{color:var(--soft);font-size:.88rem}.doneline{font-family:var(--serif);color:var(--soft);font-size:1.02rem;font-style:italic}.note{min-height:1.1em;color:var(--wife);font-size:.76rem;font-style:italic;font-family:var(--serif);text-align:center}.tap-hint{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-size:.64rem}.hear{cursor:pointer;font:inherit;color:var(--accent);border:1px solid var(--accent);background:0 0;border-radius:999px;align-self:center;align-items:center;gap:8px;padding:8px 15px;font-size:.82rem;transition:transform .1s;display:inline-flex}.hear:active{transform:scale(.96)}.hear svg{width:16px;height:16px}.hear.round{justify-content:center;width:48px;height:48px;padding:0}.hear.round svg{width:21px;height:21px}.seam{background:var(--edge);border:0;width:100%;height:1px}.answer{flex-direction:column;align-items:center;gap:13px;animation:.35s ink;display:flex}.glossit{font-family:var(--serif);color:var(--ink);font-size:clamp(1.5rem,6vw,1.95rem);font-style:italic}.forms{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.form{font-family:var(--mono);color:var(--soft);border-bottom:1px solid var(--edge);padding:0 2px 3px;font-size:.8rem}.byboth{color:var(--soft);font-size:.76rem;font-style:italic;font-family:var(--serif);align-items:center;gap:6px;display:inline-flex}.nib{border-radius:50%;width:8px;height:8px}.nib.you{background:var(--you)}.nib.wife{background:var(--wife)}.grade-bar{grid-template-columns:1fr 1.35fr 1fr;gap:10px;margin-top:2px;display:grid}.g{cursor:pointer;font:inherit;border-radius:var(--radius);border:1px solid var(--edge2);background:var(--gbg);color:var(--ink);flex-direction:column;align-items:center;gap:2px;padding:13px 6px;transition:transform .1s;display:flex}.g:active{transform:translateY(1px)}.g .gl{font-size:.98rem;font-weight:600}.g .gl .c-en{opacity:.6}.g .gt{font-family:var(--mono);color:var(--soft);margin-top:2px;font-size:.64rem}.g.bene{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.g.bene .gt{color:var(--on-accent);opacity:.72}.cta{background:var(--accent);width:100%;color:var(--on-accent);font:inherit;cursor:pointer;border-radius:var(--radius);border:none;padding:15px;font-size:1rem;font-weight:600;transition:background .15s,transform .1s}.cta:hover{background:var(--accent-deep)}.cta:active{transform:scale(.99)}.cta[disabled]{opacity:.45;cursor:default}.greet{font-family:var(--serif);font-size:clamp(2rem,8vw,2.5rem);font-weight:500}.figs{justify-content:center;gap:28px;display:flex}.fig{flex-direction:column;gap:1px;display:flex}.fig .n{font-family:var(--serif);font-variant-numeric:oldstyle-nums;font-size:2.1rem;line-height:1}.fig .n.ox{color:var(--accent)}.fig .k{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--soft);font-size:.62rem}.gauge{flex-direction:column;gap:6px;display:flex}.gauge .bar{background:var(--edge);height:3px;position:relative;overflow:hidden}.gauge .bar>i{background:var(--ink);width:34%;position:absolute;inset:0 auto 0 0}.gauge .cap{font-family:var(--mono);color:var(--soft);font-variant-numeric:tabular-nums;justify-content:space-between;font-size:.66rem;display:flex}.twoup{color:var(--soft);font-size:.8rem;font-style:italic;font-family:var(--serif);justify-content:center;align-items:center;gap:8px;display:inline-flex}.brand .big{font-family:var(--serif);font-size:2.4rem;font-weight:500}.brand .subt{color:var(--soft);font-size:.9rem;font-style:italic;font-family:var(--serif);margin-top:4px}.fields{text-align:left;flex-direction:column;gap:12px;display:flex}.fld{flex-direction:column;gap:5px;display:flex}.fld label{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--soft);font-size:.64rem}.fld input{font:inherit;color:var(--ink);border:none;border-bottom:1.5px solid var(--edge);background:0 0;padding:8px 2px;font-size:1rem;transition:border-color .15s}.fld input:focus{border-color:var(--accent);outline:none}.sentto{color:var(--soft);font-size:.86rem;line-height:1.45}.sentto b{color:var(--ink);font-weight:600}.code-in{font-family:var(--mono);letter-spacing:.55em;text-align:center;color:var(--ink);border:none;border-bottom:1.5px solid var(--edge);font-variant-numeric:tabular-nums;background:0 0;width:100%;padding:10px 0 10px .55em;font-size:2rem;transition:border-color .15s}.code-in:focus{border-color:var(--accent);outline:none}.code-wrap.err .code-in{border-color:var(--wife)}.errline{min-height:1.1em;color:var(--wife);font-size:.78rem;font-style:italic;font-family:var(--serif)}.hint{min-height:1.1em;color:var(--soft);font-family:var(--mono);letter-spacing:.06em;font-size:.66rem;font-style:normal}.linkrow{justify-content:space-between;align-items:center;gap:10px;display:flex}.qlink{cursor:pointer;font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--soft);background:0 0;border:none;padding:4px 2px;font-size:.66rem;transition:color .15s}.qlink:hover{color:var(--accent)}.qlink[disabled]{opacity:.4;cursor:default}.qlink.center{align-self:center}.qlink.iconlink{align-items:center;gap:6px;display:inline-flex}.qlink.iconlink svg{width:13px;height:13px}.sheet{text-align:left;gap:6px;padding-top:28px}.sheet-h{font-family:var(--serif);text-align:center;margin-bottom:6px;font-size:1.7rem;font-weight:500}.set-row{border-top:1px solid var(--edge);justify-content:space-between;align-items:center;gap:16px;padding:15px 2px;display:flex}.set-row:first-of-type{border-top:none}.set-label{color:var(--ink);font-size:.98rem}.set-label .c-en{opacity:.55}.set-sub{color:var(--soft);margin-top:2px;font-size:.74rem}.stepper{align-items:center;gap:10px;display:inline-flex}.step{border:1px solid var(--edge2);background:var(--gbg);width:34px;height:34px;color:var(--ink);font:inherit;cursor:pointer;border-radius:50%;place-items:center;font-size:1.1rem;line-height:1;transition:transform .1s;display:grid}.step:active{transform:scale(.94)}.stepval{font-family:var(--mono);text-align:center;font-variant-numeric:tabular-nums;min-width:1.4em;font-size:1.05rem}.chips{gap:6px;display:inline-flex}.chip{font-family:var(--mono);color:var(--soft);background:var(--gbg);border:1px solid var(--edge2);cursor:pointer;font-variant-numeric:tabular-nums;border-radius:999px;padding:6px 11px;font-size:.8rem;transition:all .12s}.chip.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.toggle{border:1px solid var(--edge2);background:var(--gbg);cursor:pointer;border-radius:999px;flex:none;width:46px;height:27px;transition:background .15s,border-color .15s;position:relative}.toggle:after{content:"";background:#fff;border-radius:50%;width:21px;height:21px;transition:transform .16s;position:absolute;top:2px;left:2px;box-shadow:0 1px 2px #00000040}.toggle.on{background:var(--accent);border-color:var(--accent)}.toggle.on:after{transform:translate(19px)}.idline{color:var(--soft);text-align:center;padding-top:6px;font-size:.8rem}.idline b{color:var(--ink);font-weight:600}.danger{border:1px solid var(--wife);width:100%;color:var(--wife);font:inherit;cursor:pointer;border-radius:var(--radius);background:0 0;margin-top:4px;padding:12px;font-size:.9rem;font-weight:600;transition:background .15s}.danger:hover{background:#b3792f14}.danger .c-en{opacity:.7}:focus-visible{outline-offset:3px;outline:2.5px solid #9fc0d0}@keyframes deal{0%{opacity:0;transform:translateY(12px)rotate(-.5deg)}to{opacity:1;transform:none}}@keyframes ink{0%{opacity:0;transform:translateY(5px)}to{opacity:1}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}@font-face{font-family:Fraunces;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/Fraunces-400-normal.woff2)format("woff2")}@font-face{font-family:Fraunces;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/Fraunces-500-normal.woff2)format("woff2")}@font-face{font-family:Fraunces;font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/Fraunces-400-italic.woff2)format("woff2")}@font-face{font-family:Fraunces;font-style:italic;font-weight:500;font-display:swap;src:url(/fonts/Fraunces-500-italic.woff2)format("woff2")}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/IBMPlexSans-400-normal.woff2)format("woff2")}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/IBMPlexSans-600-normal.woff2)format("woff2")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/IBMPlexMono-400-normal.woff2)format("woff2")}:root{--serif:"Fraunces",ui-serif,"New York","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;--sans:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,ui-sans-serif,"Segoe UI",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,"Cascadia Code",Consolas,monospace}
