@property --kb-well-width{syntax: "<length>"; inherits: true; initial-value: 992px;}[data-keyboard-test]{--kb-ease: cubic-bezier(.16, 1, .3, 1);--kb-ease-snap: cubic-bezier(.23, 1, .32, 1);--kb-layout-switch-ms: .22s;--kb-well-width: 69rem;--kb-board-width: 65rem;--kb-board-min-height: 19rem;--kb-well-min-height: calc(var(--kb-board-min-height) + 2.3rem);--kb-radius-outer: 1.5rem;--kb-radius-tray: 1.25rem;--kb-key-gap: .3125rem;--kb-key-min-h: 2.375rem;--kb-key-arrow-size: 2.35rem;--kb-key-radius: .4375rem;--kb-accent-soft: rgb(var(--color-accent) / .14);--kb-accent-glow: rgb(var(--color-accent) / .35);--kb-mod-bg: rgb(var(--color-surface-soft));--kb-mod-border: rgb(var(--color-border));--kb-alpha-bg: rgb(var(--color-surface-card));--kb-alpha-border: rgb(var(--color-border) / .75);--kb-nav-bg: rgb(var(--color-surface-soft) / .85);--kb-nav-border: rgb(var(--color-border) / .65);--kb-key-shadow: 0 2px 0 rgb(0 0 0 / .12);--kb-key-highlight: inset 0 1px 0 rgb(255 255 255 / .07)}[data-keyboard-test][data-kb-form="60"]{--kb-well-width: 36.2rem;--kb-board-width: 34rem;--kb-board-min-height: calc(var(--kb-board-width) * 5 / 15)}[data-keyboard-test][data-kb-form="65"]{--kb-well-width: 40.2rem;--kb-board-width: 38rem;--kb-board-min-height: calc(var(--kb-board-width) * 5 / 15)}[data-keyboard-test][data-kb-form="70"]{--kb-well-width: 46.2rem;--kb-board-width: 44rem;--kb-board-min-height: calc(var(--kb-board-width) * 6 / 18.25)}[data-keyboard-test][data-kb-form="75"]{--kb-well-width: 50.2rem;--kb-board-width: 48rem;--kb-board-min-height: calc(var(--kb-board-width) * 6 / 18.25)}[data-keyboard-test][data-kb-form=tkl]{--kb-well-width: 56.2rem;--kb-board-width: 54rem;--kb-board-min-height: calc(var(--kb-board-width) * 6 / 18.25)}[data-keyboard-test][data-kb-form=full]{--kb-well-width: 69rem;--kb-board-width: 65rem;--kb-board-min-height: calc(var(--kb-board-width) * 6 / 22.5)}[data-keyboard-test][data-kb-form=full] .kb-instrument__well{width:100%}[data-theme=dark] [data-keyboard-test]{--kb-mod-bg: rgb(var(--color-surface-soft));--kb-alpha-bg: rgb(var(--color-surface-dark-soft));--kb-nav-bg: rgb(var(--color-surface-card) / .92)}[data-theme=light] [data-keyboard-test]{--kb-mod-bg: rgb(var(--color-hairline));--kb-alpha-bg: rgb(var(--color-surface-card));--kb-nav-bg: rgb(var(--color-hairline-soft));--kb-key-highlight: inset 0 1px 0 rgb(255 255 255 / .85);--kb-key-shadow: 0 2px 0 rgb(0 0 0 / .08)}.kb-instrument{width:100%}.kb-instrument__frame{position:relative;display:flex;flex-direction:column;border-radius:var(--kb-radius-outer);border:1px solid rgb(var(--color-border) / .5);background:rgb(var(--color-surface-card));padding:0;overflow:hidden;box-shadow:0 1px rgb(var(--color-accent) / .12) inset,0 24px 48px rgb(var(--color-ink) / .08);transition:border-color .32s var(--kb-ease),box-shadow .32s var(--kb-ease)}.kb-instrument__frame:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent 0%,rgb(var(--color-accent) / .55) 20%,rgb(var(--color-accent)) 50%,rgb(var(--color-accent) / .55) 80%,transparent 100%);opacity:.85;pointer-events:none;z-index:2}[data-keyboard-test][data-active=true] .kb-instrument__frame{border-color:rgb(var(--color-accent) / .28);box-shadow:0 0 0 1px rgb(var(--color-accent) / .08) inset,0 0 40px rgb(var(--color-accent) / .06),0 24px 48px rgb(var(--color-ink) / .1)}[data-keyboard-test][data-complete=true] .kb-instrument__frame:before{opacity:1;background:linear-gradient(90deg,transparent,rgb(var(--color-accent)),transparent)}[data-keyboard-test][data-active=false] .kb-instrument__frame{border-color:rgb(var(--color-border) / .45)}.kb-instrument__scroll{width:100%;overflow-x:auto;padding-bottom:.25rem;scrollbar-width:thin;scrollbar-color:rgb(var(--color-accent) / .35) transparent}.kb-instrument__tray{min-width:62rem;width:100%;display:flex;flex-direction:column}.kb-instrument__rail{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.85rem 1.25rem;padding:.9rem 1.35rem;border-bottom:1px solid rgb(var(--color-border) / .35);background:linear-gradient(180deg,rgb(var(--color-surface-card) / .9),rgb(var(--color-surface-soft) / .25))}.kb-instrument__rail-left,.kb-instrument__rail-right{display:flex;flex-wrap:wrap;align-items:center;gap:.85rem 1rem;min-width:0}.kb-instrument__rail-right{margin-left:auto;justify-content:flex-end}@media(min-width:900px){.kb-instrument__rail,.kb-instrument__rail-left,.kb-instrument__rail-right{flex-wrap:nowrap}}.kb-instrument__rail-divider{width:1px;height:2rem;background:linear-gradient(180deg,transparent,rgb(var(--color-border) / .55),transparent);flex-shrink:0}.kb-instrument__rail-divider--sm{display:none}@media(min-width:640px){.kb-instrument__rail-divider--sm{display:block}}.kb-instrument__brand{display:flex;align-items:center;gap:.85rem;min-width:0}.kb-instrument__back{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:.5rem;color:rgb(var(--color-ink-muted));flex-shrink:0;transition:color .18s var(--kb-ease),background .18s var(--kb-ease)}.kb-instrument__back:hover{color:rgb(var(--color-ink));background:rgb(var(--color-accent) / .1)}.kb-instrument__title-wrap{display:flex;flex-direction:column;gap:.35rem;min-width:0}.kb-instrument__title-row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .65rem}.kb-instrument__title{margin:0;font-size:.9rem;font-weight:650;letter-spacing:-.01em;color:rgb(var(--color-ink));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kb-instrument__status{display:inline-flex;align-items:center;gap:.35rem;font-size:.625rem;font-weight:500;color:rgb(var(--color-ink-muted));white-space:nowrap}.kb-instrument__status-dot{width:.4rem;height:.4rem;border-radius:999px;background:rgb(var(--color-accent));box-shadow:0 0 8px rgb(var(--color-accent) / .55)}[data-keyboard-test][data-active=false] .kb-instrument__status-dot{background:rgb(var(--color-ink-muted));box-shadow:none}.kb-instrument__chip{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:.75rem;background:var(--kb-accent-soft);color:rgb(var(--color-accent));border:1px solid rgb(var(--color-accent) / .22);box-shadow:0 0 20px rgb(var(--color-accent) / .12);flex-shrink:0}.kb-instrument__progress{display:flex;align-items:center;gap:.5rem}.kb-instrument__progress-track{width:5.5rem;height:.3125rem;border-radius:999px;background:rgb(var(--color-border) / .45);overflow:hidden;flex-shrink:0}.kb-instrument__progress-fill{display:block;height:100%;width:0%;border-radius:inherit;background:linear-gradient(90deg,rgb(var(--color-accent) / .75),rgb(var(--color-accent)));box-shadow:0 0 10px rgb(var(--color-accent) / .45);transition:width .32s var(--kb-ease-snap)}[data-keyboard-test][data-complete=true] .kb-instrument__progress-fill{box-shadow:0 0 14px rgb(var(--color-accent) / .65)}.kb-instrument__progress-text{font-size:.625rem;font-weight:500;font-variant-numeric:tabular-nums;font-family:var(--font-mono, ui-monospace, monospace);color:rgb(var(--color-ink-muted));flex-shrink:0;min-width:2ch}.kb-instrument__stats{display:flex;align-items:center;gap:.85rem;flex-shrink:0}.kb-instrument__stat{display:flex;flex-direction:column;gap:.12rem;min-width:0}.kb-instrument__stat-label{font-size:.5625rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:rgb(var(--color-ink-muted));white-space:nowrap}.kb-instrument__stat-value{font-family:var(--font-mono, ui-monospace, monospace);font-size:.875rem;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:rgb(var(--color-ink));line-height:1.1}[data-keyboard-test][data-active=true] .kb-instrument__stat-value{color:rgb(var(--color-accent))}[data-keyboard-test][data-complete=true] .kb-instrument__progress-text{color:rgb(var(--color-accent-soft))}.kb-instrument__code{display:none;align-items:center;gap:.5rem;padding:.4rem .8rem;border-radius:.625rem;border:1px solid rgb(var(--color-border) / .5);background:rgb(var(--color-surface-soft) / .55);flex-shrink:0}@media(min-width:640px){.kb-instrument__code{display:inline-flex}}.kb-instrument__code-label{font-size:.5625rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:rgb(var(--color-ink-muted))}.kb-instrument__code-sep{width:1px;height:.8rem;background:rgb(var(--color-border) / .5)}.kb-instrument__code-value{font-family:var(--font-mono, ui-monospace, monospace);font-size:.8125rem;font-weight:500;font-variant-numeric:tabular-nums;color:rgb(var(--color-ink));min-width:3ch;text-align:left;transition:color .18s var(--kb-ease),text-shadow .18s var(--kb-ease)}.kb-instrument__code-value.is-flash{color:rgb(var(--color-accent));text-shadow:0 0 12px rgb(var(--color-accent) / .45)}.kb-instrument__locks{display:none;align-items:center;gap:.7rem;padding:.35rem .8rem;border-radius:.75rem;border:1px solid rgb(var(--color-border) / .4);background:rgb(var(--color-surface-soft) / .5);height:2.125rem;flex-shrink:0}@media(min-width:1024px){.kb-instrument__locks{display:inline-flex}}.kb-instrument__lock{display:inline-flex;align-items:center;gap:.35rem;font-size:.5625rem;font-weight:500;letter-spacing:.07em;color:rgb(var(--color-ink-muted));transition:opacity .2s var(--kb-ease),filter .2s var(--kb-ease),color .2s var(--kb-ease)}.kb-instrument__lock:not(.is-on){opacity:.38;filter:grayscale(1)}.kb-instrument__lock-dot{width:.375rem;height:.375rem;border-radius:999px;background:rgb(var(--color-border));transition:background .2s var(--kb-ease),box-shadow .2s var(--kb-ease)}.kb-instrument__lock.is-on{opacity:1;filter:none;color:rgb(var(--color-ink))}.kb-instrument__lock.is-on .kb-instrument__lock-dot{background:rgb(var(--color-accent));box-shadow:0 0 8px rgb(var(--color-accent) / .6)}.kb-instrument__layout{display:inline-flex;align-items:center;gap:.12rem;padding:.18rem;border-radius:.75rem;background:rgb(var(--color-surface-soft) / .65);border:1px solid rgb(var(--color-border) / .4);flex-shrink:0;box-shadow:inset 0 1px #ffffff0a}.kb-instrument__layout-btn{display:inline-flex;align-items:center;justify-content:center;gap:.3rem;min-width:4.25rem;padding:.42rem .72rem;border-radius:.5rem;border:1px solid transparent;border-bottom:2px solid transparent;font-size:.6875rem;font-weight:600;color:rgb(var(--color-ink-muted));background:transparent;cursor:pointer;transition:color .14s var(--kb-ease),background .14s var(--kb-ease),border-color .14s var(--kb-ease),box-shadow .14s var(--kb-ease),transform .1s var(--kb-ease-snap);box-shadow:var(--kb-key-shadow),var(--kb-key-highlight)}@media(hover:hover)and (pointer:fine){.kb-instrument__layout-btn:hover:not([aria-pressed=true]){color:rgb(var(--color-ink));transform:translateY(-1px);border-bottom-color:rgb(var(--color-border) / .55);box-shadow:0 3px #00000024,inset 0 1px #ffffff14}}.kb-instrument__layout-btn[aria-pressed=true]{color:rgb(var(--color-ink));background:rgb(var(--color-surface-card));border-color:rgb(var(--color-accent) / .28);border-bottom-color:rgb(var(--color-accent) / .45);box-shadow:0 2px #0000001f,inset 0 1px #ffffff0f,0 0 0 1px rgb(var(--color-accent) / .12)}.kb-instrument__layout-btn:active{transform:translateY(1px);border-bottom-width:1px}.kb-instrument__controls{display:inline-flex;align-items:stretch;gap:.65rem;flex-shrink:0;padding:.35rem .5rem;border-radius:.65rem;border:1px solid rgb(var(--color-border) / .45);background:rgb(var(--color-surface-soft) / .55)}.kb-instrument__field{display:flex;flex-direction:column;justify-content:center;gap:.18rem;flex-shrink:0;min-width:0;padding:.15rem .35rem}.kb-instrument__field--picker{position:relative;min-width:7.25rem}.kb-instrument__field--os{min-width:0}.kb-instrument__field-label{font-size:.5rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgb(var(--color-ink-muted));line-height:1.2}.kb-instrument__picker{position:relative}.kb-instrument__picker-trigger{position:relative;display:flex;align-items:center;justify-content:space-between;gap:.45rem;width:100%;min-width:6.5rem;padding:.42rem 1.65rem .42rem .55rem;border-radius:.5rem;border:1px solid rgb(var(--color-border) / .45);border-bottom:2px solid rgb(var(--color-border) / .65);background:rgb(var(--color-surface-card));font-size:.75rem;font-weight:700;letter-spacing:.01em;color:rgb(var(--color-ink));cursor:pointer;text-align:left;box-shadow:var(--kb-key-shadow),var(--kb-key-highlight);transition:color .14s var(--kb-ease),border-color .14s var(--kb-ease),background .14s var(--kb-ease),box-shadow .14s var(--kb-ease),transform .1s var(--kb-ease-snap)}.kb-instrument__picker-trigger:after{content:"";position:absolute;right:.45rem;top:50%;transform:translateY(-50%);width:.7rem;height:.7rem;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:center;background-repeat:no-repeat;background-size:contain;transition:transform .14s var(--kb-ease)}.kb-instrument__picker-trigger[aria-expanded=true]:after{transform:translateY(-50%) rotate(180deg)}[data-theme=dark] .kb-instrument__picker-trigger:after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23cbd5e1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}@media(hover:hover)and (pointer:fine){.kb-instrument__picker-trigger:hover{color:rgb(var(--color-accent));border-color:rgb(var(--color-accent) / .35);border-bottom-color:rgb(var(--color-accent) / .5);transform:translateY(-1px);box-shadow:0 3px #00000024,inset 0 1px #ffffff14}}.kb-instrument__picker-trigger[aria-expanded=true]{color:rgb(var(--color-accent));border-color:rgb(var(--color-accent) / .35);border-bottom-color:rgb(var(--color-accent) / .5)}.kb-instrument__picker-trigger:focus-visible{outline:2px solid rgb(var(--color-accent) / .45);outline-offset:2px}.kb-instrument__picker-trigger:active{transform:translateY(1px);border-bottom-width:1px}.kb-instrument__picker-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kb-instrument__picker-menu{position:absolute;top:calc(100% + .35rem);left:0;z-index:30;min-width:100%;padding:.28rem;border-radius:.65rem;border:1px solid rgb(var(--color-border) / .55);background:rgb(var(--color-surface-card));box-shadow:0 10px 28px #00000038,0 0 0 1px rgb(var(--color-accent) / .06)}.kb-instrument__picker-menu:not([hidden]){display:flex;flex-direction:column;gap:.12rem}.kb-instrument__picker-option{display:flex;align-items:center;width:100%;padding:.45rem .55rem;border:1px solid transparent;border-radius:.45rem;background:transparent;font-size:.75rem;font-weight:600;color:rgb(var(--color-ink-muted));text-align:left;cursor:pointer;transition:color .12s var(--kb-ease),background .12s var(--kb-ease),border-color .12s var(--kb-ease)}@media(hover:hover)and (pointer:fine){.kb-instrument__picker-option:hover{color:rgb(var(--color-ink));background:rgb(var(--color-accent) / .08);border-color:rgb(var(--color-accent) / .12)}}.kb-instrument__picker-option[aria-selected=true]{color:rgb(var(--color-accent));background:rgb(var(--color-accent) / .12);border-color:rgb(var(--color-accent) / .22)}@media(max-width:899px){.kb-instrument__controls{flex-wrap:wrap;width:100%}.kb-instrument__field{flex:1 1 6.5rem;min-width:5.5rem}}.kb-instrument__lock--hidden{display:none!important}.kb-instrument__actions{display:inline-flex;align-items:center;gap:.35rem;flex-shrink:0}.kb-instrument__icon-btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:.75rem;border:1px solid rgb(var(--color-border) / .5);background:rgb(var(--color-surface-soft) / .55);color:rgb(var(--color-ink-muted));transition:color .14s var(--kb-ease),border-color .14s var(--kb-ease),background .14s var(--kb-ease),transform .1s var(--kb-ease)}@media(hover:hover)and (pointer:fine){.kb-instrument__icon-btn:hover{color:rgb(var(--color-ink));border-color:rgb(var(--color-accent) / .28);background:var(--kb-accent-soft)}.kb-instrument__icon-btn--reset:hover{color:#f43f5e;border-color:#f43f5e59;background:#f43f5e14}}.kb-instrument__icon-btn:active{transform:scale(.94)}.kb-instrument__stage{position:relative;padding:1.35rem 1.35rem 1.15rem;background:radial-gradient(ellipse 90% 70% at 50% 0%,rgb(var(--color-accent) / .07),transparent 65%),rgb(var(--color-surface-soft) / .2)}.kb-instrument__ambient{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 18% 22%,rgb(var(--color-accent) / .05),transparent 42%),radial-gradient(circle at 82% 78%,rgb(var(--color-accent-teal) / .04),transparent 38%);opacity:.9}.kb-focus-zone{position:relative;z-index:1;outline:none}.kb-focus-zone:focus-visible{outline:none}.kb-instrument__well{border-radius:var(--kb-radius-tray);border:1px solid rgb(var(--color-border) / .35);width:var(--kb-well-width);margin-inline:auto;box-sizing:border-box;overflow:hidden;background:linear-gradient(165deg,rgb(var(--color-surface-card) / .55),rgb(var(--color-surface-soft) / .35)),repeating-linear-gradient(90deg,rgb(var(--color-border) / .04) 0,rgb(var(--color-border) / .04) 1px,transparent 1px,transparent 24px),repeating-linear-gradient(0deg,rgb(var(--color-border) / .04) 0,rgb(var(--color-border) / .04) 1px,transparent 1px,transparent 24px);box-shadow:inset 0 2px 16px #0000001f,inset 0 1px #ffffff0a;padding:1.15rem 1.1rem;min-height:var(--kb-well-min-height);transition:width var(--kb-layout-switch-ms) ease,border-color .28s var(--kb-ease),box-shadow .28s var(--kb-ease)}[data-theme=light] .kb-instrument__well{box-shadow:inset 0 2px 12px #0000000a,inset 0 1px #fffc}[data-keyboard-test][data-active=true] .kb-instrument__well{border-color:rgb(var(--color-accent) / .18);box-shadow:inset 0 2px 16px #0000001f,inset 0 0 0 1px rgb(var(--color-accent) / .06),0 0 32px rgb(var(--color-accent) / .04)}[data-keyboard-test][data-active=false] .kb-instrument__well{opacity:.82;filter:saturate(.85)}.kb-board{position:relative;flex-shrink:0;align-self:flex-start;--gap: .375rem;--u: calc(var(--kb-board-width) / var(--total));width:calc(var(--total) * var(--u));height:calc(var(--rows) * var(--u));min-height:calc(var(--rows) * var(--u));max-height:calc(var(--rows) * var(--u))}.kb-key{position:absolute;box-sizing:border-box;left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u));width:calc(var(--w) * var(--u) - var(--gap));height:calc(var(--h) * var(--u) - var(--gap));display:inline-flex;align-items:center;justify-content:center;padding:.12rem .08rem;border-radius:var(--kb-key-radius);border:none;border-bottom:2px solid transparent;font-family:var(--font-mono, ui-monospace, monospace);font-size:clamp(.4375rem,calc(var(--u) * .24),.8125rem);font-weight:500;line-height:1;letter-spacing:-.02em;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:default;transition:background-color 70ms var(--kb-ease),border-color 70ms var(--kb-ease),color 70ms var(--kb-ease),box-shadow 70ms var(--kb-ease),transform 70ms var(--kb-ease-snap);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.kb-key[data-tier=nav]{background:var(--kb-nav-bg);color:rgb(var(--color-ink-muted));border-bottom-color:var(--kb-nav-border);box-shadow:var(--kb-key-shadow),var(--kb-key-highlight);font-size:clamp(.375rem,calc(var(--u) * .2),.625rem);padding:.1rem .06rem}@media(hover:hover)and (pointer:fine){.kb-key:not([data-pressed=true]):hover{transform:translateY(-1px);border-bottom-width:3px;filter:brightness(1.05);box-shadow:0 4px #00000029,var(--kb-key-highlight),0 6px 14px #0000001f;cursor:pointer}.kb-key[data-tier=mod]:not([data-pressed=true]):hover{border-bottom-color:var(--kb-mod-border)}.kb-key[data-tier=alpha]:not([data-pressed=true]):hover{border-bottom-color:var(--kb-alpha-border)}.kb-key[data-tier=nav]:not([data-pressed=true]):hover{border-bottom-color:var(--kb-nav-border)}}.kb-key:before{content:"";position:absolute;inset:1px 1px auto;height:38%;border-radius:calc(var(--kb-key-radius) - 1px) calc(var(--kb-key-radius) - 1px) 0 0;background:linear-gradient(180deg,rgb(255 255 255 / .09),transparent);pointer-events:none;opacity:.7}[data-theme=light] .kb-key:before{background:linear-gradient(180deg,rgb(255 255 255 / .65),transparent);opacity:.55}@media(min-width:768px){[data-keyboard-test]{--kb-board-min-height: 19.75rem}}.kb-key[data-tier=mod]{background:var(--kb-mod-bg);color:rgb(var(--color-ink-muted));border-bottom-color:var(--kb-mod-border);box-shadow:var(--kb-key-shadow),var(--kb-key-highlight)}.kb-key[data-tier=alpha]{background:var(--kb-alpha-bg);color:rgb(var(--color-ink));border-bottom-color:var(--kb-alpha-border);box-shadow:var(--kb-key-shadow),var(--kb-key-highlight)}.kb-key[data-tested=true]:not([data-pressed=true]){background:rgb(var(--color-accent) / .16);color:rgb(var(--color-accent-soft));border-bottom-color:rgb(var(--color-accent) / .4);box-shadow:var(--kb-key-shadow),0 0 0 1px rgb(var(--color-accent) / .12) inset}[data-theme=dark] .kb-key[data-tested=true]:not([data-pressed=true]){color:rgb(var(--color-accent))}.kb-key[data-pressed=true]{transform:translateY(2px);border-bottom-width:1px;color:rgb(var(--color-ink));filter:brightness(.94);box-shadow:inset 0 3px 10px #0003,inset 0 1px #ffffff0d,0 1px rgb(var(--color-border) / .35)}.kb-key[data-tier=mod][data-pressed=true]{background:var(--kb-mod-bg);border-color:var(--kb-mod-border)}.kb-key[data-tier=alpha][data-pressed=true]{background:var(--kb-alpha-bg);border-color:var(--kb-alpha-border)}.kb-key[data-tier=nav][data-pressed=true]{background:var(--kb-nav-bg);border-color:var(--kb-nav-border)}.kb-key[data-pressed=true]:before{opacity:0}.kb-instrument__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 1.5rem;padding:.9rem 1.35rem 1rem;border-top:1px solid rgb(var(--color-border) / .35);background:linear-gradient(180deg,rgb(var(--color-surface-soft) / .15),transparent)}.kb-instrument__legend{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.35rem}.kb-instrument__legend-item{display:inline-flex;align-items:center;gap:.45rem;font-size:.625rem;font-weight:500;color:rgb(var(--color-ink-muted))}.kb-instrument__legend-swatch{width:.75rem;height:.75rem;border-radius:.2rem;border:1px solid rgb(var(--color-border) / .55);flex-shrink:0}.kb-instrument__legend-swatch--untested{background:var(--kb-alpha-bg);box-shadow:var(--kb-key-shadow)}.kb-instrument__legend-swatch--tested{background:rgb(var(--color-accent) / .16);border-color:rgb(var(--color-accent) / .4);box-shadow:0 0 8px rgb(var(--color-accent) / .2)}.kb-instrument__legend-swatch--pressed{background:var(--kb-alpha-bg);border-color:rgb(var(--color-border) / .55);box-shadow:inset 0 2px 4px #0000002e;transform:translateY(1px)}.kb-instrument__hint{display:inline-flex;align-items:center;gap:.35rem;margin:0;font-size:.625rem;font-weight:500;color:rgb(var(--color-ink-muted));line-height:1.3}.kb-instrument__hint-key{display:inline-flex;align-items:center;justify-content:center;min-width:1.35rem;padding:.1rem .3rem;border-radius:.25rem;border:1px solid rgb(var(--color-border) / .55);background:rgb(var(--color-surface-soft));font-family:var(--font-mono, ui-monospace, monospace);font-size:.5625rem;font-weight:500;letter-spacing:.02em;color:rgb(var(--color-ink));box-shadow:0 1px rgb(var(--color-ink) / .06)}@media(prefers-reduced-motion:reduce){.kb-instrument__progress-fill,.kb-key,.kb-instrument__lock,.kb-instrument__lock-dot{transition-duration:.01ms;animation:none}}.kb-board-stack{position:relative;width:100%;min-height:var(--kb-board-min-height)}.kb-board-panel{opacity:0;visibility:hidden;pointer-events:none;transform:scale(.985);transition:opacity var(--kb-layout-switch-ms) ease,transform var(--kb-layout-switch-ms) ease,visibility 0s linear var(--kb-layout-switch-ms)}.kb-board-panel[data-active=false]{position:absolute;top:0;left:0;right:0;z-index:0;display:none}.kb-board-panel[data-active=true]{position:relative;z-index:1;opacity:1;visibility:visible;pointer-events:auto;transform:scale(1);min-height:var(--kb-board-min-height);display:flex;justify-content:center;align-items:flex-start;transition:opacity var(--kb-layout-switch-ms) ease,transform var(--kb-layout-switch-ms) ease,visibility 0s linear 0s}.kb-board-panel .kb-board{width:var(--kb-board-width);min-width:var(--kb-board-width);margin-inline:auto}[data-keyboard-test][data-kb-form=full] .kb-board-panel[data-active=true]{width:100%}[data-keyboard-test][data-kb-form=full] .kb-board-panel .kb-board{width:100%;min-width:var(--kb-board-width)}.kb-board-panel[data-kb-form-panel="65"] .kb-board,.kb-board-panel[data-kb-form-panel="70"] .kb-board,.kb-board-panel[data-kb-form-panel="75"] .kb-board,.kb-board-panel[data-kb-form-panel=tkl] .kb-board,.kb-board-panel[data-kb-form-panel=full] .kb-board{align-items:stretch;min-height:var(--kb-board-min-height)}.kb-board-panel[data-kb-form-panel="70"] .kb-side--split,.kb-board-panel[data-kb-form-panel="75"] .kb-side--split,.kb-board-panel[data-kb-form-panel=tkl] .kb-side--split,.kb-board-panel[data-kb-form-panel=full] .kb-side--split{margin-left:0}.kb-nav--arrows-only{min-width:0;width:calc(3 * var(--kb-key-arrow-size) + 2 * var(--kb-key-gap))}@media(prefers-reduced-motion:reduce){[data-keyboard-test]{--kb-layout-switch-ms: 1ms}.kb-instrument__well{transition:border-color .28s var(--kb-ease),box-shadow .28s var(--kb-ease)}.kb-board-panel{transform:none;transition:opacity .16s ease,visibility 0s linear .16s}.kb-board-panel[data-active=true]{transform:none;transition:opacity .16s ease,visibility 0s linear 0s}}[data-keyboard-test][data-kb-theme=graphite],[data-kb-swatch=graphite]{--kb-case: #1b1d21;--kb-alpha-bg: #2c2f35;--kb-alpha-border: #17191c;--kb-mod-bg: #3c4048;--kb-mod-border: #23262b;--kb-nav-bg: #3c4048;--kb-nav-border: #23262b;--kb-legend: #e7e9ec;--kb-legend-mod: #b4bac3;--kb-accent-key: #4ade80}[data-keyboard-test][data-kb-theme=linen],[data-kb-swatch=linen]{--kb-case: #d6ccb9;--kb-alpha-bg: #f2ebdb;--kb-alpha-border: #cdc0a6;--kb-mod-bg: #b6aa93;--kb-mod-border: #928670;--kb-nav-bg: #b6aa93;--kb-nav-border: #928670;--kb-legend: #3b3327;--kb-legend-mod: #2c251b;--kb-accent-key: #b8563a}[data-keyboard-test][data-kb-theme=arctic],[data-kb-swatch=arctic]{--kb-case: #dce5ef;--kb-alpha-bg: #fbfdff;--kb-alpha-border: #ccd7e5;--kb-mod-bg: #c8d5e6;--kb-mod-border: #a6b7cd;--kb-nav-bg: #c8d5e6;--kb-nav-border: #a6b7cd;--kb-legend: #22314a;--kb-legend-mod: #22314a;--kb-accent-key: #3b82f6}[data-keyboard-test][data-kb-theme=matcha],[data-kb-swatch=matcha]{--kb-case: #cddfc3;--kb-alpha-bg: #f3f8ee;--kb-alpha-border: #c3d7b6;--kb-mod-bg: #8db17c;--kb-mod-border: #6b8f5b;--kb-nav-bg: #8db17c;--kb-nav-border: #6b8f5b;--kb-legend: #2a4120;--kb-legend-mod: #f6faf2;--kb-accent-key: #5c8a4a}[data-keyboard-test][data-kb-theme=ember],[data-kb-swatch=ember]{--kb-case: #261a15;--kb-alpha-bg: #3a2a22;--kb-alpha-border: #20140e;--kb-mod-bg: #c4623a;--kb-mod-border: #974726;--kb-nav-bg: #4a362c;--kb-nav-border: #2b1d16;--kb-legend: #f5e6da;--kb-legend-mod: #fff4ec;--kb-accent-key: #e9a15b}[data-kb-swatch=studio]{--kb-case: rgb(var(--color-surface-soft));--kb-alpha-bg: rgb(var(--color-surface-card));--kb-mod-bg: rgb(var(--color-hairline));--kb-accent-key: rgb(var(--color-accent))}[data-keyboard-test][data-kb-theme]:not([data-kb-theme=studio]) .kb-instrument__well{background:var(--kb-case);border-color:#0000002e}[data-keyboard-test][data-kb-theme]:not([data-kb-theme=studio]) .kb-key[data-tier=alpha]{color:var(--kb-legend)}[data-keyboard-test][data-kb-theme]:not([data-kb-theme=studio]) .kb-key[data-tier=mod],[data-keyboard-test][data-kb-theme]:not([data-kb-theme=studio]) .kb-key[data-tier=nav]{color:var(--kb-legend-mod)}[data-keyboard-test][data-kb-theme]:not([data-kb-theme=studio]) .kb-key[data-code=Escape]:not([data-tested=true]),[data-keyboard-test][data-kb-theme]:not([data-kb-theme=studio]) .kb-key[data-code=Enter]:not([data-tested=true]){background:var(--kb-accent-key);color:#fff}.kb-instrument__tools{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem}.kb-region{position:relative}.kb-region__trigger{display:inline-flex;align-items:center;gap:.4rem;min-height:2rem;padding:0 .7rem;border:1px solid rgb(var(--color-border) / .7);border-radius:.55rem;font-family:var(--font-mono, ui-monospace, monospace);font-size:.75rem;font-weight:650;color:rgb(var(--color-ink));cursor:pointer;list-style:none}.kb-region__trigger::-webkit-details-marker{display:none}.kb-region__trigger svg{transform:rotate(-90deg);transition:transform .14s cubic-bezier(.2,.7,.2,1)}.kb-region[open] .kb-region__trigger{border-color:rgb(var(--color-accent) / .6)}.kb-region[open] .kb-region__trigger svg{transform:rotate(90deg)}.kb-region__trigger:focus-visible{outline:2px solid rgb(var(--color-accent) / .8);outline-offset:2px}.kb-region__menu{position:absolute;z-index:20;bottom:calc(100% + .4rem);left:0;display:grid;grid-template-columns:auto auto;align-items:center;gap:.45rem .75rem;padding:.7rem .8rem;border:1px solid rgb(var(--color-border) / .7);border-radius:.75rem;background:rgb(var(--color-surface-card));box-shadow:0 12px 32px #00000040}.kb-region__label{font-size:.75rem;color:rgb(var(--color-muted))}.kb-region__seg{display:inline-flex;padding:2px;border:1px solid rgb(var(--color-border) / .6);border-radius:.5rem}.kb-region__seg button{min-width:3rem;height:1.75rem;padding:0 .55rem;border:0;border-radius:.35rem;background:transparent;font-family:var(--font-mono, ui-monospace, monospace);font-size:.6875rem;font-weight:650;color:rgb(var(--color-body));cursor:pointer}.kb-region__seg button[aria-pressed=true]{background:rgb(var(--color-accent) / .16);color:rgb(var(--color-accent))}.kb-region__seg button:focus-visible,.kb-swatch:focus-visible{outline:2px solid rgb(var(--color-accent) / .8);outline-offset:2px}.kb-themes{display:inline-flex;align-items:center;gap:.35rem}.kb-themes__label{margin-right:.15rem;font-size:.75rem;color:rgb(var(--color-muted))}.kb-swatch{display:inline-flex;flex-direction:column;gap:1px;width:3.1rem;padding:3px;border:1px solid rgb(var(--color-border) / .6);border-radius:.4rem;background:var(--kb-case);cursor:pointer}.kb-swatch[aria-checked=true]{border-color:rgb(var(--color-accent));box-shadow:0 0 0 2px rgb(var(--color-accent) / .35)}.kb-swatch__row{display:flex;gap:1px}.kb-swatch__k{flex:1 1 0;height:4px;border-radius:1px;background:var(--kb-alpha-bg)}.kb-swatch__k--m{background:var(--kb-mod-bg)}.kb-swatch__k--x{background:var(--kb-accent-key)}.kb-swatch__k--s{background:var(--kb-alpha-bg)}.kbp{display:grid;gap:.75rem;margin-top:.85rem}@media(min-width:1024px){.kbp{grid-template-columns:.9fr 1fr 1.1fr}}.kbp-card{display:flex;flex-direction:column;gap:.7rem;min-width:0;padding:.95rem 1rem;border:1px solid rgb(var(--color-border) / .5);border-radius:.9rem;background:rgb(var(--color-surface-card))}.kbp-card__head{display:flex;align-items:center;justify-content:space-between}.kbp-card__title{margin:0;font-family:var(--font-display);font-size:.9375rem;font-weight:700;color:rgb(var(--color-ink))}.kbp-card__badge{font-family:var(--font-mono, ui-monospace, monospace);font-size:.6875rem;color:rgb(var(--color-muted))}.kbp-card__foot{margin:auto 0 0;padding-top:.55rem;border-top:1px solid rgb(var(--color-border) / .35);font-size:.75rem;color:rgb(var(--color-muted))}.kbp-progress__top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.75rem}.kbp-progress__n{margin:0;font-family:var(--font-display);font-size:2.4rem;font-weight:800;line-height:1;color:rgb(var(--color-accent))}.kbp-progress__of{margin:0;font-size:.8125rem;color:rgb(var(--color-body))}.kbp-ring{--kbp-pct: 0;display:grid;place-items:center;width:3.1rem;height:3.1rem;border-radius:50%;background:radial-gradient(closest-side,rgb(var(--color-surface-card)) 76%,transparent 78%),conic-gradient(rgb(var(--color-accent)) calc(var(--kbp-pct) * 1%),rgb(var(--color-border) / .5) 0)}.kbp-ring b{font-size:.6875rem;font-weight:700;color:rgb(var(--color-ink))}.kbp-groups{display:grid;gap:.55rem}.kbp-group__head{display:flex;justify-content:space-between;margin:0 0 .25rem;font-size:.75rem;color:rgb(var(--color-body))}.kbp-group__head b{font-variant-numeric:tabular-nums;font-weight:650;color:rgb(var(--color-muted))}.kbp-group__cells{display:flex;flex-wrap:wrap;gap:3px}.kbp-group__cells i{width:.55rem;height:.55rem;border-radius:2px;background:rgb(var(--color-border) / .55)}.kbp-group__cells i[data-tested=true]{background:rgb(var(--color-accent))}.kbp-current{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.9rem}.kbp-current__cap{display:grid;place-items:center;min-width:3.6rem;height:3.6rem;padding:0 .5rem;border-radius:.7rem;border-bottom:3px solid rgb(var(--color-accent) / .55);background:rgb(var(--color-accent) / .14);font-family:var(--font-mono, ui-monospace, monospace);font-size:.9375rem;font-weight:700;color:rgb(var(--color-accent))}.kbp[data-kbp-live=false] .kbp-current__cap{border-bottom-color:rgb(var(--color-border) / .6);background:rgb(var(--color-surface-soft));color:rgb(var(--color-muted))}.kbp-current__facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem .9rem;margin:0}.kbp-current__facts dt{font-size:.6875rem;color:rgb(var(--color-muted))}.kbp-current__facts dd{margin:0;overflow:hidden;font-family:var(--font-mono, ui-monospace, monospace);font-size:.8125rem;font-weight:650;color:rgb(var(--color-ink));text-overflow:ellipsis;white-space:nowrap}.kbp-meter{display:grid;gap:.3rem}.kbp-meter__head{display:flex;justify-content:space-between;margin:0;font-size:.75rem;color:rgb(var(--color-body))}.kbp-meter__head b{color:rgb(var(--color-ink))}.kbp-meter__track{position:relative;height:.5rem;border-radius:999px;background:rgb(var(--color-border) / .45);overflow:hidden}.kbp-meter__fill{position:absolute;inset:0 auto 0 0;width:0;border-radius:inherit;background:rgb(var(--color-accent))}.kbp-meter__scale{display:flex;justify-content:space-between;margin:0;font-size:.625rem;color:rgb(var(--color-muted))}.kbp-sim{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:3px}.kbp-sim i{height:.45rem;border-radius:2px;background:rgb(var(--color-border) / .45)}.kbp-sim i[data-on=max]{background:rgb(var(--color-accent) / .35)}.kbp-sim i[data-on=now]{background:rgb(var(--color-accent))}.kbp-log{display:grid;gap:.25rem;margin:0;padding:0;list-style:none}.kbp-log__empty{padding:1.25rem 0;font-size:.8125rem;color:rgb(var(--color-muted));text-align:center}.kbp-log__row{display:grid;grid-template-columns:4.25rem minmax(0,1fr) 5rem 3.75rem;align-items:center;gap:.6rem;padding:.3rem 0;border-bottom:1px solid rgb(var(--color-border) / .3);font-size:.75rem}.kbp-log__row kbd{overflow:hidden;padding:.15rem .35rem;border:1px solid rgb(var(--color-border) / .7);border-radius:.35rem;font-family:var(--font-mono, ui-monospace, monospace);font-size:.6875rem;text-align:center;text-overflow:ellipsis;white-space:nowrap;color:rgb(var(--color-ink))}.kbp-log__code{overflow:hidden;font-family:var(--font-mono, ui-monospace, monospace);color:rgb(var(--color-body));text-overflow:ellipsis;white-space:nowrap}.kbp-log__bar{position:relative;height:.35rem;border-radius:999px;background:rgb(var(--color-border) / .4);overflow:hidden}.kbp-log__bar:after{content:"";position:absolute;inset:0;border-radius:inherit;background:rgb(var(--color-accent));transform:scaleX(var(--kbp-fill, 0));transform-origin:left center}.kbp-log__ms{font-variant-numeric:tabular-nums;text-align:right;color:rgb(var(--color-ink))}@media(prefers-reduced-motion:reduce){.kb-region__trigger svg{transition:none}}[data-keyboard-test] .kb-key[data-pressed=true][data-tier]{background:rgb(var(--color-warning))!important;border-bottom-color:rgb(var(--color-warning) / .7)!important;color:#1c1405!important;filter:none}.kb-instrument__legend-swatch--pressed{background:rgb(var(--color-warning));border-color:rgb(var(--color-warning) / .7)}