.sl-surface{--sl-ink:var(--lp-ink,#111);--sl-muted:var(--lp-muted,#5a5a66);--sl-soft:var(--lp-soft,#f5f5f7);--sl-white:var(--lp-white,#fff);--sl-purple:var(--lp-purple,var(--color-lang-purple));--sl-correct:var(--lp-correct,#0f7b3a);--sl-incorrect:var(--lp-incorrect,#b42318);--sl-control:var(--lp-control,max(112px, calc(44px / var(--game-scale,.432))));box-sizing:border-box;width:100%;height:100%;color:var(--sl-ink);flex-direction:column;justify-content:center;align-items:stretch;gap:36px;padding:24px 28px;display:flex}.sl-surface *,.sl-surface :before,.sl-surface :after{box-sizing:border-box}.sl-surface p{margin:0}.sl-sentence{text-align:center;overflow-wrap:anywhere;text-wrap:balance;font-size:44px;font-weight:600;line-height:1.45}.sl-gap{border-bottom:4px solid var(--sl-ink);vertical-align:baseline;text-align:center;white-space:nowrap;min-width:170px;margin:0 4px;padding:0 14px;line-height:1.2;display:inline-block}.sl-gap-text{text-overflow:ellipsis;vertical-align:bottom;max-width:420px;display:inline-block;overflow:hidden}.sl-gap[data-state=typing]{color:var(--sl-purple);border-color:var(--sl-purple)}.sl-gap[data-state=correct],.sl-gap[data-state=revealed]{color:var(--sl-correct);border-color:var(--sl-correct);font-weight:700}.sl-gap[data-state=incorrect]{color:var(--sl-incorrect);border-color:var(--sl-incorrect);font-weight:700}.sl-typed,.sl-translation{color:var(--sl-muted);text-align:center;overflow-wrap:anywhere;margin-top:-12px;font-size:32px;line-height:1.4}.sl-typed s{color:var(--sl-incorrect);text-decoration-thickness:3px}.sl-field{width:100%}.sl-input{width:100%;min-height:var(--sl-control);border:2px solid var(--sl-ink);border-radius:calc(var(--r-btn,4px) / var(--game-scale,.432));background:var(--sl-white);color:var(--sl-ink);text-align:center;appearance:none;padding:16px 28px;font-family:inherit;font-size:40px;font-weight:600;line-height:1.3;display:block}.sl-input::placeholder{color:var(--sl-muted)}.sl-input:focus{border-color:var(--sl-purple);outline:none}.sl-input:focus-visible{outline:calc(2px / var(--game-scale,.432) + 1px) solid var(--sl-ink);outline-width:round(up, 2px / var(--game-scale,.432), 1px);outline-offset:calc(var(--focus-offset,2px) / var(--game-scale,.432) + 1px);outline-offset:round(up, var(--focus-offset,2px) / var(--game-scale,.432), 1px)}.sl-input:disabled{background:var(--sl-soft);color:var(--sl-muted);cursor:default}.sl-input[data-state=correct]:disabled{border-color:var(--sl-correct)}.sl-input[data-state=incorrect]:disabled{border-color:var(--sl-incorrect)}.sl-sr-only{white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.sl-hero-preview{--sl-hero-purple:var(--lp-hero-purple,var(--color-lang-purple));--sl-hero-ink:var(--lp-hero-ink,#111);--sl-hero-soft:var(--lp-hero-soft,#f5f5f7);box-sizing:border-box;border-radius:var(--r-card,8px);background:var(--sl-hero-soft);width:min(100%,264px);color:var(--sl-hero-ink);pointer-events:none;-webkit-user-select:none;user-select:none;flex-direction:column;align-items:center;gap:14px;margin:16px auto 0;padding:14px 22px;display:flex}.lp-hero-art>.sl-hero-preview{background:0 0;width:100%;margin:0;padding:0}.sl-hero-preview p{margin:0}.sl-hero-preview-audio{border-radius:var(--r-btn,4px);color:#fff;background:var(--sl-hero-purple);justify-content:center;align-items:center;gap:10px;width:100px;height:40px;display:flex}.sl-hero-preview-audio>svg{stroke-width:1.8px;width:29px;height:29px}.sl-hero-preview-wave{align-items:center;gap:4px;height:32px;display:flex}.sl-hero-preview-wave i{background:currentColor;width:2px;display:block}.sl-hero-preview-sentence{border:1px solid var(--sl-hero-ink);border-radius:var(--r-card,8px);text-align:center;background:#fff;padding:10px 12px;font-size:15px;font-weight:600;line-height:1.5}.sl-hero-preview-gap{border-bottom:2px solid var(--sl-hero-purple);min-width:56px;color:var(--sl-hero-purple);padding:0 6px;line-height:1.1;display:inline-block}@media (width>=1024px){.sl-surface{--sl-control:var(--study-action-height,52px);gap:var(--space-6,24px);height:auto;padding:0}.sl-sentence{font-size:var(--fs-h1,24px);line-height:1.5}.sl-gap{min-width:96px;padding:0 var(--space-2,8px);border-bottom-width:2px}.sl-gap-text{max-width:320px}.sl-typed,.sl-translation{margin-top:calc(-1 * var(--space-3,12px));font-size:var(--fs-body,16px);line-height:1.5}.sl-typed s{text-decoration-thickness:1px}.sl-input{max-width:480px;padding:var(--space-3,12px) var(--space-5,20px);border:1px solid var(--sl-ink);border-radius:var(--r-btn,4px);font-size:var(--fs-h2,18px);margin-inline:auto;line-height:1.5}.sl-input:focus-visible{outline:var(--border-focus,2px solid var(--sl-ink));outline-offset:var(--focus-offset,2px)}.sl-hero-preview{justify-content:center;gap:var(--space-4,16px);aspect-ratio:1;width:min(100%,360px);padding:var(--space-6,24px);border:1px solid var(--color-border-subtle,#e5e8ee);border-radius:var(--r-img,0);margin:0 auto}.lp-hero-art>.sl-hero-preview{aspect-ratio:auto;border:0}.sl-hero-preview-audio{gap:var(--space-4,16px);width:128px;height:var(--space-9,48px)}.sl-hero-preview-audio>svg{width:var(--space-6,24px);height:var(--space-6,24px);stroke-width:1.6px}.sl-hero-preview-sentence{padding:var(--space-4,16px);border-color:var(--color-border-subtle,#e5e8ee);font-size:var(--fs-body,16px);line-height:1.6}}
