.course{--rise:0%;--tilt:2deg;height:440svh}.course-stage{--unit:min(1vw, 1.75svh);gap:calc(var(--unit) * 2);height:100svh;padding-block:calc(var(--unit) * 1.6);display:flex;position:sticky;top:0;overflow:clip}.course-text{justify-content:space-between;gap:calc(var(--unit) * 1.5);flex-direction:column;flex:1;min-width:0;display:flex}.course-title{font-family:var(--font-display);font-size:calc(var(--unit) * 4.6);text-transform:uppercase;padding-top:.12em;font-weight:700;line-height:1}.course-plan{max-width:36rem;margin-top:.5rem;font-size:clamp(.9375rem,1.1vw,1.0625rem);font-weight:700;line-height:1.3}.course-plan [lang=en]{color:var(--color-muted);font-weight:400}.course-verbs{font-family:var(--font-display);font-size:calc(var(--unit) * 14.8);text-transform:uppercase;font-weight:700;line-height:1.02;display:grid;overflow:hidden}.course-verb{white-space:nowrap;grid-area:1/1;padding-top:.12em;transition:translate .65s cubic-bezier(.34,1.3,.64,1);translate:0 105%}.course-verb[data-past=true]{translate:0 -105%}.course-verb[data-on=true]{translate:0}.course-foot{justify-items:start;gap:calc(var(--unit) * 1.2);display:grid}.course-notes{width:100%;max-width:40rem;display:grid}.course-note{opacity:0;grid-area:1/1;align-content:start;gap:.25rem;font-size:clamp(1.125rem,1.8vw,1.625rem);font-weight:700;line-height:1.2;transition:opacity .25s,translate .25s cubic-bezier(.34,1.56,.64,1);display:grid;translate:0 .5rem}.course-note[data-on=true]{opacity:1;translate:0}.course-note [lang=en]{color:var(--color-muted);font-size:1rem;font-weight:400;line-height:1.3}.course-device{z-index:1;height:100%;translate:0 var(--rise);flex:none;align-items:center;margin-right:5vw;display:flex;position:relative}.course-phone{aspect-ratio:390/844;background:var(--ink);corner-shape:superellipse(1.35);height:92%;rotate:var(--tilt);backface-visibility:hidden;border-radius:14.6%/6.75%;position:relative}.app-screen{corner-shape:superellipse(1.35);background:#fff;border-radius:12.8%/5.76%;position:absolute;inset:1.11% 2.4%;overflow:hidden;container-type:size}.phone-key{background:var(--ink);border-radius:9999px;width:.9%;position:absolute}.phone-key-action{height:3.4%;top:15%;left:-.7%}.phone-key-up{height:6.6%;top:20.5%;left:-.7%}.phone-key-down{height:6.6%;top:28.5%;left:-.7%}.phone-key-power{height:10%;top:23%;right:-.7%}.app-island{z-index:2;background:var(--ink);border-radius:9999px;width:31%;height:4.1%;position:absolute;top:1.35%;left:50%;translate:-50%}.app{--line:color-mix(in srgb, var(--ink) 14%, transparent);--soft:color-mix(in srgb, var(--ink) 62%, #fff);height:100%;color:var(--ink);font-family:var(--font-sans);flex-direction:column;font-size:4.54545cqw;line-height:1.3;display:flex}.app-status{flex:none;grid-template-columns:1fr 31% 1fr;place-items:center;height:4.15em;padding-inline:.5em;font-size:.875em;font-weight:700;display:grid}.app-status svg{fill:currentColor;grid-column:3;width:3.4em}.app-bar{flex:none;align-items:center;gap:.5em;padding:.4em 1em .6em;display:flex}.app-back{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.4px;width:1.4em}.app-bar-title{flex:1;font-weight:700}.app-logo{width:auto;height:1em}.app-body{flex:1;min-height:0;position:relative;overflow:hidden}.app-page{translate:calc((var(--i) - var(--active)) * 100%) 0;transition:translate .45s cubic-bezier(.32,.72,0,1);position:absolute;inset:0;overflow:hidden}.app-page-content,.app-page-bones{transition:opacity .25s;position:absolute;inset:0}.app-page-content{opacity:0}.app-page[data-ready=true] .app-page-content{opacity:1}.app-page[data-ready=true] .app-page-bones{opacity:0}.app-bone{background:linear-gradient(100deg,#e3e8ed 30%,#f6f8f9 50%,#e3e8ed 70%) 0 0/220% 100%;border-radius:.6em;animation:1.2s linear infinite app-shimmer;display:block}.app-bone-player{aspect-ratio:16/9;border-radius:1.1em;margin-inline:.75em}.app-bone-title{height:1.5em;margin-bottom:.6em}.app-bone-line{border-radius:9999px;height:.9em;margin-bottom:.7em}.app-bone-short{width:55%}.app-bone-row{align-items:center;gap:.75em;margin-top:.9em;display:flex}.app-bone-row .app-bone-line{flex:1;margin:0}.app-bone-thumb{flex:none;width:3.4em;height:2.4em}.app-bone-card{border-radius:.9em;height:3em;margin-top:.6em}.app-bone-chip{border-radius:9999px;width:40%;height:1.6em;margin:.4em 0 1em}.app-bone-option{border-radius:1em;height:3.4em;margin-top:.7em}.app-bone-ring{border-radius:9999px;width:11em;height:11em;margin:.6em auto 1em}.app-bone-center{width:60%;margin-inline:auto}@keyframes app-shimmer{to{background-position:-220% 0}}.app-rise{opacity:0;translate:0 .5em}.app-page[data-ready=true] .app-rise{opacity:1;transition:opacity .3s calc(var(--n,0) * 55ms), translate .4s cubic-bezier(.34, 1.4, .64, 1) calc(var(--n,0) * 55ms);translate:0}.app-pad{padding:.9em 1em}.app-pad-top{padding-top:.3em}.app-h1{font-size:1.375em;font-weight:800;line-height:1.15}.app-sub{color:var(--soft);font-size:.8125em;font-weight:500}.app-label{margin:.9em 0 .3em;font-size:.8125em;font-weight:700}.app-body-text{color:var(--soft);margin-top:.5em;font-size:.875em}.app-player{aspect-ratio:16/9;background:var(--ink);border-radius:1.1em;margin-inline:.75em;position:relative;overflow:hidden}.app-graph{fill:none;stroke-linecap:round;width:100%;height:100%;display:block}.app-graph-axis{stroke:color-mix(in srgb, var(--hero-bg) 45%, transparent);stroke-width:2px}.app-graph-line{stroke:var(--hero-bg);stroke-dasharray:1 1.1;stroke-width:3.5px}.app-page[data-ready=true] .app-graph-line{animation:1.8s ease-out both app-draw}.app-page[data-ready=true] .app-graph-line-two{animation-delay:.5s}.app-graph-dot{fill:var(--hero-bg)}@keyframes app-draw{0%{stroke-dashoffset:1.02px}to{stroke-dashoffset:0}}.app-controls{color:#fff;align-items:center;gap:.5em;display:flex;position:absolute;bottom:.5em;left:.7em;right:.7em}.app-pause{border-inline:.22em solid #fff;flex:none;width:.7em;height:.8em}.app-scrub{background:#ffffff59;border-radius:9999px;flex:1;height:.22em;position:relative}.app-scrub-fill{background:#fff;border-radius:9999px;position:absolute;inset:0 auto 0 0}.app-scrub i{background:var(--ink);width:.12em;height:.32em;position:absolute;top:-.05em}.app-time{font-variant-numeric:tabular-nums;flex:none;font-size:.6875em;font-weight:600}.app-chapter{border-radius:.8em;align-items:center;gap:.7em;margin-inline:-.4em;padding:.4em;display:flex}.app-chapter-on{background:color-mix(in srgb, var(--ink) 8%, transparent)}.app-chapter-thumb{background:var(--ink);width:3.2em;height:2.2em;color:var(--hero-bg);border-radius:.5em;flex:none;place-items:center;font-size:.875em;font-weight:800;display:grid}.app-chapter-title{flex:1;font-size:.875em;font-weight:600}.app-chapter-time{color:var(--soft);font-variant-numeric:tabular-nums;font-size:.75em;font-weight:600}.app-terms{gap:.45em;display:grid}.app-term{background:color-mix(in srgb, var(--ink) 6%, transparent);border-radius:.9em;justify-content:space-between;align-items:center;gap:.75em;padding:.7em .85em;display:flex}.app-term-en{font-weight:800}.app-term-sw{color:var(--soft);text-align:right;font-size:.875em;font-weight:500}.app-quiz-top{align-items:center;gap:.6em;display:flex}.app-progress{background:var(--line);border-radius:9999px;flex:1;height:.5em;overflow:hidden}.app-progress span{background:var(--ink);border-radius:9999px;width:30%;height:100%;display:block}.app-chip{background:color-mix(in srgb, var(--ink) 8%, transparent);border-radius:9999px;width:fit-content;margin-top:.9em;padding:.25em .7em;font-size:.75em;font-weight:700}.app-question{margin-top:.6em;font-size:1.1875em;font-weight:700;line-height:1.22}.app-options{gap:.55em;margin-top:.9em;display:grid}.app-option{border:.13em solid var(--line);border-radius:1em;justify-content:space-between;align-items:center;min-height:3.2em;padding-inline:.9em;font-weight:600;display:flex}.app-option svg{fill:none;opacity:0;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:3px;width:1.3em}.app-page[data-ready=true] .app-option-right{animation:.25s 1.1s both app-pick}.app-page[data-ready=true] .app-option-right svg{animation:.2s 1.2s both app-show}.app-page[data-ready=true] .app-option-wrong{animation:.25s 1.1s both app-dim}@keyframes app-pick{to{border-color:var(--ink);background:var(--ink);color:#fff}}@keyframes app-dim{to{color:var(--soft)}}@keyframes app-show{to{opacity:1}}.app-verdict{background:color-mix(in srgb, var(--ink) 9%, #fff);border-radius:1.4em 1.4em 0 0;gap:.6em;padding:1em;display:grid;position:absolute;bottom:0;left:0;right:0;translate:0 110%}.app-page[data-ready=true] .app-verdict{animation:.45s cubic-bezier(.34,1.3,.64,1) 1.5s both app-sheet}@keyframes app-sheet{to{translate:0}}.app-verdict-title{font-size:1.25em;font-weight:800}.app-button{background:var(--ink);color:#fff;border-radius:9999px;place-items:center;min-height:3em;font-weight:700;display:grid}.app-button-soft{min-height:2.8em;box-shadow:inset 0 0 0 .13em var(--ink);color:var(--ink);background:0 0;margin-top:.7em}.app-save{justify-items:center;gap:.5em;padding-block:.5em .3em;display:grid;position:relative}.app-ring{fill:none;stroke-linecap:round;stroke-width:7px;width:11em}.app-ring-back{stroke:var(--line)}.app-ring-fill{stroke:var(--ink);stroke-dasharray:1 1.1;stroke-dashoffset:1.02px;transform-origin:50px 50px;transform:rotate(-90deg)}.app-page[data-ready=true] .app-ring-fill{animation:2.6s ease-in-out .3s both app-draw}.app-ring-tick{stroke:var(--ink);stroke-dasharray:1 1.1;stroke-dashoffset:1.02px;stroke-linejoin:round}.app-page[data-ready=true] .app-ring-tick{animation:.35s ease-out 3s both app-draw}.app-percent{font-variant-numeric:tabular-nums;font-size:1.375em;font-weight:800;line-height:1;position:absolute;top:4.36em;translate:0 -40%}.app-page[data-ready=true] .app-percent{animation:.15s 2.95s both app-hide}@keyframes app-hide{to{opacity:0}}.app-save-state{text-align:center;width:100%;font-size:.875em;font-weight:700;display:grid}.app-save-state span{grid-area:1/1}.app-state-b{opacity:0}.app-page[data-ready=true] .app-state-a{animation:.15s 2.95s both app-hide}.app-page[data-ready=true] .app-state-b{animation:.2s 3s both app-show}.app-files{gap:.4em;margin-top:.7em;display:grid}.app-file,.app-setting{background:color-mix(in srgb, var(--ink) 6%, transparent);border-radius:.9em;align-items:center;gap:.6em;padding:.62em .85em;display:flex}.app-file-name{flex:1;font-size:.875em;font-weight:700}.app-file-size{color:var(--soft);font-size:.75em;font-weight:600}.app-file-tick{border:.14em solid var(--line);border-radius:9999px;width:1em;height:1em}.app-page[data-ready=true] .app-file-tick{animation:app-done .2s var(--done) both}@keyframes app-done{to{border-color:var(--ink);background:var(--ink);box-shadow:inset 0 0 0 .14em #fff}}.app-setting{justify-content:space-between;margin-top:.4em;font-size:.875em;font-weight:600}.app-switch{background:var(--ink);border-radius:9999px;width:2.5em;height:1.45em;position:relative}.app-switch:after{content:"";background:#fff;border-radius:9999px;width:1.1em;height:1.1em;position:absolute;top:.17em;right:.17em}.app-storage{gap:.35em;margin-top:.7em;display:grid}.app-storage-bar{background:var(--line);border-radius:9999px;height:.45em;overflow:hidden}.app-storage-bar span{background:var(--ink);border-radius:9999px;width:18%;height:100%;display:block}.app-offline{color:var(--soft);opacity:0;text-align:center;margin-top:.55em;font-size:.75em;font-weight:600}.app-page[data-ready=true] .app-offline{animation:.25s 3.1s both app-show}.app-tabs{background:color-mix(in srgb, var(--ink) 7%, #fff);border-radius:1.4em;flex:none;grid-template-columns:repeat(4,minmax(0,1fr));margin-inline:.75em;padding:.25em;display:grid;position:relative}.app-tabs-thumb{background:var(--ink);width:calc(25% - .125em);translate:calc(var(--active) * 100%) 0;border-radius:1.15em;transition:translate .45s cubic-bezier(.34,1.56,.64,1);position:absolute;top:.25em;bottom:.25em;left:.25em}.app-tab{cursor:pointer;color:var(--ink);border-radius:1em;justify-items:center;gap:.05em;padding-block:.35em;font-size:.6875em;font-weight:700;transition:color .2s;display:grid;position:relative}.app-tab[aria-pressed=true]{color:#fff}.app-tab:focus-visible{outline-color:var(--loop);outline-offset:-2px}.app-tab-icon{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;width:1.9em}.app-home{background:var(--ink);border-radius:9999px;flex:none;width:36%;height:.28em;margin:.55em auto .5em}@media (prefers-reduced-motion:reduce){.course{height:100svh}.course-verb,.course-note,.app-page,.app-tabs-thumb{transition:none}.app-bone{animation:none}.app-page[data-ready=true] *{transition-delay:0s!important;animation-duration:0s!important;animation-delay:0s!important}}@media (max-width:63.99rem) and (orientation:portrait){.course-stage{--unit:1vw;flex-direction:column;gap:.75rem;padding-block:1rem .75rem}.course-text{flex:none;gap:.5rem}.course-title{font-size:min(8.62069vw - .258621rem,5svh)}.course-plan{margin-top:.25rem;font-size:.8125rem}.course-verbs{font-size:min(30.303vw - .909091rem,11svh)}.course-note{font-size:1rem}.course-note [lang=en]{font-size:.875rem}.course-cta{display:none}.course-device{flex:1;justify-content:center;min-height:0;margin-right:0}.course-phone{height:96%}}
