:root{--bg:#eef0f3;--surface:#fff;--ink:#17223b;--muted:#5b6478;--line:#d9dde5;--accent:#f2c200;--accent-ink:#17223b;--focus:#2f5bd3;--again:#b3412c;--hard:#9a6412;--easy:#2c7a55;--alert:#b3412c;--trial:#b58900;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0f1522;--surface:#182033;--ink:#e9ecf2;--muted:#9aa3b5;--line:#28324a;--accent:#e8b900;--accent-ink:#141a28;--focus:#8fb0ff;--again:#f08a76;--hard:#e7b35a;--easy:#6fcf9e;--alert:#f08a76;--trial:#f2c200}}:root[data-theme=dark]{--bg:#0f1522;--surface:#182033;--ink:#e9ecf2;--muted:#9aa3b5;--line:#28324a;--accent:#e8b900;--accent-ink:#141a28;--focus:#8fb0ff;--again:#f08a76;--hard:#e7b35a;--easy:#6fcf9e;--alert:#f08a76;--trial:#f2c200}html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 170px)}*,:before,:after{box-sizing:inherit}body{background:var(--bg);color:var(--ink);margin:0;font-family:Karla,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.45}button,select{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.wrap{max-width:680px;margin:0 auto;padding:0 16px}header{top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);padding:14px 0 12px;position:sticky}.title{flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin:0 0 12px;display:flex}h1{letter-spacing:-.01em;margin:0;font-family:Literata,Georgia,serif;font-size:1.9rem;font-weight:600;line-height:1}.sub{color:var(--muted);font-size:.95rem}.modes{background:var(--surface);border:1px solid var(--line);border-radius:12px;grid-template-columns:repeat(5,1fr);gap:4px;padding:4px;display:grid}.modes button{appearance:none;cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:9px;padding:9px 4px;font-size:.86rem;font-weight:700;line-height:1.15}.modes button[aria-pressed=true]{background:var(--ink);color:var(--bg)}@media (width<=380px){.modes button{padding:8px 2px;font-size:.78rem}}.hint{color:var(--muted);margin:8px 2px 10px;font-size:.9rem}.tools{flex-wrap:wrap;gap:8px;display:flex}.tools select,.tools button,.pill{appearance:none;background:var(--surface);border:1px solid var(--line);cursor:pointer;border-radius:999px;padding:7px 14px;font-size:.92rem}.tools select,select.pill{background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 16px) 55%,calc(100% - 11px) 55%;background-repeat:no-repeat;background-size:5px 5px;max-width:100%;padding-right:30px}.tools button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:700}.note{border:1px dashed var(--muted);color:var(--muted);border-radius:10px;margin:14px 0 0;padding:10px 12px;font-size:.9rem;display:none}.note.show{display:block}main{padding:8px 0 40px}h2.level{border-top:3px solid var(--accent);margin:34px 2px 0;padding-top:6px;font-size:1.5rem;display:inline-block}h2{margin:26px 2px 8px;font-family:Literata,Georgia,serif;font-size:1.1rem;font-weight:600}ul{background:var(--surface);border:1px solid var(--line);border-radius:14px;margin:0;padding:0;list-style:none;overflow:hidden}li{border-top:1px solid var(--line);grid-template-columns:1fr auto;align-items:center;gap:12px;padding:14px 14px 14px 16px;display:grid}li:first-child{border-top:0}.primary{overflow-wrap:anywhere;margin:0}.listen .primary{font-family:Literata,Georgia,serif;font-size:1.28rem;line-height:1.3}.recall .primary{font-size:1.1rem;font-weight:500}.reveal{appearance:none;text-align:left;cursor:pointer;background:0 0;border:0;max-width:100%;margin:6px 0 0;padding:0;display:block}.mask{background:var(--accent);color:#0000;-webkit-box-decoration-break:clone;box-decoration-break:clone;border-radius:3px;padding:1px 4px;transition:background-color .25s,color .25s}.open .mask{background:0 0;padding-left:0;padding-right:0}.listen .mask{font-size:1rem}.listen .open .mask{color:var(--muted)}.recall .mask{font-family:Literata,Georgia,serif;font-size:1.28rem;line-height:1.35}.recall .open .mask{color:var(--ink)}.open .reveal{cursor:default}.play{appearance:none;border:1.5px solid var(--ink);cursor:pointer;background:0 0;border-radius:50%;flex:none;place-items:center;width:46px;height:46px;display:grid}.play svg{width:20px;height:20px}.play.speaking{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.recall li:not(.open) .play{visibility:hidden}footer{color:var(--muted);text-align:center;padding:0 0 30px;font-size:.85rem}@media (prefers-reduced-motion:reduce){.mask{transition:none}}.langs{color:var(--muted);align-items:center;gap:8px;margin:0 0 12px;display:flex}.langs select{flex:1;min-width:0}.langs select:disabled{opacity:1;cursor:default;background-image:none;padding-right:14px}.rom{opacity:.8;font-family:Karla,system-ui,sans-serif;font-size:.72em}.logo{vertical-align:-6px;margin-right:.34em;display:inline-block}.logo img{width:34px;height:34px;display:block}.statsbtn{align-self:center;margin-left:auto;padding:6px 12px;font-size:.85rem}.statsbtn[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}.stats-view .tools,.stats-view .hint{display:none}.card{background:var(--surface);border:1px solid var(--line);border-radius:16px;margin:14px 0;padding:16px}.card h3{margin:0 0 4px;font-family:Literata,Georgia,serif;font-size:1.1rem;font-weight:600}.card .sub{color:var(--muted);margin:0 0 12px;font-size:.86rem}.big{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.big div b{font-family:Literata,Georgia,serif;font-size:1.5rem;line-height:1.1;display:block}.big div span{color:var(--muted);font-size:.84rem}.advice{background:var(--bg);border-radius:10px;margin:12px 0 0;padding:10px 12px;font-size:.92rem}.advice.warn{background:color-mix(in srgb,var(--alert) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--alert) 40%,var(--line));color:var(--alert)}.advice.ok{background:color-mix(in srgb,var(--easy) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--easy) 40%,var(--line));color:var(--easy)}.error,.small.error{color:var(--alert)}.ok,.small.ok{color:var(--easy)}.trial,.small.trial,.pill.trial{color:var(--trial)}.pill.subscribe{background:color-mix(in srgb,var(--easy) 16%,var(--surface));border-color:color-mix(in srgb,var(--easy) 55%,var(--line));color:var(--easy);font-weight:700}.profilebtn[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--bg);font-weight:700}.legal{max-width:760px}.legal h1{margin:16px 0 4px;font-size:1.6rem}.legal h2{margin:20px 0 4px;font-size:1.05rem}.legal p{margin:8px 0;line-height:1.55}.legal ul{background:0 0;border:0;margin:8px 0;padding:0 0 0 20px;list-style:outside}.legal li{border:0;margin:5px 0;padding:0;line-height:1.5;display:list-item}.legal-links{color:var(--muted);text-align:center;padding:16px 0 30px;font-size:.85rem}.legal-links a{color:var(--muted)}.pill.danger{color:var(--alert);border-color:color-mix(in srgb,var(--alert) 55%,var(--line))}.pill.danger.solid{background:var(--alert);border-color:var(--alert);color:#fff;font-weight:700}.pill[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:700}.bars{grid-template-columns:repeat(7,1fr);align-items:end;gap:6px;height:130px;margin-top:6px;display:grid}.bars .col{flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;height:100%;display:flex}.bars .bar{background:var(--accent);border-radius:6px 6px 2px 2px;width:100%;min-height:2px}.bars small{color:var(--muted);font-size:.75rem}.bars b{font-size:.8rem;font-weight:700}.lvl{margin:10px 0}.lvl-head{justify-content:space-between;margin-bottom:4px;font-size:.9rem;display:flex}.lvl-head span{color:var(--muted)}.track{background:var(--line);border-radius:999px;height:10px;position:relative;overflow:hidden}.track i{border-radius:999px;position:absolute;top:0;bottom:0;left:0}.track .seen{background:color-mix(in srgb,var(--accent) 45%,transparent)}.track .solid{background:var(--accent)}.legend{color:var(--muted);gap:14px;margin-top:8px;font-size:.8rem;display:flex}.legend i{vertical-align:-1px;border-radius:3px;width:10px;height:10px;margin-right:5px;display:inline-block}.cal{grid-template-rows:repeat(7,1fr);grid-auto-columns:1fr;grid-auto-flow:column;gap:3px;max-width:420px;display:grid}.cal i{aspect-ratio:1;background:var(--line);border-radius:3px}.cal i.l1{background:color-mix(in srgb,var(--accent) 35%,var(--line))}.cal i.l2{background:color-mix(in srgb,var(--accent) 65%,var(--line))}.cal i.l3{background:var(--accent)}.cal i.today{outline:1.5px solid var(--ink);outline-offset:-1.5px}.hard{background:0 0;border:0;margin:0;padding:0;list-style:none}.hard li{border-top:1px solid var(--line);grid-template-columns:1fr auto;align-items:center;gap:10px;padding:10px 0;display:grid}.hard li:first-child{border-top:0}.hard .h-dst{font-family:Literata,Georgia,serif;font-size:1.05rem}.hard .h-src{color:var(--muted);font-size:.9rem}.hard .h-n{color:var(--again);font-size:.8rem;font-weight:700}.hard .play{width:40px;height:40px}.no-rom .rom{display:none}.rom{unicode-bidi:isolate}[dir=rtl].primary,[dir=rtl].rprimary,.reveal[dir=rtl],[dir=rtl].h-dst{text-align:right}.reveal[dir=rtl]{width:100%}.line [dir=rtl],.reveal[dir=rtl] .mask{unicode-bidi:plaintext}:lang(ja),:lang(zh),:lang(ko){font-family:Hiragino Sans,Hiragino Kaku Gothic ProN,PingFang SC,Noto Sans CJK JP,Noto Sans CJK SC,Noto Sans JP,Microsoft YaHei,Yu Gothic,Malgun Gothic,system-ui,sans-serif}:lang(ar),:lang(fa),:lang(ur){font-family:Geeza Pro,Noto Naskh Arabic,Noto Sans Arabic,Segoe UI,Tahoma,system-ui,sans-serif;line-height:1.7}:lang(he){font-family:Arial Hebrew,Noto Sans Hebrew,Segoe UI,system-ui,sans-serif}:lang(ru),:lang(uk),:lang(el){font-family:Literata,Georgia,Times New Roman,serif}.rom:lang(ja-Latn),.rom:lang(zh-Latn),.rom:lang(ko-Latn),.rom:lang(ar-Latn),.rom:lang(fa-Latn),.rom:lang(ur-Latn),.rom:lang(he-Latn){font-family:Karla,system-ui,sans-serif}.badge{background:var(--accent);min-width:1.5em;color:var(--accent-ink);vertical-align:1px;border-radius:999px;margin-left:6px;padding:0 .4em;font-size:.78rem;line-height:1.5em;display:inline-block}.badge[hidden],.review #shuffle,.review #all{display:none}.stats{grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0 14px;display:grid}.stats div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px}.stats b{font-family:Literata,Georgia,serif;font-size:1.5rem;font-weight:600;line-height:1.15;display:block}.stats span{color:var(--muted);font-size:.84rem}.rcard{background:var(--surface);border:1px solid var(--line);border-radius:16px;flex-direction:column;gap:12px;min-height:220px;padding:20px 18px;display:flex}.rtheme{color:var(--muted);align-items:center;gap:8px;margin:0;font-size:.86rem;display:flex}.tag{border:1px solid var(--accent);color:var(--ink);border-radius:999px;padding:0 8px;font-size:.78rem}.rprimary{overflow-wrap:anywhere;margin:0;font-size:1.35rem;font-weight:500}.dir-l .rprimary{font-family:Literata,Georgia,serif;font-size:1.6rem;font-weight:400;line-height:1.3}.rcard .reveal{margin:0}.dir-l .rcard .mask{font-size:1.1rem}.dir-r .rcard .mask{font-family:Literata,Georgia,serif;font-size:1.6rem;line-height:1.35}.review .open .mask{color:var(--ink)}.dir-l .rcard.open .mask{color:var(--muted)}.rcard .play{margin-top:auto}.line{display:block}.line+.line{margin-top:6px}.ear .line .mask,.dir-a .rcard .line .mask{font-family:Literata,Georgia,serif;font-size:1.25rem;line-height:1.35}.ear .sec .mask,.dir-a .rcard .sec .mask{font-family:Karla,system-ui,sans-serif;font-size:1rem}.ear .open .mask{color:var(--ink)}.ear .open .sec .mask,.dir-a .rcard.open .sec .mask{color:var(--muted)}.ear .play{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.earbox{align-items:center;gap:14px;margin:4px 0 6px;display:flex}.play.hero{background:var(--accent);border-color:var(--accent);width:72px;height:72px;color:var(--accent-ink)}.play.hero svg{width:30px;height:30px}.rcard .play.hero{margin-top:0}.taphint{color:var(--muted);text-align:center;margin:14px 0 0;font-size:.9rem}.grades{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px;display:grid}.grades button{appearance:none;background:var(--surface);border:1.5px solid var(--g);color:var(--g);cursor:pointer;border-radius:12px;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;font-weight:700;display:flex}.grades small{color:var(--muted);font-size:.8rem;font-weight:400}.g-otra{--g:var(--again)}.g-dificil{--g:var(--hard)}.g-bien{--g:var(--ink)}.g-facil{--g:var(--easy)}.done{background:var(--surface);border:1px solid var(--line);text-align:center;border-radius:16px;padding:26px 18px}.done p{color:var(--muted);margin:0 0 14px}.done .done-title{color:var(--ink);margin-bottom:6px;font-family:Literata,Georgia,serif;font-size:1.4rem}.panel{border-top:1px solid var(--line);gap:12px;margin-top:26px;padding-top:16px;display:grid}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.row label{color:var(--muted);width:100%;font-size:.9rem}.small{color:var(--muted);margin:0;font-size:.85rem}.toast{left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);opacity:0;pointer-events:none;text-align:center;z-index:10;border-radius:999px;max-width:calc(100% - 32px);padding:10px 16px;font-size:.92rem;transition:opacity .2s;position:fixed;transform:translate(-50%)}.toast.show{opacity:1}@media (width<=380px){.grades button{font-size:.9rem}}input[type=email],input[type=password],.field{appearance:none;background:var(--surface);border:1px solid var(--line);font:inherit;color:inherit;border-radius:10px;width:100%;padding:9px 12px}.check{color:var(--muted);margin:6px 0 0;padding:0;font-size:.85rem;list-style:none}.check li{margin-top:2px}.check li.ok{color:var(--easy)}.check-line{color:var(--muted);align-items:flex-start;gap:8px;margin-top:6px;font-size:.9rem;display:flex}.check-line input{margin-top:2px}.check-line a{color:inherit}.repeat .secondary{color:var(--muted);overflow-wrap:anywhere;margin:8px 0 0;font-size:1.15rem}.repeat-controls{justify-content:center;align-items:center;gap:18px;margin:16px 0 6px;display:flex}.repeat-controls .play{width:52px;height:52px}.repeat-controls .play svg{width:24px;height:24px}.repeat-controls .play.hero{width:72px;height:72px}.repeat-controls .play.hero svg{width:32px;height:32px}input[type=range]{min-width:120px;accent-color:var(--accent);flex:1}.panel input[type=number]{max-width:110px}
