.hanzi-hero{padding:120px 0 56px}.hanzi-hero-copy{text-align:center;max-width:720px;margin:0 auto 24px}.hanzi-hero h1{color:var(--ink);text-wrap:balance;margin:16px 0 12px;font-size:clamp(30px,4.4vw,50px);line-height:1.14}.hanzi-hero h1 em{color:var(--sky-700);font-style:normal}.hanzi-hero-copy>p{color:var(--secondary);text-wrap:pretty;margin:0;font-size:17px;line-height:1.6}.hanzi-practice{border:1px solid var(--sky-200);max-width:860px;box-shadow:var(--shadow-soft);background:#fff;border-radius:22px;margin:0 auto;padding:24px}.hanzi-label{color:var(--ink);margin-bottom:8px;font-size:14px;font-weight:700;display:block}.hanzi-label small{color:var(--tertiary);font-weight:500}.hanzi-form-row{gap:10px;display:flex}.hanzi-form input{border:1px solid var(--sky-400);min-width:0;height:52px;color:var(--ink);background:#fff;border-radius:14px;flex:1;padding:0 16px;font-size:22px}.hanzi-form input::placeholder{color:var(--quaternary);font-size:17px}.hanzi-form input:focus{border-color:var(--sky-600);box-shadow:0 0 0 3px var(--sky-200);outline:none}.hanzi-form .gv-btn{cursor:pointer;border-radius:14px;height:52px;padding:0 26px;font-size:15px}.hanzi-suggest{flex-wrap:wrap;gap:8px;margin-top:14px;display:flex}.hanzi-suggest button{border:1px solid var(--sky-200);min-height:40px;color:var(--ink);cursor:pointer;font:inherit;background:#fff;border-radius:999px;flex:none;align-items:baseline;gap:6px;padding:8px 14px;transition:background .15s,border-color .15s;display:inline-flex}.hanzi-suggest button span{font-size:17px;font-weight:600}.hanzi-suggest button small{color:var(--tertiary);font-size:12px}.hanzi-suggest button:hover{border-color:var(--sky-500)}.hanzi-suggest button[aria-pressed=true]{background:var(--sky-300);border-color:var(--sky-500)}.hanzi-suggest button[aria-pressed=true] small{color:var(--secondary)}.hanzi-toolbar{justify-content:space-between;align-items:center;gap:10px;margin:20px 0 16px;display:flex}.hanzi-practice.compact .hanzi-toolbar{margin-top:0}.hanzi-seg{background:var(--sky-100);border:1px solid var(--sky-200);border-radius:999px;padding:4px;display:inline-flex}.hanzi-seg button{min-height:40px;font:inherit;color:var(--secondary);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:0 18px;font-size:14.5px;font-weight:700;transition:background .15s,color .15s,box-shadow .15s}.hanzi-seg button:hover{color:var(--ink)}.hanzi-seg button[aria-pressed=true]{color:var(--ink);background:#fff;box-shadow:0 2px 8px -2px #0b6fa459}.hanzi-action{border:1px solid var(--sky-400);min-height:44px;color:var(--sky-800);font:inherit;cursor:pointer;background:#fff;border-radius:999px;align-items:center;gap:6px;padding:0 16px;font-size:14.5px;font-weight:700;display:inline-flex}.hanzi-action:hover{background:var(--sky-100)}.hanzi-board{flex-wrap:wrap;justify-content:center;display:flex}.hanzi-cell{flex-direction:column;align-items:center;max-width:100%;display:flex}.hanzi-canvas{aspect-ratio:1;background-color:var(--sky-50);border:2px solid var(--sky-200);touch-action:none;-webkit-user-select:none;user-select:none;background-size:100% 100%;border-radius:16px;min-width:120px;transition:border-color .2s}.hanzi-cell[data-status=done] .hanzi-canvas{border-color:#34b37a}.hanzi-cell[data-status=mistake] .hanzi-canvas{border-color:#e3a33b}.hanzi-note{text-align:center;width:100%;min-height:20px;color:var(--tertiary);margin:8px 0 0;font-size:13px;font-weight:600;line-height:1.4}.hanzi-note .ok{color:#0f7a4f}.hanzi-note .warn,.hanzi-note.warn{color:#a15c07}.hanzi-toggle{min-height:44px;color:var(--secondary);cursor:pointer;justify-content:center;align-items:center;gap:8px;margin-top:8px;font-size:14px;display:flex}.hanzi-toggle input{width:18px;height:18px;accent-color:var(--sky-700)}.hanzi-practice.compact{box-shadow:none;background:0 0;border:0;padding:0}@media (max-width:900px){.hanzi-hero{padding-top:96px}}@media (max-width:600px){.hanzi-hero{padding-bottom:40px}.hanzi-hero-copy>p{font-size:15.5px}.hanzi-practice{border-radius:18px;padding:16px}.hanzi-suggest{scrollbar-width:none;flex-wrap:nowrap;margin-inline:-16px;padding:0 16px 4px;overflow-x:auto}.hanzi-suggest::-webkit-scrollbar{display:none}.hanzi-seg button,.hanzi-action{padding:0 14px}}@media (prefers-reduced-motion:reduce){.hanzi-suggest button,.hanzi-seg button,.hanzi-canvas{transition:none}}