@font-face{font-family:Nunito;src:url(/fonts/nunito-latin-v1.woff2)format("woff2");font-weight:500 1000;font-display:swap}@font-face{font-family:Noto Sans TC;src:url(/fonts/notosanstc-zhuyin-v1.woff2)format("woff2");font-weight:400 900;font-display:swap}:root{--amber:#f5a524;--amber-d:#c77a0a;--amber-l:#ffd27a;--teal:#14b8a6;--teal-b:#2dd4bf;--teal-d:#0e7c72;--ink:#0b1f24;--ink-2:#10282e;--deep:#061316;--cream:#fff8ec;--coral:#ff7a4d;--muted:#fff8ecc2;--faint:#fff8ec8f;--line:#ffffff24;--t1:#ffd27a;--t2:#2dd4bf;--t3:#b98af0;--t4:#ff8a5b;--t5:#9aa5a8;--radius:28px;--zh:"Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;--font:"Nunito", "Noto Sans TC", system-ui, -apple-system, "Segoe UI", sans-serif;color-scheme:dark}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}body{background:var(--deep);min-height:100vh;color:var(--cream);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;font-size:17px;font-weight:600;line-height:1.6;overflow-x:hidden}.zh,:not(html)[lang^=zh]{font-family:var(--zh)}img,svg{max-width:100%}img{height:auto;display:block}a{color:var(--teal-b);text-underline-offset:.18em}a:hover{color:var(--amber-l)}button{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--amber-l);outline-offset:3px;border-radius:6px}::selection{background:var(--amber);color:var(--ink)}h1,h2,h3{letter-spacing:-.02em;text-wrap:balance;margin:0;font-weight:900;line-height:1.08}p{text-wrap:pretty}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link{z-index:100;background:var(--amber);color:var(--ink);border-radius:12px;padding:10px 16px;font-weight:900;position:absolute;top:-60px;left:16px}.skip-link:focus{top:12px}.wrap{width:min(1180px,100%);margin:0 auto;padding:0 16px}@media (width>=700px){.wrap{padding:0 28px}}.muted{color:var(--muted)}.ambient{z-index:-1;pointer-events:none;background:radial-gradient(1200px 800px at 50% -10%, #0d2c31 0%, var(--deep) 65%);position:fixed;inset:0;overflow:hidden}.ambient i{opacity:.55;will-change:transform;border-radius:50%;position:absolute}.ambient .a1{background:radial-gradient(closest-side,#14b8a66b,#0000);width:70vmax;height:70vmax;animation:26s ease-in-out infinite alternate drift1;top:-24vmax;left:-22vmax}.ambient .a2{background:radial-gradient(closest-side,#f5a5244d,#0000);width:64vmax;height:64vmax;animation:31s ease-in-out infinite alternate drift2;bottom:-26vmax;right:-24vmax}.ambient .a3{background:radial-gradient(closest-side,#0e7c7261,#0000);width:40vmax;height:40vmax;animation:37s ease-in-out infinite alternate-reverse drift1;top:40%;left:40%}@keyframes drift1{to{transform:translate(8vmax,10vmax)scale(1.12)}}@keyframes drift2{to{transform:translate(-9vmax,-7vmax)scale(.9)}}.glass{backdrop-filter:blur(18px)saturate(160%);background:linear-gradient(160deg,#ffffff21,#ffffff0a 55%,#ffffff12);border:1px solid #ffffff26;position:relative;box-shadow:inset 0 1px #ffffff4d,0 18px 40px #00000047}.btn{--c:var(--amber);--d:var(--amber-d);cursor:pointer;letter-spacing:.01em;min-height:56px;color:var(--ink);background:var(--c) linear-gradient(180deg, #ffffff57, #fff0 55%);box-shadow:0 5px 0 var(--d), 0 14px 26px #00000040;border:0;border-radius:18px;justify-content:center;align-items:center;gap:10px;padding:0 26px;font-size:17px;font-weight:900;text-decoration:none;transition:transform 90ms,box-shadow 90ms,filter .2s;display:inline-flex}.btn:hover{color:var(--ink);filter:brightness(1.06);box-shadow:0 6px 0 var(--d), 0 16px 30px #0000004d;transform:translateY(-1px)}.btn:active{box-shadow:0 0 0 var(--d);transform:translateY(5px)}.btn-teal{--c:var(--teal-b);--d:var(--teal-d)}.btn-ghost{--c:#ffffff1a;--d:#00000059;color:var(--cream);border:1px solid var(--line);background-image:none}.btn-ghost:hover{color:var(--cream)}.btn-small{min-height:42px;box-shadow:0 4px 0 var(--d);border-radius:14px;padding:0 16px;font-size:15px}.btn-small:active{transform:translateY(4px)}.btn svg{flex:none}.play-badge{align-items:center;gap:12px;display:inline-flex}.play-badge small{letter-spacing:.06em;text-transform:uppercase;opacity:.8;font-size:11.5px;font-weight:800;line-height:1.1;display:block}.play-badge b{font-size:19px;line-height:1.1;display:block}.play-badge>span{text-align:left}.header-wrap{z-index:50;padding:10px 12px 0;position:sticky;top:10px}.site-nav{border-radius:22px;align-items:center;gap:10px;width:min(1180px,100%);height:64px;margin:0 auto;padding:0 10px 0 12px;display:flex}.wordmark{color:var(--cream);letter-spacing:-.01em;align-items:center;gap:10px;margin-right:auto;font-size:19px;font-weight:900;text-decoration:none;display:flex}.wordmark img{border-radius:11px;width:38px;height:38px;box-shadow:0 4px 12px #00000059}.wordmark b{color:var(--amber-l)}.nav-links{gap:2px;display:none}.nav-links a,.lang-switch{color:var(--muted);border-radius:12px;padding:8px 12px;font-size:15px;font-weight:800;text-decoration:none}.nav-links a:hover,.lang-switch:hover,.nav-links a[aria-current=page]{color:var(--cream);background:#ffffff14}.lang-switch{border:1px solid var(--line);padding:6px 10px;font-size:14px}.nav-cta{display:none}.menu{position:relative}.menu summary{cursor:pointer;background:#ffffff14;border-radius:14px;place-items:center;width:44px;height:44px;list-style:none;display:grid}.menu summary::-webkit-details-marker{display:none}.menu-panel{background:#0b1f24f5;border-radius:22px;gap:2px;width:min(300px,100vw - 32px);padding:10px;display:grid;position:absolute;top:54px;right:0}.menu-panel a{color:var(--cream);border-radius:14px;padding:12px 14px;font-weight:800;text-decoration:none}.menu-panel a:hover{background:#ffffff14}.menu-panel .btn{margin-top:8px}@media (width>=980px){.nav-links{display:flex}.nav-cta{display:inline-flex}.menu{display:none}}.section{padding:64px 0;position:relative}@media (width>=900px){.section{padding:96px 0}}.eyebrow{color:var(--teal-b);letter-spacing:.08em;text-transform:uppercase;align-items:center;gap:8px;margin:0 0 14px;font-size:14px;font-weight:900;display:inline-flex}.eyebrow .zh{letter-spacing:.02em}.h2{font-size:clamp(34px,5.4vw,60px)}.h2 em{color:var(--amber-l);font-style:normal}.h2 .teal{color:var(--teal-b)}.lead{color:var(--muted);max-width:60ch;margin:18px 0 0;font-size:clamp(18px,2vw,21px)}.center{text-align:center}.center .lead{margin-left:auto;margin-right:auto}.split{align-items:center;gap:40px;display:grid}@media (width>=900px){.split{grid-template-columns:1fr 1fr;gap:64px}.split.flip>:first-child{order:2}}.checks{gap:12px;margin:24px 0 0;padding:0;list-style:none;display:grid}.checks li{color:var(--muted);grid-template-columns:30px 1fr;align-items:start;gap:12px;display:grid}.checks li b{color:var(--cream)}.checks li:before{content:"";background:var(--teal-b) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1F24' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/18px no-repeat;width:30px;height:30px;box-shadow:0 3px 0 var(--teal-d);border-radius:50%}.js .reveal{opacity:0;transition:opacity .7s,transform .8s cubic-bezier(.2,1.3,.4,1);transition-delay:calc(var(--rd,0) * 90ms);transform:translateY(28px)scale(.98)}.js .reveal.in{opacity:1;transform:none}.hero{padding:40px 0 56px;position:relative}@media (width>=900px){.hero{padding:72px 0 96px}}.hero-grid{align-items:center;gap:40px;display:grid}@media (width>=980px){.hero-grid{grid-template-columns:1.02fr 1fr;gap:56px}}.hero h1{letter-spacing:-.035em;font-size:clamp(44px,11vw,78px);line-height:1}.hero h1>span,.hero h1{text-wrap:nowrap}@media (width>=980px) and (width<=1150px){.hero h1{font-size:64px}}.hero h1 .glow{color:var(--amber-l);text-shadow:0 0 40px #f5a52473}.hero h1 .zh{color:var(--teal-b);letter-spacing:.06em;margin-bottom:12px;font-size:.5em;display:block}.hero .lead{font-size:clamp(18px,2.1vw,22px)}.hero-actions{flex-wrap:wrap;gap:14px;margin-top:30px;display:flex}.floaters{pointer-events:none;z-index:-1;position:absolute;inset:0;overflow:hidden}.floaters span{font-family:var(--zh);color:#fff8ec0f;font-weight:900;font-size:var(--s,80px);animation:floaty var(--t,14s) ease-in-out infinite alternate;position:absolute}@keyframes floaty{to{transform:translateY(-36px) rotate(var(--r,8deg))}}.map-stage{position:relative}.map-card{border-radius:36px;padding:12px 12px 14px}.map-head{justify-content:space-between;align-items:center;padding:6px 8px 10px;display:flex}.map-head b{font-size:20px;font-weight:900;display:block}.map-head small{color:var(--muted);font-size:14px;font-weight:800}.ring{flex:none;width:58px;height:58px;position:relative}.ring svg{width:100%;height:100%;transform:rotate(-90deg)}.ring span{place-items:center;font-size:14px;font-weight:900;display:grid;position:absolute;inset:0}.ring .arc{transition:stroke-dashoffset 1.6s cubic-bezier(.3,1,.4,1)}.zmap{width:100%;height:auto;display:block;overflow:visible}.zmap .cell{cursor:pointer;outline:none}.zmap .cell .body{transition:filter .2s}.zmap a.cell:hover .body,.zmap .cell:focus-visible .body{filter:brightness(1.16)}.zmap .cell:focus-visible .sel{opacity:1}.zmap .sel{opacity:0;transition:opacity .2s}.zmap .cell.selected .sel{opacity:1;animation:2.2s ease-in-out infinite selp}@keyframes selp{50%{opacity:.35}}.zmap .glyph{font-family:var(--zh);pointer-events:none;font-weight:700}.zmap .dueline{animation:1.4s linear infinite dash}@keyframes dash{to{stroke-dashoffset:-20px}}.zmap .glowl{opacity:var(--o);animation:3.2s ease-in-out infinite breathe;animation-delay:calc(var(--i) * -170ms)}@keyframes breathe{50%{opacity:calc(var(--o) * .4)}}.zmap.intro .cell{animation:.7s cubic-bezier(.3,1.7,.5,1) both cellIn;animation-delay:calc(var(--w) * 1ms + .2s);transform-box:fill-box;transform-origin:50%}@keyframes cellIn{0%{opacity:0;transform:scale(.4)}}.zmap .cell.pop{transform-box:fill-box;transform-origin:50%;animation:.75s cubic-bezier(.3,1.7,.5,1) pop}@keyframes pop{35%{transform:scale(1.14)}}.zmap .ripple{transform-box:fill-box;transform-origin:50%;pointer-events:none;animation:1.1s ease-out forwards ripple}@keyframes ripple{0%{opacity:1;transform:scale(.5)}to{opacity:0;transform:scale(4.4)}}.tones-row{align-items:center;gap:8px;padding:10px 8px 0;display:flex}.tones-row small{color:var(--muted);flex:1;font-size:14px;font-weight:800}.bead{width:34px;height:34px;font-family:var(--zh);color:var(--ink);border-radius:50%;place-items:center;font-size:21px;font-weight:900;line-height:1;display:grid;box-shadow:inset 0 1px #ffffff80,0 3px #0000004d}.plus{z-index:5;color:var(--ink);background:var(--amber-l);box-shadow:0 3px 0 var(--amber-d);pointer-events:none;border-radius:12px;padding:2px 9px;font-size:16px;font-weight:900;animation:1.3s ease-out forwards plus;position:absolute}@keyframes plus{0%{opacity:0;transform:translate(-50%)scale(.7)}15%{opacity:1;transform:translate(-50%,-12px)scale(1.1)}70%{opacity:1;transform:translate(-50%,-30px)}to{opacity:0;transform:translate(-50%,-46px)}}.cell-card{z-index:6;background:#0d262ceb;border-radius:24px;grid-template-columns:64px 1fr;align-items:center;gap:6px 14px;width:min(360px,100% - 24px);padding:16px;animation:.35s cubic-bezier(.3,1.5,.5,1) cardIn;display:grid;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.cell-card[hidden]{display:none}@keyframes cardIn{0%{opacity:0;transform:translate(-50%,16px)scale(.96)}}.cell-card .tile{grid-row:span 2}.cell-card b{align-items:center;gap:8px;font-size:20px;font-weight:900;display:flex}.cell-card p{color:var(--muted);grid-column:1/-1;margin:0;font-size:14.5px;line-height:1.45}.cell-card .row{grid-column:1/-1;gap:8px;margin-top:6px;display:flex}.cell-card .close{cursor:pointer;background:#ffffff14;border:0;border-radius:50%;place-items:center;width:34px;height:34px;display:grid;position:absolute;top:8px;right:8px}.tile{width:64px;height:64px;font-family:var(--zh);color:var(--ink);border-radius:20px;place-items:center;font-size:38px;font-weight:900;line-height:1;display:grid;box-shadow:0 4px #0000004d,inset 0 1px #ffffff80}.tile.initial{background:linear-gradient(180deg, #5fe3d2, var(--teal-b))}.tile.final{background:linear-gradient(180deg, var(--amber-l), var(--amber))}.tile.medial{background:linear-gradient(135deg, var(--teal-b), var(--amber))}.pill{height:28px;color:var(--cream);background:#ffffff1f;border-radius:14px;align-items:center;padding:0 12px;font-size:14px;font-weight:900;display:inline-flex}.pill.teal{color:var(--teal-b);background:#2dd4bf2e}.pill.amber{color:var(--amber-l);background:#f5a52433}.bo{display:block;overflow:visible}.bo.bob{animation:2.8s ease-in-out infinite bob}@keyframes bob{50%{transform:translateY(-8px)rotate(-3deg)}}.bo.jump{animation:.7s cubic-bezier(.3,1.6,.5,1) jump}@keyframes jump{40%{transform:translateY(-26px)scale(1.06,.94)}}.bo.shake{animation:.5s ease-in-out shake}@keyframes shake{25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}.map-stage{margin-top:40px}.hero-bo{z-index:4;width:96px;position:absolute;top:-66px;left:-4px}.bubble-say{z-index:5;white-space:nowrap;border-radius:20px 20px 20px 6px;padding:10px 16px;font-size:15px;font-weight:900;animation:6s ease-in-out infinite say;position:absolute;top:-44px;left:92px}@media (width>=980px){.map-stage{margin-top:0}.hero-bo{width:132px;top:-70px;left:auto;right:-36px}.bubble-say{border-radius:20px 20px 6px;top:-62px;left:auto;right:104px}}@keyframes say{0%,8%{opacity:0;transform:translateY(8px)scale(.9)}14%,80%{opacity:1;transform:none}90%,to{opacity:0;transform:translateY(-6px)}}.stats{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}@media (width>=760px){.stats{grid-template-columns:repeat(5,1fr);gap:16px}}.stat{text-align:center;background:var(--ink-2);border:2px solid color-mix(in srgb, var(--c) 75%, transparent);box-shadow:0 6px 0 color-mix(in srgb, var(--c) 40%, #000), 0 16px 30px #00000040;border-radius:22px;padding:18px 8px 16px}.stat b{color:var(--c);font-variant-numeric:tabular-nums;font-size:clamp(36px,4.2vw,50px);font-weight:1000;line-height:1;display:block}.stat span{color:var(--muted);letter-spacing:.05em;text-transform:uppercase;margin-top:8px;font-size:13.5px;font-weight:900;display:block}:lang(zh-Hant) .stat span{letter-spacing:.08em}.stats .stat:last-child:nth-child(odd){grid-column:1/-1}@media (width>=760px){.stats .stat:last-child:nth-child(odd){grid-column:auto}}.quiz-wrap{align-items:center;gap:28px;margin-top:44px;display:grid}@media (width>=900px){.quiz-wrap{grid-template-columns:220px minmax(0,560px);justify-content:center;gap:40px}}.quiz-bo{flex-direction:column;align-items:center;gap:12px;display:flex}.quiz-bo .bo{width:150px}.quiz-bo .speech{text-align:center;border-radius:20px;max-width:240px;padding:12px 16px;font-weight:900}@media (width<=899px){.quiz-bo{flex-direction:row;justify-content:center}.quiz-bo .bo{width:92px}}.quiz{border-radius:32px;padding:22px 20px 20px;overflow:hidden}@media (width>=600px){.quiz{padding:26px}}.q-bar{background:#ffffff1f;border-radius:8px;height:16px;overflow:hidden}.q-bar i{background:linear-gradient(#ffd27a,#f5a524);border-radius:8px;width:0;height:100%;transition:width .5s cubic-bezier(.3,1.4,.5,1);display:block;box-shadow:inset 0 4px #ffffff59}.q-tag{color:var(--teal-b);margin:20px 0 4px;font-size:14px;font-weight:900}.q-text{margin:0;font-size:clamp(23px,3vw,28px);font-weight:900;line-height:1.2}.q-text .zh{color:var(--amber-l)}.q-listen{margin-top:14px}.q-listen[hidden]{display:none}.opts{grid-template-columns:1fr 1fr;gap:12px;margin-top:20px;display:grid}.opt{cursor:pointer;background:#ffffff0f;border:2px solid #ffffff29;border-radius:22px;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-height:104px;transition:transform 80ms,box-shadow 80ms,border-color .15s,background-color .15s;display:flex;box-shadow:0 5px #ffffff17}.opt:hover{background:#ffffff1a}.opt:active{transform:translateY(4px);box-shadow:0 1px #ffffff17}.opt .g{font-family:var(--zh);font-size:44px;font-weight:900;line-height:1.05}.opt .g.latin{font-family:var(--font);font-size:34px}.opt[aria-pressed=true]{border-color:var(--teal-b);box-shadow:0 5px 0 var(--teal-d);background:#2dd4bf29}.opt.right{border-color:var(--teal-b);box-shadow:0 5px 0 var(--teal-d);background:#2dd4bf47;animation:.5s cubic-bezier(.3,1.7,.5,1) pop}.opt.wrong{border-color:var(--amber);box-shadow:0 5px 0 var(--amber-d);background:#f5a5242e;animation:.4s shake}.q-check{border-top:1px solid #0000;margin:20px -20px -20px;padding:18px 20px 22px;transition:background-color .25s}@media (width>=600px){.q-check{margin:24px -26px -26px;padding:20px 26px 26px}}.q-check .btn{width:100%}.q-check .btn[disabled]{--c:#ffffff1f;--d:#0000004d;color:var(--faint);cursor:default;filter:none;background-image:none;transform:none}.q-fb{margin-bottom:14px;display:none}.q-fb b{align-items:center;gap:8px;font-size:20px;font-weight:900;display:flex}.q-fb p{margin:4px 0 0;font-size:15.5px;line-height:1.5}.q-check.ok{background:#14b8a633;border-top-color:#2dd4bf66}.q-check.no{background:#f5a52429;border-top-color:#f5a52473}.q-check.ok .q-fb,.q-check.no .q-fb{display:block}.q-check.ok .q-fb b{color:var(--teal-b)}.q-check.no .q-fb b{color:var(--amber-l)}.q-done{text-align:center;padding:10px 0 4px}.q-done[hidden]{display:none}.q-done h3{margin:4px 0 6px;font-size:30px}.q-done p{color:var(--muted);margin:0 0 18px}.q-done .row{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.confetti{pointer-events:none;z-index:80;position:fixed;inset:0;overflow:hidden}.confetti i{width:10px;height:16px;animation:fall var(--t) cubic-bezier(.2, .6, .4, 1) forwards;animation-delay:var(--d);border-radius:3px;position:absolute;top:-20px}@keyframes fall{to{transform:translate(var(--x), 110vh) rotate(var(--r))}}.phone{aspect-ratio:1080/2400;background:linear-gradient(145deg,#2b3438,#0c1012);border-radius:46px;width:min(300px,78vw);margin:0 auto;padding:9px;position:relative;box-shadow:0 0 0 1.5px #3c464b,0 44px 90px #0000008c,0 10px 24px #0006}.phone .screen{background:var(--ink);border-radius:38px;width:100%;height:100%;position:relative;overflow:hidden}.phone .screen img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.phone.tilt{transition:transform .8s cubic-bezier(.2,1,.3,1);transform:perspective(1400px)rotateY(-10deg)rotateX(3deg)}.phone.tilt:hover{transform:perspective(1400px)rotateY(-3deg)rotateX(1deg)translateY(-6px)}.tour{align-items:start;gap:36px;margin-top:44px;display:grid}@media (width>=900px){.tour{grid-template-columns:1fr 1fr;gap:56px}.tour>:first-child{padding-top:24px;position:sticky;top:140px}}.tabs{flex-wrap:wrap;gap:8px;display:flex}.tabs [role=tab]{cursor:pointer;border:1px solid var(--line);color:var(--muted);background:#ffffff0f;border-radius:16px;padding:10px 16px;font-size:15px;font-weight:900;transition:transform 80ms,background-color .2s,color .2s;box-shadow:0 4px #00000040}.tabs [role=tab]:active{transform:translateY(3px)}.tabs [role=tab][aria-selected=true]{color:var(--ink);background:var(--amber-l);box-shadow:0 4px 0 var(--amber-d);border-color:#0000}.tab-copy{min-height:180px;margin-top:26px}.tab-copy h3{font-size:clamp(28px,3.4vw,38px)}.tab-copy p{color:var(--muted);max-width:46ch;margin:12px 0 0;font-size:18px}.tab-copy [hidden],.tour .shot[hidden]{display:none}.js .tour .shot:not([hidden]){animation:.55s cubic-bezier(.2,1.2,.4,1) shotIn}@keyframes shotIn{0%{opacity:0;transform:translateY(18px)scale(.97)}}.js .tab-copy>div:not([hidden]){animation:.45s fadeUp}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}}.demo-note{color:var(--faint);margin-top:14px;font-size:13.5px}.feature-card{border-radius:32px;padding:22px}.paper{color:var(--ink);background:#fff8ec;border-radius:26px;padding:18px;box-shadow:0 30px 60px #0006,inset 0 -4px #00000014}.stroke-stage{aspect-ratio:1;max-width:360px;margin:0 auto;position:relative}.stroke-svg{width:100%;height:auto;display:block}.stroke-svg .grid{stroke:#e2cfa9;fill:none}.stroke-svg .ghost{fill:#eadfca}.stroke-svg .ink{fill:none;stroke:var(--ink);stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:0}.stroke-svg .ink.tone{stroke:var(--ink)}.stroke-svg .num{font:900 30px var(--font);fill:#fff}.stroke-svg .dot{fill:var(--coral)}.js .stroke-svg.ready .ink{stroke-dashoffset:1px}.js .stroke-svg.ready .marker{opacity:0}.js .stroke-svg.play .ink{animation:drawStroke var(--dur) cubic-bezier(.45, .1, .4, 1) var(--d) forwards}.js .stroke-svg.play .marker{animation:showMarker .2s ease var(--d) forwards}@keyframes drawStroke{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes showMarker{to{opacity:1}}.chips{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:18px;display:flex}.chip{border:1px solid var(--line);cursor:pointer;min-width:52px;height:52px;font-family:var(--zh);background:#ffffff12;border-radius:16px;font-size:26px;font-weight:900;transition:transform 80ms;box-shadow:0 4px #0000004d}.chip:active{transform:translateY(3px)}.chip[aria-pressed=true]{background:var(--teal-b);color:var(--ink);box-shadow:0 4px 0 var(--teal-d)}.step-strip{flex-wrap:wrap;gap:10px;display:flex}.step-strip figure{text-align:center;width:84px;margin:0}.step-strip svg{background:#fff8ec;border-radius:16px;width:84px;height:84px}.step-strip figcaption{color:var(--muted);margin-top:4px;font-size:13px;font-weight:800}.pitch{width:100%;height:auto;display:block}.pitch .axis{stroke:#ffffff1a}.pitch .target{fill:none;stroke-width:14px;stroke-linecap:round;opacity:.3}.pitch .voice{fill:none;stroke-width:5px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px}.pitch .lab{font:900 22px var(--font);fill:var(--cream)}.pitch .lab.zh{font-family:var(--zh)}.js .in .pitch .voice,.no-js .pitch .voice{animation:1.6s forwards drawStroke;animation-delay:calc(var(--i) * .35s + .3s)}.ruby-card{border-radius:32px;padding:26px 22px}.seg{border:1px solid var(--line);background:#ffffff14;border-radius:16px;gap:4px;padding:4px;display:inline-flex}.seg button{cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:12px;padding:8px 14px;font-size:14.5px;font-weight:900}.seg button[aria-pressed=true]{background:var(--cream);color:var(--ink)}.ruby-text{flex-direction:column;gap:14px;margin-top:22px;display:flex}.ruby-line{flex-wrap:wrap;align-items:flex-end;gap:4px 2px;display:flex}.rb{align-items:center;gap:2px;margin-right:6px;display:inline-flex}.rb .han{font-family:var(--zh);font-size:clamp(30px,4vw,40px);font-weight:700;line-height:1.15}.rb .zy{font-family:var(--zh);color:var(--amber-l);flex-direction:column;justify-content:center;align-items:center;min-width:1.1em;padding-right:.7em;font-size:clamp(13px,1.6vw,16px);font-weight:700;line-height:1.05;display:inline-flex;position:relative}.rb .zy .tm{font-size:.9em;line-height:1;position:absolute;bottom:.1em;right:0}.rb .zy .neutral{line-height:.5}.rb .py{color:var(--amber-l);font-size:13px;font-weight:800;display:none}.rb.punct .zy{visibility:hidden}.ruby-text[data-mode=pinyin] .rb{flex-direction:column-reverse;gap:0}.ruby-text[data-mode=pinyin] .zy,.ruby-text[data-mode=none] .zy{display:none}.ruby-text[data-mode=pinyin] .py{min-height:1.2em;display:block}.ruby-trans{color:var(--muted);margin-top:18px;font-size:15px}.kb{user-select:none;border-radius:26px;gap:6px;padding:12px;display:grid}.kb-row{grid-template-columns:repeat(11,1fr);gap:6px;display:grid}.key{aspect-ratio:1/1.16;font-family:var(--zh);color:var(--ink);background:var(--k);border-radius:10px;place-items:center;font-size:clamp(14px,2.4vw,22px);font-weight:900;transition:transform 80ms,box-shadow 80ms,filter .2s;display:grid;box-shadow:0 3px #00000059,inset 0 1px #ffffff73}.key.empty{visibility:hidden}.key.down{filter:brightness(1.25)saturate(1.2);transform:translateY(3px);box-shadow:0 0 #00000059}.key.space{aspect-ratio:auto;height:44px;font-family:var(--font);grid-column:3/span 7;font-size:14px}.kb-out{background:#00000040;border-radius:18px;align-items:center;gap:12px;min-height:64px;margin-bottom:4px;padding:10px 16px;display:flex}.kb-out .typed{font-family:var(--zh);color:var(--amber-l);min-width:3ch;font-size:26px;font-weight:700}.kb-out .typed:after{content:"";vertical-align:-.12em;background:var(--teal-b);width:3px;height:1em;margin-left:3px;animation:1s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}.kb-out .result{font-family:var(--zh);margin-left:auto;font-size:30px;font-weight:900}.kb-legend{color:var(--muted);flex-wrap:wrap;gap:14px;margin-top:12px;font-size:14px;font-weight:800;display:flex}.kb-legend i{vertical-align:-2px;border-radius:4px;width:14px;height:14px;margin-right:6px;display:inline-block}.curve{width:100%;height:auto;display:block}.curve .r{fill:none;stroke:url(#curveG);stroke-width:5px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1px}.js .in .curve .r,.no-js .curve .r{animation:2.6s .2s forwards drawStroke}.curve .tick{fill:var(--amber-l);stroke:var(--ink);stroke-width:3px}.curve text{font:800 14px var(--font);fill:var(--muted)}.stages{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:18px;display:grid}.stages div{text-align:center;border:1px solid var(--line);background:#ffffff0f;border-radius:16px;padding:10px}.stages b{font-size:15px;display:block}.stages small{color:var(--muted);font-size:12.5px;font-weight:800}.stages div:first-child b{color:var(--cream)}.stages div:nth-child(2) b{color:var(--amber-l)}.stages div:nth-child(3) b{color:#7ee8da}.stages div:nth-child(4) b{color:var(--teal-b)}.paths{gap:14px;margin-top:36px;display:grid}@media (width>=900px){.paths{grid-template-columns:repeat(3,1fr)}}.path{border-radius:26px;padding:22px}.path .badge{width:56px;height:56px;color:var(--ink);border-radius:18px;place-items:center;font-size:18px;font-weight:1000;display:grid;box-shadow:0 4px #0000004d,inset 0 1px #ffffff80}.path h3{margin:16px 0 4px;font-size:24px}.path p{color:var(--muted);margin:0}.js .reveal .js .reveal.in .words-row{flex-wrap:wrap;gap:6px;margin-top:14px;display:flex}.words-row span{font-family:var(--zh);background:#ffffff12;border-radius:10px;padding:4px 10px;font-weight:700}.cards4{gap:14px;margin-top:40px;display:grid}@media (width>=700px){.cards4{grid-template-columns:1fr 1fr}}@media (width>=1000px){.cards4{grid-template-columns:repeat(4,1fr)}}.mini{border-radius:26px;padding:22px}.mini .ic{width:52px;height:52px;color:var(--teal-b);background:#2dd4bf29;border-radius:16px;place-items:center;margin-bottom:14px;display:grid}.mini h3{font-size:21px}.mini p{color:var(--muted);margin:8px 0 0;font-size:16px}.marquee{margin-top:36px;overflow:hidden;mask-image:linear-gradient(90deg,#0000,#000 8% 92%,#0000)}.marquee-track{gap:12px;width:max-content;animation:48s linear infinite marquee;display:flex}.marquee:hover .marquee-track{animation-play-state:paused}@keyframes marquee{to{transform:translate(-50%)}}.lang{border-radius:20px;flex-direction:column;min-width:150px;padding:14px 20px;display:inline-flex}.lang b{font-size:22px;font-weight:900}.lang span{color:var(--muted);font-size:14px;font-weight:800}.faq{gap:12px;max-width:860px;margin-top:36px;margin-left:auto;margin-right:auto;display:grid}.faq details{border-radius:22px;padding:0 22px}.faq summary{cursor:pointer;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font-size:18.5px;font-weight:900;list-style:none;display:flex}.faq summary::-webkit-details-marker{display:none}.faq summary svg{color:var(--amber-l);flex:none;transition:transform .25s}.faq details[open] summary svg{transform:rotate(45deg)}.faq details p{color:var(--muted);margin:0 0 20px}.cta-band{text-align:center;background:linear-gradient(135deg, #2dd4bf4d, #f5a5244d), var(--ink-2);border:1px solid #ffffff29;border-radius:40px;padding:48px 22px;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff4d,0 40px 80px #00000059}@media (width>=700px){.cta-band{padding:72px 40px}}.cta-band .bo{width:130px;margin:0 auto 10px}.cta-band h2{font-size:clamp(36px,6vw,64px)}.cta-band p{color:var(--muted);max-width:46ch;margin:14px auto 28px;font-size:19px}.cta-band .bits i{border-radius:4px;width:12px;height:18px;animation:3.4s ease-in-out infinite flt;position:absolute}@keyframes flt{50%{transform:translateY(10px)rotate(30deg)}}.page-hero{padding:40px 0 24px}@media (width>=900px){.page-hero{padding:72px 0 32px}}.page-hero h1{font-size:clamp(40px,6.4vw,72px)}.crumbs{color:var(--faint);flex-wrap:wrap;gap:6px;margin-bottom:18px;font-size:14px;font-weight:800;display:flex}.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--amber-l)}.prose{max-width:760px}.prose h2{margin:56px 0 14px;font-size:clamp(28px,3.6vw,38px)}.prose h3{margin:32px 0 8px;font-size:22px}.prose p,.prose li{color:var(--muted)}.prose strong,.prose b{color:var(--cream)}.prose ul,.prose ol{padding-left:22px}.prose li{margin:6px 0}.callout{border-radius:24px;margin:24px 0;padding:18px 22px}.callout p{margin:0}.table-wrap{border:1px solid var(--line);-webkit-overflow-scrolling:touch;background:#ffffff08;border-radius:22px;margin:24px 0;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:15.5px}th,td{text-align:left;vertical-align:middle;border-bottom:1px solid #ffffff14;padding:11px 14px}thead th{color:var(--cream);white-space:nowrap;background:#ffffff0f;font-weight:900}tbody tr:hover{background:#ffffff0a}td .zh,.big-zh{font-family:var(--zh);font-size:24px;font-weight:900}.sym-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:18px;display:grid}.sym-card{color:var(--cream);border-radius:22px;grid-template-columns:56px 1fr;align-items:center;gap:4px 12px;padding:12px;text-decoration:none;transition:transform .15s,border-color .2s;display:grid}.sym-card:hover{color:var(--cream);border-color:#ffd27a80;transform:translateY(-3px)}.sym-card .tile{border-radius:17px;grid-row:span 2;width:56px;height:56px;font-size:32px}.sym-card b{font-size:19px;font-weight:900;line-height:1}.sym-card small{color:var(--muted);font-size:13px;font-weight:800;line-height:1.2}.group-title{align-items:baseline;gap:12px;margin:40px 0 0;font-size:24px;display:flex}.group-title small{color:var(--muted);font-size:15px;font-weight:800}.guide-cards{gap:14px;margin-top:36px;display:grid}@media (width>=700px){.guide-cards{grid-template-columns:repeat(2,1fr)}}@media (width>=1000px){.guide-cards{grid-template-columns:repeat(3,1fr)}}.guide-card{color:var(--cream);border-radius:26px;padding:22px;text-decoration:none;transition:transform .15s;display:block}.guide-card:hover{color:var(--cream);transform:translateY(-4px)}.guide-card .zh{color:var(--amber-l);font-size:15px;font-weight:900}.guide-card h3{margin:6px 0;font-size:23px}.guide-card p{color:var(--muted);margin:0;font-size:16px}.sym-hero{align-items:center;gap:28px;display:grid}@media (width>=900px){.sym-hero{grid-template-columns:1fr 380px;gap:48px}}.sym-title{flex-wrap:wrap;align-items:center;gap:20px;display:flex}.sym-title .tile{border-radius:34px;width:120px;height:120px;font-size:76px;box-shadow:0 7px #0000004d,inset 0 2px #ffffff80}.sym-facts{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.fact{border:1px solid var(--line);height:36px;color:var(--muted);background:#ffffff12;border-radius:18px;align-items:center;gap:6px;padding:0 14px;font-size:14.5px;font-weight:800;display:inline-flex}.fact b{color:var(--cream)}.fact .zh{color:var(--cream);font-size:17px}.info-grid{gap:14px;margin-top:28px;display:grid}@media (width>=800px){.info-grid{grid-template-columns:1fr 1fr}}.info{border-radius:26px;padding:22px}.info .label{color:var(--teal-b);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;font-size:14px;font-weight:900;display:block}.info p{margin:0;font-size:17.5px}.word-list{gap:10px;margin-top:16px;display:grid}@media (width>=700px){.word-list{grid-template-columns:1fr 1fr}}.word{border-radius:20px;align-items:center;gap:16px;padding:12px 16px;display:flex}.word .han{font-family:var(--zh);font-size:34px;font-weight:900;line-height:1}.word .bp{font-family:var(--zh);color:var(--amber-l);letter-spacing:.05em;font-size:16px;font-weight:700}.word .mean{color:var(--muted);font-size:14.5px}.word .speak{margin-left:auto}.icon-btn{cursor:pointer;background:var(--teal-b);width:44px;height:44px;color:var(--ink);box-shadow:0 4px 0 var(--teal-d);border:0;border-radius:50%;flex:none;place-items:center;transition:transform 80ms;display:grid}.icon-btn:active{box-shadow:none;transform:translateY(4px)}.icon-btn[hidden]{display:none}.syl-chips{flex-wrap:wrap;gap:6px;margin-top:14px;display:flex}.syl-chips a{font-family:var(--zh);color:var(--cream);background:#ffffff12;border-radius:12px;padding:6px 10px;font-size:16px;font-weight:700;text-decoration:none}.syl-chips a small{font-family:var(--font);color:var(--muted);margin-left:4px;font-size:13px;font-weight:800}.syl-chips a:hover{background:#f5a52433}.pn{grid-template-columns:1fr 1fr;gap:12px;margin-top:48px;display:grid}.pn a{color:var(--cream);border-radius:22px;align-items:center;gap:12px;padding:16px 18px;text-decoration:none;display:flex}.pn a:last-child{text-align:right;justify-content:flex-end}.pn .zh{font-size:34px;font-weight:900}.pn small{color:var(--muted);font-weight:800;display:block}.syl-table td,.syl-table th{text-align:center;padding:6px 8px}.syl-table td a{color:var(--cream);border-radius:10px;padding:4px 2px;text-decoration:none;display:block}.syl-table td a:hover{background:#f5a52433}.syl-table td .zh{font-size:17px;font-weight:700;display:block}.syl-table td small{color:var(--muted);font-size:12.5px;font-weight:800}.syl-table th.zh{font-family:var(--zh);font-size:18px}.syl-table th small{font-family:var(--font);color:var(--muted);font-size:12px;display:block}.syl-table tbody th{z-index:1;background:#0d2328;position:sticky;left:0}.syl-table td:target,.syl-table td.hl{background:#f5a52440}.tone-cards{gap:12px;margin-top:24px;display:grid}@media (width>=700px){.tone-cards{grid-template-columns:repeat(5,1fr)}}.tone-card{text-align:center;border-radius:24px;padding:18px}.tone-card .mk{width:64px;height:64px;font-family:var(--zh);color:var(--ink);background:var(--tc);border-radius:50%;place-items:center;margin:0 auto;font-size:36px;font-weight:900;display:grid;box-shadow:0 4px #0000004d,inset 0 1px #ffffff80}.tone-card h3{margin:12px 0 2px;font-size:19px}.tone-card .ex{font-family:var(--zh);font-size:30px;font-weight:900}.tone-card p{color:var(--muted);margin:4px 0 0;font-size:14.5px}.tone-card svg{width:100%;height:64px;margin-top:8px}.legal-page{padding:40px 16px 80px}.legal-heading h1{font-size:clamp(38px,6vw,60px)}.legal-summary{color:var(--muted);max-width:60ch;font-size:19px}.legal-grid{gap:32px;margin-top:36px;display:grid}@media (width>=960px){.legal-grid{grid-template-columns:240px 1fr;gap:56px}.legal-toc{align-self:start;position:sticky;top:104px}}.legal-toc{gap:2px;display:grid}.legal-toc a{color:var(--muted);border-radius:10px;padding:6px 10px;font-size:15px;font-weight:800;text-decoration:none}.legal-toc a:hover{color:var(--cream);background:#ffffff0f}.legal-prose{max-width:760px}.legal-prose section{scroll-margin-top:104px}.legal-prose h2{margin:44px 0 12px;font-size:27px}.legal-prose section:first-child h2{margin-top:0}.legal-prose p,.legal-prose li,.legal-prose td{color:var(--muted)}.legal-prose strong{color:var(--cream)}.legal-prose address{border:1px solid var(--line);color:var(--cream);background:#ffffff0f;border-radius:20px;margin:16px 0;padding:16px 20px;font-style:normal;line-height:1.7}.legal-callout{background:#2dd4bf1a;border:1px solid #2dd4bf4d;border-radius:20px;margin:18px 0;padding:16px 20px}.legal-callout p{color:var(--cream);margin:0}code{background:#ffffff14;border-radius:6px;padding:2px 6px;font-size:.92em}.site-footer{border-top:1px solid var(--line);background:linear-gradient(#0000,#00000040);margin-top:40px;padding:56px 0 40px}.footer-grid{gap:32px;display:grid}@media (width>=800px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr}}.footer-brand p{color:var(--muted);max-width:34ch;font-size:15.5px}.site-footer h2{letter-spacing:.08em;text-transform:uppercase;color:var(--teal-b);margin:0 0 12px;font-size:14px}.site-footer nav{gap:6px;display:grid}.site-footer nav a{color:var(--muted);font-size:15.5px;font-weight:700;text-decoration:none}.site-footer nav a:hover{color:var(--amber-l)}.footer-bottom{color:var(--faint);flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:40px;font-size:14px;display:flex}.not-found{text-align:center;padding:80px 16px}.not-found .bo{width:160px;margin:0 auto 16px}.not-found h1{font-size:clamp(40px,7vw,72px)}.not-found p{color:var(--muted)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.js .reveal{opacity:1;transform:none}.js .stroke-svg.ready .ink{stroke-dashoffset:0}.js .stroke-svg.ready .marker{opacity:1}.pitch .voice,.curve .r{stroke-dashoffset:0}.js .reveal .marquee-track{flex-wrap:wrap;width:auto}.marquee-track [aria-hidden=true]{display:none}}.rb rp{display:none}.key{position:relative}.key small{font:800 10px var(--font);opacity:.55;position:absolute;top:3px;right:5px}:lang(zh-Hant) :is(p,li,small,.lead,.muted,.faq summary,.side-note,.stat span):not(.zh){font-family:Nunito,system-ui,PingFang TC,Microsoft JhengHei,Noto Sans CJK TC,Noto Sans TC,sans-serif}:lang(zh-Hant) .hero h1{font-size:clamp(42px,6.6vw,80px);line-height:1.08}:lang(zh-Hant) .h2{line-height:1.18}.syl-table td .zh,.syl-table th.zh span{white-space:nowrap}.side-note{color:var(--muted);align-items:center;gap:10px;margin:22px 0 0;font-size:16px;font-weight:800;display:flex}.side-note svg{color:var(--teal-b);flex:none}.duo{justify-items:center;display:grid;position:relative}.duo .phone{width:min(260px,66vw);transform:rotate(2.5deg)}.duo .float{z-index:2;background:#0d262cdb;border-radius:26px;width:min(460px,100%);margin-top:-96px;padding:14px 16px 12px;position:relative}.duo .float .kb-legend{margin-top:4px}@media (width>=900px){.duo{min-height:610px;display:block}.duo .phone{margin:0 12px 0 auto}.duo .float{width:430px;margin:0;position:absolute;bottom:36px;left:-12px}.flip .duo .phone{margin:0 auto 0 12px;transform:rotate(-2.5deg)}.flip .duo .float{left:auto;right:-12px}}.stages{margin-top:28px}.paper-band{color:var(--ink);background:linear-gradient(170deg,#fffaf1,#f6ead3);border-radius:40px;margin:24px 12px;box-shadow:0 40px 80px #00000059,inset 0 -6px #0b1f240f}.paper-band .h2{color:var(--ink)}.paper-band .h2 em{color:var(--amber-d)}.paper-band .lead{color:#0b1f24c7}.paper-band :focus-visible{outline-color:var(--ink)}.paper-band .ruby-card{background:#fff;border-radius:30px;box-shadow:0 24px 50px #785a282e,0 0 0 1px #0b1f240f}.paper-band .seg{background:#0b1f240f;border-color:#0b1f241a}.paper-band .seg button{color:#0b1f24b3}.paper-band .seg button[aria-pressed=true]{background:var(--ink);color:var(--cream)}.paper-band .rb .zy,.paper-band .rb .py{color:var(--teal-d)}.paper-band .ruby-trans{color:#0b1f24b3}.paper-band ruby.rb:hover .han{color:var(--teal-d)}.path-head{align-items:center;gap:14px;display:flex}.path .badge{background:var(--pc)}.path h3{margin:0}.path-n{color:var(--muted);margin:18px 0 0;font-weight:800}.path-n b{color:var(--pc);font-variant-numeric:tabular-nums;margin-right:4px;font-size:44px;font-weight:1000;line-height:1}.cards3{gap:14px;margin-top:36px;display:grid}@media (width>=800px){.cards3{grid-template-columns:repeat(3,1fr)}}.mouths{border-radius:28px;grid-template-columns:1fr 1fr;gap:10px;width:min(460px,100%);padding:12px;display:grid}.mouths figure{text-align:center;margin:0}.mouths img{border-radius:18px;width:100%;height:auto}.mouths figcaption{margin-top:6px;font-size:17px;font-weight:900}.mouths figcaption .zh{color:var(--amber-l);margin-right:2px;font-size:22px}.mouths figcaption small{color:var(--muted);font-size:13.5px;font-weight:800;display:block}.duo .mouths{transform:rotate(-1.5deg)}.duo .mouths+.float{margin-top:16px}@media (width>=900px){.duo:has(.mouths){justify-items:start;min-height:0;display:grid}.duo .mouths+.float{margin:16px 0 0 60px;position:relative;bottom:auto;left:auto;right:auto;transform:rotate(1deg)}}.ruby-line .nb{white-space:nowrap;align-items:flex-end;display:inline-flex}.rb.punct .zy{display:none}.rb.punct .han{margin-right:2px}.info.say-it{grid-row:span 2;grid-template-columns:132px 1fr;align-items:center;gap:16px;display:grid}.info.say-it img{border-radius:18px;width:132px;height:auto}@media (width>=800px){.info.say-it{grid-template-columns:210px 1fr;gap:22px}.info.say-it img{width:210px}}.nb .rb:has(+.punct){margin-right:0}@media (width>=900px){.paper-band .split{grid-template-columns:1fr 1.15fr}}.q-alt{color:var(--amber-l);background:#f5a52424;border-radius:14px;margin:12px 0 0;padding:10px 14px;font-size:15px;font-weight:800}.q-alt[hidden]{display:none}