.dg [data-finger=lp]{--fc:#e5484d }.dg [data-finger=lr]{--fc:#f5a524 }.dg [data-finger=lm]{--fc:#eab308 }.dg [data-finger=li]{--fc:#24c07a }.dg [data-finger=ri]{--fc:#22c3e6 }.dg [data-finger=rm]{--fc:#6ea8fe }.dg [data-finger=rr]{--fc:#a78bfa }.dg [data-finger=rp]{--fc:#ff8fd0 }.dg [data-finger=th]{--fc:#94a3b8 }.dg-hero{position:relative;overflow:hidden;padding-top:clamp(8rem,14vh,11rem);padding-bottom:clamp(1rem,4vw,2.5rem)}.dg-bg{position:absolute;inset:0;z-index:0;opacity:.5}.dg-bg .brain-wrap{height:100%}.dg-hero__inner{position:relative;z-index:1;max-width:44rem}.dg-hero__title{margin-top:1rem}.dg-hero__lead{margin-top:1.4rem;max-width:40rem}.dg-sec{padding-top:clamp(1.5rem,4vw,2.5rem)}.dg-pick{display:grid;gap:.9rem;margin-bottom:1.6rem}.dg-courses{display:flex;flex-wrap:wrap;gap:.6rem}.tt-course{padding:.55em 1.2em;border-radius:999px;font-weight:700;font-size:.9rem;cursor:pointer;color:var(--ink);background:var(--graphite);border:1.5px solid var(--hairline-soft);transition:border-color .3s,color .3s,background .3s}.tt-course:hover{border-color:var(--gold)}.tt-course.is-on{color:#fff;background:var(--grad-dusk);border-color:transparent}.dg-lessons{display:flex;flex-wrap:wrap;gap:.5rem}.tt-lesson{display:inline-flex;flex-direction:column;gap:.1rem;text-align:left;padding:.5em .9em;border-radius:10px;cursor:pointer;background:var(--graphite);border:1px solid var(--hairline-soft);color:var(--ink-dim);transition:border-color .3s,color .3s}.tt-lesson:hover{border-color:var(--gold);color:var(--ink)}.tt-lesson.is-on{border-color:var(--gold);color:var(--ink);box-shadow:0 0 0 1px var(--gold) inset}.tt-lesson__n{font-weight:600;font-size:.86rem}.tt-lesson__lv{font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-mute)}.dg-app{display:grid;grid-template-columns:1fr;gap:1.4rem}@media(min-width:1000px){.dg-app{grid-template-columns:300px 1fr;align-items:end}}.dg-guide{background:var(--graphite);border:1px solid var(--hairline-soft);border-radius:14px;padding:1.2rem 1.3rem;box-shadow:var(--shadow-card, 0 10px 30px rgba(0,0,0,.15))}.dg-guide__title{font-size:1rem;color:var(--ink);margin-bottom:.9rem}.dg-hands{display:flex;align-items:flex-end;justify-content:center;gap:.5rem;margin:0 auto .8rem}.hand{display:flex;align-items:flex-end;gap:5px}.hand__finger,.hand__thumb{display:block;width:12px;border-radius:8px;background:var(--fc, #ccc);opacity:.42;transition:opacity .2s,transform .2s,box-shadow .2s}.hand--esq .hand__finger:nth-child(1){height:30px}.hand--esq .hand__finger:nth-child(2){height:44px}.hand--esq .hand__finger:nth-child(3){height:52px}.hand--esq .hand__finger:nth-child(4){height:46px}.hand--dir .hand__finger:nth-child(1){height:46px}.hand--dir .hand__finger:nth-child(2){height:52px}.hand--dir .hand__finger:nth-child(3){height:44px}.hand--dir .hand__finger:nth-child(4){height:30px}.hand__thumb{height:16px;width:22px;align-self:flex-start;margin:0 -2px}.dg-hands [data-finger].is-active{opacity:1;transform:translateY(-4px);box-shadow:0 0 0 2px #fff,0 0 16px 2px var(--fc)}.dg-guide__now{text-align:center;font-size:.86rem;color:var(--ink-dim);margin-bottom:.9rem}.dg-guide__now strong{color:var(--ink)}.dg-legend{list-style:none;display:grid;gap:.45rem;font-size:.76rem;color:var(--ink-dim)}.dg-legend li{display:flex;align-items:center;gap:.35rem}.dg-legend i{width:12px;height:12px;border-radius:4px;background:var(--fc);display:inline-block}.dg-tip{margin-top:.9rem;font-size:.82rem;color:var(--ink-dim);border-left:2px solid var(--gold);padding-left:.7rem;line-height:1.5}.dg-posture{list-style:none;margin-top:.9rem;display:grid;gap:.35rem;font-size:.72rem;color:var(--ink-mute)}.dg-posture li:before{content:"›";color:var(--gold);margin-right:.4rem}.dg-stats{display:flex;align-items:center;gap:1.2rem;margin-bottom:1rem;flex-wrap:wrap}.dg-stat{display:flex;flex-direction:column}.dg-stat__v{font-size:1.7rem;font-weight:700;color:var(--gold);line-height:1}.dg-stat__l{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute)}.dg-prog{flex:1 1 120px;height:6px;background:var(--hairline-soft);border-radius:99px;overflow:hidden;min-width:120px}.dg-prog__bar{display:block;height:100%;width:0;background:var(--grad-dusk);transition:width .25s ease}.dg-stage{position:relative;background:var(--graphite);border:1px solid var(--hairline-soft);border-radius:14px;padding:clamp(1.2rem,3vw,1.8rem)}.dg-stage__lesson{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin-bottom:.8rem}.dg-text{font-family:Courier New,ui-monospace,monospace;font-size:clamp(1.1rem,2.4vw,1.6rem);line-height:1.9;letter-spacing:.02em;color:var(--ink-mute);word-break:break-word}.tt-char{position:relative;padding:0 1px;border-radius:3px}.tt-char--space{opacity:.4}.tt-char.is-ok{color:#16a34a}.tt-char.is-wrong{color:#fff;background:#e5484d}.tt-char.is-cur{background:color-mix(in srgb,var(--gold) 22%,transparent);box-shadow:inset 0 -2px 0 var(--gold);color:var(--ink)}.dg-catch{position:absolute;inset:0;border-radius:14px;cursor:text;outline:none}.dg-catch__hint{position:absolute;inset:0;display:grid;place-items:center;color:var(--ink-mute);font-size:.9rem;background:color-mix(in srgb,var(--graphite) 82%,transparent);border-radius:14px;transition:opacity .3s}.dg.is-typing .dg-catch__hint{opacity:0;pointer-events:none}.dg-catch:focus-visible{box-shadow:0 0 0 2px var(--gold)}.dg-flash{position:absolute;right:1rem;top:.9rem;font-size:.82rem;font-weight:700;color:var(--gold);opacity:0;transform:translateY(-6px);transition:opacity .3s,transform .3s}.dg-flash.is-in{opacity:1;transform:none}.dg-kb{margin-top:1.2rem;display:grid;gap:6px;justify-items:center}.kb-row{display:flex;gap:6px}.kb-key{width:clamp(1.9rem,4.4vw,2.6rem);height:clamp(1.9rem,4.4vw,2.6rem);display:grid;place-items:center;border-radius:8px;background:var(--graphite);border:1px solid var(--hairline-soft);border-bottom:3px solid var(--fc, var(--hairline-soft));font-size:.8rem;color:var(--ink-dim);text-transform:uppercase;user-select:none;transition:transform .12s,box-shadow .12s,background .12s,color .12s}.kb-key--space{width:clamp(10rem,40vw,16rem)}.kb-key.is-next{color:#fff;background:var(--fc);border-color:transparent;transform:translateY(-2px);box-shadow:0 0 0 2px #fff,0 6px 18px 0 var(--fc);animation:kbPulse 1s ease-in-out infinite}@keyframes kbPulse{50%{box-shadow:0 0 0 3px #fff,0 8px 24px 2px var(--fc)}}@media(prefers-reduced-motion:reduce){.kb-key.is-next{animation:none}}@media(max-width:560px){.dg-kb{transform:scale(.86);transform-origin:top center}}.kb-key.is-next2{color:#fff;background:color-mix(in srgb,var(--fc) 55%,transparent);border-color:transparent}.dg{position:relative}.dg-bubbles{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:5}.dg-bubble{position:absolute;bottom:-70px;border-radius:50%;pointer-events:none;will-change:transform,opacity;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.9),rgba(200,220,255,.28) 42%,rgba(167,139,250,.14) 70%,transparent 76%);border:1px solid rgba(255,255,255,.55);box-shadow:inset -6px -8px 14px #a78bfa2e,inset 6px 6px 12px #ffffff80,0 0 12px #a78bfa26;animation:bubbleUp var(--dur, 8s) linear forwards}@keyframes bubbleUp{0%{transform:translate(0) scale(.5);opacity:0}12%{opacity:.9}88%{opacity:.85}to{transform:translate(var(--drift, 0),-860px) scale(1.04);opacity:0}}.dg-bubble.is-pop{animation:none;transform:scale(1.7);opacity:0;transition:transform .4s ease,opacity .4s ease}@media(prefers-reduced-motion:reduce){.dg-bubbles{display:none}}.dg-realkb{position:fixed;right:1.2rem;bottom:1.2rem;z-index:70;width:min(340px,80vw);background:var(--graphite);border:1px solid var(--hairline-soft);border-radius:16px;padding:.8rem .9rem .6rem;box-shadow:0 18px 50px #28195a4d;opacity:0;transform:translate(30px,40px) scale(.9);pointer-events:none;transition:opacity .5s var(--ease),transform .5s var(--ease)}.dg-realkb.is-shown{opacity:1;transform:none}.dg-realkb__cap{display:block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.3rem;text-align:center}@media(max-width:620px){.dg-realkb{display:none}}.dg-hands-svg{display:block;width:100%;height:auto}.dg-hk{fill:color-mix(in srgb,var(--ink) 8%,transparent)}.dg-hk-keys rect{fill:color-mix(in srgb,var(--ink) 6%,transparent)}.dg-palm{fill:var(--ink-mute);opacity:.28}.dg-finger{fill:var(--fc, #bbb);opacity:.32;transition:opacity .18s ease,filter .18s ease}.dg-finger.is-active{opacity:1;filter:drop-shadow(0 0 6px var(--fc))}