@font-face{font-family:Google Sans Flex;font-style:normal;font-weight:100 900;font-display:swap;src:url(/demo/assets/google-sans-flex-latin-wght-normal-CRMKv9uI.woff2)format("woff2")}@font-face{font-family:Noto Sans SC;font-style:normal;font-weight:400;font-display:swap;src:url(/demo/assets/noto-sans-sc-chinese-simplified-400-normal-Ba7eOkfT.woff2)format("woff2")}@font-face{font-family:Noto Sans SC;font-style:normal;font-weight:500;font-display:swap;src:url(/demo/assets/noto-sans-sc-chinese-simplified-500-normal-z_irmif2.woff2)format("woff2")}@font-face{font-family:Noto Sans SC;font-style:normal;font-weight:600;font-display:swap;src:url(/demo/assets/noto-sans-sc-chinese-simplified-600-normal-CI4uXaOp.woff2)format("woff2")}:root{color:#242424;background:#fff;font-family:Google Sans Flex,Noto Sans SC,Arial,sans-serif;font-weight:500}*{box-sizing:border-box}body{background:#fff;margin:0}button{-webkit-tap-highlight-color:transparent}button:focus:not(:focus-visible){outline:none}button:focus-visible{outline-offset:2px;outline:2px solid #82b7a9}.page-shell{background:#fff;min-height:100dvh;position:relative}.phone{background:#fff;flex-direction:column;width:100%;height:100dvh;min-height:0;display:flex;position:relative;overflow:hidden}.content{--content-inset:20px;width:100%;max-width:1120px;min-height:0;padding:8px var(--content-inset) 24px;flex-direction:column;flex:1;margin-inline:auto;display:flex;overflow:hidden}.content--study{--study-controls-depth:146px;--study-header-depth:44px;--study-glass-fill:#ffffffb3;--study-glass-blur:20px;--study-bottom-padding:24px;isolation:isolate;position:relative}.content--study>.card-scroll{z-index:0;margin-top:calc(-1 * var(--study-header-depth));padding-top:var(--study-header-depth);margin-bottom:calc(-1 * var(--study-controls-depth));padding-bottom:calc(var(--study-controls-depth) + 12px);position:relative}.study-backdrop{z-index:1;pointer-events:none;left:0;right:0;bottom:var(--study-bottom-padding);height:var(--study-controls-depth);background:#fff;position:absolute}.content--study>.category-row,.content--study>.subpage-header{z-index:3;position:relative}.content--study>.category-row:before,.content--study>.subpage-header:before{content:"";z-index:-1;pointer-events:none;top:-48px;left:calc(-1 * var(--content-inset));right:calc(-1 * var(--content-inset));background:var(--study-glass-fill);-webkit-backdrop-filter:blur(var(--study-glass-blur));backdrop-filter:blur(var(--study-glass-blur));position:absolute;bottom:0}.content--study.content--transitioning>.card-scroll{z-index:1}.content--study.content--transitioning>.study-backdrop{visibility:hidden}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.content--study{--study-glass-fill:#fffffff0}}.category-row{flex-shrink:0;justify-content:space-between;align-items:center;height:44px;display:flex}.category-btn,.favourites,.toolbar button{color:#242424;cursor:pointer;background:0 0;border:0;align-items:center;gap:4px;font-family:inherit;font-size:14px;font-weight:500;line-height:1.2;display:flex}.category-btn{gap:8px;min-height:44px;padding:11px 8px 11px 0;font-size:16px;font-weight:600}.favourites{white-space:nowrap;gap:4px;min-height:44px;padding:0;font-size:14px;font-weight:400;line-height:20px}.favourites svg{color:#287f70;flex:none;display:block}.favourites .favourites-icon{transform:translateY(-1px)}.category-btn:active,.favourites:active,.subpage-back:active{opacity:.65}.subpage-header{flex-shrink:0;justify-content:space-between;align-items:center;height:44px;display:flex;position:relative}.subpage-header h1{white-space:nowrap;margin:0;font-size:18px;font-weight:600;position:absolute;left:50%;transform:translate(-50%)}.subpage-back{color:#242424;cursor:pointer;background:0 0;border:0;align-items:center;gap:4px;min-width:44px;height:44px;padding:0 8px 0 0;font-family:inherit;font-size:14px;font-weight:500;line-height:1.2;display:inline-flex}.subpage-back-label{font-family:inherit;font-size:16px;font-weight:600}.subpage-context{color:#8a9691;font-size:13px}.saved-list{scrollbar-width:none;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;flex:1;min-height:0;padding-top:16px;overflow-y:auto}.saved-list::-webkit-scrollbar{display:none}.saved-row{color:#242424;text-align:left;cursor:pointer;background:#f4f7f6;border:0;border-radius:16px;grid-template-columns:64px minmax(0,1fr) 18px;align-items:center;gap:12px;width:100%;min-height:88px;margin:0 0 10px;padding:12px;font-family:inherit;display:grid}.saved-row:hover{background:#edf4f1}.saved-row:focus-visible,.subpage-back:focus-visible,.saved-empty button:focus-visible{outline-offset:2px;outline:2px solid #287f70}.saved-thumb{color:#7c928c;background:#eaf2ef;border-radius:12px;place-items:center;width:64px;height:64px;font-size:12px;font-weight:600;display:grid;overflow:hidden}.saved-thumb img{object-fit:cover;object-position:center;width:100%;height:100%;display:block}.saved-thumb>span{text-overflow:ellipsis;white-space:nowrap;max-width:100%;padding:0 4px;overflow:hidden}.saved-row-copy{flex-direction:column;gap:5px;min-width:0;display:flex}.saved-word-line{white-space:nowrap;align-items:baseline;gap:8px;min-width:0;display:flex}.saved-word-line strong{letter-spacing:-.5px;flex:none;font-family:Arial Rounded MT Bold,Arial,sans-serif;font-size:24px;line-height:28px}.saved-word-line>span{text-overflow:ellipsis;color:#55615d;min-width:0;font-size:13px;font-weight:400;line-height:1.4;overflow:hidden}.saved-row-copy small{color:#87928e;white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:400;line-height:1.4;overflow:hidden}.saved-row-arrow{color:#287f70}.saved-empty{text-align:center;color:#287f70;flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:0;padding:0 20px 44px;display:flex}.saved-empty h2{color:#242424;margin:20px 0 8px;font-size:18px;font-weight:600}.saved-empty p{color:#666;margin:0 0 24px;font-size:14px;font-weight:400;line-height:1.5}.saved-empty button{color:#fff;cursor:pointer;background:#287f70;border:0;border-radius:999px;min-height:44px;padding:0 20px;font-family:inherit;font-size:14px;font-weight:500}.card-scroll{min-height:0;width:calc(100% + 2 * var(--content-inset));margin-inline:calc(-1 * var(--content-inset));overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;scrollbar-width:none;flex-direction:column;flex:1;display:flex;overflow:hidden auto}.card-scroll::-webkit-scrollbar{display:none}.card-stage{flex-shrink:0;margin-top:8px;position:relative;overflow:hidden}.card-body{width:100%;padding-inline:var(--content-inset)}.card-body--leaving{pointer-events:none;position:absolute;top:0;left:0}.illustration-slot{flex-shrink:0;width:100%;height:280px;overflow:hidden}.illustration{aspect-ratio:5/4;transform-origin:top;will-change:transform;background:#fafaf4;border-radius:24px;place-items:center;width:100%;height:auto;margin-inline:auto;display:grid;position:relative;overflow:hidden}.illustration img{object-fit:contain;border-radius:inherit;width:100%;min-width:0;height:100%;min-height:0;display:block}.illustration:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #00000008}.definition{padding-top:20px}.word-row{justify-content:space-between;align-items:center;gap:24px;min-height:80px;padding-inline-end:8px;display:flex}.word-row>div{flex:1;min-width:0}.word-row h2{letter-spacing:-1.5px;overflow-wrap:anywhere;margin:0 0 6px;font-family:Arial Rounded MT Bold,Arial,sans-serif;font-size:34px;font-weight:600;line-height:43px}.phonetic{color:#666;overflow-wrap:anywhere;margin:0;font-size:14px;font-weight:400;line-height:1.5}.phonetic span{margin:0 4px}.play{color:#fff;cursor:pointer;background:#287f70;border:0;border-radius:50%;flex-shrink:0;place-items:center;width:60px;height:60px;display:grid;position:relative}.play:active:not(:disabled){background:#206d60;transform:scale(.93)}.play:disabled{cursor:default}.play.is-playing:after{content:"";pointer-events:none;border:2px solid #287f7094;border-radius:50%;animation:1.6s ease-out infinite play-breathe;position:absolute;inset:-1px}.play-spinner{border:3px solid #ffffff59;border-top-color:#fff;border-radius:50%;width:25px;height:25px;animation:.8s linear infinite play-spin}@keyframes play-spin{to{transform:rotate(360deg)}}@keyframes play-breathe{0%{opacity:.72;transform:scale(1)}70%,to{opacity:0;transform:scale(1.34)}}@media (prefers-reduced-motion:reduce){.play.is-playing:after{opacity:.52;animation:none;transform:scale(1.12)}.play-spinner{animation-duration:1.6s}}.example{color:#242424;width:100%;margin-top:14px}.example p{margin:0 0 6px;font-size:18px;font-weight:400;line-height:23px}.example small{color:#666;font-size:14px;line-height:1.5;display:block}.spacer{flex:1 0 32px;min-height:32px}.toolbar{z-index:2;background:#f4f7f6;border-radius:14px;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;height:48px;min-height:48px;margin-top:20px;padding:0 4px;display:grid;position:relative}.toolbar>.popover-anchor{min-width:0}.toolbar>button,.toolbar>.popover-anchor>button{color:#666;border-radius:10px;justify-content:center;width:100%;min-width:0;height:40px;font-size:13px;transition:background-color .16s,color .16s}.toolbar>button:active,.toolbar>.popover-anchor>button:active{background:#e3eee9}.toolbar>button:focus:not(:focus-visible),.toolbar>.popover-anchor>button:focus:not(:focus-visible){outline:none}.toolbar>button:focus-visible,.toolbar>.popover-anchor>button:focus-visible{outline-offset:-2px;outline:2px solid #82b7a9}.speed-display{white-space:nowrap}.speed-times{font-size:inherit;line-height:inherit}.toolbar .saved{color:#287f70}.popover-anchor{position:relative}.menu{z-index:5;background:#fff;border:1px solid #dce4e0;border-radius:14px;min-width:180px;padding:4px 6px;position:absolute;bottom:calc(100% + 8px);left:0;overflow:hidden;box-shadow:0 6px 18px #0000001f}.menu button{white-space:nowrap;color:#242424;text-align:left;cursor:pointer;background:#fff;border:0;align-items:center;width:100%;min-height:44px;padding:0 12px;font-family:Google Sans Flex,Noto Sans SC,Arial,sans-serif;font-weight:500;display:flex;justify-content:space-between!important;height:44px!important}.category-menu{width:248px;max-height:348px;top:calc(100% + 2px);bottom:auto;overflow-y:auto}.category-menu button{gap:14px;color:#242424!important;justify-content:space-between!important;font-size:14px!important}.category-menu button.trial-locked-category{cursor:pointer;background:#fff;color:#9aa6a0!important}.category-menu button.trial-locked-category:hover{background:#fff}.category-menu button.trial-locked-category .category-count{color:#aab5af}.category-count{color:#7b8581;font-variant-numeric:tabular-nums;flex:none;font-weight:400}.rate-menu{border-color:#dee8e3;border-radius:16px;width:192px;padding:6px}.rate-menu button{padding:0 14px;font-size:15px!important}.selected-dot{background:#287f70;border-radius:50%;width:8px;height:8px}.more-menu{width:232px;padding:4px 12px;left:auto;right:0}.more-menu label{justify-content:space-between;align-items:center;height:42px;font-size:14px;display:flex}.more-menu input{appearance:none;cursor:pointer;background:#d8dddb;border-radius:20px;width:44px;height:26px;position:relative}.more-menu input:checked{background:#287f70}.more-menu input:after{content:"";background:#fff;border-radius:50%;width:22px;height:22px;transition:all .2s;position:absolute;top:2px;left:2px}.more-menu input:checked:after{left:20px}.difficulty-setting{border-top:1px solid #edf1ef;margin-top:4px;padding:12px 0 8px;font-size:14px}.difficulty-setting>span{margin-bottom:10px;display:block}.difficulty-options{background:#f2f6f4;border-radius:10px;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;display:grid}.difficulty-options button{white-space:nowrap;color:#53605b;background:0 0;border-radius:7px;min-width:0;min-height:32px;overflow:hidden;justify-content:center!important;height:32px!important;padding:0 2px!important;font-size:12px!important}.difficulty-options button.is-selected{color:#fff;background:#287f70;box-shadow:0 1px 3px #0000001a}.difficulty-options button:focus-visible{outline-offset:2px;outline:2px solid #287f70}.pager{text-align:center;color:#666;z-index:2;flex-shrink:0;grid-template-columns:1fr 70px 1fr;align-items:center;gap:8px;height:52px;margin-top:26px;font-size:14px;display:grid;position:relative}.pager>span{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:400}.pager button{cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;min-width:0;height:52px;padding:0 8px;font-family:inherit;font-size:17px;font-weight:500;display:flex}.pager .prev:active:not(:disabled),.pager .next:active:not(:disabled){background:#1d695d;transform:scale(.96)}.pager .page-number:active{color:#287f70;transform:scale(.96)}.page-jump{min-width:0;position:relative}.pager .page-number{color:#666;font-variant-numeric:tabular-nums;white-space:nowrap;background:0 0;border-radius:0;width:100%;height:52px;padding:0;font-size:14px;font-weight:400}.page-jump-menu{z-index:6;text-align:left;background:#fff;border:1px solid #dce4e0;border-radius:14px;width:232px;padding:14px;position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);box-shadow:0 6px 18px #0000001f}.page-jump-menu label{color:#242424;margin-bottom:10px;font-size:14px;font-weight:500;display:block}.page-jump-controls{align-items:center;gap:8px;display:flex}.page-jump-controls input{color:#242424;text-align:center;font-variant-numeric:tabular-nums;background:#fff;border:1px solid #cfdcd6;border-radius:9px;width:64px;height:38px;padding:0 8px;font:500 16px/1 Google Sans Flex,Noto Sans SC,Arial,sans-serif}.page-jump-controls input:focus{outline-offset:1px;outline:2px solid #82b7a9}.page-jump-controls input[aria-invalid=true]{border-color:#bf6a60}.page-jump-controls>span{color:#69756f;white-space:nowrap;flex:1;font-size:14px}.pager .page-jump-controls button{color:#fff;white-space:nowrap;background:#287f70;border-radius:9px;min-width:56px;height:38px;padding:0 10px;font-size:13px}.pager .page-jump-controls button:disabled{color:#9aa6a0;background:#e7ece9}.trial-page-hint{color:#78877f;margin:10px 0 0;font-size:12px;line-height:1.4}.pager-action{white-space:nowrap;align-items:center;gap:4px;line-height:1;display:inline-flex}.pager-action svg{flex:none;display:block}.pager-label{transform:translateY(.5px)}.pager .prev .pager-action{transform:translate(-4px)}.pager .next .pager-action{transform:translate(4px)}.prev,.next{color:#fff;background:#287f70}.pager button:disabled{cursor:not-allowed;color:#a0a0a0;background:#eff2f1}.trial-overlay{z-index:30;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#12251c87;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.trial-dialog{color:#24382c;background:#fff;border-radius:24px;width:min(100%,440px);padding:30px;box-shadow:0 25px 70px #10291c40}.trial-dialog-eyebrow{color:#43805a;background:#edf6ec;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:700;display:inline-flex}.trial-dialog h2{margin:18px 0 12px;font-size:25px;line-height:1.35}.trial-dialog p{color:#5f6e63;margin:0;font-size:15px;line-height:1.75}.trial-dialog .trial-purchase-note{color:#327052;margin-top:15px;font-weight:600}.trial-dialog-actions{grid-template-columns:1fr 1fr;gap:10px;margin-top:26px;display:grid}.trial-dialog-actions button,.trial-dialog-actions a{border:0;border-radius:999px;min-height:52px;padding:8px;font:600 16px/1.35 Noto Sans SC,Arial,sans-serif}.trial-dialog-back{color:#395744;cursor:pointer;background:#edf2ee}.trial-dialog-buy{color:#fff;background:#287f70;justify-content:center;align-items:center;text-decoration:none;display:flex}.trial-dialog-buy:hover{background:#216b5f}.trial-dialog-buy:focus-visible{outline-offset:3px;outline:3px solid #81b9a7}@media (width<=420px){.trial-dialog{padding:26px 22px}.trial-dialog h2{font-size:22px}}@media (width>=600px){.content{--content-inset:32px;padding-top:20px;padding-bottom:28px}.content--study{--study-bottom-padding:28px}.card-stage{margin-top:20px}.illustration-slot{margin-inline:auto}.definition{padding-top:24px}.toolbar>button,.toolbar>.popover-anchor>button{height:44px;font-size:14px}}@media (width>=600px) and (width<=1199px) and (orientation:portrait) and (height>=601px){.content{max-width:none}}@media (width>=1200px),(width>=900px) and (orientation:landscape),(width>=640px) and (height<=600px){.content{--content-inset:40px;padding-top:24px;padding-bottom:32px}.content--study{--study-header-depth:68px;--study-footer-height:148px;--study-footer-gap:24px;--study-bottom-padding:32px;--study-illustration-extra:185px;grid-template-rows:44px minmax(0,1fr) 48px 52px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 48px;display:grid}.content--study>.category-row,.content--study>.subpage-header{grid-area:1/1/auto/-1}.content--study>.category-row:before,.content--study>.subpage-header:before{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff;top:0}.content--study>.card-scroll{z-index:0;-webkit-overflow-scrolling:touch;grid-area:1/1/-1/-1;margin-top:0;margin-bottom:0;padding-bottom:0;overflow:hidden auto;container-type:size}.card-stage{height:auto;min-height:100%;padding-bottom:var(--study-footer-height);flex:none;margin-top:0;overflow:visible}.card-body{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:48px;min-height:100%;display:grid}.illustration-slot{align-self:start;place-items:start center;min-width:0;max-width:none;margin:0;display:grid;position:sticky;top:0;overflow:visible;container-type:size;height:calc(100cqh - var(--study-footer-height))!important}.illustration{aspect-ratio:5/4;will-change:auto;justify-content:center;align-items:center;display:flex;width:min(100cqw,calc(125cqh + var(--study-illustration-extra)))!important;height:auto!important;transform:none!important}.definition{min-width:0;min-height:0;padding:0 8px 32px 0;overflow:visible}.word-row{padding-inline-end:4px}.spacer{display:none}.study-backdrop{left:calc(50% + .5 * var(--study-footer-gap));height:var(--study-footer-height);right:0}.toolbar,.pager{z-index:2;grid-column:2}.toolbar{grid-row:3}.pager{grid-row:4}.toolbar,.pager{margin-top:0}.content--saved-list>.subpage-header,.saved-list{width:100%;max-width:800px;margin-inline:auto}.category-menu{max-height:min(348px,100dvh - 160px)}}@media (width<=599px){.content{padding-top:max(8px,env(safe-area-inset-top));padding-bottom:max(24px,calc(env(safe-area-inset-bottom) + 8px))}.content--study{--mobile-nav-top:max(16px,env(safe-area-inset-top));--study-header-depth:calc(60px + var(--mobile-nav-top));--study-bottom-padding:max(24px,calc(env(safe-area-inset-bottom) + 8px));padding-top:0}.content--atlas{padding-top:max(16px,env(safe-area-inset-top))}.content--study.content--atlas{padding-top:0}.content--study>.category-row,.content--study>.subpage-header{height:var(--study-header-depth);padding-top:var(--mobile-nav-top);padding-bottom:16px}.content--study>.category-row:before,.content--study>.subpage-header:before{top:0}.content--study .card-stage{margin-top:0}}@media (width>=640px) and (height<=600px){.content{--content-inset:24px;padding-top:max(8px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}.content--study{--study-header-depth:56px;--study-footer-height:116px;--study-footer-gap:12px;--study-bottom-padding:max(12px,env(safe-area-inset-bottom));--study-illustration-extra:145px;grid-template-rows:44px minmax(0,1fr) 48px 44px;gap:12px 24px}.card-body{column-gap:24px}.play{width:48px;height:48px}.pager,.pager button,.pager .page-number{height:44px}.category-menu{max-height:calc(100dvh - 100px)}}@media (width>=640px) and (width<=1000px) and (height<=600px){.content{--content-inset:max(24px,env(safe-area-inset-left),env(safe-area-inset-right))}}@media (width<=360px){.pager button{padding:0 2px;font-size:14px}}.missing-image{color:#9baaa4;background:#f0f5f3;place-items:center;width:100%;height:100%;font-size:28px;font-weight:600;display:grid}.empty-state{text-align:center;color:#7a8983;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:10px;display:flex}.empty-state h2{color:#242424;margin:4px 0 0;font-size:18px}.empty-state p{margin:0;font-size:14px}.is-playing{box-shadow:0 0 0 5px #287f7033}@media (width<=480px){.phone,.content{min-height:0}}