.kb{display:flex;flex-direction:column;gap:var(--key-gap);align-items:center;width:max-content;padding:var(--key-gap);touch-action:manipulation}.kb__strip,.kb__row{display:grid;grid-template-columns:repeat(48,var(--key-unit));gap:var(--key-gap);width:max-content}.kb__rows{display:flex;flex-direction:column;gap:var(--key-gap)}.key{position:relative;min-height:calc(var(--key-min) * var(--key-scale));display:flex;align-items:center;justify-content:center;padding:0;border:1px solid var(--rule);border-radius:var(--key-radius);background:var(--face);color:var(--ink);font-size:calc(23px * var(--key-scale));font-weight:500;letter-spacing:.02em;line-height:1;cursor:default;user-select:none;-webkit-user-select:none}.key--mod,.key--accent{font-size:calc(15px * var(--key-scale));color:var(--muted);background:var(--paper)}.key--accent{color:var(--ink)}.key__hint{position:absolute;top:5px;right:7px;font-size:calc(11px * var(--key-scale));color:var(--muted);line-height:1}.key.is-on{border-color:var(--signal);color:var(--signal)}.key.is-lock{background:var(--signal);border-color:var(--signal);color:var(--face)}.key.is-flash:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:var(--signal);opacity:0;animation:key-flash 60ms linear}@keyframes key-flash{0%{opacity:.34}to{opacity:0}}.kb.is-paused .key:not([data-dwell=pause]){opacity:.45}.kb[data-keys=outline] .key,.kb[data-keys=outline] .key--mod,.kb[data-keys=outline] .key--accent,.kb[data-keys=outline] .sug{background:transparent}.kb[data-keys=faint] .key,.kb[data-keys=faint] .key--mod,.kb[data-keys=faint] .key--accent,.kb[data-keys=faint] .sug{background:transparent;border-color:transparent}.kb[data-keys=outline] .key.is-on,.kb[data-keys=faint] .key.is-on{border-color:var(--signal)}.kb[data-keys=faint] .key.is-lock{background:var(--signal);border-color:var(--signal)}.kb[data-keys=faint] .sug:disabled{border-color:transparent}.key-spacer{display:block;pointer-events:none}.sug{grid-column:span 12;min-height:calc(40px * var(--key-scale));display:flex;align-items:center;justify-content:center;padding:0 8px;border:1px solid var(--rule);border-radius:var(--key-radius);background:var(--paper);color:var(--ink);font-size:calc(16px * var(--key-scale));overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:default;-webkit-user-select:none;user-select:none;position:relative}.sug:disabled{color:transparent;border-style:dashed;opacity:.5}.sug.is-flash:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:var(--signal);opacity:0;animation:key-flash 60ms linear}.kb[data-suggestions=off] .kb__strip{display:none}.ring-layer{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:60}.dwell-ring{position:absolute;top:0;left:0;transform:translate(-1000px,-1000px);will-change:transform}.dwell-ring__track{fill:none;stroke:var(--rule);stroke-width:5;opacity:.75}.dwell-ring__fill{fill:none;stroke:var(--signal);stroke-width:5;stroke-linecap:butt}.dwell-ring.is-held .dwell-ring__fill{stroke:var(--muted)}@media (prefers-reduced-motion: reduce){.key.is-flash:after{animation:none;opacity:.34}}#app{display:flex;flex-direction:column;height:100%;min-height:0}.bar{display:flex;align-items:center;gap:14px;padding:8px 14px;border-bottom:1px solid var(--rule);background:var(--paper);flex:none}.bar__brand{margin:0;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--muted)}.bar__tools{display:flex;gap:6px}.tool{min-height:34px;padding:0 14px;border:1px solid var(--rule);border-radius:4px;background:var(--face);color:var(--ink);font-size:13px;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative}.tool.is-on{border-color:var(--signal);color:var(--signal)}.tool--clear{width:74px;padding:0;text-align:center}.tool--clear.is-armed{border-color:var(--signal);color:var(--signal);box-shadow:inset 0 0 0 1px var(--signal);font-weight:600}.bar__spacer{flex:1}.bar__counts{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.stage{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);padding:14px}.stage__doc{min-width:0;min-height:0}.surface{display:block;height:100%;min-height:0;overflow:hidden}.surface textarea{display:block;width:100%;height:100%;min-height:0;padding:10px 12px;border:none;border-radius:3px;background:transparent;color:var(--ink);font-family:var(--font-ui);font-size:16px;line-height:1.6;resize:none}.surface textarea:focus{outline:none}.surface textarea::placeholder{color:var(--muted);opacity:.75}.surface:focus-within{box-shadow:inset 0 0 0 2px var(--signal);border-radius:3px}.kb-panel{flex:none;display:flex;justify-content:flex-start;justify-content:safe center;padding-top:4px;overflow-x:auto;overflow-y:hidden}.rest{flex:none;min-height:clamp(38px,7vh,58px);display:flex;align-items:center;justify-content:center;gap:10px;border-top:1px solid var(--rule);margin-top:6px;color:var(--muted);font-size:12px;letter-spacing:.08em;text-transform:uppercase;-webkit-user-select:none;user-select:none}.app-foot{flex:none;display:flex;align-items:center;gap:14px;padding:0 14px 6px}.status{flex:1;min-height:20px;margin:0;text-align:center;font-size:12px;color:var(--muted)}.app-foot__support,.app-foot__links{flex:none;margin:0;display:flex;gap:8px;font-size:11px}.app-foot__sep{color:var(--rule)}.app-foot__support a,.app-foot__links a{color:var(--muted);text-decoration:none}.app-foot__support a:hover,.app-foot__support a:focus-visible,.app-foot__links a:hover,.app-foot__links a:focus-visible{color:var(--ink);text-decoration:underline}@media (max-width: 620px){.app-foot__links{display:none}}.bar__divider{flex:none;width:1px;align-self:stretch;margin:2px 4px;background:var(--rule)}.bar__skins{flex:none}.tool--skin{padding:0 11px}.tool--theme{width:88px;padding:0;display:inline-flex;align-items:center;justify-content:center;gap:6px}.tool__icon{width:14px;height:14px;flex:none;color:var(--muted)}.tool--icon{width:38px;padding:0;display:inline-flex;align-items:center;justify-content:center}.tool--icon .tool__icon{width:16px;height:16px}.tool--icon.is-on .tool__icon{color:var(--signal)}@media (max-width: 1160px){.bar__counts{display:none}}@media (max-width: 940px){.bar__skins,.bar__skins+.bar__divider{display:none}}.panel{position:fixed;top:0;right:0;bottom:0;z-index:70;width:min(420px,100%);display:flex;flex-direction:column;background:var(--face-raised);border-left:1px solid var(--rule);overflow:hidden}.panel__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--rule);flex:none}.panel__title{margin:0;font-size:16px;font-weight:600}.panel__close,.panel__wide,.chip,.skin-chip,.step,.calib__btn{border:1px solid var(--rule);border-radius:4px;background:var(--face);color:var(--ink);cursor:pointer;-webkit-user-select:none;user-select:none;position:relative}.panel__close{min-height:38px;padding:0 16px}.panel__body{flex:1;min-height:0;overflow-y:auto;padding:12px 16px 24px}.panel__section{margin:18px 0 8px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.panel__section:first-child{margin-top:4px}.panel__row{padding:10px 0;border-bottom:1px solid var(--rule)}.panel__row--primary{padding:4px 0 14px;border-bottom:none}.panel__row--primary .panel__label{font-size:17px;font-weight:600}.panel__row--primary .panel__value{font-size:21px}.panel__row--primary .step{min-height:52px}.panel__label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:14px}.panel__value{color:var(--signal);font-variant-numeric:tabular-nums;font-weight:600}.panel__hint{font-size:12px;color:var(--muted);margin-top:1px}.panel__controls{display:flex;align-items:center;gap:10px;margin-top:8px}.step{width:54px;min-height:44px;font-size:20px;display:flex;align-items:center;justify-content:center;flex:none}.panel__track{flex:1;min-width:0}.panel__bar{height:6px;border-radius:3px;background:var(--rule);overflow:hidden}.panel__ends{display:flex;justify-content:space-between;gap:8px;margin-top:5px;font-size:11px;color:var(--muted)}.panel__end:last-child{text-align:right}.panel__fill{height:100%;width:100%;background:var(--signal);transform-origin:left center;transform:scaleX(0)}.panel__row--choice{display:flex;align-items:center;justify-content:space-between;gap:14px}.panel__choices{display:flex;gap:6px;flex:none}.panel__choices--wide{margin-top:8px;flex-wrap:wrap}.chip{min-height:40px;padding:0 16px}.chip.is-on,.skin-chip.is-on{border-color:var(--signal);color:var(--signal);box-shadow:inset 0 0 0 1px var(--signal)}.panel__actions{display:flex;gap:8px;margin-top:12px}.panel__wide{flex:1;min-height:44px}.panel__skins{display:grid;grid-template-columns:1fr 1fr;gap:8px}.skin-chip{min-height:62px;padding:8px 10px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;text-align:left;font-weight:600}.skin-chip__desc{font-weight:400;font-size:11px;color:var(--muted);line-height:1.35}.panel__note{margin-top:12px;font-size:12px;color:var(--muted)}.panel__note--tight{margin-top:2px;margin-bottom:10px}.panel__disclosure{display:flex;align-items:center;justify-content:space-between;gap:12px}.panel__disclosure .panel__section{margin-bottom:8px}.chip--quiet{min-height:34px;padding:0 14px;font-size:12px;color:var(--muted)}.panel__advanced{border-top:1px solid var(--rule);padding-top:8px}.tryout{display:flex;align-items:center;gap:14px;padding:12px;margin-bottom:10px;border:1px solid var(--rule);border-radius:5px;background:var(--paper);height:108px;overflow:hidden}.tryout__key{flex:none;width:min(calc(var(--key-min) * var(--key-scale) * 1.6),150px);height:min(calc(var(--key-min) * var(--key-scale)),84px);border:1px solid var(--rule);border-radius:var(--key-radius);background:var(--face);color:var(--muted);font-size:13px;cursor:default;-webkit-user-select:none;user-select:none;position:relative}.tryout__note{margin:0;font-size:12px;color:var(--muted)}.panel__links{font-size:13px}.tryout__key.is-flash:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:var(--signal);opacity:0;animation:key-flash 60ms linear}.calib{position:fixed;z-index:75;left:50%;top:14px;transform:translate(-50%);width:min(520px,calc(100% - 28px));padding:16px 20px;background:var(--face-raised);border:1px solid var(--rule);border-radius:6px}.calib__title{margin:0 0 6px;font-size:16px}.calib__intro,.calib__progress,.calib__readout{font-size:13px;color:var(--muted);margin:0 0 8px}.calib__readout{color:var(--signal);font-weight:600}.calib__phrase{margin:8px 0;font-size:26px;letter-spacing:.06em;color:var(--muted)}.calib__phrase .is-done{color:var(--ink)}.calib__phrase .is-next{color:var(--signal);text-decoration:underline;text-underline-offset:6px}.calib__actions{display:flex;gap:8px;margin-top:10px}.calib__btn{min-height:46px;padding:0 18px;flex:1}.calib__btn:disabled{opacity:.5}[data-input=touch] .rest{display:none}.touch-note{margin:0;padding:10px 14px;background:var(--face);border-bottom:1px solid var(--rule);font-size:13px;color:var(--muted);text-align:center}