:root{--sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--mono: "JetBrains Mono", ui-monospace, "Cascadia Code", "Fira Code", monospace;--signal: #5ba3d9;--signal-dim: rgba(91, 163, 217, .5);--signal-ghost: rgba(91, 163, 217, .08);--bg-page: #080c14;--bg-card: #080c14;--surface: rgba(255, 255, 255, .02);--line: rgba(255, 255, 255, .05);--text-primary: #e4e8ed;--text-muted: rgba(255, 255, 255, .4);--text-ghost: rgba(255, 255, 255, .18);--scanlines: repeating-linear-gradient( 0deg, transparent 0px, transparent 2px, rgba(91, 163, 217, .03) 2px, rgba(91, 163, 217, .03) 3px );--radius-sm: 4px;--radius-md: 5px;--radius-lg: 6px;--radius-xl: 8px;color-scheme:dark}@media (prefers-color-scheme: light){:root:not([data-theme=dark]){--signal: #2970a8;--signal-dim: rgba(41, 112, 168, .7);--signal-ghost: rgba(41, 112, 168, .06);--bg-page: #f4f5f7;--bg-card: #ffffff;--surface: rgba(0, 0, 0, .02);--line: rgba(0, 0, 0, .08);--text-primary: #1a1d23;--text-muted: rgba(0, 0, 0, .6);--text-ghost: rgba(0, 0, 0, .45);color-scheme:light}}:root[data-theme=light]{--signal: #2970a8;--signal-dim: rgba(41, 112, 168, .7);--signal-ghost: rgba(41, 112, 168, .06);--bg-page: #f4f5f7;--bg-card: #ffffff;--surface: rgba(0, 0, 0, .02);--line: rgba(0, 0, 0, .08);--text-primary: #1a1d23;--text-muted: rgba(0, 0, 0, .6);--text-ghost: rgba(0, 0, 0, .45);color-scheme:light}select,option,optgroup{color:var(--text-primary);background-color:var(--bg-card)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg-page);color:var(--text-primary);font-family:var(--sans);font-size:.9rem;line-height:1.5}h1,h2{font-weight:700;letter-spacing:-.02em}h1{font-size:clamp(1.5rem,4vw,2.25rem)}h2{font-size:1.1rem;color:var(--text-primary);margin-bottom:1rem}.top-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.5rem;border-bottom:1px solid var(--line)}.brand{font-family:var(--mono);font-weight:600;font-size:.85rem;color:var(--signal);text-decoration:none;letter-spacing:.02em}.nav-controls{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;font-family:var(--mono);font-size:.65rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.nav-controls select,.nav-controls button{font-family:var(--mono);font-size:.7rem;background:var(--surface);color:var(--text-primary);border:1px solid var(--line);border-radius:var(--radius-sm);padding:.35rem .5rem;cursor:pointer}.import-label{cursor:pointer}#route-root{max-width:900px;margin:0 auto;padding:2rem 1.5rem 4rem}.home-header{position:relative;padding:2.5rem 2rem;margin-bottom:2.5rem;border:1px solid var(--line);border-radius:var(--radius-xl);overflow:hidden}.home-header:before{content:"";position:absolute;inset:0;background-image:var(--scanlines);pointer-events:none}.home-header .tagline{max-width:44ch;color:var(--text-muted)}.category{margin-bottom:3rem}.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}.tool-card{display:flex;flex-direction:column;align-items:flex-start;gap:.4rem;text-align:left;background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.25rem;cursor:pointer;font-family:var(--sans);color:var(--text-primary);transition:border-color .2s ease}.tool-card:hover{border-color:var(--signal-dim)}.tool-icon{display:block;width:22px;height:22px;color:var(--text-ghost)}.tool-icon svg{width:100%;height:100%;display:block}.tool-card--available .tool-icon{color:var(--signal)}.tool-name{font-weight:600}.tool-description{font-size:.8rem;color:var(--text-muted);max-width:55ch}.tool-status{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-ghost)}.tool-card--available .tool-status{color:var(--signal)}.notice{color:var(--text-muted)}.connect-status{font-family:var(--mono);font-size:.75rem;color:var(--signal)}.connect-detail{font-family:var(--mono);font-size:.9rem;min-height:1.5rem;margin-bottom:1.5rem}.visual-keyboard{position:relative;height:140px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}.key{position:absolute;top:0;bottom:0;border:1px solid var(--line);border-radius:0 0 var(--radius-sm) var(--radius-sm);transition:background-color .2s ease}.key-white{background:var(--bg-card);z-index:1}.key-black{height:60%;background:var(--text-primary);opacity:.85;z-index:2}.key.active{background:var(--signal);opacity:1}.key.highlight{box-shadow:inset 0 0 0 2px var(--signal)}.key.highlight-root{box-shadow:inset 0 0 0 2px var(--signal);background:var(--signal-ghost)}.key.wrong{background:#f87171;opacity:1}.visual-keyboard{touch-action:none;cursor:pointer}.trainer-target{font-family:var(--mono);font-size:1.4rem;color:var(--signal);margin-bottom:.5rem}.trainer-streak{font-family:var(--mono);font-size:.8rem;color:var(--text-muted);margin-bottom:1rem}.trainer-play-btn,.trainer-tap-pad,.scale-controls select,.synth-controls select,.synth-presets button{font-family:var(--mono);font-size:.75rem;background:var(--surface);color:var(--text-primary);border:1px solid var(--line);border-radius:var(--radius-sm);padding:.5rem .9rem;cursor:pointer}.trainer-play-btn:hover,.trainer-tap-pad:hover,.synth-presets button:hover{border-color:var(--signal-dim)}.trainer-tap-pad{display:block;width:100%;max-width:320px;padding:2rem;margin:.75rem 0 1.5rem;text-align:center;font-size:1rem;letter-spacing:.1em}.scale-controls{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1rem}.synth-controls{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin:1rem 0}.synth-slider{display:flex;flex-direction:column;gap:.4rem;font-family:var(--mono);font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.synth-presets{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.band-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:1rem;font-family:var(--mono);font-size:.75rem}.band-controls select,.band-controls button{font-family:var(--mono);font-size:.75rem;background:var(--surface);color:var(--text-primary);border:1px solid var(--line);border-radius:var(--radius-sm);padding:.5rem .75rem;cursor:pointer}.band-controls button:hover{border-color:var(--signal-dim)}.band-controls button:disabled{opacity:.4;cursor:not-allowed}.band-controls label{display:flex;align-items:center;gap:.4rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:.65rem}.band-tempo{display:flex;align-items:center;gap:.5rem}.sustain-indicator{display:inline-block;padding:.75rem 1.5rem;margin:.5rem 0 1rem;font-family:var(--mono);font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);color:var(--text-muted)}.sustain-indicator--down{color:var(--signal);border-color:var(--signal-dim)}.epicness-details{list-style:none;margin:0 0 1rem;padding:0;font-family:var(--mono);font-size:.8rem;color:var(--text-muted)}.epicness-details li{padding:.35rem 0;border-bottom:1px solid var(--line)}.movie-trailer-btn{display:block;width:100%;max-width:420px;padding:1.5rem;margin-bottom:1rem;font-family:var(--mono);font-size:1rem;letter-spacing:.15em;text-align:center;background:var(--surface);color:var(--signal);border:1px solid var(--signal-dim);border-radius:var(--radius-lg);cursor:pointer}.movie-trailer-btn:hover{border-color:var(--signal)}.intensity-bar{width:100%;max-width:420px;height:10px;margin:.75rem 0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}.intensity-bar-fill{height:100%;width:0%;background:var(--signal);transition:width .4s ease}.auth-form{display:flex;flex-direction:column;gap:.6rem;max-width:320px}.auth-form input,.auth-form button{font-family:var(--sans);font-size:.85rem;background:var(--surface);color:var(--text-primary);border:1px solid var(--line);border-radius:var(--radius-sm);padding:.6rem .75rem}.auth-form button{cursor:pointer;font-family:var(--mono)}.auth-form button:hover{border-color:var(--signal-dim)}.song-library-list{list-style:none;margin:0;padding:0}.song-library-list li{display:flex;align-items:center;gap:.75rem;padding:.5rem 0;border-bottom:1px solid var(--line);font-size:.85rem}.song-library-list a,.song-library-list button{font-family:var(--mono);font-size:.72rem;color:var(--signal);background:none;border:1px solid var(--line);border-radius:var(--radius-sm);padding:.3rem .6rem;cursor:pointer;text-decoration:none}.setup-section{margin-bottom:2rem}.setup-section h2{font-size:.9rem;margin-bottom:.5rem}.sight-staff{display:block;width:100%;max-width:420px;height:auto;color:var(--text-primary);margin-bottom:1rem}.ear-answers{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.ear-answers button{font-family:var(--mono);font-size:.75rem;background:var(--surface);color:var(--text-primary);border:1px solid var(--line);border-radius:var(--radius-sm);padding:.6rem 1rem;cursor:pointer}.ear-answers button:hover{border-color:var(--signal-dim)}.song-sources{margin-bottom:1rem;font-size:.8rem}.song-sources summary{cursor:pointer;color:var(--signal);font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}.song-sources-body{margin-top:.6rem;padding:.75rem 1rem;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);color:var(--text-muted)}.song-sources-body p{margin:0 0 .5rem}.song-sources-body ul{margin:0 0 .5rem;padding-left:1.2rem}.song-sources-body a{color:var(--signal)}.song-sources-note{font-size:.72rem;color:var(--text-ghost)}.song-falling-notes{display:block;width:100%;margin-bottom:.5rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md)}.practice-log-table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:.8rem}.practice-log-table th,.practice-log-table td{text-align:left;padding:.5rem .75rem;border-bottom:1px solid var(--line)}@media (max-width: 640px){.tool-grid{grid-template-columns:1fr}.top-nav{flex-direction:column;align-items:flex-start}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}#route-root.route-wide{max-width:none;padding:.75rem 1rem}.page-key-hero h1{margin:0;font-size:1.15rem}.page-key-hero .sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.kh{display:grid;grid-template-columns:minmax(17rem,21rem) minmax(0,1fr);gap:1rem;height:calc(100dvh - var(--kh-top, 4.5rem) - 1rem);min-height:27rem}.kh-side{display:flex;flex-direction:column;gap:.6rem;min-height:0;overflow-y:auto;padding-right:.25rem;scrollbar-width:thin}.kh-head{display:flex;flex-direction:column;gap:.15rem}.kh-device{margin:0;font-family:var(--mono);font-size:.68rem;line-height:1.35;color:var(--text-muted)}.kh-device.on{color:var(--signal)}.kh-tabs{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden}.kh-tab{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;padding:.5rem .25rem;background:transparent;color:var(--text-muted);border:0;border-right:1px solid var(--line);cursor:pointer}.kh-tab:last-child{border-right:0}.kh-tab.on{background:var(--signal-ghost);color:var(--signal)}.kh-panel{display:flex;flex-direction:column;gap:.5rem}.kh-panel[hidden]{display:none}.kh-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem .6rem}.kh-field{display:flex;flex-direction:column;gap:.2rem;min-width:0}.kh-label{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.kh select,.kh input[type=text],.kh input[type=number]{width:100%;min-width:0;height:2.1rem;padding:0 .5rem;font-family:var(--mono);font-size:.75rem;color:var(--text-primary);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm)}.kh select:focus-visible,.kh input:focus-visible,.kh button:focus-visible,.kh summary:focus-visible,.kh-drop:focus-within{outline:2px solid var(--signal);outline-offset:2px}.kh-seed{grid-column:1 / -1}.kh-btn{font-family:var(--mono);font-size:.75rem;height:2.3rem;padding:0 .9rem;color:var(--text-primary);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);cursor:pointer;transition:border-color .15s ease,background-color .15s ease}.kh-btn:hover:not(:disabled){border-color:var(--signal-dim)}.kh-btn:disabled{opacity:.4;cursor:not-allowed}.kh-primary{color:#06101b;background:var(--signal);border-color:var(--signal);font-weight:600}.kh-primary:hover:not(:disabled){filter:brightness(1.08);border-color:var(--signal)}.kh-link{background:transparent;border-color:transparent;color:var(--signal);text-decoration:underline;text-underline-offset:3px;padding:0;height:auto;text-align:left}.kh-actions{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:auto}.kh-actions .kh-primary{grid-column:1 / -1;height:2.6rem;font-size:.85rem}.kh-actions .kh-link{grid-column:1 / -1}.kh.locked .kh-panel,.kh .locked{pointer-events:none;opacity:.45}.kh-chartinfo{margin:0;font-family:var(--mono);font-size:.68rem;color:var(--text-muted)}.kh-note{margin:0;font-size:.72rem;line-height:1.45;color:var(--text-muted)}.kh-error{margin:0;padding:.4rem .6rem;font-size:.75rem;color:#f87171;border:1px solid rgba(248,113,113,.4);border-radius:var(--radius-sm)}.kh-drop{display:flex;align-items:center;justify-content:center;min-height:3rem;padding:.5rem;text-align:center;font-family:var(--mono);font-size:.72rem;color:var(--signal);border:1px dashed var(--signal-dim);border-radius:var(--radius-md);cursor:pointer}.kh-drop input{position:absolute;width:1px;height:1px;opacity:0}.kh-drop.over{background:var(--signal-ghost)}.kh-tracks{display:flex;flex-direction:column;gap:.25rem;max-height:7.5rem;overflow-y:auto}.kh-check{display:flex;align-items:flex-start;gap:.5rem;font-size:.75rem;line-height:1.35;cursor:pointer}.kh-check input{margin-top:.15rem;accent-color:var(--signal)}.kh-options{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}.kh-options summary{padding:.5rem .7rem;font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--signal);cursor:pointer}.kh-optbody{display:flex;flex-direction:column;gap:.5rem;padding:0 .7rem .7rem}.kh-optbody input[type=range]{width:100%;accent-color:var(--signal)}.kh-out{font-family:var(--mono);font-size:.68rem;color:var(--text-muted)}.kh-stage{display:flex;flex-direction:column;gap:0;min-width:0;min-height:0}.kh-hud{display:grid;grid-template-columns:1.6fr 1fr .8fr 1fr 1.2fr 1.6fr;gap:.5rem;margin-bottom:.5rem}.kh-stat,.kh-energy{display:flex;flex-direction:column;gap:.1rem;min-width:0;padding:.4rem .7rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md)}.kh-slabel{font-family:var(--mono);font-size:.58rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.kh-value{font-family:var(--mono);font-size:1.3rem;font-weight:600;line-height:1.15;font-variant-numeric:tabular-nums}.kh-stat.hot .kh-value{color:var(--signal)}.kh-meter{height:.5rem;margin-top:.55rem;background:var(--line);border-radius:99px;overflow:hidden}.kh-meter-fill{height:100%;background:var(--signal);transform-origin:left center;transition:transform .15s ease}.kh-energy.low .kh-meter-fill{background:#f87171}.kh-progress{height:3px;margin-bottom:.5rem;background:var(--line);border-radius:99px;overflow:hidden}.kh-progress-fill{height:100%;background:var(--signal-dim);transform-origin:left center}.kh-playfield{position:relative;flex:1;min-height:8rem;background:#0a0f1a;border:1px solid rgba(255,255,255,.06);border-bottom:0;border-radius:var(--radius-md) var(--radius-md) 0 0;overflow:hidden}.kh-canvas{position:absolute;inset:0;display:block}.kh-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:.75rem;background:#080c149e;backdrop-filter:blur(3px)}.kh-overlay[hidden]{display:none}.kh-result{width:min(24rem,100%);max-height:100%;overflow-y:auto;padding:1rem 1.2rem;background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:0 12px 40px #00000059}.kh-result h2{margin:0 0 .5rem;font-size:1rem}.kh-stars{display:flex;gap:.25rem;margin-bottom:.7rem}.kh-star{width:1.7rem;height:1.7rem;fill:none;stroke:var(--text-ghost);stroke-width:1.2;stroke-linejoin:round}.kh-star.on{fill:var(--signal);stroke:var(--signal)}.kh-resgrid{display:grid;grid-template-columns:1fr auto;gap:.2rem 1rem;margin:0 0 .6rem;font-family:var(--mono);font-size:.75rem}.kh-resgrid dt{color:var(--text-muted)}.kh-resgrid dd{margin:0;text-align:right}.kh-resactions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.7rem}.kh-keyboard .visual-keyboard{height:clamp(5rem,16vh,9rem)}.kh-dialog{width:min(34rem,calc(100vw - 2rem));max-height:calc(100dvh - 2rem);padding:0;color:var(--text-primary);background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-lg)}.kh-dialog::backdrop{background:#0000008c}.kh-dialog-body{display:flex;flex-direction:column;gap:.6rem;padding:1.2rem 1.4rem;max-height:calc(100dvh - 2rem);overflow-y:auto}.kh-dialog h2{margin:0;font-size:1.05rem}.kh-dialog h3{margin:.4rem 0 0;font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.kh-dialog p,.kh-dialog li{font-size:.8rem;line-height:1.5}.kh-sourcelist,.kh-tips{margin:0;padding:0;list-style:none}.kh-sourcelist li{display:flex;flex-direction:column;gap:.1rem;padding:.45rem 0;border-bottom:1px solid var(--line)}.kh-sourcelist a{color:var(--signal);font-weight:600}.kh-sourcelist span{color:var(--text-muted)}.kh-tips li{padding:.2rem 0 .2rem .9rem;position:relative}.kh-tips li:before{content:"";position:absolute;left:0;top:.75em;width:.4rem;height:1px;background:var(--signal)}@media (max-width: 860px){.kh{grid-template-columns:1fr;height:auto}.kh-side{overflow:visible}.kh-stage{min-height:32rem}.kh-hud{grid-template-columns:repeat(3,1fr)}.kh-actions{margin-top:0}}@media (max-height: 760px) and (min-width: 861px){.kh-side{gap:.4rem}.kh-grid{gap:.35rem .5rem}.kh select,.kh input[type=text],.kh input[type=number]{height:1.9rem}.kh-actions .kh-primary{height:2.3rem}.kh-value{font-size:1.1rem}}@media (prefers-reduced-motion: reduce){.kh-meter-fill{transition:none}}.kh-wide{grid-column:1 / -1}.kh-pills{position:absolute;top:.5rem;right:.5rem;z-index:2;display:flex;align-items:center;gap:.35rem;padding:.25rem;background:#080c14b8;border:1px solid rgba(255,255,255,.1);border-radius:99px;backdrop-filter:blur(4px)}.kh-pill{height:1.7rem;padding:0 .7rem;font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:#ffffff8c;background:transparent;border:1px solid transparent;border-radius:99px;cursor:pointer}.kh-pill[aria-pressed=true]{color:#06101b;background:#7fbdf0}.kh-pill:focus-visible{outline:2px solid #9fd0f7;outline-offset:1px}.kh-pills input[type=range]{width:4.5rem;accent-color:#7fbdf0}.kh-dropover{position:absolute;inset:.5rem;z-index:3;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:1rem;color:#cfe6fa;background:#0a1220e0;border:2px dashed #7fbdf0;border-radius:var(--radius-lg)}.kh-dropover[hidden]{display:none}.kh-recent{display:flex;flex-direction:column;gap:.25rem}.kh-recentrow{display:flex;gap:.35rem}.kh-recentbtn{flex:1;min-width:0;height:1.9rem;padding:0 .6rem;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap;font-family:var(--mono);font-size:.7rem;color:var(--text-primary);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);cursor:pointer}.kh-recentbtn:hover{border-color:var(--signal-dim)}.kh-recentforget{height:1.9rem;padding:0 .5rem;font-family:var(--mono);font-size:.62rem;color:var(--text-muted);background:transparent;border:1px solid var(--line);border-radius:var(--radius-sm);cursor:pointer}.kh-sections{display:flex;flex-wrap:wrap;gap:.3rem;margin-bottom:.5rem}.kh-section{width:2rem;height:2rem;font-family:var(--mono);font-size:.75rem;color:#06101b;border:0;border-radius:var(--radius-sm);cursor:pointer}.kh-section[data-level=high]{background:#6ee7a8}.kh-section[data-level=mid]{background:#ffd479}.kh-section[data-level=low]{background:#ff8f8f}.kh-section[data-level=none]{color:var(--text-muted);background:var(--line);cursor:default}.kh-keyboard .visual-keyboard{border:0;border-radius:0 0 var(--radius-md) var(--radius-md);background:#1a2130;overflow:hidden}.kh-keyboard .key{transition:background-color .08s ease,box-shadow .08s ease}.kh-keyboard .key-white{background:linear-gradient(#fbfcfd,#e6ebf1);border:0;border-right:1px solid #aeb7c4;border-radius:0 0 4px 4px;box-shadow:inset 0 -5px #00000012}.kh-keyboard .key-black{background:linear-gradient(#2a3345,#0d121b);border:0;border-radius:0 0 3px 3px;opacity:1;box-shadow:inset 0 -4px #ffffff0f}.kh-keyboard .key-white.active{background:linear-gradient(#cfe6fa,#8fc4f0);opacity:1}.kh-keyboard .key-black.active{background:linear-gradient(#4da3e8,#2d6fa8);opacity:1}.kh-keyboard .key-white.tgt-right{background:linear-gradient(#bfe0fb,#4da3e8)}.kh-keyboard .key-white.tgt-left{background:linear-gradient(#c4f1e3,#3cc9a0)}.kh-keyboard .key-black.tgt-right{background:linear-gradient(#4da3e8,#2d6fa8)}.kh-keyboard .key-black.tgt-left{background:linear-gradient(#3cc9a0,#1f8f6e)}.kh-keyboard .key.hit{box-shadow:inset 0 0 0 2px #fff,0 0 12px #b4e6ffe6}.kh-keyboard .key.wrong{background:linear-gradient(#ffd0d0,#ff7b7b);opacity:1}.kh-keyboard .key.highlight{box-shadow:none}.kh-keyboard .key-white:after{position:absolute;bottom:4px;left:0;right:0;text-align:center;font-family:var(--mono);font-size:.58rem;color:#5b6577;pointer-events:none}.kh-keyboard .key-white[data-c]:after{content:attr(data-label)}.kh.names .kh-keyboard .key-white:after{content:attr(data-label)}@media (max-width: 860px){.kh-pills{right:.25rem;left:.25rem;justify-content:center}}.kh-commonsform{display:flex;gap:.35rem}.kh-commonsform input{flex:1;min-width:0;height:1.9rem;padding:0 .6rem;font-family:var(--mono);font-size:.72rem;color:var(--text-primary);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm)}.kh-recentforget[href]{display:inline-flex;align-items:center;max-width:9rem;overflow:hidden;text-decoration:none;white-space:nowrap}.kh-stat[hidden],.kh-energy[hidden]{display:none}