.kd-shell{--kd-gap:1rem;--kd-pad-y:1.4rem;--kd-pad-x:1.5rem;--kd-crawl-min:340px;--kd-crawl-size:1.35rem;--kd-piano-h:156px;--kd-black-h:calc(var(--kd-piano-h) * .46);--kd-readout-gap:1.4rem;--kd-letter-size:clamp(3.2rem, 7vw, 6.4rem);--kd-quality-size:clamp(1.4rem, 2.6vw, 2.6rem);position:relative}.kd-bar{margin-bottom:var(--kd-gap)}.kd-bar-actions{align-items:center;gap:.85rem;display:flex}.kd-install-link{color:var(--accent);font:500 .8rem var(--font-body);cursor:pointer;white-space:nowrap;background:0 0;border:0;padding:0}.kd-install-link:hover{text-decoration:underline}.kd-offline-row{flex-wrap:wrap;align-items:baseline;gap:.35rem .85rem;margin-top:.55rem;display:flex}.kd-offline-status{color:var(--ink-faint);font:400 .7rem var(--font-body)}.kd-bar-title{color:var(--ink);font:600 1.15rem var(--font-body);align-items:center;gap:.6rem;display:none}.kd-bar-title svg{color:var(--accent)}.kd-banner{color:#f0b4ae;border-radius:var(--radius);margin-bottom:var(--kd-gap);font:400 .8rem/1.5 var(--font-mono);white-space:pre-wrap;background:#c83c321f;border:1px solid #c83c3266;padding:.85rem 1rem;display:none}.kd-banner.show{display:block}.kd-top{gap:var(--kd-gap);margin-bottom:var(--kd-gap);grid-template-columns:minmax(420px,1.9fr) minmax(280px,1fr);display:grid}@media (width<=1100px){.kd-top{grid-template-columns:1fr}}.kd-panel{background:var(--bg-elevated);border:1px solid var(--line);border-radius:var(--radius);padding:var(--kd-pad-y) var(--kd-pad-x);margin-bottom:var(--kd-gap);min-width:0;overflow:hidden}.kd-top .kd-panel{flex-direction:column;min-height:0;margin-bottom:0;display:flex}.kd-panel-title{color:var(--ink-soft);font:500 .95rem var(--font-body);justify-content:space-between;align-items:baseline;gap:.75rem;margin:0 0 .9rem;display:flex}.kd-panel-note{color:var(--ink-faint);font:400 .8rem var(--font-mono)}.kd-key-panel{grid-template-columns:1.15fr 1fr;gap:0;display:grid!important}.kd-col{flex-direction:column;min-width:0;display:flex}.kd-col-key{justify-content:center;container-type:inline-size}.kd-col-alt{padding-left:var(--kd-pad-x);border-left:1px solid var(--line)}.kd-col-key{padding-right:var(--kd-pad-x)}@media (width<=380px){.kd-key-panel{grid-template-columns:1fr}.kd-col-alt{border-left:0;border-top:1px solid var(--line);padding-top:1.1rem;padding-left:0}.kd-col-key{padding-right:0}}.kd-key{font-family:var(--font-display);color:var(--accent);flex-wrap:wrap;align-items:baseline;gap:.4rem;min-width:0;line-height:.95;display:flex}.kd-key .kd-letter{font-size:var(--kd-letter-size);font-weight:600}@supports (font-size:1cqw){.kd-key:not(.kd-idle) .kd-letter{font-size:clamp(2.6rem,52cqw,15rem)}.kd-key .kd-quality{font-size:clamp(1.1rem,15cqw,4rem)}}.kd-key .kd-quality{font-family:var(--font-body);font-size:var(--kd-quality-size);font-weight:500}.kd-key.kd-idle .kd-letter{font-size:clamp(1.6rem,3vw,2.4rem);font-family:var(--font-body)}.kd-key.kd-settled{color:#6fbf73}.kd-key.kd-unsure{color:var(--accent)}.kd-key.kd-weak{color:var(--ink-faint)}.kd-detail{color:var(--ink-soft);font:400 .82rem/1.5 var(--font-mono);margin:.9rem 0 0}.kd-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--ink-soft);font:400 .78rem var(--font-mono);align-items:center;gap:.5rem;margin-top:.8rem;display:flex}.kd-toggle input{accent-color:var(--accent);cursor:pointer}.kd-also{flex-direction:column;gap:.85rem;display:flex}.kd-alt{grid-template-columns:1fr auto;align-items:center;gap:.35rem .7rem;min-width:0;display:grid}.kd-alt-name{font:500 1.05rem var(--font-body);color:var(--ink);text-overflow:ellipsis;white-space:nowrap;grid-area:1/1/auto/-1;overflow:hidden}.kd-alt-track{background:var(--bg-surface);border-radius:4px;grid-area:2/1;min-width:0;height:8px;overflow:hidden}.kd-alt-track i{background:var(--accent);border-radius:4px;width:0;height:100%;transition:width .12s linear;display:block}.kd-alt-pct{text-align:right;min-width:2.9rem;font:400 .85rem var(--font-mono);color:var(--ink-soft);grid-area:2/2;font-style:normal}.kd-crawl-panel{position:relative}.kd-crawl-hint{color:var(--ink-faint);font:400 .85rem var(--font-mono);pointer-events:none;justify-content:center;align-items:center;margin:0;display:flex;position:absolute;inset:0}.kd-crawl-hint[hidden]{display:none}.kd-crawl{min-height:var(--kd-crawl-min);flex-direction:column;flex:1;justify-content:flex-end;gap:.3rem;display:flex;overflow:hidden}.kd-crawl div{white-space:pre;font:500 var(--kd-crawl-size) var(--font-mono);color:var(--ink)}.kd-crawl div:nth-last-child(n+8){display:none}.kd-cell{width:6.4rem;display:inline-block}.kd-cell.kd-now{color:#fff}.kd-cell.kd-ghost{color:var(--accent);opacity:.62}.kd-cell.kd-ghost.kd-far{color:var(--ink-faint);opacity:.5}.kd-piano{height:var(--kd-piano-h);-webkit-user-select:none;user-select:none;border-radius:5px;position:relative;overflow:hidden}.kd-piano .kd-white,.kd-piano .kd-black{border-radius:0 0 4px 4px;position:absolute;top:0;overflow:hidden}.kd-piano .kd-white{height:var(--kd-piano-h);background:#e6e2dc;border:1px solid #b4aea7}.kd-piano .kd-black{height:var(--kd-black-h);z-index:2;background:#17171a;border:1px solid #000}.kd-piano .kd-fill{background:linear-gradient(to top, var(--accent), #f5b464);height:0;transition:height 70ms linear;position:absolute;bottom:0;left:0;right:0}.kd-piano .kd-lit{box-shadow:inset 0 0 0 1px #e8912abf}.kd-piano b{z-index:3;font:500 .62rem var(--font-mono);color:#6b6560;position:absolute;bottom:5px;left:6px}.kd-readout{margin-top:var(--kd-readout-gap);color:var(--ink-soft);font:400 .8rem var(--font-mono);flex-wrap:wrap;align-items:center;gap:1.6rem;display:flex}.kd-readout b{color:var(--ink);font-weight:500}.kd-meter{background:var(--bg-surface);vertical-align:middle;border-radius:3px;width:90px;height:5px;margin-left:.5rem;display:inline-block;overflow:hidden}.kd-meter i{background:var(--accent);width:0;height:100%;transition:width .1s linear;display:block}.kd-controls{flex-wrap:wrap;align-items:center;gap:.6rem;display:flex}.kd-controls .btn{font:500 .95rem var(--font-body);cursor:pointer;line-height:normal}.kd-controls .btn:disabled{opacity:.5;cursor:default;transform:none}.kd-mic-btn.kd-live:before{content:"";vertical-align:middle;background:currentColor;border-radius:50%;width:.55rem;height:.55rem;margin-right:.55rem;animation:1.8s ease-in-out infinite kd-pulse;display:inline-block}@keyframes kd-pulse{0%,to{opacity:1}50%{opacity:.35}}@media (prefers-reduced-motion:reduce){.kd-mic-btn.kd-live:before{animation:none}}.kd-rate{color:var(--ink-faint)}.kd-input{font:400 .85rem var(--font-mono);background:var(--bg-surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);width:11rem;padding:.6rem .7rem .6rem 2.1rem}.kd-saved{color:#6fbf73;font:400 .78rem var(--font-mono)}.kd-note{color:var(--ink-soft);max-width:var(--measure);margin:.9rem 0 0;font-size:.85rem;line-height:1.65}.kd-shell.is-fullscreen{--kd-gap:.7rem;--kd-pad-y:1rem;--kd-pad-x:1.25rem;--kd-crawl-min:0;--kd-readout-gap:.9rem;box-sizing:border-box;flex-direction:column;height:100dvh;padding:.7rem clamp(.8rem,1.6vw,1.4rem);display:flex;overflow:hidden}.kd-shell.is-fullscreen .page-head,.kd-shell.is-fullscreen .kd-note{display:none}.kd-shell.is-fullscreen .kd-bar{padding-left:3rem}.kd-shell.is-fullscreen .kd-bar-title{display:inline-flex}.kd-shell.is-fullscreen .kd-top{flex:1;min-height:0}.kd-shell.is-fullscreen .kd-top .kd-panel,.kd-shell.is-fullscreen .kd-crawl{height:100%}.kd-shell.is-fullscreen .kd-piano-panel,.kd-shell.is-fullscreen .kd-controls-panel{flex-shrink:0}.kd-shell.is-fullscreen .kd-controls-panel{margin-bottom:0}@media (height<=760px) and (width>=761px){.kd-shell.is-fullscreen{--kd-piano-h:112px;--kd-letter-size:clamp(2.6rem, 5vw, 4.4rem);--kd-quality-size:clamp(1.1rem, 2vw, 1.7rem);--kd-crawl-size:1.15rem;--kd-pad-y:.75rem}}@media (height<=480px){.kd-shell.is-fullscreen .kd-piano{display:none}.kd-shell.is-fullscreen .kd-readout{margin-top:0}}@media (height<=600px) and (width>=761px){.kd-shell.is-fullscreen{--kd-piano-h:84px;--kd-crawl-size:1rem;--kd-pad-y:.55rem;--kd-gap:.5rem}.kd-shell.is-fullscreen .kd-bar{display:none}}@media (width<=760px){.kd-shell.is-fullscreen{-webkit-overflow-scrolling:touch;height:100dvh;padding:.5rem .7rem .7rem;overflow-y:auto}.kd-shell.is-fullscreen .kd-top{flex:1 0 auto;grid-template-rows:auto 1fr}.kd-shell.is-fullscreen .kd-top .kd-panel,.kd-shell.is-fullscreen .kd-crawl{height:auto}.kd-shell.is-fullscreen .kd-bar{padding-left:2.9rem}.kd-shell{--kd-pad-y:.8rem;--kd-pad-x:1rem;--kd-gap:.6rem}.kd-top{gap:var(--kd-gap)}.kd-key-panel{grid-template-columns:1.25fr 1fr}.kd-col-key{padding-right:.9rem}.kd-col-alt{padding-left:.9rem}.kd-shell{--kd-letter-size:clamp(3rem, 15vw, 4.6rem);--kd-quality-size:clamp(1.1rem, 5.5vw, 1.8rem)}.kd-detail{margin-top:.7rem;font-size:.76rem}.kd-toggle{font-size:.72rem}.kd-also{gap:.7rem}.kd-alt{gap:.25rem .5rem}.kd-alt-name{grid-column:1;font-size:.95rem}.kd-alt-pct{grid-area:1/2;min-width:0;font-size:.8rem}.kd-alt-track{grid-area:2/1/auto/-1}.kd-crawl{gap:.4rem;min-height:0}.kd-crawl div:nth-last-child(n+5){display:none}.kd-crawl div{grid-template-columns:repeat(4,1fr);gap:.3rem;display:grid}.kd-shell{--kd-crawl-size:1.2rem}.kd-cell{text-overflow:ellipsis;width:auto;min-width:0;overflow:hidden}.kd-shell{--kd-piano-h:88px}.kd-piano b{font-size:.55rem;bottom:3px;left:3px}.kd-readout{gap:.45rem .9rem;margin-top:.9rem;font-size:.7rem}.kd-meter{width:54px}.kd-controls{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.kd-controls .btn{text-align:center;justify-content:center;padding:.75rem .8rem}.kd-mic-btn,.kd-saved{grid-column:1/-1}.kd-note{display:none}}.kd-dialog{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-elevated);color:var(--ink);width:min(26rem,100vw - 2rem);padding:1.5rem;box-shadow:0 24px 60px #0000008c}.kd-dialog::backdrop{background:#0009}.kd-dialog h2{font:600 1.25rem var(--font-body);color:var(--ink);margin:0 0 .5rem}.kd-dialog-note{color:var(--ink-soft);font:400 .85rem/1.5 var(--font-mono);margin:0 0 1rem}.kd-dialog-label{color:var(--ink-soft);font:500 .78rem var(--font-mono);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.4rem;display:block}.kd-dialog-input{box-sizing:border-box;width:100%;padding:.7rem .8rem}.kd-dialog-input:focus{outline:2px solid var(--accent);outline-offset:1px}.kd-dialog-hint{color:var(--ink-faint);font:400 .78rem/1.6 var(--font-body);margin:.6rem 0 0}.kd-dialog-hint code{font:400 .78rem var(--font-mono);color:var(--ink-soft);background:var(--bg-surface);border-radius:3px;padding:.1rem .3rem}.kd-dialog-error{color:#f0b4ae;font:400 .8rem/1.5 var(--font-mono);margin:.7rem 0 0}.kd-dialog-error[hidden]{display:none}.kd-dialog-actions{justify-content:flex-end;gap:.6rem;margin-top:1.4rem;display:flex}.kd-dialog-actions .btn{font:500 .9rem var(--font-body);cursor:pointer}@media (width<=480px){.kd-dialog-actions{flex-direction:column-reverse}.kd-dialog-actions .btn{text-align:center;width:100%}}@media (width<=760px) and (height<=780px){.kd-shell.is-fullscreen{--kd-piano-h:72px;--kd-pad-y:.6rem;--kd-gap:.5rem;--kd-letter-size:clamp(2.4rem, 15vw, 4rem)}.kd-shell.is-fullscreen .kd-controls .btn{padding:.62rem .7rem}.kd-shell.is-fullscreen .kd-readout{margin-top:.65rem}.kd-shell.is-fullscreen .kd-detail{margin-top:.6rem}}@media (width<=500px) and (height>=820px){.kd-shell.is-fullscreen{--kd-piano-h:92px;--kd-crawl-size:1.35rem}@supports (font-size:1cqw){.kd-shell.is-fullscreen .kd-key:not(.kd-idle) .kd-letter{font-size:60cqw}.kd-shell.is-fullscreen .kd-key .kd-quality{font-size:17cqw}}}@media (width<=500px) and (width>=420px) and (height>=920px){.kd-shell.is-fullscreen{--kd-piano-h:100px;--kd-crawl-size:1.75rem}@supports (font-size:1cqw){.kd-shell.is-fullscreen .kd-key:not(.kd-idle) .kd-letter{font-size:82cqw}.kd-shell.is-fullscreen .kd-key .kd-quality{font-size:19cqw}}}