:root{--purple: #6C5CE7;--purple-2: #8E7BFF;--orange: #F9A826;--green: #27C46B;--red: #FF6B6B;--blue: #4DA3FF;--ink: #2D3436;--muted: #7A828B;--bg: #F4F5FB;--card: #FFFFFF;--shadow: 0 8px 24px rgba(80, 70, 180, .12);--radius: 22px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--tabbar-h: 64px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%}body{font-family:-apple-system,SF Pro Rounded,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--ink);overscroll-behavior:none;-webkit-user-select:none;user-select:none;touch-action:manipulation}#app{min-height:100dvh;padding:calc(var(--safe-top) + 12px) 16px calc(var(--safe-bottom) + var(--tabbar-h) + 16px);max-width:560px;margin:0 auto}.hidden{display:none!important}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.topbar h1{font-size:22px;margin:0;letter-spacing:.2px}.topbar .logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:20px}.topbar .logo .lg{font-size:26px}.chip{display:inline-flex;align-items:center;gap:5px;background:var(--card);border-radius:999px;padding:7px 12px;font-weight:700;font-size:14px;box-shadow:var(--shadow)}.chip.fire{color:#e8590c}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;margin-bottom:16px}.btn{border:0;border-radius:18px;padding:16px 20px;font-size:17px;font-weight:700;min-height:56px;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;color:#fff;cursor:pointer;box-shadow:0 6px #00000029;transition:transform .08s ease,filter .15s ease}.btn:active{transform:translateY(3px);filter:brightness(.95);box-shadow:0 2px #00000029}.btn.purple{background:var(--purple)}.btn.orange{background:var(--orange)}.btn.green{background:var(--green)}.btn.red{background:var(--red)}.btn.blue{background:var(--blue)}.btn.ghost{background:#eeecff;color:var(--purple);box-shadow:none}.btn.ghost2{background:#e8f7ee;color:#1e8e52;box-shadow:none}.btn.small{min-height:44px;padding:10px 16px;font-size:15px;border-radius:14px}.btn:disabled{opacity:.45}.modes{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mode-tile{border:0;text-align:center;padding:16px;border-radius:var(--radius);color:#fff;min-height:108px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;cursor:pointer;box-shadow:0 6px #00000024;transition:transform .08s ease}.mode-tile:active{transform:translateY(3px)}.mode-tile .mi{font-size:30px;line-height:1}.mode-tile .mt{font-weight:800;font-size:16px}.mode-tile .ms{font-size:12.5px;opacity:.92;font-weight:600}.mode-tile.t-learn{background:linear-gradient(135deg,#6c5ce7,#8e7bff)}.mode-tile.t-picture{background:linear-gradient(135deg,#ff9f1a,#ff6b6b)}.mode-tile.t-mean{background:linear-gradient(135deg,#12b5cb,#4da3ff)}.mode-tile.t-review{background:linear-gradient(135deg,#27c46b,#12b886)}.mode-tile .badge{position:absolute}.hero{display:flex;align-items:center;gap:16px}.ring{position:relative;width:108px;height:108px;flex:none}.ring svg{width:108px;height:108px;transform:rotate(-90deg)}.ring .ring-txt{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:800}.ring .ring-txt b{font-size:22px}.ring .ring-txt span{font-size:11px;color:var(--muted);font-weight:700}.hero .htxt{flex:1}.hero .htxt h2{margin:0 0 6px;font-size:19px}.hero .htxt p{margin:0;color:var(--muted);font-size:14px;line-height:1.45}.goalbar{height:12px;background:#ececf6;border-radius:999px;overflow:hidden;margin-top:10px}.goalbar>div{height:100%;background:linear-gradient(90deg,var(--green),#12B886);border-radius:999px;transition:width .4s ease}.session-top{display:flex;align-items:center;gap:12px;margin-bottom:16px}.session-top .quit{border:0;background:var(--card);border-radius:14px;padding:10px 14px;font-size:17px;font-weight:800;box-shadow:var(--shadow);cursor:pointer}.progress-track{flex:1;height:14px;background:#ececf6;border-radius:999px;overflow:hidden}.progress-track>div{height:100%;background:var(--purple-2);border-radius:999px;transition:width .3s}.session-count{font-weight:800;color:var(--muted);font-size:14px;min-width:52px;text-align:right}.flashcard{position:relative;background:var(--card);border-radius:28px;min-height:380px;padding:26px 20px;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin-bottom:16px;transition:transform .18s ease}.flashcard .big-emoji{font-size:96px;line-height:1.15}.flashcard .word{font-size:40px;font-weight:800;margin:10px 0 4px;letter-spacing:-.5px}.flashcard .ipa{color:var(--muted);font-size:16px;margin-bottom:4px}.flashcard .pos{color:#fff;background:var(--blue);font-size:12.5px;font-weight:700;padding:3px 12px;border-radius:999px;margin-top:8px}.flashcard .meaning{font-size:24px;font-weight:700;margin-top:14px;color:var(--purple)}.flashcard .example{margin-top:14px;font-size:15px;color:var(--muted);font-style:italic;line-height:1.5}.flashcard .example b{color:var(--ink)}.letter-tile{font-size:72px;font-weight:900;color:#fff;width:132px;height:132px;display:flex;align-items:center;justify-content:center;border-radius:30px;background:linear-gradient(135deg,var(--purple),#4DA3FF)}.replay{border:0;background:#eeecff;color:var(--purple);font-size:18px;font-weight:800;border-radius:999px;padding:14px 22px;margin-top:18px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;box-shadow:var(--shadow)}.replay:active{transform:scale(.96)}.quiz-word{text-align:center;margin:8px 0 18px}.quiz-word .qw{font-size:34px;font-weight:800}.quiz-word .qi{color:var(--muted);font-size:15px}.quiz-word .speakspeak{margin-top:10px}.grid4{display:grid;grid-template-columns:1fr 1fr;gap:14px}.pic-tile{border:0;background:var(--card);border-radius:24px;padding:18px 10px;min-height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;cursor:pointer;box-shadow:var(--shadow);position:relative;transition:transform .1s ease}.pic-tile:active{transform:scale(.97)}.pic-tile .pe{font-size:64px;line-height:1.2}.pic-tile .pe-img{width:96px;height:96px;object-fit:contain;border-radius:12px}.pic-tile.correct{background:#e4f9ee;outline:4px solid var(--green);animation:pop .35s ease}.pic-tile.wrong{background:#ffe9e9;outline:4px solid var(--red);animation:shake .4s ease}.pic-tile .pt-label{font-weight:700;color:var(--muted);font-size:13px}.letter-tile.sm{font-size:40px;width:78px;height:78px;border-radius:20px}.mean-tile{border:0;background:var(--card);border-radius:20px;padding:16px;min-height:72px;font-size:17px;font-weight:700;text-align:left;box-shadow:var(--shadow);cursor:pointer;width:100%;color:var(--ink)}.mean-tile.correct{background:#e4f9ee;outline:4px solid var(--green);animation:pop .35s}.mean-tile.wrong{background:#ffe9e9;outline:4px solid var(--red);animation:shake .4s}@keyframes pop{0%{transform:scale(1)}45%{transform:scale(1.07)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-8px)}75%{transform:translate(8px)}}.grade-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:4px}.grade-grid .btn{padding:12px 6px;min-height:64px;flex-direction:column;gap:2px;font-size:15px;box-shadow:0 4px #00000029}.grade-grid .btn small{font-size:11px;font-weight:700;opacity:.9}.btn.g-again{background:var(--red)}.btn.g-hard{background:#f4900c}.btn.g-good{background:var(--green)}.btn.g-easy{background:var(--blue)}#tabbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;justify-content:space-around;align-items:stretch;height:calc(var(--tabbar-h) + var(--safe-bottom));padding:0 8px var(--safe-bottom);background:#ffffffeb;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid #E9E9F2}#tabbar .tab{border:0;background:none;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:11px;font-weight:700;color:var(--muted);cursor:pointer;padding:6px 0;position:relative}#tabbar .tab .tab-ic{font-size:22px}#tabbar .tab.active{color:var(--purple)}#tabbar .tab .n-badge{position:absolute;top:5px;left:calc(50% + 8px);background:var(--red);color:#fff;border-radius:999px;font-size:10px;padding:2px 6px;font-weight:800;line-height:1}#toast{position:fixed;left:50%;transform:translate(-50%);bottom:calc(var(--safe-bottom) + 84px);background:var(--ink);color:#fff;padding:12px 18px;border-radius:14px;font-weight:700;font-size:14.5px;z-index:99;max-width:86vw;text-align:center;box-shadow:0 10px 30px #00000040;opacity:0;transition:opacity .25s ease}#toast.show{opacity:1}.confetti{position:fixed;top:-12px;z-index:98;font-size:18px;animation:fall linear forwards}@keyframes fall{to{transform:translateY(105vh) rotate(540deg);opacity:.7}}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}.stat-box{background:var(--card);border-radius:18px;padding:12px 8px;text-align:center;box-shadow:var(--shadow)}.stat-box b{display:block;font-size:22px}.stat-box span{font-size:11.5px;color:var(--muted);font-weight:700}.bar-row{display:flex;align-items:center;gap:10px;margin:10px 0;font-size:14px;font-weight:700}.bar-row .br-label{min-width:108px;color:var(--muted)}.bar-row .br-track{flex:1;height:12px;background:#ececf6;border-radius:999px;overflow:hidden}.bar-row .br-track>div{height:100%;border-radius:999px}.list-item{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--card);border-radius:18px;padding:14px 16px;margin-bottom:10px;box-shadow:var(--shadow);font-weight:700;font-size:15px}.list-item .li-sub{display:block;color:var(--muted);font-weight:600;font-size:12.5px;margin-top:3px}.stepper{display:flex;align-items:center;gap:12px}.stepper button{width:38px;height:38px;border-radius:12px;border:0;background:#eeecff;color:var(--purple);font-size:20px;font-weight:800;cursor:pointer}.stepper b{min-width:26px;text-align:center;font-size:17px}.search-input{width:100%;border:0;background:var(--card);border-radius:16px;padding:14px 16px;font-size:16px;font-weight:600;box-shadow:var(--shadow);margin-bottom:12px;-webkit-user-select:text;user-select:text}.word-row{display:flex;align-items:center;gap:12px;background:var(--card);border-radius:16px;padding:12px 14px;margin-bottom:8px;box-shadow:var(--shadow)}.word-row .wr-em{font-size:28px;width:36px;text-align:center;flex:none}.word-row .wr-main{flex:1;min-width:0}.word-row .wr-w{font-weight:800;font-size:16.5px}.word-row .wr-vi{color:var(--muted);font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.word-row .wr-state{flex:none;font-size:18px}.wr-speaker{border:0;background:#eeecff;color:var(--purple);width:40px;height:40px;border-radius:999px;font-size:17px;cursor:pointer;flex:none}.summ-emoji{font-size:78px;text-align:center;margin:10px 0}.summ-title{text-align:center;font-size:24px;font-weight:800;margin:0 0 6px}.summ-sub{text-align:center;color:var(--muted);font-weight:600;margin:0 0 18px}.intro-hero{text-align:center;padding:30px 6px 10px}.intro-hero .ih-emoji{font-size:92px}.intro-hero h2{font-size:26px;margin:12px 0 8px}.intro-hero p{color:var(--muted);font-weight:600;line-height:1.5;margin:0 0 22px}@media (min-width: 700px){.grid4,.modes{grid-template-columns:repeat(4,1fr)}.mode-tile{min-height:150px}}.deck-row{display:flex;gap:8px;overflow-x:auto;padding:4px 16px 8px;scrollbar-width:none}.deck-row::-webkit-scrollbar{display:none}.deck-chip{flex:0 0 auto;display:flex;flex-direction:column;gap:1px;align-items:flex-start;background:#fff;border:2px solid var(--line, #E7E7F2);border-radius:16px;padding:8px 14px;font:inherit;cursor:pointer}.deck-chip .dc-name{font-weight:800;font-size:13.5px;color:#333}.deck-chip .dc-n{font-weight:700;font-size:12px;color:var(--muted)}.deck-chip.active{border-color:var(--primary, #6C5CE7);background:#f3f2fd}.deck-chip.active .dc-name{color:var(--primary, #6C5CE7)}.deck-chip.add{border-style:dashed;color:var(--muted);justify-content:center}.deck-chip.all{flex-direction:row;align-items:center;gap:4px;color:var(--primary, #6C5CE7);background:#f3f2fd;border-color:transparent}.deck-chip.all .dc-name{color:var(--primary, #6C5CE7)}#deck-sheet{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90}#deck-sheet .ds-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#14122673}#deck-sheet .ds-panel{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:20px 20px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom));max-height:72vh;display:flex;flex-direction:column;animation:dsUp .22s ease}@keyframes dsUp{0%{transform:translateY(48px);opacity:.4}to{transform:none;opacity:1}}#deck-sheet .ds-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;font-size:16px}#deck-sheet .ds-head b{font-size:16px}#deck-sheet .ds-close{border:none;background:#f1f0fa;color:#555;width:30px;height:30px;border-radius:50%;font-size:13px;cursor:pointer;font:inherit;line-height:1}#deck-sheet .ds-list{overflow-y:auto;display:grid;gap:6px}#deck-sheet .ds-row{display:flex;align-items:center;gap:10px;text-align:left;border:2px solid #ECECF6;background:#fff;border-radius:14px;padding:10px 12px;font:inherit;cursor:pointer}#deck-sheet .ds-row.active{border-color:var(--primary, #6C5CE7);background:#f7f6fe}#deck-sheet .ds-ic{font-size:24px}#deck-sheet .ds-main{flex:1;display:grid;gap:3px}#deck-sheet .ds-main b{font-size:14.5px;color:#222}#deck-sheet .ds-sub{font-size:12px;color:var(--muted);font-weight:700}#deck-sheet .ds-bar{height:6px;border-radius:4px;background:#ececf6;overflow:hidden}#deck-sheet .ds-bar i{display:block;height:100%;background:linear-gradient(90deg,#6c5ce7,#4da3ff);border-radius:4px}#deck-sheet .ds-check{color:var(--primary, #6C5CE7);font-weight:800;font-size:16px;width:20px;text-align:center}#deck-sheet .ds-add{margin-top:10px;border:2px dashed #C9C5EA;background:#fbfaff;color:var(--primary, #6C5CE7);font-weight:800;border-radius:14px;padding:12px;font:inherit;cursor:pointer}