.learning-card{padding:12px 20px 24px}
.learning-tools{display:flex;justify-content:flex-end;min-height:32px;margin-bottom:8px}
.translation-toggle{display:inline-flex;gap:7px;align-items:center;font-size:12px;color:#728ca3;cursor:pointer;min-height:32px}
.translation-toggle input{appearance:none;-webkit-appearance:none;position:relative;width:32px;height:19px;margin:0;background:#dbe7ef;border:0;border-radius:20px;cursor:pointer;transition:background .15s}
.translation-toggle input:after{content:"";display:block;position:absolute;left:3px;top:3px;width:13px;height:13px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #264f7126;transition:transform .15s}
.translation-toggle input:checked{background:#2689e8}
.translation-toggle input:checked:after{transform:translateX(13px)}
.learning-card .learning-image{width:min(100%,220px);height:190px;border-radius:15px}
.content-audio-target{appearance:none;border:0;background:transparent;box-shadow:none;padding:0;font:inherit;color:inherit;cursor:pointer}
.content-audio-target:hover{background:transparent;box-shadow:none}
.content-audio-target:active{transform:none}
.content-audio-target:focus-visible{outline:3px solid #288ce5;outline-offset:4px}
.content-audio-target[aria-disabled="true"]{cursor:default}
.learning-image-trigger{display:block;width:min(100%,220px);max-width:100%;margin:0 auto;border-radius:15px;line-height:0}
.learning-image-trigger .learning-image{display:block}
.learning-word{margin-top:16px}
.word-line,.sentence-line{display:flex;justify-content:center;align-items:center;gap:8px;margin:auto;max-width:100%}
.learning-card .word{font-size:32px;line-height:1.3;margin:0;min-width:0;text-align:left}
.learning-card .word small{font-size:13px;font-weight:600;white-space:nowrap}
.learning-card .ipa{font-size:14px;line-height:1.6;margin-top:7px}
.inline-play{flex:0 0 36px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:#288ce5;display:inline-grid;place-items:center;padding:0}
.inline-play svg{width:29px;height:29px;display:block}
.inline-play:hover{background:#e9f5ff}
.inline-play:active{transform:scale(.95)}
.learning-sentence{display:block;width:100%;border-top:1px solid #edf3f8;border-radius:0;padding-top:17px;max-width:540px;margin:0 auto;text-align:left}
.learning-card .learning-section-label{flex:0 0 4em;margin:0;color:#607e98;font-size:13px;font-weight:600;line-height:1.4;text-align:left;white-space:nowrap}
.learning-card .learning-definition{width:100%;max-width:540px}
.learning-card .definition-line,.learning-card .sentence-line{display:flex;align-items:baseline;justify-content:flex-start;gap:10px;max-width:100%;text-align:left}
.learning-card .definition-line>p,.learning-card .definition-copy{flex:1;min-width:0;margin:0;overflow-wrap:anywhere}
.learning-card .definition-trigger{width:100%}
.learning-card .definition-translation{color:#8192a4;font-size:13px;line-height:1.7;margin:6px 0 0;text-align:center;overflow-wrap:anywhere}
.sentence-line{align-items:flex-start}
.learning-sentence .sentence-translation{display:block}
.learning-card .sentence{font-size:18px;line-height:1.8;margin:0;min-width:0;text-align:left;overflow-wrap:anywhere}
.word-translation,.sentence-translation{color:#8192a4;font-size:13px;line-height:1.7;margin:7px 0 0;overflow-wrap:anywhere}
@media(min-width:600px){.learning-card{padding:14px 30px 27px}.learning-card .learning-image{height:210px;width:240px}.learning-card .word{font-size:36px}.learning-card .sentence{font-size:20px}}
@media(min-width:600px){.learning-image-trigger{width:min(100%,240px)}}
@media(max-width:360px){.learning-card{padding:10px 13px 20px}.learning-card .word{font-size:29px}.learning-card .learning-image{height:170px}.word-line,.sentence-line{gap:5px}}
@media(prefers-reduced-motion:reduce){.translation-toggle input,.translation-toggle input:after{transition:none}}

.learning-card[data-word-id]{touch-action:pan-y pinch-zoom}
.word-card-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.word-card-footer:has(>nav:only-child){justify-content:center}
.word-card-navigation{display:flex;align-items:center;gap:3px}
.word-card-arrow{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:transparent;color:#2782bd;border-radius:12px;box-shadow:none}
.word-card-arrow svg{width:20px;height:20px}
.word-card-arrow:enabled:hover{background:#e4f3fc}
.word-card-arrow:disabled{opacity:.3}