@font-face{font-family:"Baloo 2 Variable";font-style:normal;font-display:swap;font-weight:400 800;src:url(./baloo-2-devanagari-wght-normal-B4j4n2PV.woff2) format("woff2-variations");unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+20F0,U+25CC,U+A830-A839,U+A8E0-A8FF,U+11B00-11B09}@font-face{font-family:"Baloo 2 Variable";font-style:normal;font-display:swap;font-weight:400 800;src:url(./baloo-2-vietnamese-wght-normal-C4ZonJY6.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:"Baloo 2 Variable";font-style:normal;font-display:swap;font-weight:400 800;src:url(./baloo-2-latin-ext-wght-normal-Dz43yst_.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Baloo 2 Variable";font-style:normal;font-display:swap;font-weight:400 800;src:url(./baloo-2-latin-wght-normal-B_TVFhwJ.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-display:swap;font-weight:400;src:url(./be-vietnam-pro-vietnamese-400-normal-CRcqvyg1.woff2) format("woff2"),url(./be-vietnam-pro-vietnamese-400-normal-BuGn0gnm.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-display:swap;font-weight:400;src:url(./be-vietnam-pro-latin-ext-400-normal-CiZNW1ec.woff2) format("woff2"),url(./be-vietnam-pro-latin-ext-400-normal-DYBYyMQr.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-display:swap;font-weight:400;src:url(./be-vietnam-pro-latin-400-normal-PpnXBOrz.woff2) format("woff2"),url(./be-vietnam-pro-latin-400-normal-bXgqVju9.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-display:swap;font-weight:600;src:url(./be-vietnam-pro-vietnamese-600-normal-nyU-ZL2p.woff2) format("woff2"),url(./be-vietnam-pro-vietnamese-600-normal-DkpCIyan.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-display:swap;font-weight:600;src:url(./be-vietnam-pro-latin-ext-600-normal-BNd8euf0.woff2) format("woff2"),url(./be-vietnam-pro-latin-ext-600-normal-BeUwKxhG.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-display:swap;font-weight:600;src:url(./be-vietnam-pro-latin-600-normal-BZDkUTrt.woff2) format("woff2"),url(./be-vietnam-pro-latin-600-normal-5IO4e7bK.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-display:swap;font-weight:700;src:url(./be-vietnam-pro-vietnamese-700-normal-Csr0PCuG.woff2) format("woff2"),url(./be-vietnam-pro-vietnamese-700-normal-By_5yT39.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-display:swap;font-weight:700;src:url(./be-vietnam-pro-latin-ext-700-normal-C8_gqRu2.woff2) format("woff2"),url(./be-vietnam-pro-latin-ext-700-normal-4Hjo2OtD.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-display:swap;font-weight:700;src:url(./be-vietnam-pro-latin-700-normal-DlW1Zbsh.woff2) format("woff2"),url(./be-vietnam-pro-latin-700-normal-C2EtzaOi.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--ink:#0A3B4F;--teal:#0B5C7A;--cream:#FFF4DD;--paper:#FFFCF5;--red:#D63A25;--red-d:#B02C1A;--sun:#FFC93C;--mint:#62D6B2;--lilac:#BBA8FF;--sky:#7FCBFF;--coral:#FF9A85;--muted:#4D6B78;--line:#0A3B4F;--ok:#14804F;--warn:#7A4B00;--bw:2.5px;--sh:4px 4px 0 var(--ink);--sh-s:3px 3px 0 var(--ink);--r:22px;--r-s:12px;--display:"Baloo 2 Variable","Be Vietnam Pro","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;--body:"Be Vietnam Pro","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,-apple-system,Roboto,sans-serif;--nav-h:72px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.65;background-color:var(--cream);background-image:radial-gradient(#0a3b4f22 1.2px,transparent 1.3px);background-size:22px 22px}h1,h2,h3,h4{font-family:var(--display);color:var(--ink);line-height:1.25;margin:.2em 0 .45em;font-weight:800;letter-spacing:-.01em}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.2rem}h4{font-size:1.05rem}a{color:var(--teal);font-weight:600}code{background:var(--sun);padding:1px 7px;border-radius:7px;font-size:.88em;word-break:break-all}.muted{color:var(--muted)}.small{font-size:.85rem}.red{color:var(--red)}.warn{color:var(--warn);font-weight:600}.hanzi{font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",var(--display);font-size:1.7rem;font-weight:700;line-height:1.6}.py{font-size:1.15rem;color:var(--teal);font-weight:600;line-height:1.8;padding-top:2px}.container{max-width:1080px;margin:0 auto;padding:18px 14px calc(var(--nav-h) + 40px)}@media (min-width:861px){.container{padding-bottom:48px}}.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:14px;padding:10px 16px;background:var(--cream);border-bottom:var(--bw) solid var(--ink)}.brand{display:flex;align-items:center;text-decoration:none}.wordmark{display:flex;align-items:center;gap:8px;color:var(--ink);line-height:1.1}.wordmark b{font-family:var(--display);font-size:1.5rem;background:var(--red);color:#fff;padding:0 10px;border-radius:12px;border:var(--bw) solid var(--ink);box-shadow:var(--sh-s);transform:rotate(-2deg)}.wordmark small{font-size:.62rem;font-weight:700;max-width:7ch;line-height:1.15}.topbar nav{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}.topbar nav a{color:var(--ink);text-decoration:none;padding:6px 12px;border-radius:999px;font-size:.9rem;font-weight:700;border:var(--bw) solid transparent;white-space:nowrap}.topbar nav a:hover{background:var(--sun)}.topbar nav a.active{background:var(--ink);color:var(--cream)}.bottomnav,.more-sheet,.more-scrim{display:none}@media (max-width:860px){.topbar nav{display:none}.topbar{padding:8px 14px}.bottomnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;z-index:40;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));height:var(--nav-h);background:var(--paper);border:var(--bw) solid var(--ink);border-radius:26px;box-shadow:var(--sh);padding:6px;gap:4px}.bottomnav a,.bottomnav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;border:0;background:transparent;border-radius:18px;text-decoration:none;color:var(--ink);font:inherit;font-size:.68rem;font-weight:700;cursor:pointer;line-height:1.2}.bottomnav .ic{font-size:1.45rem;line-height:1.2}.bottomnav a.active{background:var(--sun);box-shadow:inset 0 0 0 var(--bw) var(--ink)}.more-scrim.open{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#0a3b4f99;z-index:41}.more-sheet.open{display:block;position:fixed;z-index:42;left:10px;right:10px;bottom:calc(var(--nav-h) + 22px + env(safe-area-inset-bottom));background:var(--paper);border:var(--bw) solid var(--ink);border-radius:24px;box-shadow:var(--sh);padding:14px}.more-sheet a{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;text-decoration:none;color:var(--ink);font-weight:700}.more-sheet a.active{background:var(--sun)}h1{font-size:1.65rem}}.footer{text-align:center;color:var(--muted);font-size:.8rem;padding:0 14px calc(var(--nav-h) + 30px)}@media (min-width:861px){.footer{padding-bottom:28px}}.page-title{margin:4px 0 16px}.page-title p{margin:0;max-width:62ch}.card{background:var(--paper);border:var(--bw) solid var(--ink);border-radius:var(--r);box-shadow:var(--sh);padding:16px 18px;margin:0 0 18px}.card.sun{background:var(--sun)}.card.mint{background:var(--mint)}.card.lilac{background:var(--lilac)}.card.sky{background:var(--sky)}.card.coral{background:var(--coral)}.card.flat{box-shadow:none}.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-bottom:18px}.grid3 .card{margin:0}.link-card{text-decoration:none;color:var(--ink);display:block;transition:transform .12s,box-shadow .12s;font-weight:400}.link-card:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}.link-card:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}.link-card h3{display:flex;align-items:center;gap:8px}.link-card .emoji{font-size:1.8rem}.tts-banner{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;background:var(--sky);border:var(--bw) solid var(--ink);border-radius:16px;padding:8px 14px;margin:0 0 18px;font-size:.88rem;font-weight:500}.tts-banner p{margin:0;flex-basis:100%}.tts-banner.warn{background:var(--sun);color:var(--ink)}.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:12px 0}.big{font-family:var(--display);font-size:2.6rem;font-weight:800;line-height:1.1;margin:0}.big small{font-size:1rem;color:var(--muted);font-weight:600}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:var(--bw) solid var(--ink);background:var(--paper);color:var(--ink);padding:8px 16px;border-radius:999px;font:inherit;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block;min-height:44px;box-shadow:var(--sh-s);transition:transform .1s,box-shadow .1s,background .1s}.btn:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink);background:var(--sun)}.btn:active:not(:disabled){transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}.btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.btn.primary{background:var(--red);color:#fff}.btn.primary:hover:not(:disabled){background:var(--red-d)}.btn.ghost{background:transparent;box-shadow:none;border-style:dashed}.btn.ok{background:var(--mint)}.btn.danger{color:var(--red-d)}.btn.small{min-height:36px;padding:3px 12px;font-size:.85rem}.btn:focus-visible,.chip:focus-visible,.opt:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,.tab:focus-visible,.tone-pick:focus-visible,.cell:focus-visible{outline:3px solid var(--red);outline-offset:3px}.speak-wrap{display:inline-flex;flex-direction:column;gap:3px;margin:4px 8px 4px 0;vertical-align:top}.speak{background:var(--sky)}.speak-msg{color:var(--red-d);font-size:.78rem;max-width:240px;font-weight:600}.chips{display:flex;flex-wrap:wrap;gap:9px;margin:8px 0}.chip{border:var(--bw) solid var(--ink);background:var(--paper);border-radius:14px;padding:4px 14px;min-height:40px;font:inherit;font-weight:700;cursor:pointer;color:var(--ink);box-shadow:2px 2px 0 var(--ink);transition:transform .1s,box-shadow .1s}.chip:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink)}.chip:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}.chip.big{font-family:var(--display);font-size:1.5rem;padding:2px 18px;min-width:62px;min-height:54px;border-radius:16px}.chip.on{background:var(--ink);color:var(--cream)}.chip.rare{border-style:dashed}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 18px;padding:6px;background:var(--paper);border:var(--bw) solid var(--ink);border-radius:999px;width:fit-content;max-width:100%;overflow-x:auto}.tab{border:0;background:transparent;border-radius:999px;padding:7px 16px;font:inherit;font-weight:700;cursor:pointer;color:var(--ink);white-space:nowrap;min-height:40px}.tab:hover{background:var(--sun)}.tab.on{background:var(--ink);color:var(--cream)}.filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;align-items:end}.filters label,.inline,.try label{display:flex;flex-direction:column;font-size:.82rem;color:var(--muted);font-weight:600;gap:4px}.inline{flex-direction:row;align-items:center;gap:10px;margin-top:14px}input,select{font:inherit;padding:9px 12px;border:var(--bw) solid var(--ink);border-radius:14px;background:var(--paper);color:var(--ink);min-height:46px;max-width:100%;font-weight:500}.t1{--tc:var(--sky)}.t2{--tc:var(--sun)}.t3{--tc:var(--lilac)}.t4{--tc:var(--coral)}.tneutral{--tc:var(--mint)}.tone-card{background:var(--tc,var(--paper));text-align:center}.tone-card p{text-align:left}.tone-img,.tone-svg{width:100%;max-width:200px;height:auto;margin:0 auto;display:block;color:var(--ink)}.tone-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:4px 8px;border-radius:14px;background:var(--tc,transparent);margin-bottom:6px;border:var(--bw) solid var(--ink)}.tone-row .speak{background:var(--paper)}.tone-btns{margin:12px 0}.hero{position:relative;background:var(--teal);color:#fff;border:var(--bw) solid var(--ink);border-radius:30px;box-shadow:6px 6px 0 var(--ink);padding:28px 22px 22px;margin-bottom:22px;overflow:hidden}.hero h1{color:#fff;font-size:clamp(2rem,6vw,3.3rem);line-height:1.05;margin:0 0 10px;max-width:15ch}.hero p{max-width:52ch;margin:0 0 14px;font-size:1.05rem}.hero .glyph{position:absolute;right:-10px;top:-34px;font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",var(--display);font-size:11rem;font-weight:900;color:#ffffff14;line-height:1;pointer-events:none;-webkit-user-select:none;user-select:none}.tone-hero{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}.tone-pick{border:var(--bw) solid var(--ink);border-radius:18px;background:var(--tc);color:var(--ink);padding:8px 6px 6px;cursor:pointer;font:inherit;display:flex;flex-direction:column;align-items:center;box-shadow:var(--sh-s);transition:transform .1s,box-shadow .1s}.tone-pick:hover{transform:translate(-1px,-2px);box-shadow:4px 5px 0 var(--ink)}.tone-pick:active,.tone-pick.playing{transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}.tone-pick svg{width:100%;height:44px}.tone-pick b{font-family:var(--display);font-size:1.4rem;line-height:1.2}.tone-pick small{font-size:.72rem;font-weight:600}.tone-pick path.draw{stroke-dasharray:140;stroke-dashoffset:140;animation:draw .9s ease-out forwards}.tone-pick:nth-child(2) path.draw{animation-delay:.15s}.tone-pick:nth-child(3) path.draw{animation-delay:.3s}.tone-pick:nth-child(4) path.draw{animation-delay:.45s}@keyframes draw{to{stroke-dashoffset:0}}.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;margin-bottom:18px}.bento .card{margin:0}.b-streak,.b-xp,.b-review{grid-column:span 2}.b-wide,.b-quick{grid-column:span 3}@media (max-width:860px){.bento{grid-template-columns:1fr 1fr;gap:14px}.b-streak,.b-xp{grid-column:span 1}.b-review,.b-wide,.b-quick{grid-column:span 2}.hero .glyph{font-size:8rem}}@media (max-width:420px){.tone-hero{gap:6px}.tone-pick b{font-size:1.15rem}}.stat{font-family:var(--display);font-size:2.8rem;font-weight:800;line-height:1;margin:0}.stat small{font-size:.95rem;font-weight:700}.flame{display:inline-block;transform-origin:50% 90%}.flame.on{animation:flick 1.6s ease-in-out infinite}@keyframes flick{0%,to{transform:rotate(-4deg) scale(1)}50%{transform:rotate(4deg) scale(1.12)}}.bar{height:16px;background:var(--paper);border:var(--bw) solid var(--ink);border-radius:99px;overflow:hidden;flex:1;min-width:80px}.bar i{display:block;height:100%;background:var(--red);border-right:var(--bw) solid var(--ink);border-radius:99px 0 0 99px;min-width:0}.bar i[style*="width: 0%"]{border-right:0}.segs{display:flex;gap:4px;flex:1 1 140px}.segs i{flex:1;height:14px;border:2px solid var(--ink);border-radius:99px;background:var(--paper)}.segs i.done{background:var(--mint)}.segs i.cur{background:var(--sun)}.catrow{display:grid;grid-template-columns:minmax(110px,1.2fr) 2fr minmax(70px,auto);gap:12px;align-items:center;padding:6px 0;font-weight:600}@media (max-width:520px){.catrow{grid-template-columns:1fr;gap:3px}}.table-layout{display:block}.table-layout.has-detail{display:grid;grid-template-columns:1fr 350px;gap:18px;align-items:start}.sticky{position:sticky;top:84px}.detail{position:relative}.close{position:absolute;right:12px;top:12px}@media (max-width:860px){.table-layout.has-detail{grid-template-columns:1fr}.table-layout.has-detail aside{position:fixed;z-index:35;left:0;right:0;bottom:0;top:auto;max-height:62vh;overflow:auto;border-radius:26px 26px 0 0;margin:0;padding-bottom:calc(var(--nav-h) + 30px);box-shadow:0 -4px 0 var(--ink);background:var(--paper)}.table-layout.has-detail>div{padding-bottom:60vh}}.compare{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.compare small{color:var(--muted);display:block;font-weight:600}.arrow{font-size:1.8rem;color:var(--red);font-weight:800}.matrix{border-collapse:separate;border-spacing:6px;width:100%;min-width:500px}.matrix th{font-size:.82rem;font-weight:700}.cell{width:100%;border:var(--bw) solid var(--ink);background:var(--tc,var(--paper));border-radius:14px;cursor:pointer;padding:6px 2px;display:flex;flex-direction:column;align-items:center;font:inherit;color:var(--ink);min-height:70px;box-shadow:2px 2px 0 var(--ink);transition:transform .1s,box-shadow .1s}.cell .hanzi{font-size:1.3rem;line-height:1.4}.cell .py{font-size:.88rem;line-height:1.4;color:var(--ink)}.cell:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink)}.cell.on{background:var(--ink);color:var(--cream)}.cell.on .py{color:var(--cream)}.scroll{overflow-x:auto;padding-bottom:4px}.combo-ex{padding:8px 0;border-top:2px dashed #0a3b4f55}.combo-ex:first-of-type{border-top:0}.badge{background:var(--sun);color:var(--ink);border:2px solid var(--ink);border-radius:999px;padding:1px 10px;font-size:.78rem;font-weight:700;margin:0 6px}.plain{list-style:none;padding:0;margin:0}.plain li{padding:9px 0;border-top:2px dashed #0a3b4f55}.plain li:first-child{border-top:0}.runbar{display:flex;gap:12px;align-items:center;margin-bottom:12px;flex-wrap:wrap;font-weight:700}.question h2{font-size:1.45rem;line-height:1.35}.options{display:grid;gap:12px;margin:16px 0}.opt{display:flex;align-items:center;gap:12px;text-align:left;border:var(--bw) solid var(--ink);background:var(--paper);border-radius:18px;padding:10px 14px;font:inherit;font-weight:600;cursor:pointer;min-height:56px;color:var(--ink);box-shadow:var(--sh-s);transition:transform .1s,box-shadow .1s,background .1s}.opt .ltr{flex:none;width:34px;height:34px;border-radius:11px;border:var(--bw) solid var(--ink);display:grid;place-items:center;font-family:var(--display);background:var(--sun);font-size:1.05rem}.opt:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}.opt:active:not(:disabled){transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}.opt.sel{background:var(--sky)}.opt.right{background:var(--mint);animation:pop .35s ease-out}.opt.wrong{background:var(--coral);animation:shake .35s}.opt:disabled{cursor:default}@keyframes pop{50%{transform:scale(1.03)}}@keyframes shake{25%{transform:translate(-5px)}75%{transform:translate(5px)}}.feedback{border:var(--bw) solid var(--ink);border-radius:18px;padding:10px 16px;margin:12px 0;background:var(--sky)}.feedback.ok{background:var(--mint)}.feedback.bad{background:var(--coral)}.feedback p{margin:.3em 0 0}.sticky-cta{position:sticky;bottom:calc(var(--nav-h) + 22px);z-index:10;background:var(--sun)}@media (min-width:861px){.sticky-cta{bottom:12px}}.score{text-align:center;position:relative;overflow:hidden}.score .emoji{font-size:3rem;line-height:1.2}.score .big{font-size:4.2rem;color:var(--red)}.confetti{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.confetti i{position:absolute;top:-14px;width:10px;height:16px;border-radius:3px;animation:fall 2.4s ease-in forwards}@keyframes fall{to{transform:translateY(340px) rotate(540deg);opacity:.2}}.rv summary{cursor:pointer;font-weight:600}.rv .st{font-size:.78rem;font-weight:800;padding:2px 10px;border-radius:99px;background:var(--paper);border:2px solid var(--ink);margin-right:6px}.rv.correct{background:#d9f7ec}.rv.incorrect{background:#ffe3dc}.rv{box-shadow:var(--sh-s)}.video{width:100%;max-width:560px;border-radius:18px;border:var(--bw) solid var(--ink);background:#000}.video-missing{background:var(--paper);border:var(--bw) dashed var(--ink);border-radius:18px;padding:14px;color:var(--muted);font-size:.9rem;margin-bottom:12px}details summary{cursor:pointer;font-weight:600}@media (prefers-reduced-motion: reduce){*,*:before,*:after{transition:none!important;animation:none!important}.tone-pick path.draw{stroke-dashoffset:0}.confetti{display:none}}.learn-layout{display:grid;grid-template-columns:minmax(250px,320px) 1fr;gap:18px;align-items:start}.sound-list{position:sticky;top:84px;max-height:calc(100vh - 104px);overflow:auto;background:var(--paper);border:var(--bw) solid var(--ink);border-radius:var(--r);box-shadow:var(--sh);padding:12px 14px}.sl-group{margin-bottom:10px}.sl-label{display:block;font-weight:700;font-size:.82rem;color:var(--muted);margin-bottom:4px}.sl-items{display:flex;flex-wrap:wrap;gap:8px}.sound-list .chip.big{position:relative}.ld{position:absolute;top:-8px;right:-6px;background:var(--mint);border:2px solid var(--ink);border-radius:99px;width:20px;height:20px;display:grid;place-items:center;font-size:.7rem;line-height:1}.big-sound{font-family:var(--display);font-size:4.5rem;line-height:1;color:var(--red)}@media (max-width:860px){.learn-layout{grid-template-columns:1fr;gap:12px}.sound-list{position:sticky;top:56px;z-index:12;max-height:none;overflow-x:auto;overflow-y:hidden;display:flex;gap:14px;padding:8px 10px;border-radius:18px;box-shadow:var(--sh-s);scroll-snap-type:x proximity}.sl-group{margin:0;flex:none}.sl-items{flex-wrap:nowrap}.sound-list .chip.big{min-width:52px;min-height:48px;font-size:1.3rem;scroll-margin:0 40px}.big-sound{font-size:3.4rem}}.matrix-wrap{overflow:auto;max-height:72vh;background:var(--paper);border:var(--bw) solid var(--ink);border-radius:var(--r);box-shadow:var(--sh);position:relative}table.pm{border-collapse:separate;border-spacing:0;font-size:.92rem}table.pm th,table.pm td{border-right:1px solid #0a3b4f26;border-bottom:1px solid #0a3b4f26;padding:0;text-align:center}table.pm thead th{position:sticky;top:0;z-index:3;background:var(--paper);padding:8px 6px;font-family:var(--display);font-size:1.05rem;min-width:50px;border-bottom:var(--bw) solid var(--ink)}table.pm tbody th.row{position:sticky;left:0;z-index:2;padding:0 10px;font-family:var(--display);font-size:1.15rem;min-width:48px;border-right:var(--bw) solid var(--ink)}table.pm th.corner{position:sticky;left:0;top:0;z-index:4;min-width:96px;font-family:var(--body);font-size:.68rem;font-weight:700;line-height:1.25;padding:4px 8px;border-right:var(--bw) solid var(--ink);background:var(--cream)}.g0{background:var(--sky)!important}.g1{background:var(--sun)!important}.g2{background:var(--lilac)!important}.g3{background:var(--mint)!important}.g4{background:var(--coral)!important}.g5{background:#e6dfcf!important}table.pm td.empty{background:repeating-linear-gradient(45deg,transparent 0 5px,#0a3b4f10 5px 6px)}.pc{display:block;width:100%;min-width:50px;height:42px;border:0;background:transparent;font:inherit;font-weight:600;color:var(--ink);cursor:pointer;padding:0 4px;transition:background .08s}.pc:hover{background:var(--sun)}.pc.on{background:var(--ink);color:var(--cream)}.pc.rare{box-shadow:inset 0 0 0 2px #0a3b4f66;border-radius:8px}.pc.dim{opacity:.18}.pc:focus-visible{outline:3px solid var(--red);outline-offset:-3px}.matrix-wrap:focus-visible{outline:3px solid var(--red);outline-offset:3px}@media (max-width:860px){.matrix-wrap{max-height:60vh}.table-layout.has-detail>div{padding-bottom:62vh}}.tone-pop{position:fixed;z-index:50;width:min(310px,calc(100vw - 16px));background:var(--paper);border:var(--bw) solid var(--ink);border-radius:20px;box-shadow:var(--sh);padding:10px 12px 12px}.tp-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}.tp-head .btn{margin-left:auto}.tp-syl{font-family:var(--display);font-size:1.7rem;line-height:1.1;color:var(--red)}.tp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}.tp-grid .speak-wrap{display:flex;margin:0}.tp-grid .tone-chip{width:100%;min-height:46px;padding:4px 6px;font-size:.92rem;white-space:nowrap;background:var(--tc)}.tp-grid>button.tone-chip{width:100%}