@layer components{.path_page{width:min(100% - 2 * var(--site-margin), 56rem);margin:var(--space-4) auto var(--space-6)}.path{gap:var(--space-5);flex-direction:column;display:flex}.path_hero{justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-6) var(--space-5);border-radius:calc(var(--radius-card) * 1.5);color:#fff;background:radial-gradient(circle at 95% 0,#ffd84d40 0 14rem,#0000 14rem),#15171e;flex-wrap:wrap;display:flex;position:relative;overflow:hidden;box-shadow:0 18px 40px -18px #1113188c}.path_hero-text{align-items:flex-start;gap:var(--space-3);flex-direction:column;min-width:0;max-width:32rem;display:flex}.path_kicker{color:#ffd84d;font-size:var(--text-small);letter-spacing:.06em;text-transform:uppercase;margin:0;font-weight:800}.path_hero h1{letter-spacing:-.02em;margin:0;font-size:clamp(2rem,5vw,3.25rem);font-weight:800;line-height:1.05}.path_lead{color:#ffffffc7;margin:0;line-height:1.5}.path_go{padding:var(--space-3) var(--space-5);color:#15171e;background:#ffd84d;border-radius:1.5rem;flex-direction:column;align-items:flex-start;gap:2px;font-weight:800;text-decoration:none;display:inline-flex;box-shadow:0 4px #00000073}.path_go small{font-size:var(--text-small);font-weight:var(--primary-bold);opacity:.8}.path_go:active{transform:translateY(3px);box-shadow:0 1px #00000073}.path_go:focus-visible{outline-offset:3px;outline:3px solid #fff}.path_review{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);color:#fff;border:2px solid #ffffff59;font-weight:800;text-decoration:none;display:inline-flex}.path_review small{color:#ffd84d;font-size:var(--text-small);font-weight:var(--primary-bold)}.path_review:hover{background:#ffffff1a}.path_review:focus-visible{outline-offset:3px;outline:3px solid #fff}.lesson_gate{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-card);background:#fff8d9;border:2px dashed #d89e00;flex-wrap:wrap;display:flex}.lesson_gate b{display:block}.lesson_gate p{font-size:var(--text-small);margin:0}.lesson_gate-actions{gap:var(--space-2);display:flex}.path_stat{min-width:9rem;padding:var(--space-3) var(--space-4);text-align:center;background:#ffffff1a;border-radius:1.25rem;flex-direction:column;align-items:center;gap:2px;display:flex}.path_stat b{color:#ffd84d;font-variant-numeric:tabular-nums;font-size:3rem;font-weight:800;line-height:1}.path_stat span{color:#ffffffc7;font-size:var(--text-small)}.path_side{gap:var(--space-3);flex-direction:column;display:flex}.path_goal{padding:var(--space-3) var(--space-4);font-size:var(--text-small);background:#ffffff1a;border-radius:1.25rem;flex-direction:column;gap:2px;display:flex}.path_goal b{color:#ffd84d;letter-spacing:.04em;text-transform:uppercase}.path_goal span{color:#ffffffb3}.path_goal span.is-on{color:#a7e6b8;font-weight:var(--primary-bold)}.path_goal em{color:#ffd84d;font-style:normal;font-weight:var(--primary-bold);margin-top:2px}.path_goal small{color:#a7e6b8}.path_goal.is-done{box-shadow:inset 0 0 0 2px #a7e6b8}.path_module.is-locked{border-color:var(--color-border);box-shadow:none;opacity:.75;background:0 0}.path_guest{align-items:center;gap:var(--space-2) var(--space-4);padding:var(--space-3) var(--space-4);background:#fff6d1;border:2px solid #17181c;border-radius:1.25rem;flex-wrap:wrap;margin:0;display:flex}.path_guest a,.path_lock-note a{color:inherit;font-weight:800}.path_lock-note{color:var(--color-text-secondary);font-size:var(--text-small);margin:0}.path_lesson.is-locked{color:var(--color-text-secondary);cursor:not-allowed;background:var(--color-surface-soft)}.path_lesson.is-checkpoint{border-color:#6a3fd3}.path_lesson.is-checkpoint .path_lesson-mark{color:#6a3fd3;background:#ece5fb}.path_lesson.is-checkpoint.is-done .path_lesson-mark{color:#fff;background:#26890c}.path_cando{padding:var(--space-3) var(--space-4);font-size:var(--text-small);background:#e8f7ec;border-radius:1rem}.path_cando ul{margin:var(--space-1) 0 0;padding-inline-start:1.25rem;line-height:1.6}.path_clips{padding:var(--space-2) var(--space-3);border:1px dashed var(--color-border);border-radius:1rem}.path_clips summary{cursor:pointer;font-weight:var(--primary-bold)}.path_clips p{margin:var(--space-2) 0;color:var(--color-text-secondary);font-size:var(--text-small)}.path_clips ul{gap:var(--space-2);grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));margin:0;padding:0;list-style:none;display:grid}.path_clips a{height:100%;padding:var(--space-2) var(--space-3);border:2px solid var(--color-border);color:inherit;border-radius:.875rem;flex-direction:column;gap:2px;text-decoration:none;display:flex}.path_clips a:hover{border-color:var(--color-text-primary)}.path_clips a:focus-visible{outline:var(--outline-focus);outline-offset:2px}.path_clips a i{color:var(--color-text-secondary);font-size:var(--text-small);font-style:normal}.path_clips a small{color:var(--color-blue-text);font-weight:var(--primary-bold);margin-top:auto;padding-top:2px}.path_modules{gap:var(--space-3);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.path_module{gap:var(--space-3);padding:var(--space-4);border:2px solid var(--color-text-primary);border-radius:var(--radius-card);background:var(--color-white);box-shadow:0 5px 0 var(--color-text-primary);flex-direction:column;display:flex}.path_module.is-soon{border-color:var(--color-border);box-shadow:none;opacity:.7;background:0 0}.path_module.is-complete{background:#e8f7ec}.path_module-head{align-items:center;gap:var(--space-3);display:flex}.path_module-head>div{flex:1;min-width:0}.path_module-head h2{margin:0;font-size:1.25rem;font-weight:800;line-height:1.2}.path_module-head p{color:var(--color-text-secondary);font-size:var(--text-small);margin:2px 0 0;line-height:1.4}.path_module-num{width:3rem;height:3rem;font:800 1.5rem / 1 var(--font-mono);background:#ffd84d;border-radius:1rem;flex:none;place-items:center;display:grid;transform:rotate(-4deg)}.path_module.is-soon .path_module-num{background:var(--color-surface-soft)}.path_module-badge{border-radius:var(--radius-pill);background:var(--color-surface-soft);font-size:var(--text-small);font-weight:var(--primary-bold);white-space:nowrap;flex:none;padding:2px 12px}.path_module-bar{background:var(--color-surface-soft);border-radius:4px;height:8px;overflow:hidden}.path_module-bar i{background:#26890c;border-radius:4px;height:100%;transition:width .3s;display:block}.path_lessons{gap:var(--space-2);grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));margin:0;padding:0;list-style:none;display:grid}.path_lesson{align-items:center;gap:2px var(--space-3);padding:var(--space-2) var(--space-3);border:2px solid var(--color-border);color:inherit;border-radius:1rem;grid-template-columns:auto minmax(0,1fr);text-decoration:none;display:grid}.path_lesson:hover{border-color:var(--color-text-primary)}.path_lesson.is-current{background:#fff8d9;border-color:#ffd84d;box-shadow:0 0 0 2px #ffd84d}.path_lesson.is-done{background:#f1faf3}.path_lesson:focus-visible{outline:var(--outline-focus);outline-offset:2px}.path_lesson-mark{background:var(--color-surface-soft);border-radius:50%;grid-row:span 2;place-items:center;width:2.25rem;height:2.25rem;font-weight:800;display:grid}.path_lesson.is-done .path_lesson-mark{color:#fff;background:#26890c}.path_lesson.is-current .path_lesson-mark{background:#ffd84d}.path_lesson-title{font-weight:var(--primary-bold);line-height:1.25}.path_lesson-meta{color:var(--color-text-secondary);font-size:var(--text-small)}.lesson{gap:var(--space-4);flex-direction:column;max-width:40rem;margin-inline:auto;display:flex}.lesson_head{align-items:center;gap:var(--space-3);display:flex}.lesson_back{color:var(--color-blue-text);font-size:var(--text-small);flex:none}.lesson_bar{background:var(--color-surface-soft);border-radius:5px;flex:1;height:10px;overflow:hidden}.lesson_bar i{background:#ffd84d;border-radius:5px;height:100%;transition:width .3s;display:block;box-shadow:inset 0 -2px #00000026}.lesson_title{letter-spacing:-.02em;margin:0;font-size:clamp(1.5rem,4vw,2rem);font-weight:800;line-height:1.1}.lesson_card{gap:var(--space-3);padding:var(--space-5) var(--space-4);border:2px solid var(--color-text-primary);border-radius:calc(var(--radius-card) * 1.25);background:var(--color-white);box-shadow:0 6px 0 var(--color-text-primary);flex-direction:column;display:flex}.lesson_card>form{gap:var(--space-3);flex-direction:column;display:flex}.lesson_kicker{color:var(--color-text-secondary);font:700 .75rem / 1.4 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;margin:0}.lesson_prompt,.lesson_rule-title{margin:0;font-size:1.375rem;font-weight:800;line-height:1.25}.lesson_text{margin:0;line-height:1.6}.lesson_words,.lesson_examples{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.lesson_words li{align-items:center;gap:2px var(--space-3);padding-bottom:var(--space-2);border-bottom:1px dashed var(--color-border);grid-template-columns:auto minmax(0,1fr);display:grid}.lesson_words li:last-child{border-bottom:0}.lesson_sound{cursor:pointer;background:#ffd84d;border:0;border-radius:50%;grid-row:span 2;place-items:center;width:2.5rem;height:2.5rem;font-size:1.125rem;display:grid;box-shadow:0 3px #0000004d}.lesson_sound:active{transform:translateY(2px);box-shadow:0 1px #0000004d}.lesson_word{align-items:baseline;gap:var(--space-2);flex-wrap:wrap;display:flex}.lesson_word b{font-size:1.25rem}.lesson_word i{color:var(--color-text-secondary);font-style:normal}.lesson_example{color:var(--color-text-secondary);font-size:var(--text-small)}.lesson_example em{opacity:.8;margin-inline-start:var(--space-2);font-style:normal}.lesson_examples li{align-items:center;gap:0 var(--space-3);grid-template-columns:auto minmax(0,1fr);display:grid}.lesson_examples li span{font-weight:var(--primary-bold)}.lesson_examples li i{color:var(--color-text-secondary);font-size:var(--text-small);grid-column:2;font-style:normal}.lesson_play{gap:var(--space-2);flex-wrap:wrap;display:flex}.lesson_big-sound,.lesson_slow{min-height:3rem;padding:0 var(--space-4);border:2px solid var(--color-text-primary);border-radius:var(--radius-pill);cursor:pointer;font:inherit;background:#ffd84d;font-weight:800}.lesson_slow{background:var(--color-white)}.lesson_options{gap:var(--space-2);grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));display:grid}.lesson_option{min-height:3.5rem;padding:var(--space-2) var(--space-3);border:2px solid var(--color-border-field,var(--color-border));background:var(--color-white);cursor:pointer;font:inherit;font-weight:var(--primary-bold);border-radius:1rem;line-height:1.3}.lesson_option:hover:not(:disabled){border-color:var(--color-text-primary);background:var(--color-surface-soft)}.lesson_option.is-right{color:#135c2b;background:#e8f7ec;border-color:#26890c}.lesson_option.is-wrong{color:#8f0d25;background:#fde6ea;border-color:#e21b3c}.lesson_option.is-dim{opacity:.45}.lesson_option:disabled{cursor:default}.lesson_hint{color:var(--color-text-secondary);font:700 1.25rem / 1.4 var(--font-mono);letter-spacing:.1em;margin:0}.lesson_hint-uk{color:var(--color-text-secondary);font-size:var(--text-small);margin:0}.lesson_input{width:100%;min-height:3.5rem;padding:0 var(--space-3);border:2px solid var(--color-border-field,var(--color-border));background:var(--color-white);font:inherit;border-radius:1rem;font-size:1.25rem}.lesson_input:focus-visible{outline:var(--outline-focus);outline-offset:2px;border-color:var(--color-text-primary)}.lesson_check{align-self:flex-start}.lesson_verdict{padding:var(--space-2) var(--space-3);font-weight:var(--primary-bold);border-radius:1rem;margin:0}.lesson_verdict.is-right{color:#135c2b;background:#e8f7ec}.lesson_verdict.is-wrong{color:#8f0d25;background:#fde6ea}.lesson_foot{justify-content:flex-end;display:flex}.lesson_error{color:#8f0d25;font-size:var(--text-small);margin:0}.lesson_finish{align-items:center;gap:var(--space-3);text-align:center;flex-direction:column;display:flex}.lesson_finish h2{margin:0;font-size:1.75rem;font-weight:800}.lesson_medal{background:var(--color-surface-soft);border-radius:50%;place-items:center;width:5rem;height:5rem;font-size:2.5rem;display:grid}.lesson_medal.is-passed{background:#ffd84d;transform:rotate(-6deg);box-shadow:0 6px #00000040}.lesson_score{margin:0;font-size:1.125rem}.lesson_actions{justify-content:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.lesson_passage{gap:var(--space-2);padding:var(--space-3) var(--space-4);background:var(--color-surface-soft);border-radius:1rem;flex-direction:column;display:flex}.lesson_passage>p:not(.lesson_kicker){margin:0;font-size:1.0625rem;line-height:1.7}.lesson_meaning{font-size:1.125rem;font-weight:var(--primary-bold)}.lesson_slots{align-items:center;gap:var(--space-2);min-height:3.75rem;padding:var(--space-2) var(--space-3);border:2px dashed var(--color-border);border-radius:1rem;flex-wrap:wrap;display:flex}.lesson_slots.is-right{background:#e8f7ec;border-style:solid;border-color:#26890c}.lesson_slots.is-wrong{background:#fde6ea;border-style:solid;border-color:#e21b3c}.lesson_slots-empty{color:var(--color-text-muted);font-size:1.5rem}.lesson_bank{gap:var(--space-2);flex-wrap:wrap;display:flex}.lesson_tile{min-height:2.75rem;padding:0 var(--space-3);border:2px solid var(--color-text-primary);background:var(--color-white);box-shadow:0 3px 0 var(--color-text-primary);cursor:pointer;font:inherit;font-size:1.0625rem;font-weight:var(--primary-bold);border-radius:.875rem}.lesson_tile.is-placed{background:#ffd84d}.lesson_tile:active:not(:disabled){box-shadow:0 1px 0 var(--color-text-primary);transform:translateY(2px)}.lesson_tile:disabled{cursor:default;box-shadow:none}.lesson_phrase{margin:0;font-size:1.5rem;font-weight:800;line-height:1.3}.lesson_mic{min-height:3rem;padding:0 var(--space-4);border:2px solid var(--color-text-primary);border-radius:var(--radius-pill);cursor:pointer;font:inherit;background:#fde6ea;font-weight:800}.lesson_mic:disabled{opacity:.6;cursor:default}.lesson_diff{margin-top:var(--space-2);flex-wrap:wrap;gap:6px;display:flex}.lesson_diff i{font-style:normal;font-weight:var(--primary-bold);border-radius:8px;padding:2px 8px}.lesson_diff .is-hit{color:#fff;background:#26890c}.lesson_diff .is-miss{color:#8f0d25;background:#fde6ea}.lesson_fine{color:var(--color-text-secondary);margin:0;font-size:.8125rem;line-height:1.4}.lesson_cando{padding:var(--space-3) var(--space-4);text-align:left;background:#e8f7ec;border-radius:1rem}.lesson_cando ul{margin:var(--space-2) 0 0;padding-inline-start:1.25rem;line-height:1.6}@media (prefers-reduced-motion:reduce){.lesson_bar i,.path_module-bar i{transition:none}}@media (width<=40rem){.path_hero{padding:var(--space-5) var(--space-4)}.path_stat{justify-content:center;gap:var(--space-3);flex-direction:row;width:100%}.path_stat b{font-size:2rem}}}
