:root{--indigo:#4f46e5;--pink:#db2777;--ink:#0f172a;--muted:#475569;--soft:#64748b;--bg:#faf9ff;--card:#fff;--border:#e2e8f0;--grad:linear-gradient(90deg, var(--indigo), var(--pink));--radius:16px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Arial,Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;line-height:1.65}.hanzi-font{font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif}a{color:var(--indigo);text-decoration:none}a:hover{text-decoration:underline}.container{max-width:1080px;margin:0 auto;padding:0 20px}.site-header{z-index:50;backdrop-filter:blur(12px);border-bottom:1px solid var(--border);background:#ffffffd9;position:sticky;top:0}.site-header .container{align-items:center;gap:22px;height:60px;display:flex}.logo{color:var(--ink);white-space:nowrap;align-items:center;gap:10px;font-size:17px;font-weight:800;display:flex}.logo:hover{text-decoration:none}.logo-mark{background:var(--grad);color:#fff;border-radius:9px;flex:none;justify-content:center;align-items:center;width:34px;height:34px;font-size:20px;font-weight:700;display:flex}.site-nav{align-items:center;gap:18px;margin-left:auto;font-size:15px;font-weight:600;display:flex}.site-nav a{color:var(--muted)}.site-nav a:hover{color:var(--indigo);text-decoration:none}.btn{background:var(--grad);cursor:pointer;border:none;border-radius:999px;padding:9px 20px;font-size:15px;font-weight:700;display:inline-block;color:#fff!important}.btn:hover{filter:brightness(1.08);text-decoration:none}.btn-outline{border:2px solid var(--indigo);background:#fff;color:var(--indigo)!important}.hero{text-align:center;background:radial-gradient(600px 300px at 15% 0,#60a5fa40,#0000),radial-gradient(600px 300px at 85% 100%,#f472b638,#0000),linear-gradient(135deg,#eef2ff,#faf5ff 55%,#fdf2f8);padding:64px 0 56px}.hero h1{max-width:800px;margin:0 auto 16px;font-size:clamp(30px,5vw,46px);font-weight:900;line-height:1.18}.hero h1 .accent{background:var(--grad);color:#0000;background-clip:text}.hero p.sub{color:var(--muted);max-width:640px;margin:0 auto 28px;font-size:clamp(16px,2.4vw,20px)}.hero .cta-row{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.hero .cta-row .btn{padding:13px 30px;font-size:17px}.stats-band{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:36px;display:flex}.stat-chip{color:var(--ink);background:#fffc;border:1px solid #fff;border-radius:999px;padding:8px 20px;font-size:15px;font-weight:700;box-shadow:0 4px 14px #4f46e514}.hero-metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;max-width:900px;margin:38px auto 0;display:grid}.hero-metric{text-align:center;background:#ffffffdb;border:1px solid #fffffff2;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;min-height:112px;padding:20px 14px;display:flex;box-shadow:0 10px 28px #4f46e517}.hero-metric strong{color:var(--indigo);font-size:clamp(27px,4vw,38px);font-weight:900;line-height:1}.hero-metric span{color:var(--muted);margin-top:9px;font-size:14px;font-weight:700}section.block{padding:52px 0}section.block.alt{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:#fff}h2.section-title{margin-bottom:10px;font-size:clamp(24px,3.4vw,32px);font-weight:800}p.section-sub{color:var(--muted);max-width:720px;margin-bottom:28px}.grid{gap:16px;display:grid}.grid-3{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.grid-2{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px;transition:box-shadow .2s,transform .2s}a.card{color:inherit;display:block}a.card:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 12px 28px #4f46e51f}.card h3{margin-bottom:6px;font-size:19px}.card p{color:var(--muted);font-size:14.5px}.card .card-meta{color:var(--indigo);margin-top:10px;font-size:13.5px;font-weight:700}.featured-topics{align-items:stretch}.topic-card{min-height:154px}.topic-card-top{justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px;display:flex}.topic-card-icon{font-size:28px;line-height:1}.topic-card-category{max-width:75%;color:var(--indigo);text-align:right;background:#eef2ff;border-radius:999px;padding:4px 10px;font-size:11.5px;font-weight:800}.topic-card h3{margin-bottom:12px}.level-badge{border-radius:999px;padding:3px 12px;font-size:12.5px;font-weight:800;display:inline-block}.lv-1{color:#b91c1c;background:#fee2e2}.lv-2{color:#c2410c;background:#ffedd5}.lv-3{color:#a16207;background:#fef9c3}.lv-4{color:#15803d;background:#dcfce7}.lv-5{color:#1d4ed8;background:#dbeafe}.lv-6{color:#7e22ce;background:#f3e8ff}.lv-topic{color:#4338ca;background:#e0e7ff}.breadcrumbs{color:var(--soft);padding:14px 0 0;font-size:13.5px}.breadcrumbs ol{flex-wrap:wrap;gap:6px;list-style:none;display:flex}.breadcrumbs li+li:before{content:"›";color:#cbd5e1;margin-right:6px}.breadcrumbs a{color:var(--soft)}.word-table-wrap{border:1px solid var(--border);border-radius:var(--radius);background:#fff;overflow-x:auto}table.word-table{border-collapse:collapse;width:100%;font-size:15.5px}.word-table th{text-align:left;text-transform:uppercase;letter-spacing:.04em;color:var(--soft);border-bottom:1px solid var(--border);background:#f8fafc;padding:12px 16px;font-size:13px}.word-table td{vertical-align:top;border-bottom:1px solid #f1f5f9;padding:11px 16px}.word-table tr:last-child td{border-bottom:none}.word-table td.cell-hanzi a{color:var(--ink);font-size:21px;font-weight:700}.word-table td.cell-hanzi a:hover{color:var(--indigo);text-decoration:none}.word-table td.cell-pinyin{color:var(--indigo);white-space:nowrap;font-weight:600}.word-table td.cell-tr{color:var(--muted)}.entry-head{flex-wrap:wrap;align-items:flex-start;gap:26px;margin:26px 0;display:flex}.entry-hanzi{font-size:clamp(64px,12vw,110px);font-weight:900;line-height:1.05}.entry-meta{padding-top:10px}.entry-pinyin{color:var(--indigo);margin-bottom:6px;font-size:clamp(22px,4vw,30px);font-weight:700}.entry-translations{color:var(--ink);max-width:560px;margin-bottom:12px;font-size:clamp(17px,3vw,21px)}.entry-badges{flex-wrap:wrap;gap:8px;display:flex}.strokes-row{flex-wrap:wrap;gap:22px;margin:10px 0 8px;display:flex}.stroke-anim{text-align:center}.stroke-target{border:1.5px solid var(--border);background-color:#fff;background-image:linear-gradient(90deg,#0000 calc(50% - .5px),#f1f5f9 calc(50% - .5px) calc(50% + .5px),#0000 calc(50% + .5px)),linear-gradient(#0000 calc(50% - .5px),#f1f5f9 calc(50% - .5px) calc(50% + .5px),#0000 calc(50% + .5px));background-position:0 0;background-repeat:repeat;background-size:auto;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;border-radius:12px;margin:0 auto;position:relative}.stroke-controls{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:10px;display:flex}.stroke-controls button{border:1.5px solid var(--indigo);color:var(--indigo);cursor:pointer;background:#fff;border-radius:999px;padding:6px 14px;font-size:13px;font-weight:700}.stroke-controls button:hover{background:var(--indigo);color:#fff}.stroke-char-label{color:var(--muted);margin-top:8px;font-size:14px}.stroke-char-label a{font-weight:700}.chip-list{flex-wrap:wrap;gap:10px;display:flex}.chip{border:1px solid var(--border);color:var(--ink);background:#fff;border-radius:999px;padding:7px 16px;font-size:15px}.chip:hover{border-color:var(--indigo);color:var(--indigo);text-decoration:none}.chip .p{color:var(--indigo);margin-left:6px;font-size:13.5px;font-weight:600}.chip .t{color:var(--soft);margin-left:6px;font-size:13.5px}.cta-panel{border-radius:var(--radius);background:linear-gradient(135deg,#eef2ff,#fdf2f8);border:1px solid #e0e7ff;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;margin:34px 0;padding:26px;display:flex}.cta-panel .cta-text h3{margin-bottom:4px;font-size:20px}.cta-panel .cta-text p{color:var(--muted);font-size:14.5px}h2.sub-block{margin:34px 0 14px;font-size:22px;font-weight:800}.char-groups h3{color:var(--muted);margin:26px 0 10px;font-size:17px}.char-grid{flex-wrap:wrap;gap:8px;display:flex}.char-grid a{border:1px solid var(--border);width:52px;height:52px;color:var(--ink);background:#fff;border-radius:10px;justify-content:center;align-items:center;font-size:24px;font-weight:700;display:flex}.char-grid a:hover{border-color:var(--indigo);color:var(--indigo);text-decoration:none}.faq-item{border-bottom:1px solid var(--border);padding:16px 0}.faq-item h3{margin-bottom:6px;font-size:17px}.faq-item p{color:var(--muted);font-size:15px}.level-nav{flex-wrap:wrap;gap:8px;margin:18px 0;display:flex}.level-nav a{border:1.5px solid var(--border);color:var(--muted);background:#fff;border-radius:999px;padding:7px 16px;font-size:14.5px;font-weight:700}.level-nav a:hover{border-color:var(--indigo);color:var(--indigo);text-decoration:none}.level-nav a.active{background:var(--grad);color:#fff;border-color:#0000}.site-footer{border-top:1px solid var(--border);background:#fff;margin-top:60px;padding:36px 0}.site-footer .cols{flex-wrap:wrap;justify-content:space-between;gap:40px;display:flex}.site-footer h4{text-transform:uppercase;letter-spacing:.05em;color:var(--soft);margin-bottom:10px;font-size:14px}.site-footer ul{font-size:14.5px;list-style:none}.site-footer li{margin-bottom:6px}.site-footer a{color:var(--muted)}.site-footer .copyright{color:var(--soft);margin-top:26px;font-size:13px}@media (width<=640px){.site-nav{gap:12px;font-size:13.5px}.site-nav .nav-extra{display:none}.entry-head{gap:16px}.hero-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hero-metric{min-height:100px;padding:16px 10px}.hero-metric span{font-size:12.5px}}