.shell-header{position:sticky;top:0;z-index:40;height:var(--header-h);background:#071321d1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--surface-line)}.shell-header__inner{height:100%;max-width:1180px;margin:0 auto;padding-inline:var(--space-5);display:flex;align-items:center;justify-content:space-between;gap:var(--space-5)}.shell-brand{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-display);font-weight:900;font-size:var(--fs-lg);color:var(--text);flex-shrink:0}.shell-brand__mark{width:22px;height:22px;border-radius:50%;border:2px solid var(--blue);border-top-color:var(--cyan);display:inline-block}.shell-nav{display:flex;align-items:center;gap:var(--space-2);overflow-x:auto;margin-inline-end:auto}.shell-avatar{flex-shrink:0;width:40px;height:40px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--surface);border:1px solid var(--border);color:var(--cyan);font-family:var(--font-display);font-weight:800;font-size:var(--fs-md);transition:border-color var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}.shell-avatar:hover{border-color:var(--blue);transform:translateY(-2px)}.shell-nav__link{padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);color:var(--muted);font-size:var(--fs-sm);font-weight:600;white-space:nowrap;transition:color var(--dur-fast) var(--ease-out),background-color var(--dur-fast) var(--ease-out)}.shell-nav__link:hover{color:var(--text);background:var(--surface)}.shell-nav__link.is-active{color:var(--bg-deep);background:var(--blue)}.shell-main{max-width:1180px;margin:0 auto;padding:var(--space-6) var(--space-5) var(--space-8);min-height:calc(100vh - var(--header-h))}.shell-main--lesson{max-width:none;padding:0;min-height:100vh}@media (max-width: 640px){.shell-header__inner{padding-inline:var(--space-4)}.shell-nav__link{padding:var(--space-2) var(--space-3);font-size:var(--fs-xs)}.shell-main{padding:var(--space-5) var(--space-4) var(--space-7)}}.home{display:flex;flex-direction:column;gap:var(--space-8)}.home-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-7);align-items:center;padding-block:var(--space-6)}.home-eyebrow{color:var(--cyan);font-weight:700;font-size:var(--fs-sm);letter-spacing:.02em;margin-bottom:var(--space-3)}.home-title{font-size:var(--fs-3xl);line-height:1.2;margin-bottom:var(--space-4)}.home-subtitle{color:var(--muted);font-size:var(--fs-md);max-width:46ch;margin-bottom:var(--space-5)}.home-cta-row{display:flex;flex-wrap:wrap;gap:var(--space-3)}.home-stat-row{display:flex;gap:var(--space-6);margin-top:var(--space-6)}.home-stat{display:flex;flex-direction:column}.home-stat__value{font-family:var(--font-ui);font-size:var(--fs-2xl);font-weight:900;color:var(--gold)}.home-stat__label{color:var(--muted);font-size:var(--fs-xs)}.orbit-graphic{display:flex;align-items:center;justify-content:center}.home-section-title{font-size:var(--fs-xl);margin-bottom:var(--space-4)}.stage-list{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}.stage-card{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-5) var(--space-6);min-height:84px;background:var(--surface);border:1px solid var(--surface-line);border-radius:var(--radius-lg)}.stage-card.is-locked{opacity:.5;cursor:not-allowed}.stage-card__status{flex-shrink:0;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--muted);border:1px solid var(--border)}.stage-card__arrow{color:var(--blue)}.stage-card__test-icon{color:var(--gold)}.stage-card__index{font-family:var(--font-ui);font-size:var(--fs-lg);font-weight:900;color:var(--blue);flex-shrink:0}.stage-card__body h3{font-size:var(--fs-md);margin-bottom:var(--space-1)}.stage-card__body p{color:var(--muted);font-size:var(--fs-sm)}.stage-card__progress{margin-inline-start:auto;color:var(--muted);font-size:var(--fs-sm);font-weight:700;flex-shrink:0}@media (max-width: 900px){.home-hero{grid-template-columns:1fr}.orbit-graphic{order:-1}.stage-list{grid-template-columns:1fr}}.curriculum{display:flex;flex-direction:column;gap:var(--space-8)}.curriculum-header h1{font-size:var(--fs-2xl);margin-bottom:var(--space-2)}.curriculum-header p{color:var(--muted)}.curriculum-stage h2{font-size:var(--fs-lg);margin-bottom:var(--space-1)}.curriculum-stage__goal{color:var(--muted);font-size:var(--fs-sm);margin-bottom:var(--space-5)}.lesson-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));column-gap:var(--space-4);row-gap:calc(var(--space-3) * 3)}.lesson-node{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--surface);border:1px solid var(--surface-line);border-radius:var(--radius-md);position:relative}.lesson-node.is-complete{border-color:var(--green)}.lesson-node.is-locked{opacity:.45;cursor:not-allowed}.lesson-node__status{width:32px;height:32px;flex-shrink:0;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:var(--fs-sm);background:var(--bg-soft);border:1px solid var(--border)}.lesson-node__status.is-complete{background:var(--green);color:var(--bg-deep);border-color:var(--green)}.lesson-node__status.is-open{border-color:var(--blue);color:var(--blue)}.lesson-node__status.is-locked{color:var(--muted)}.lesson-node__title{font-size:var(--fs-sm);font-weight:600}.lesson-node__badge{margin-inline-start:auto;font-size:10px;color:var(--gold);border:1px solid var(--gold-glow);border-radius:var(--radius-pill);padding:2px 8px;white-space:nowrap;flex-shrink:0}.curriculum-stage__locked-banner{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);background:var(--bg-soft);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--muted);font-size:var(--fs-sm);margin-bottom:var(--space-5)}.curriculum-stage-test{display:flex;align-items:center;gap:var(--space-4);margin-top:var(--space-6);padding:var(--space-5) var(--space-6);background:var(--surface);border:1px solid var(--gold-glow);border-radius:var(--radius-lg)}.curriculum-stage-test__icon{flex-shrink:0;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--bg-soft);border:1px solid var(--gold-glow);color:var(--gold)}.curriculum-stage-test__body{display:flex;flex-direction:column;gap:2px}.curriculum-stage-test__body strong{font-size:var(--fs-md);color:var(--text)}.curriculum-stage-test__body span{font-size:var(--fs-sm);color:var(--muted)}.curriculum-stage-test.is-passed{border-color:var(--green)}.curriculum-stage-test.is-passed .curriculum-stage-test__icon{color:var(--green);border-color:var(--green)}.curriculum-stage-test.is-attempted{border-color:var(--gold)}.lesson-intro{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-5)}.lesson-intro__card{max-width:480px;width:100%;padding:var(--space-7) var(--space-6);text-align:center}.lesson-intro__eyebrow{color:var(--cyan);font-size:var(--fs-xs);font-weight:700;margin-bottom:var(--space-3)}.lesson-intro__title{font-size:var(--fs-2xl);margin-bottom:var(--space-3)}.lesson-intro__goal{color:var(--muted);margin-bottom:var(--space-5)}.lesson-intro__chars{display:flex;justify-content:center;gap:var(--space-2);margin-bottom:var(--space-5)}.lesson-intro__char{width:44px;height:44px;border-radius:var(--radius-md);background:var(--bg-soft);border:1px solid var(--gold-glow);display:flex;align-items:center;justify-content:center;font-size:var(--fs-lg);color:var(--gold)}.lesson-intro__sentence{font-size:var(--fs-sm);color:var(--text);margin-bottom:var(--space-6);line-height:1.7}.lesson-intro__start{width:100%;padding-block:var(--space-4);font-size:var(--fs-md);margin-bottom:var(--space-4)}.lesson-intro__meta{font-size:var(--fs-xs);color:var(--muted)}.icon-btn{position:relative;width:44px;height:44px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);border:1px solid var(--border);color:var(--text);transition:border-color var(--dur-fast) var(--ease-out),background-color var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out)}.icon-btn__icon{display:flex;align-items:center;justify-content:center}.icon-btn:hover,.icon-btn[aria-pressed=true],.icon-btn[aria-expanded=true]{border-color:var(--blue);color:var(--cyan);background:var(--surface-hover)}.icon-btn--danger:hover{border-color:var(--red);color:var(--red);background:var(--red-glow)}.icon-btn__tooltip{position:absolute;top:calc(100% + 8px);inset-inline-start:50%;transform:translate(50%) translateY(-4px);background:var(--bg-deep);color:var(--text);border:1px solid var(--surface-line);padding:4px 10px;border-radius:var(--radius-sm);font-size:var(--fs-xs);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .14s var(--ease-out),transform .14s var(--ease-out);z-index:60}.icon-btn__tooltip--top{top:auto;bottom:calc(100% + 8px);transform:translate(50%) translateY(4px)}.icon-btn:hover .icon-btn__tooltip,.icon-btn:focus-visible .icon-btn__tooltip{opacity:1;transform:translate(50%) translateY(0)}:root[data-reduce-motion=true] .icon-btn__tooltip{transition-duration:0ms}.toolbar-menu{position:relative}.toolbar-menu__panel{position:absolute;top:calc(100% + 8px);inset-inline-end:0;min-width:220px;background:var(--surface);border:1px solid var(--surface-line);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:var(--space-3);z-index:50;display:flex;flex-direction:column;gap:var(--space-3);transform-origin:top center}.toolbar-menu__row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);font-size:var(--fs-sm);color:var(--text)}.toolbar-menu__section-title{font-size:10px;color:var(--muted);letter-spacing:.04em;margin-bottom:2px}.toolbar-menu__segmented{display:flex;gap:3px;background:var(--bg-soft);border-radius:var(--radius-pill);padding:3px}.toolbar-menu__segmented button{padding:6px 10px;border-radius:var(--radius-pill);font-size:var(--fs-xs);color:var(--muted);min-height:32px}.toolbar-menu__segmented button.is-active{background:var(--blue);color:var(--bg-deep);font-weight:700}.toolbar-menu__panel input[type=checkbox]{width:20px;height:20px;accent-color:var(--blue)}.lesson-toolbar{border-bottom:1px solid var(--surface-line)}.lesson-toolbar__row{position:relative;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding-inline:var(--space-4)}.lesson-toolbar__side{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;z-index:1}.lesson-toolbar__center{position:absolute;inset-inline:0;top:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;pointer-events:none;padding-inline:120px}.lesson-toolbar__kind{font-size:11px;color:var(--cyan);font-weight:600;letter-spacing:.02em}.lesson-toolbar__title{font-size:var(--fs-md);font-weight:700;color:var(--text);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.lesson-toolbar__dots{display:flex;gap:5px;margin-top:2px}.lesson-toolbar__dot{width:6px;height:6px;border-radius:50%;background:var(--border)}.lesson-toolbar__dot.is-active{background:var(--blue)}.lesson-toolbar__paused-badge{font-size:11px;font-weight:700;color:var(--gold);border:1px solid var(--gold-glow);border-radius:var(--radius-pill);padding:4px 10px}.lesson-toolbar__confirm{display:flex;align-items:center;gap:6px;font-size:var(--fs-xs);color:var(--text);background:var(--surface);border:1px solid var(--surface-line);border-radius:var(--radius-pill);padding:4px 6px 4px 10px}.lesson-toolbar__confirm-btn{min-height:32px;padding:4px 10px;border-radius:var(--radius-pill);font-size:var(--fs-xs);font-weight:600;border:1px solid var(--border);color:var(--text)}.lesson-toolbar__confirm-btn--danger{color:var(--red);border-color:var(--red)}.lesson-toolbar__confirm-btn--danger:hover{background:var(--red-glow)}@media (max-width: 640px){.lesson-toolbar__center{padding-inline:8px}.lesson-toolbar__title{font-size:var(--fs-sm)}.lesson-toolbar__confirm span:first-child{display:none}}.lesson-complete{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-6) var(--space-5)}.lesson-complete__inner{position:relative;overflow:hidden;max-width:560px;width:100%;text-align:center}.lesson-complete__eyebrow{color:var(--green);font-weight:700;font-size:var(--fs-sm);margin-bottom:var(--space-2)}.lesson-complete__title{font-size:var(--fs-2xl);margin-bottom:var(--space-7)}.lesson-complete__metrics{display:flex;flex-direction:column;gap:var(--space-6);margin-bottom:var(--space-6);text-align:start}.lesson-complete__metric-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--space-2)}.lesson-complete__metric-label{font-size:var(--fs-sm);color:var(--muted);font-weight:600}.lesson-complete__metric-value{font-family:var(--font-ui);font-size:var(--fs-xl);font-weight:800;color:var(--text)}.lesson-complete__unit{font-size:var(--fs-sm);font-weight:600;color:var(--muted)}.lesson-complete__bar{position:relative;height:14px;border-radius:var(--radius-pill);background:var(--bg-soft);border:1px solid var(--surface-line);overflow:visible}.lesson-complete__bar-fill{height:100%;border-radius:var(--radius-pill);transition:width var(--dur-slow) var(--ease-out)}.lesson-complete__bar-fill.is-pass{background:linear-gradient(90deg,var(--blue),var(--green))}.lesson-complete__bar-fill.is-below{background:linear-gradient(90deg,var(--blue),var(--gold))}.lesson-complete__bar-target{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--text);opacity:.55}.lesson-complete__bar-caption{display:block;margin-top:var(--space-2);font-size:var(--fs-xs);color:var(--muted)}.lesson-complete__metric--plain .lesson-complete__metric-head{margin-bottom:0}.lesson-complete__hint{font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--space-6);line-height:1.8}.lesson-complete__actions{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.lesson-complete__primary{width:100%;padding-block:var(--space-4);font-size:var(--fs-md)}.lesson-complete__secondary-row{display:flex;align-items:center;gap:var(--space-5)}.lesson-complete__back-link{font-size:var(--fs-sm);color:var(--muted);text-decoration:underline;text-underline-offset:3px}.lesson-complete__back-link:hover{color:var(--text)}.lesson-stats-rail{display:flex;align-items:center;justify-content:space-between;padding:var(--space-2) var(--space-5);border-top:1px solid var(--surface-line);min-height:40px}.lesson-stats-rail__group{display:flex;align-items:center;gap:var(--space-5)}.lesson-stats-rail__chip{display:flex;flex-direction:column;align-items:center;gap:2px}.lesson-stats-rail__value{font-family:var(--font-ui);font-weight:800;font-size:var(--fs-md);color:var(--cyan)}.lesson-stats-rail__unit{font-size:var(--fs-xs);font-weight:600;color:var(--muted);margin-inline-start:3px}.lesson-stats-rail__label{font-size:10px;color:var(--muted)}@keyframes statsReveal{0%{opacity:0}to{opacity:1}}.stats-reveal{animation:statsReveal 2s var(--ease-out) both}:root[data-reduce-motion=true] .stats-reveal{animation-duration:1ms}.lesson-error{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-5)}.lesson-error__card{max-width:440px;width:100%;padding:var(--space-7) var(--space-6);text-align:center}.lesson-error__card h1{font-size:var(--fs-xl);margin-bottom:var(--space-3)}.lesson-error__card p{color:var(--muted);margin-bottom:var(--space-5)}.practice-text{font-family:var(--font-ui);font-size:clamp(1.4rem,2.6vw,2.1rem);line-height:2.1;letter-spacing:.01em;text-align:center;max-width:46ch;margin:0 auto;white-space:pre-wrap;overflow-wrap:anywhere;unicode-bidi:plaintext;overflow:hidden}.practice-text__char{position:relative;border-radius:4px;padding-inline:1px}.practice-text__char.is-done{color:var(--muted)}.practice-text__char.is-current{color:var(--text);font-weight:700}.practice-text__char.is-upcoming{color:#f0f8ff59}.cursor-bar:before{content:"";position:absolute;inset-inline-start:-1px;top:4px;bottom:4px;width:2px;background:var(--blue);border-radius:2px;animation:caretBlink 1.1s ease-in-out infinite}.cursor-underline:after{content:"";position:absolute;inset-inline:0;bottom:-2px;height:2px;background:var(--blue);border-radius:2px;animation:caretBlink 1.1s ease-in-out infinite}.cursor-block{background:var(--blue-glow);outline:1px solid var(--blue);animation:caretBlockPulse 1.1s ease-in-out infinite}.cursor-halo{box-shadow:0 0 0 4px var(--blue-glow);animation:caretBlink 1.1s ease-in-out infinite}@keyframes caretBlink{0%,to{opacity:1}50%{opacity:.35}}@keyframes caretBlockPulse{0%,to{outline-color:var(--blue)}50%{outline-color:var(--cyan)}}:root[data-reduce-motion=true] .cursor-bar:before,:root[data-reduce-motion=true] .cursor-underline:after,:root[data-reduce-motion=true] .cursor-block,:root[data-reduce-motion=true] .cursor-halo{animation:none}@keyframes charShake{0%,to{transform:translate(0)}20%{transform:translate(-2px)}40%{transform:translate(2px)}60%{transform:translate(-1.5px)}80%{transform:translate(1.5px)}}.flash-error{animation:errorShake .16s linear,charShake .22s ease-in-out}:root[data-reduce-motion=true] .flash-error{animation:errorShake .16s linear}.keyboard-guide{display:flex;flex-direction:column;gap:6px;padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--surface-line);border-radius:var(--radius-md);width:fit-content;margin-inline:auto}.keyboard-guide__row{display:flex;gap:6px;justify-content:center}.keyboard-guide__key{width:32px;height:32px;border-radius:8px;background:var(--bg-soft);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:var(--fs-sm);color:var(--muted);transition:background-color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}.keyboard-guide__row--space{margin-top:2px}.keyboard-guide__space-half{width:108px;height:26px;background:var(--bg-soft);border:1px solid var(--border);transition:background-color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}.keyboard-guide__space-half--left{border-radius:6px 2px 2px 6px}.keyboard-guide__space-half--right{border-radius:2px 6px 6px 2px}.keyboard-guide__key.is-active{background:var(--blue);border-color:var(--cyan);color:var(--bg-deep);transform:translateY(-2px);box-shadow:0 6px 16px var(--blue-glow)}.keyboard-guide__space-half.is-active{background:var(--blue);border-color:var(--cyan);transform:translateY(-2px);box-shadow:0 6px 16px var(--blue-glow)}@media (max-width: 700px){.keyboard-guide{display:none}}.hand-guide{display:flex;align-items:flex-end;justify-content:center;gap:var(--space-4);padding:var(--space-2) var(--space-4)}.hand-guide__hand{display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.hand-guide__label{font-size:10px;color:var(--muted);letter-spacing:.04em}.hand-guide__fingers{display:flex;gap:6px;align-items:flex-end}.hand-guide__finger{width:12px;height:32px;border-radius:6px;background:var(--surface);border:1px solid var(--border);transition:background-color var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}.hand-guide__finger--thumb{width:18px;height:16px;align-self:flex-end;margin-bottom:2px}.hand-guide__finger.is-active{background:var(--gold);border-color:var(--gold);transform:translateY(-4px);box-shadow:0 4px 12px var(--gold-glow)}@media (max-width: 560px){.hand-guide{display:none}}.lesson-page{height:100vh;display:flex;flex-direction:column;overflow:hidden}.lesson-header{flex-shrink:0;display:flex;flex-direction:column}.lesson-header__banner{display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-5);min-height:36px;background:var(--gold-glow);color:var(--gold);font-size:var(--fs-sm);font-weight:600;border-top:1px solid var(--surface-line)}.lesson-page__body{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(var(--space-4),3vh,var(--space-7));padding:clamp(var(--space-3),2vh,var(--space-6)) var(--space-5);overflow:hidden}.lesson-page__guides-stack{display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}@keyframes restartFadeOut{to{opacity:0}}@keyframes restartFadeIn{0%{opacity:0}to{opacity:1}}@keyframes restartFlashBorder{0%,to{box-shadow:inset 0 0 0 0 transparent}50%{box-shadow:inset 0 0 0 2px var(--blue-glow)}}.lesson-page__body.is-restart-out{animation:restartFadeOut .26s var(--ease-out) forwards}.lesson-page__body.is-restart-in{animation:restartFadeIn .32s var(--ease-out) both}.lesson-page__body.is-restart-flash{animation:restartFlashBorder .26s var(--ease-out);border-radius:var(--radius-md)}:root[data-reduce-motion=true] .lesson-page__body.is-restart-out,:root[data-reduce-motion=true] .lesson-page__body.is-restart-in{animation-duration:1ms}.lesson-page__help-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:var(--bg-deep)}.lesson-missing{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-8);text-align:center}.stage-test-missing,.stage-test-intro,.stage-test-complete{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-6) var(--space-5);text-align:center}.stage-test-missing{flex-direction:column;gap:var(--space-4)}.stage-test-intro__card,.stage-test-complete__inner{max-width:520px;width:100%}.stage-test-intro__card{padding:var(--space-7) var(--space-6)}.stage-test-intro__eyebrow{color:var(--cyan);font-weight:700;font-size:var(--fs-sm);margin-bottom:var(--space-2)}.stage-test-intro__card h1{font-size:var(--fs-xl);margin-bottom:var(--space-4)}.stage-test-intro__desc{color:var(--muted);margin-bottom:var(--space-4);line-height:1.8}.stage-test-intro__previous{font-size:var(--fs-sm);color:var(--gold);margin-bottom:var(--space-5)}.stage-test-intro__start{width:100%;padding-block:var(--space-4);font-size:var(--fs-md);margin-bottom:var(--space-4)}.stage-test-intro__back{font-size:var(--fs-sm);color:var(--muted);text-decoration:underline;text-underline-offset:3px}.stage-test-complete__eyebrow{color:var(--gold);font-weight:700;font-size:var(--fs-sm);margin-bottom:var(--space-2)}.stage-test-complete__eyebrow.is-pass{color:var(--green)}.stage-test-complete__inner h1{font-size:var(--fs-xl);margin-bottom:var(--space-6)}.stage-test-complete__metrics{display:flex;justify-content:center;gap:var(--space-7);margin-bottom:var(--space-5)}.stage-test-complete__metrics>div{display:flex;flex-direction:column}.stage-test-complete__value{font-family:var(--font-ui);font-size:var(--fs-2xl);font-weight:900;color:var(--cyan)}.stage-test-complete__label{font-size:var(--fs-xs);color:var(--muted)}.stage-test-complete__hint{font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--space-6);line-height:1.8}.stage-test-complete__actions{display:flex;flex-direction:column;align-items:center;gap:var(--space-3)}.stage-test-complete__back{font-size:var(--fs-sm);color:var(--muted);text-decoration:underline;text-underline-offset:3px}.stage-test-page{height:100vh;display:flex;flex-direction:column;overflow:hidden}.stage-test-header{position:relative;min-height:64px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding-inline:var(--space-4);border-bottom:1px solid var(--surface-line)}.stage-test-header__center{position:absolute;inset-inline:0;top:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;pointer-events:none;padding-inline:120px}.stage-test-header__kind{font-size:11px;color:var(--cyan);font-weight:600}.stage-test-header__title{font-size:var(--fs-md);font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stage-test-header__dots{display:flex;gap:5px;margin-top:2px}.stage-test-header__dot{width:6px;height:6px;border-radius:50%;background:var(--border)}.stage-test-header__dot.is-active{background:var(--blue)}.stage-test-page__body{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(var(--space-4),3vh,var(--space-7));padding:clamp(var(--space-3),2vh,var(--space-6)) var(--space-5);overflow:hidden}.stage-test-page__guides-stack{display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.keyboard-heatmap{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding-top:var(--space-2)}.keyboard-heatmap__grid{display:flex;flex-direction:column;gap:6px}.keyboard-heatmap__row{display:flex;gap:6px;justify-content:center}.keyboard-heatmap__key{width:34px;height:34px;border-radius:8px;border:1px solid var(--border);background:var(--bg-soft);display:flex;align-items:center;justify-content:center;font-size:var(--fs-sm);color:var(--text);transition:background-color var(--dur-med) var(--ease-out),border-color var(--dur-med) var(--ease-out)}.keyboard-heatmap__key.is-neutral{color:var(--muted);opacity:.6}.keyboard-heatmap__legend{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-4)}.keyboard-heatmap__legend-item{display:flex;align-items:center;gap:6px;font-size:var(--fs-xs);color:var(--muted)}.keyboard-heatmap__swatch{width:12px;height:12px;border-radius:3px;border:1px solid var(--border)}.keyboard-heatmap__empty{font-size:var(--fs-sm);color:var(--muted);text-align:center}@media (max-width: 480px){.keyboard-heatmap__key{width:26px;height:26px;font-size:var(--fs-xs)}}.profile{display:flex;flex-direction:column;gap:var(--space-7);max-width:720px}.profile-header h1{font-size:var(--fs-2xl);margin-bottom:var(--space-4)}.profile-name-field{display:flex;flex-direction:column;gap:var(--space-2);max-width:320px}.profile-name-field span{font-size:var(--fs-xs);color:var(--muted)}.profile-name-field input{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4)}.profile-name-field input:focus-visible{border-color:var(--blue)}.profile-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3)}.profile-stat{padding:var(--space-5);display:flex;flex-direction:column;align-items:center;gap:var(--space-1)}.profile-stat__value{font-family:var(--font-ui);font-size:var(--fs-xl);font-weight:900;color:var(--gold)}.profile-stat__label{font-size:var(--fs-xs);color:var(--muted);text-align:center}.profile-stages h2{font-size:var(--fs-md);margin-bottom:var(--space-4)}.profile-stage-row{display:flex;align-items:center;gap:var(--space-3);padding-block:var(--space-2)}.profile-stage-row__label{width:130px;flex-shrink:0;font-size:var(--fs-sm)}.profile-stage-row__bar{flex:1;height:8px;background:var(--surface);border-radius:var(--radius-pill);overflow:hidden}.profile-stage-row__fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--green));border-radius:var(--radius-pill);transition:width var(--dur-slow) var(--ease-out)}.profile-stage-row__count{width:44px;text-align:end;font-size:var(--fs-xs);color:var(--muted);flex-shrink:0}.profile-data{padding:var(--space-6)}.profile-data h2{font-size:var(--fs-md);margin-bottom:var(--space-2)}.profile-data p{color:var(--muted);font-size:var(--fs-sm);margin-bottom:var(--space-4)}.profile-data__actions{display:flex;gap:var(--space-3);flex-wrap:wrap}.profile-data__message{margin-top:var(--space-3);color:var(--green);font-size:var(--fs-sm)}.profile-data__danger{margin-top:var(--space-6);padding-top:var(--space-5);border-top:1px solid var(--surface-line)}.profile-data__reset-link{color:var(--red);font-size:var(--fs-sm);text-decoration:underline;text-underline-offset:3px}.profile-gate{min-height:60vh;display:flex;align-items:center;justify-content:center}.profile-gate__card{max-width:420px;padding:var(--space-7) var(--space-6);text-align:center}.profile-gate__card h1{font-size:var(--fs-xl);margin-bottom:var(--space-3)}.profile-gate__card p{color:var(--muted);margin-bottom:var(--space-5)}.profile-next{display:flex;align-items:center;justify-content:space-between;padding:var(--space-5);gap:var(--space-4)}.profile-next span{color:var(--muted);font-size:var(--fs-sm)}.profile-weak,.profile-recent,.profile-goal{padding:var(--space-6)}.profile-weak h2,.profile-recent h2,.profile-goal h2{font-size:var(--fs-md);margin-bottom:var(--space-4)}.profile-weak__chips{display:flex;gap:var(--space-2);flex-wrap:wrap}.profile-weak__chip{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);background:var(--bg-soft);border:1px solid var(--gold-glow);color:var(--gold);font-size:var(--fs-md)}.profile-recent__list li{display:flex;align-items:center;justify-content:space-between;padding-block:var(--space-2);font-size:var(--fs-sm);border-bottom:1px solid var(--surface-line)}.profile-recent__list li:last-child{border-bottom:none}.profile-recent__meta{color:var(--muted);font-size:var(--fs-xs)}.profile-goal__field{display:flex;align-items:center;justify-content:space-between;font-size:var(--fs-sm)}.profile-goal__field input{width:80px;background:var(--bg-soft);border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);text-align:center}.profile-data__reset-confirm{color:var(--red)!important;border-color:var(--red)!important}.profile-heatmap{padding:var(--space-6)}.profile-heatmap__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-2)}.profile-heatmap__head h2{font-size:var(--fs-md)}.profile-data__confirm p{color:var(--text);margin-bottom:var(--space-3)}@media (max-width: 640px){.profile-stats{grid-template-columns:repeat(2,1fr)}}.assessment{min-height:60vh;display:flex;align-items:center;justify-content:center}.assessment__card{max-width:520px;width:100%;padding:var(--space-7) var(--space-6);text-align:center}.assessment__card h1{font-size:var(--fs-xl);margin-bottom:var(--space-4)}.assessment__card p{color:var(--muted);margin-bottom:var(--space-5)}.assessment__skip{display:block;margin-top:var(--space-4);font-size:var(--fs-sm);color:var(--muted);text-decoration:underline;text-underline-offset:3px}.assessment__practice{width:100%;max-width:640px}.assessment__stats{display:flex;justify-content:center;gap:var(--space-7);margin-bottom:var(--space-5)}.assessment__stats span{display:block;font-family:var(--font-ui);font-size:var(--fs-2xl);font-weight:900;color:var(--gold)}.assessment__stats small{color:var(--muted);font-size:var(--fs-xs)}.not-found{min-height:60vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:var(--space-3)}.not-found__eyebrow{font-family:var(--font-display);font-size:var(--fs-3xl);font-weight:900;color:var(--blue)}.not-found h1{font-size:var(--fs-xl)}.not-found__body{color:var(--muted);margin-bottom:var(--space-4)}:root{--bg-deep: #071321;--bg-soft: #0a1a2d;--surface: #0e263e;--surface-hover: #143452;--border: #214a6d;--text: #f0f8ff;--muted: #a8c3d6;--blue: #4ea3ff;--cyan: #73d6ff;--green: #5dcca3;--gold: #f2c76e;--red: #e47272;--blue-glow: rgba(78, 163, 255, .35);--cyan-glow: rgba(115, 214, 255, .35);--green-glow: rgba(93, 204, 163, .3);--gold-glow: rgba(242, 199, 110, .35);--red-glow: rgba(228, 114, 114, .3);--surface-line: rgba(33, 74, 109, .55);--font-reading: "Amiri", serif;--font-ui: "Tajawal", sans-serif;--font-display: "IBM Plex Sans Arabic", "Noto Kufi Arabic", sans-serif;--font-body: var(--font-ui);--font-mono: var(--font-ui);--fs-xs: .8125rem;--fs-sm: .9375rem;--fs-base: 1rem;--fs-md: 1.125rem;--fs-lg: 1.375rem;--fs-xl: 1.75rem;--fs-2xl: 2.25rem;--fs-3xl: 3rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 64px;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 22px;--radius-pill: 999px;--shadow-card: 0 12px 32px rgba(3, 10, 20, .45);--shadow-focus: 0 0 0 3px var(--blue-glow);--ease-out: cubic-bezier(.16, 1, .3, 1);--dur-fast: .16s;--dur-med: .42s;--dur-slow: .64s;--dur-menu: .22s;--header-h: 64px;--lesson-bar-h: 68px}@media (prefers-reduced-motion: reduce){:root{--dur-fast: 0ms;--dur-med: 0ms;--dur-slow: 0ms;--dur-menu: 0ms}}:root[data-reduce-motion=true]{--dur-fast: 0ms;--dur-med: 0ms;--dur-slow: 0ms;--dur-menu: 0ms}@keyframes menuPop{0%{opacity:0;transform:scale(.96) translateY(-4px)}to{opacity:1;transform:scale(1) translateY(0)}}.enter-pop{animation:menuPop var(--dur-menu) var(--ease-out) both}@keyframes riseIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.enter-rise{animation:riseIn var(--dur-med) var(--ease-out) both}@keyframes softPulse{0%,to{box-shadow:0 0 0 0 var(--blue-glow)}50%{box-shadow:0 0 0 8px transparent}}.pulse-primary{animation:softPulse 7s ease-in-out infinite}@media (prefers-reduced-motion: reduce){.pulse-primary{animation:none}}:root[data-reduce-motion=true] .pulse-primary{animation:none}.interactive-lift{transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),background-color var(--dur-fast) var(--ease-out)}.interactive-lift:hover{transform:translateY(-3px);border-color:var(--blue);box-shadow:0 10px 28px #4ea3ff2e}.interactive-lift:active{transform:scale(.98)}@keyframes charGlow{0%,to{filter:drop-shadow(0 0 0 transparent)}50%{filter:drop-shadow(0 0 6px var(--gold-glow))}}.char-current{animation:charGlow 1.8s ease-in-out infinite}@media (prefers-reduced-motion: reduce){.char-current{animation:none}}:root[data-reduce-motion=true] .char-current{animation:none}@keyframes correctFlash{0%{background-color:var(--green-glow)}to{background-color:transparent}}.flash-correct{animation:correctFlash .18s var(--ease-out)}@keyframes errorShake{0%,to{background-color:transparent}40%{background-color:var(--red-glow)}}@keyframes fillProgress{0%{stroke-dashoffset:var(--dash-from, 100)}to{stroke-dashoffset:var(--dash-to, 0)}}.progress-fill{animation:fillProgress var(--dur-slow) var(--ease-out) forwards}@keyframes sheen{0%{transform:translate(-120%)}to{transform:translate(120%)}}.completion-sheen:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(100deg,transparent,rgba(240,248,255,.18),transparent);animation:sheen .9s var(--ease-out) 1}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-radius:var(--radius-pill);font-weight:700;font-size:var(--fs-sm);border:1px solid transparent}.btn-primary{background:linear-gradient(135deg,var(--blue),var(--cyan));color:var(--bg-deep);box-shadow:0 10px 24px var(--blue-glow)}.btn-ghost{background:transparent;border-color:var(--border);color:var(--text)}.btn-secondary{background:var(--surface);border-color:var(--border);color:var(--text)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important;box-shadow:none!important}.card{background:var(--surface);border:1px solid var(--surface-line);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:radial-gradient(120% 100% at 50% -10%,var(--bg-soft) 0%,var(--bg-deep) 60%);color:var(--text);font-family:var(--font-body);font-size:var(--fs-base);line-height:1.6;-webkit-font-smoothing:antialiased}h1{font-family:var(--font-display);margin:0;font-weight:700}h2,h3,h4{font-family:var(--font-ui);margin:0;font-weight:700}.reading-text,.long-form-copy{font-family:var(--font-reading);font-weight:400}p{margin:0}button,input,select{font:inherit;color:inherit}button{cursor:pointer;background:none;border:none}a{color:inherit;text-decoration:none}ul{margin:0;padding:0;list-style:none}:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:var(--radius-sm)}::selection{background:var(--blue-glow);color:var(--text)}.ambient-field{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;background-image:radial-gradient(1px 1px at 12% 22%,rgba(240,248,255,.35),transparent),radial-gradient(1px 1px at 78% 12%,rgba(240,248,255,.25),transparent),radial-gradient(1.5px 1.5px at 45% 68%,rgba(115,214,255,.25),transparent),radial-gradient(1px 1px at 88% 78%,rgba(240,248,255,.2),transparent),radial-gradient(1px 1px at 25% 85%,rgba(240,248,255,.18),transparent);opacity:.6}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:absolute;right:var(--space-4);top:-60px;background:var(--surface);color:var(--text);padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);border:1px solid var(--border);z-index:100;transition:top var(--dur-fast) var(--ease-out)}.skip-link:focus{top:var(--space-3)}