:root{--rojo:#c8102e;--rojo-osc:#9b0c23;--jade:#128c7e;--jade-claro:#e3f5f2;--error:#d64545;--error-claro:#fdeaea;--tinta:#1f2328;--gris:#6b7280;--borde:#e2e5ea;--fondo:#faf8f5;--tarjeta:#fff;--sombra:0 2px 0 var(--borde);color:var(--tinta);background:var(--fondo);-webkit-tap-highlight-color:transparent;font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans SC,PingFang SC,sans-serif}@media (prefers-color-scheme:dark){:root{--tinta:#e8eaed;--gris:#9aa0a6;--borde:#3a3f45;--fondo:#16181b;--tarjeta:#1f2226;--jade-claro:#0f2e2a;--error-claro:#3a1a1a}}*{box-sizing:border-box}html,body{background:var(--fondo);margin:0}body{min-height:100dvh}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}#app{flex-direction:column;max-width:560px;min-height:100dvh;margin:0 auto;display:flex}.top{z-index:2;background:var(--fondo);border-bottom:1px solid var(--borde);justify-content:space-between;align-items:center;padding:12px 16px;display:flex;position:sticky;top:0}.top h1{align-items:center;gap:8px;margin:0;font-size:1.15rem;display:flex}.logo{background:var(--rojo);color:#fff;border-radius:8px;padding:2px 7px;font-size:1rem}.stats{gap:12px;font-weight:700;display:flex}.home{padding:8px 16px 32px}.unidad{margin-top:20px}.unidad h2{margin:0;font-size:1.05rem}.meta{color:var(--gris);margin:2px 0 10px;font-size:.85rem}.lecciones{gap:10px;display:grid}.card{text-align:left;background:var(--tarjeta);border:2px solid var(--borde);width:100%;min-height:56px;box-shadow:var(--sombra);border-radius:14px;align-items:center;gap:12px;padding:10px 14px;display:flex}.card:active{box-shadow:none;transform:translateY(2px)}.card .icono{text-align:center;width:32px;font-size:1.5rem}.card .titulo{flex:1;font-weight:600}.card .mejor{color:var(--jade);font-size:.9rem;font-weight:700}.card.hecha{border-color:var(--jade)}.card.repaso{border-color:var(--rojo);margin-top:16px}.card.repaso span:last-child{flex-direction:column;display:flex}.card.repaso small{color:var(--gris)}.aviso{background:var(--jade-claro);border-radius:10px;margin-top:24px;padding:12px;font-size:.9rem}.link{color:var(--gris);background:0 0;border:0;margin:28px auto 0;font-size:.85rem;text-decoration:underline;display:block}.lesson-top{align-items:center;gap:12px;padding:14px 16px;display:flex}.cerrar{color:var(--gris);background:0 0;border:0;min-width:44px;min-height:44px;font-size:1.4rem}.barra{background:var(--borde);border-radius:8px;flex:1;height:14px;overflow:hidden}.relleno{background:var(--jade);border-radius:8px;height:100%;transition:width .3s}.vidas{color:var(--error);white-space:nowrap;font-weight:700}.ejercicio{flex-direction:column;flex:1;gap:18px;padding:8px 16px 16px;display:flex}.instruccion{margin:0 0 8px;font-size:1.25rem;font-weight:700}.palabra{flex-direction:column;align-items:center;gap:4px;padding:12px 0;display:flex}.hanzi{font-size:3.4rem;line-height:1.2}.pinyin{color:var(--gris);font-size:1.3rem}.traduccion{color:var(--gris);font-size:1.1rem}.numero{text-align:center;letter-spacing:.02em;padding:16px 0;font-size:2.6rem;font-weight:700}.frase-es{margin:0;font-size:1.15rem}.audio-btns,.escucha{justify-content:center;gap:10px;margin-top:6px;display:flex}.btn-audio{background:var(--tarjeta);border:2px solid var(--borde);min-width:48px;min-height:48px;box-shadow:var(--sombra);border-radius:12px;font-size:1.3rem}.btn-audio.grande{border-color:var(--jade);border-radius:22px;min-width:96px;min-height:96px;font-size:2.6rem}.escucha{align-items:center;padding:16px 0}.opciones{gap:10px;display:grid}.opciones.n2,.opciones.n4{grid-template-columns:1fr 1fr}.opcion{background:var(--tarjeta);border:2px solid var(--borde);min-height:56px;box-shadow:var(--sombra);text-align:center;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:12px;font-size:1.1rem;display:flex}.opcion .label.cjk{font-size:1.45rem}.opcion .sub{color:var(--gris);font-size:.85rem}.opcion.grande .label{font-size:2rem}.opcion.chico .label{font-size:.95rem}.opcion.elegida,.opcion.correcta{border-color:var(--jade);background:var(--jade-claro)}.opcion.incorrecta{border-color:var(--error);background:var(--error-claro)}.opcion:active{box-shadow:none;transform:translateY(2px)}.opciones.largas{grid-template-columns:1fr}.opciones.largas .opcion{text-align:left;align-items:flex-start}.respuesta-fichas{border-bottom:2px solid var(--borde);flex-wrap:wrap;align-content:flex-start;gap:8px;min-height:78px;padding:8px 0;display:flex}.banco{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.ficha{background:var(--tarjeta);border:2px solid var(--borde);min-width:48px;min-height:56px;box-shadow:var(--sombra);border-radius:12px;flex-direction:column;align-items:center;padding:6px 12px;display:flex}.fh{font-size:1.5rem}.fp{color:var(--gris);font-size:.75rem}.acciones{padding:14px 16px calc(14px + env(safe-area-inset-bottom));background:var(--fondo);border-top:1px solid var(--borde);position:sticky;bottom:0}.acciones.bien{background:var(--jade-claro)}.acciones.mal{background:var(--error-claro)}.retro{margin-bottom:12px}.retro.bien strong{color:var(--jade);font-size:1.2rem}.retro.mal strong{color:var(--error)}.retro p{margin:4px 0 0}.retro .resp{font-size:1.15rem;font-weight:600}.retro .expl{color:var(--gris);font-size:.95rem}.btn{background:var(--tarjeta);border:2px solid var(--borde);width:100%;min-height:52px;box-shadow:var(--sombra);border-radius:14px;font-size:1.05rem;font-weight:700}.btn.primario{background:var(--jade);border-color:var(--jade);color:#fff;box-shadow:0 3px #0b6157}.btn.error{background:var(--error);border-color:var(--error);color:#fff;box-shadow:0 3px #a33232}.btn:disabled{background:var(--borde);border-color:var(--borde);color:var(--gris);box-shadow:none}.btn:active:not(:disabled){box-shadow:none;transform:translateY(2px)}.resultado{text-align:center;flex-direction:column;flex:1;align-items:center;gap:8px;padding:48px 16px 24px;display:flex}.resultado .big{font-size:4rem}.resultado h2{margin:0}.leccion-nombre{color:var(--gris);margin:0}.cifras{grid-template-columns:repeat(3,1fr);gap:10px;width:100%;margin:24px 0;display:grid}.cifras div{background:var(--tarjeta);border:2px solid var(--borde);border-radius:14px;flex-direction:column;padding:12px 4px;display:flex}.cifras strong{font-size:1.4rem}.cifras span{color:var(--gris);font-size:.85rem}.acciones-col{gap:10px;width:100%;margin-top:auto;display:grid}.card.practica span:last-child,.card.repaso span:last-child{flex-direction:column;display:flex}.card.practica small{color:var(--gris)}.card.repaso.inactivo{border-color:var(--borde)}.creditos{color:var(--gris);text-align:center;margin-top:24px;font-size:.75rem}.palabra.fila{flex-flow:wrap;justify-content:center;gap:10px;padding:4px 0}.palabra.fila .audio-btns{margin-top:0}.ejercicio.escribir{align-items:center}.ejercicio.escribir .enunciado{width:100%}.lienzo{touch-action:none;-webkit-user-select:none;user-select:none;background:var(--tarjeta);box-shadow:0 0 0 2px var(--borde);color:var(--borde);border-radius:16px;position:relative}.lienzo .cuadricula{color:var(--borde);pointer-events:none;position:absolute;inset:0}.lienzo svg:not(.cuadricula){display:block;position:relative}.herramientas{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.btn-audio.texto{padding:0 14px;font-size:.95rem}.btn-audio:disabled{opacity:.4}.estado{text-align:center;min-height:1.4em;margin:0;font-weight:600}.rejilla{grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:8px;display:grid}.celda{aspect-ratio:1;background:var(--tarjeta);border:2px solid var(--borde);box-shadow:var(--sombra);border-radius:12px;font-size:1.8rem}.celda:active{box-shadow:none;transform:translateY(2px)}.top .cerrar{min-width:44px}