:root{--bg:#0d0f12;--panel:#15181d;--panel-2:#1b1f25;--border:#2a3038;--text:#f4f6f8;--muted:#929aa5;--accent:#8dfc96;--accent-strong:#5ff16d;--key:#232831;--key-border:#343b46;--key-tested:#173a20;--key-tested-border:#57dc68;--key-pressed:#9afca2;--key-pressed-text:#0d2212;--radius:22px;--key-size:52px;--gap:7px;--cluster-separation:18px}*{box-sizing:border-box}html{background:var(--bg)}body{background:radial-gradient(circle at 50% -10%, #75ff8514, transparent 34rem), var(--bg);min-height:100vh;color:var(--text);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,a{font:inherit}button{color:inherit}.page-shell{width:min(1480px,100% - 36px);margin:0 auto;padding-bottom:64px}.topbar{border-bottom:1px solid #ffffff12;justify-content:space-between;align-items:center;height:74px;display:flex}.brand{color:var(--text);letter-spacing:-.03em;align-items:center;gap:10px;font-size:20px;font-weight:780;text-decoration:none;display:inline-flex}.brand-mark{background:var(--accent);color:#0b170d;border-radius:9px;place-items:center;width:31px;height:31px;font-size:17px;display:grid}.tagline{color:var(--muted);font-size:13px}.hero{text-align:center;padding:64px 0 34px}.eyebrow{color:var(--accent);letter-spacing:.16em;margin:0 0 13px;font-size:12px;font-weight:800}h1{letter-spacing:-.055em;margin:0;font-size:clamp(36px,5vw,68px);line-height:.98}.hero-copy{max-width:620px;color:var(--muted);margin:17px auto 0;font-size:clamp(15px,1.4vw,18px)}.tester-card{border:1px solid var(--border);background:linear-gradient(180deg, #ffffff06, transparent 28%), var(--panel);border-radius:var(--radius);padding:18px;box-shadow:0 24px 80px #00000052}.toolbar{justify-content:space-between;align-items:center;gap:20px;margin-bottom:12px;display:flex}.layout-switcher{border:1px solid var(--border);scrollbar-width:none;background:#0f1216;border-radius:12px;gap:4px;padding:4px;display:flex;overflow-x:auto}.layout-switcher::-webkit-scrollbar{display:none}.tester-options{align-items:center;gap:10px;display:flex}.layout-picker{align-items:center;gap:8px;display:flex}.layout-search{z-index:20;position:relative}.layout-search-field{border:1px solid var(--border);color:#68717d;background:#0f1216;border-radius:12px;align-items:center;gap:7px;width:180px;height:45px;padding:0 11px;transition:border-color .12s,box-shadow .12s;display:flex}.layout-search-field:focus-within{border-color:#4b555f;box-shadow:0 0 0 3px #8dfc9612}.search-icon{color:var(--accent);font-size:18px;line-height:1;transform:translateY(-1px)}.layout-search-field input{width:100%;min-width:0;color:var(--text);font:inherit;background:0 0;border:0;outline:0;padding:0;font-size:12px}.layout-search-field input::placeholder{color:#707985}.layout-search-field input::-webkit-search-cancel-button{filter:invert(.7)}.layout-results{background:#111419;border:1px solid #343b46;border-radius:14px;width:365px;max-height:min(480px,62vh);padding:8px;position:absolute;top:calc(100% + 8px);right:0;overflow-y:auto;box-shadow:0 24px 60px #0000008c}.layout-result-group+.layout-result-group{border-top:1px solid #ffffff0f;margin-top:8px;padding-top:8px}.layout-result-group h3{color:#7c8590;letter-spacing:.12em;text-transform:uppercase;margin:4px 8px 6px;font-size:9px;font-weight:800}.layout-result{width:100%;color:var(--text);cursor:pointer;text-align:left;background:0 0;border:0;border-radius:9px;grid-template-columns:35px 1fr auto;align-items:center;gap:10px;padding:8px;display:grid}.layout-result:hover,.layout-result:focus-visible{background:#1d2229;outline:0}.layout-result.active{background:#8dfc9612}.result-code{width:35px;height:31px;color:var(--accent);border:1px solid #333a44;border-radius:8px;place-items:center;font-size:10px;font-weight:800;display:grid}.layout-result strong,.layout-result small{display:block}.layout-result strong{font-size:12px}.layout-result small{color:#747d88;margin-top:2px;font-size:9px}.selected-check{color:var(--accent);padding-right:4px;font-size:13px}.layout-empty{color:var(--muted);text-align:center;margin:0;padding:22px 12px;font-size:12px}.mode-switcher{border:1px solid var(--border);background:#0f1216;border-radius:12px;gap:4px;padding:4px;display:flex}.layout-pill,.mode-button,.test-mode-button,.utility-button,.fullscreen-button,.reset-button{cursor:pointer;border:0;transition:all .12s}.mode-button{color:var(--muted);white-space:nowrap;background:0 0;border-radius:8px;padding:9px 11px;font-size:12px;font-weight:720}.mode-button:hover{color:var(--text)}.mode-button.active{background:var(--panel-2);color:var(--text)}.mode-button.active .mode-plus{color:var(--accent)}.mode-plus{color:#68717d;font-weight:900}.layout-pill{min-width:50px;color:var(--muted);background:0 0;border-radius:8px;flex:none;padding:9px 13px;font-size:12px;font-weight:760}.layout-pill:hover{color:var(--text)}.layout-pill.active{background:var(--panel-2);color:var(--accent)}.layout-pill:focus-visible,.mode-button:focus-visible,.test-mode-button:focus-visible,.utility-button:focus-visible,.fullscreen-button:focus-visible,.reset-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.toolbar-right{align-items:center;gap:15px;display:flex}.configuration-row{border-top:1px solid #ffffff0e;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px;padding-top:11px;display:flex}.test-tools,.test-mode-switcher{align-items:center;display:flex}.test-tools{gap:8px}.test-mode-switcher{border:1px solid var(--border);background:#0f1216;border-radius:10px;gap:3px;padding:3px}.test-mode-button{color:var(--muted);background:0 0;border-radius:7px;padding:7px 11px;font-size:11px;font-weight:720}.test-mode-button.active{background:var(--panel-2);color:var(--accent)}.utility-button,.fullscreen-button{color:#b9c0c8;background:#20252c;border:1px solid #353c46;border-radius:10px;font-size:11px;font-weight:700}.utility-button{padding:9px 12px}.utility-button.active{color:var(--accent);background:#18331e;border-color:#4e8e59}.fullscreen-button{align-items:center;gap:6px;padding:8px 11px;display:inline-flex}.fullscreen-button span{color:var(--accent);font-size:14px}.utility-button:hover,.fullscreen-button:hover{color:var(--text);background:#2a3038}.counter{color:var(--muted);align-items:baseline;gap:4px;font-size:13px;display:flex}.counter strong{color:var(--text);font-size:19px}.counter small{margin-left:3px}.counter em{color:#7e8792;white-space:nowrap;border-left:1px solid #353c46;margin-left:5px;padding-left:8px;font-size:9px;font-style:normal}.reset-button{background:#252a31;border:1px solid #353c46;border-radius:10px;padding:9px 15px;font-weight:700}.reset-button:hover{background:#2b3139}.layout-meta{color:var(--muted);align-items:center;gap:9px;margin-bottom:14px;font-size:12px;display:flex}.remaining-label{color:#7c8590;font-variant-numeric:tabular-nums;margin-left:auto}.layout-group-label{color:#707985}.layout-group-label:before{content:"·";color:#444c56;margin-right:9px}.shape-badge{color:#cdd2d8;border:1px solid var(--border);letter-spacing:.08em;border-radius:999px;padding:3px 7px;font-size:10px}.fn-test-control{color:#aab2bc;cursor:pointer;background:#ffffff06;border:1px dashed #47515d;border-radius:999px;min-height:24px;padding:3px 9px;font-size:10px;font-weight:700;transition:border-color .12s,background .12s,color .12s}.fn-test-control:hover,.fn-test-control:focus-visible{border-color:var(--accent);color:var(--text);outline:0}.fn-test-control.armed{color:#ffd89a;background:#302619;border-style:solid;border-color:#d49a42;animation:.9s ease-in-out infinite alternate fn-test-pulse}.fn-test-control.confirmed{border-style:solid;border-color:var(--key-tested-border);background:var(--key-tested);color:#b7ffc0}@keyframes fn-test-pulse{0%{box-shadow:0 0 #d49a420f}to{box-shadow:0 0 0 4px #d49a4224}}.keyboard-wrap{scrollbar-color:#343b46 transparent;scrollbar-width:thin;background:#101318;border:1px solid #ffffff0b;border-radius:16px;padding:14px;overflow-x:auto}.keyboard{-webkit-user-select:none;user-select:none;width:max-content}.keyboard-stage{align-items:flex-start;gap:0;width:max-content;margin:0 auto;display:flex}.keyboard-row{height:var(--key-size);align-items:flex-start;gap:var(--gap);margin-bottom:var(--gap);display:flex;position:relative}.key,.key-spacer{flex:none}.key{--key-face:var(--key);--key-edge:var(--key-border);height:var(--key-size);border:1px solid var(--key-edge);background:var(--key-face);color:#e9edf1;border-bottom-width:3px;border-radius:9px;justify-content:flex-start;align-items:flex-end;padding:8px;font-size:12px;font-weight:680;transition:transform 55ms,background 90ms,border-color 90ms,color 90ms;display:flex;position:relative;box-shadow:inset 0 1px #ffffff06}.key.tested{--key-face:var(--key-tested);--key-edge:var(--key-tested-border);background:var(--key-face);border-color:var(--key-edge);color:#b7ffc0}.key.pressed{--key-face:var(--key-pressed);--key-edge:var(--key-pressed);background:var(--key-face);border-color:var(--key-edge);color:var(--key-pressed-text);transform:translateY(2px)}.key.iso-enter{height:calc(var(--key-size) * 2 + var(--gap));z-index:4;box-shadow:none;background:0 0;border:0;padding-left:21px}.key.iso-enter:before,.key.iso-enter:after{content:"";border-radius:inherit;pointer-events:none;position:absolute}.key.iso-enter:before{background:var(--key-edge);clip-path:polygon(0 0,100% 0,100% 100%,18% 100%,18% 46.85%,0 46.85%);inset:0}.key.iso-enter:after{background:var(--key-face);clip-path:polygon(0 0,100% 0,100% 100%,18.5% 100%,18.5% 48.6%,0 48.6%);inset:1px 1px 3px;box-shadow:inset 0 1px #ffffff06}.key.iso-enter>*{z-index:1;position:relative}.key.untested-emphasis{--key-edge:#d49a42;--key-face:#302619;color:#ffd89a;background:#302619;border-color:#d49a42;box-shadow:0 0 0 1px #ffb84c14,inset 0 1px #ffffff08}.key.possible-stuck{--key-edge:#ff6868;--key-face:#481d22;color:#ffd0d0;background:#481d22;border-color:#ff6868;animation:.9s ease-in-out infinite alternate warning-pulse}.key.possible-chatter:not(.possible-stuck){border-color:#ffb24c;box-shadow:0 0 0 1px #ffb24c33}.key.not-testable{opacity:.48;border-style:dashed}.key.optional-key{border-style:dashed}.key.optional-key .key-sub{color:var(--accent);opacity:.8}.key.fn-test-trigger{cursor:pointer}.key.fn-test-trigger:hover,.key.fn-test-trigger:focus-visible{--key-edge:#71808f;outline:0;box-shadow:0 0 0 3px #8dfc9614,inset 0 1px #ffffff06}.key.fn-test-armed{--key-face:#302619;--key-edge:#d49a42;background:var(--key-face);border-color:var(--key-edge);color:#ffd89a;transform:translateY(2px);box-shadow:0 0 0 3px #d49a421f}@keyframes warning-pulse{0%{box-shadow:0 0 #ff68680d}to{box-shadow:0 0 0 5px #ff686821}}.press-count{min-width:15px;height:15px;color:var(--accent);background:#8dfc961f;border-radius:999px;place-items:center;padding-inline:3px;font-size:8px;line-height:1;display:grid;position:absolute;top:5px;left:6px}.desktop-cluster-panel{opacity:0;visibility:hidden;flex:none;width:0;max-width:0;transition:width .24s cubic-bezier(.2,.8,.2,1),max-width .24s cubic-bezier(.2,.8,.2,1),opacity .17s,transform .24s cubic-bezier(.2,.8,.2,1),visibility 0s linear .24s;overflow:hidden;transform:translate(22px)}.desktop-cluster-panel.visible{opacity:1;visibility:visible;width:188px;max-width:188px;transition-delay:0s;transform:translate(0)}.desktop-cluster{grid-template-columns:repeat(3, var(--key-size));grid-template-rows:repeat(6, var(--key-size));gap:var(--gap);width:188px;padding-left:var(--cluster-separation);display:grid}.desktop-key{width:auto;height:auto;padding:6px;font-size:9px}.numpad-panel{opacity:0;visibility:hidden;flex:none;width:0;max-width:0;transition:width .26s cubic-bezier(.2,.8,.2,1),max-width .26s cubic-bezier(.2,.8,.2,1),opacity .18s,transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s linear .26s;overflow:hidden;transform:translate(28px)}.numpad-panel.visible{opacity:1;visibility:visible;width:247px;max-width:247px;transition-delay:0s;transform:translate(0)}.numpad{grid-template-columns:repeat(4, var(--key-size));grid-template-rows:repeat(5, var(--key-size));gap:var(--gap);width:247px;padding-left:var(--cluster-separation);margin-top:calc(var(--key-size) + var(--gap));display:grid}.numpad-key{width:auto;height:auto}.numpad-key[data-code=NumpadAdd],.numpad-key[data-code=NumpadEnter]{align-items:center}.key-main{line-height:1}.key-sub{opacity:.65;font-size:9px;font-weight:600;position:absolute;top:6px;right:7px}.completion-banner{background:linear-gradient(90deg,#2e823a33,#2e823a0f);border:1px solid #3c8f4a;border-radius:12px;align-items:center;gap:10px;margin-top:12px;padding:11px 13px;display:flex}.completion-mark{background:var(--accent);color:#102214;border-radius:50%;place-items:center;width:28px;height:28px;font-weight:900;display:grid}.completion-banner strong,.completion-banner small{display:block}.completion-banner strong{font-size:13px}.completion-banner small{color:#94aa99;margin-top:2px;font-size:10px}.advanced-panel{background:#111419;border:1px solid #303842;border-radius:14px;grid-template-columns:minmax(420px,.9fr) 1.1fr;gap:14px;margin-top:12px;padding:12px;animation:.18s ease-out panel-in;display:grid}@keyframes panel-in{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.advanced-stats{grid-template-columns:repeat(5,1fr);gap:6px;display:grid}.advanced-stats>div{background:#181c22;border:1px solid #ffffff0e;border-radius:10px;min-width:0;padding:9px}.advanced-stats strong,.advanced-stats span{display:block}.advanced-stats strong{color:var(--text);font-variant-numeric:tabular-nums;font-size:18px}.advanced-stats span{color:#7f8893;text-transform:uppercase;letter-spacing:.06em;margin-top:3px;font-size:8px;line-height:1.25}.advanced-stats .stat-alert{background:#2a2118;border-color:#8a572f}.advanced-stats .stat-alert strong{color:#ffc477}.advanced-guidance{color:#89929d;padding:8px 10px 8px 29px;font-size:10px;line-height:1.5;position:relative}.advanced-guidance p{margin:0}.diagnostic-dot{background:var(--accent);border-radius:50%;width:7px;height:7px;position:absolute;top:13px;left:9px;box-shadow:0 0 0 4px #8dfc9614}.advanced-guidance .diagnostic-warning{color:#ffc47d;margin-top:6px}.status-row{border-top:1px solid var(--border);grid-template-columns:1fr auto;align-items:center;gap:18px;margin-top:12px;padding-top:15px;display:grid}.progress-track{background:#252a31;border-radius:999px;height:5px;overflow:hidden}.progress-fill{background:var(--accent);border-radius:inherit;height:100%;transition:width .14s}.last-key{text-align:right;min-width:260px;color:var(--muted);font-size:12px}.last-key strong{color:var(--text)}.last-key span{color:#676f7a;margin-left:8px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.ad-slot{text-align:center;color:#707985;background:#ffffff03;border:1px dashed #2e343d;border-radius:16px;align-content:center;place-items:center;min-height:105px;margin:24px 0;display:grid}.ad-slot span{letter-spacing:.16em;margin-bottom:5px;font-size:9px}.ad-slot p{margin:0;font-size:12px}.result-guide{border:1px solid var(--border);background:#ffffff04;border-radius:18px;grid-template-columns:minmax(260px,.65fr) 1.35fr;align-items:center;gap:28px;margin-top:22px;padding:24px;display:grid}.section-heading .eyebrow,.faq-intro .eyebrow{margin-bottom:8px}.section-heading h2,.faq-intro h2{letter-spacing:-.04em;margin:0;font-size:clamp(22px,2.5vw,32px)}.state-legend{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.state-legend>div{background:#15191f;border-radius:12px;grid-template-rows:auto auto;grid-template-columns:40px 1fr;align-items:center;column-gap:10px;padding:11px;display:grid}.legend-key{border:1px solid var(--key-border);background:var(--key);border-bottom-width:3px;border-radius:8px;grid-row:1/3;place-items:center;width:40px;height:40px;font-size:11px;font-weight:800;display:grid}.legend-key.pressed-sample{background:var(--key-pressed);border-color:var(--key-pressed);color:var(--key-pressed-text)}.legend-key.tested-sample{background:var(--key-tested);border-color:var(--key-tested-border);color:#b7ffc0}.state-legend strong{font-size:11px}.state-legend small{color:#78818c;font-size:9px}.privacy-strip{background:#2c683614;border:1px solid #294d31;border-radius:16px;align-items:center;gap:14px;padding:18px 20px;display:flex}.privacy-icon{width:38px;height:38px;color:var(--accent);background:#8dfc961a;border-radius:11px;flex:none;place-items:center;display:grid}.privacy-strip strong{font-size:13px}.privacy-strip p{color:#7f8c82;margin:4px 0 0;font-size:11px}.faq-section{grid-template-columns:minmax(250px,.55fr) 1.45fr;gap:40px;margin-top:22px;padding:34px 0 10px;display:grid}.faq-intro>p:last-child{color:var(--muted);margin:10px 0 0;font-size:12px}.faq-list{border-top:1px solid var(--border)}.faq-list details{border-bottom:1px solid var(--border)}.faq-list summary{cursor:pointer;color:#dce1e6;padding:17px 38px 17px 0;font-size:13px;font-weight:700;list-style:none;position:relative}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"+";color:var(--accent);font-size:20px;font-weight:400;transition:transform .14s;position:absolute;top:14px;right:5px}.faq-list details[open] summary:after{transform:rotate(45deg)}.faq-list details p{color:#8b949f;max-width:850px;margin:-3px 38px 17px 0;font-size:11px;line-height:1.65}.localized-seo-copy,.seo-language-nav{width:min(1480px,100% - 36px);margin-inline:auto}.localized-seo-copy{border:1px solid var(--border);background:#ffffff04;border-radius:18px;margin-top:18px;padding:30px}.localized-seo-copy h2{letter-spacing:-.035em;margin:0 0 13px;font-size:clamp(23px,3vw,34px)}.localized-seo-copy>p:not(.eyebrow){max-width:920px;color:var(--muted);margin:8px 0 0;font-size:13px;line-height:1.7}.seo-language-nav{border-top:1px solid var(--border);grid-template-columns:minmax(210px,.45fr) 1.55fr;align-items:start;gap:24px;margin-top:18px;margin-bottom:48px;padding:20px;display:grid}.seo-language-nav strong,.seo-language-nav span{display:block}.seo-language-nav strong{font-size:13px}.seo-language-nav span{color:var(--muted);margin-top:4px;font-size:10px}.seo-language-links{flex-wrap:wrap;gap:7px;display:flex}.seo-language-links a{border:1px solid var(--border);color:#aeb6c0;border-radius:999px;padding:6px 9px;font-size:10px;text-decoration:none;transition:border-color .12s,background .12s,color .12s}.seo-language-links a:hover,.seo-language-links a:focus-visible,.seo-language-links a.active{border-color:var(--key-tested-border);background:var(--key-tested);color:#b7ffc0;outline:0}.tester-card:fullscreen{background:var(--panel);border:0;border-radius:0;width:100vw;height:100vh;padding:20px;overflow:auto}.tester-card:fullscreen .keyboard-wrap{align-items:center;min-height:calc(100vh - 245px);display:grid}.tester-card:fullscreen .keyboard-stage{margin:auto}.info-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.info-grid article{border:1px solid var(--border);background:#ffffff04;border-radius:16px;padding:20px}.info-grid article>span{color:var(--accent);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}.info-grid h2{margin:18px 0 6px;font-size:17px}.info-grid p{color:var(--muted);margin:0;font-size:13px;line-height:1.55}@media (max-width:1050px){.toolbar{flex-wrap:wrap}.advanced-panel{grid-template-columns:1fr}}@media (max-width:760px){.page-shell{width:min(100% - 20px,1480px)}.tagline{display:none}.hero{padding-top:45px}.tester-card{border-radius:16px;padding:12px}.toolbar{flex-direction:column;align-items:flex-start}.tester-options{flex-direction:column;align-items:stretch;width:100%}.layout-picker{grid-template-columns:minmax(0,1fr) minmax(150px,.7fr);display:grid}.layout-search-field{width:100%}.layout-results{width:min(365px,100vw - 44px)}.toolbar-right{justify-content:space-between;gap:8px;width:100%}.utility-button{margin-left:auto}.layout-switcher{width:100%}.layout-pill{min-width:48px}.configuration-row{flex-direction:column;align-items:stretch}.mode-switcher{width:100%}.mode-button{flex:1 0 auto;padding-inline:9px}.test-tools{justify-content:space-between;width:100%}.test-mode-switcher,.test-mode-button{flex:1}.layout-meta{flex-wrap:wrap}.remaining-label{width:100%;margin-left:0}.keyboard-wrap{border-radius:12px;margin-inline:-4px;padding:10px}.advanced-stats{grid-template-columns:repeat(5,minmax(58px,1fr));overflow-x:auto}.status-row{grid-template-columns:1fr}.last-key{text-align:left;min-width:0}.result-guide,.faq-section{grid-template-columns:1fr;gap:18px}.result-guide{padding:18px}.state-legend{grid-template-columns:1fr}.faq-section{padding-top:22px}.info-grid{grid-template-columns:1fr}.localized-seo-copy,.seo-language-nav{width:min(100% - 20px,1480px)}.localized-seo-copy{padding:20px}.seo-language-nav{grid-template-columns:1fr;gap:13px;padding-inline:4px}}@media (max-width:430px){.layout-picker{grid-template-columns:1fr}.toolbar-right{flex-wrap:wrap}.counter{margin-right:auto}.utility-button{margin-left:0}.mode-switcher{scrollbar-width:none;overflow-x:auto}.mode-switcher::-webkit-scrollbar{display:none}.privacy-strip{align-items:flex-start}}