:root{--color-page:#07111F;--color-header:#091725;--color-panel:#0E1D2C;--color-panel-light:#122438;--color-key:#111E2B;--color-key-border:#263A4D;--color-primary:#22D3C5;--color-primary-dark:#10BFB4;--color-tested:#20C997;--color-pressed:#22C7E8;--color-warning:#F4B62C;--color-danger:#F05252;--color-text:#F4F7FA;--color-text-muted:#A9B9CB;--color-border:#263B50;--shadow:0 14px 36px rgb(0 0 0 / .22)}
body{background:radial-gradient(circle at 50% -20%,#0d2740 0,var(--color-page) 43%);color:var(--color-text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}.site-header{height:58px;padding:0 max(6vw,48px);background:rgb(9 23 37 / .88);border-color:#20364b}.brand{font-size:25px;letter-spacing:-1px}.brand span{color:var(--color-primary)}.site-header nav{display:flex;gap:40px;margin-right:auto;margin-left:42px}.site-header nav a{color:var(--color-text);font-size:14px;text-decoration:none}.site-header nav a:first-child:after{content:"⌄";padding-left:8px;color:var(--color-text-muted)}.site-header nav a:last-child:before{content:"Desktop App";margin-right:40px;color:var(--color-text)}.site-header nav a:last-child{font-size:0}.site-header nav a:last-child:after{content:"Guides\00a0\00a0\00a0\00a0 About";font-size:14px;color:var(--color-text)}.site-footer{display:none}.keyboard-page{max-width:1524px;margin:0 auto;padding:21px 0 22px}.breadcrumbs{display:flex;align-items:center;gap:13px;color:var(--color-text-muted);font-size:13px}.breadcrumbs a{color:var(--color-text-muted);text-decoration:none}.breadcrumbs span:nth-child(even){color:#71849b;font-size:20px}.tester-hero{display:grid;grid-template-columns:minmax(550px,1fr) 352px 266px;align-items:center;gap:42px;margin:10px 20px 22px}.hero-copy h1{margin:0;font-size:45px;line-height:1.11;letter-spacing:-1.3px;color:var(--color-text)}.eyebrow{margin:0 0 5px;color:var(--color-primary);font-size:13px;letter-spacing:2px}.hero-copy>p:last-child{max-width:730px;margin:7px 0 0;color:#b2c6dd;font-size:18px;line-height:1.38}.hero-action{padding-top:12px}.start-button{width:100%;height:55px;border:0;border-radius:10px;background:linear-gradient(115deg,var(--color-primary),#32d5da);color:#03151c;font:800 17px inherit;cursor:pointer;box-shadow:inset 0 1px 0 #78f6f0}.start-button span{margin-right:15px}.hero-action p{margin:13px 0 0;text-align:center;color:#b5c6d9;font-size:12px}.hero-action p span{color:var(--color-primary);font-size:24px;vertical-align:middle;margin-right:9px}.hero-benefits{align-self:stretch;margin:0;padding:6px 0 2px 43px;border-left:1px solid var(--color-border);list-style:none;display:grid;align-content:center;gap:13px;color:#b6c6d8;font-size:13px}.hero-benefits span{display:inline-block;width:34px;color:var(--color-primary);font-size:25px;vertical-align:middle;line-height:0}.keyboard-workspace{margin:0 0 18px;padding:0 14px;background:linear-gradient(135deg,#102438,#0d1c2c);border:1px solid var(--color-border);border-radius:11px;box-shadow:var(--shadow)}.workspace-summary{height:72px;display:flex;align-items:center;gap:25px}.stat-tested{width:205px;padding-left:13px;display:grid}.stat-tested span,.stat-pressed span{color:var(--color-text-muted);font-size:14px}.stat-tested strong{font-size:25px;line-height:1.05}.stat-progress{width:428px;display:grid;gap:7px}.stat-progress strong{color:#b7c7d8;font-size:16px}.stat-progress strong b{color:var(--color-text);font-size:17px}.progress{height:15px;border:1px solid #5a748b;border-radius:8px;background:#0b1b2a;overflow:hidden}.progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,#2bdad0,#25c6e7);border-radius:inherit;transition:width .15s}.stat-pressed{height:50px;width:275px;padding-left:21px;border-left:1px solid #38536a;display:grid}.stat-pressed strong{font-size:25px;line-height:1}.key-legend{margin-left:auto;display:flex;gap:26px;align-items:center;color:#c4d0dc;font-size:12px}.key-legend span{display:flex;align-items:center;gap:10px}.key-legend i{width:20px;height:20px;border:1px solid #4b6880;border-radius:3px;background:#193047}.key-legend .legend-pressed{background:var(--color-pressed);border-color:#81f4ff}.key-legend .legend-tested{background:var(--color-tested);border-color:#75efc6}.key-legend .legend-problem{background:var(--color-warning);border-color:#ffd25e}.keyboard-shell{padding:10px;border:1px solid #26394a;border-radius:10px;background:linear-gradient(145deg,#0b1b29,#0e202d);overflow:hidden}.visual-keyboard{min-width:1390px;display:grid;gap:6px}.keyboard-top{padding-bottom:4px}.keyboard-clusters{display:grid;grid-template-columns:944px 184px 268px;gap:29px}.main-board{display:grid;gap:5px}.key-row{display:flex;gap:6px}.key{height:52px;min-width:52px;flex:1;position:relative;display:flex;align-items:center;justify-content:center;gap:2px;flex-direction:column;background:linear-gradient(145deg,#172837,#0d1924);border:1px solid #050a0f;border-radius:6px;color:#f1f6f9;font-size:13px;line-height:1.05;box-shadow:inset 0 0 0 1px var(--color-key-border),inset 0 -3px 0 #071019,0 2px 4px #000;user-select:none;transition:background .06s,border-color .06s}.key .secondary{font-size:11px;color:#d3dfe9}.key[data-w="1.25"]{flex:1.25}.key[data-w="1.5"]{flex:1.5}.key[data-w="1.75"]{flex:1.75}.key[data-w="2"]{flex:2}.key[data-w="2.25"]{flex:2.25}.key[data-w="2.75"]{flex:2.75}.key[data-w="6.25"]{flex:6.25}.key.pressed{background:linear-gradient(145deg,#42dff5,var(--color-pressed));border-color:#95f8ff;color:#04202b;box-shadow:inset 0 0 0 1px #bbfbff,inset 0 -3px 0 #058fad,0 0 9px #22c7e899}.key.tested:not(.pressed){background:linear-gradient(145deg,#27d99d,#138a68);border-color:#6ef0c2;box-shadow:inset 0 0 0 1px #6ef0c2,inset 0 -3px 0 #09634c,0 0 8px #20c99766}.key.problem{background:linear-gradient(145deg,#f8c74c,#b77708);border-color:#ffe58b;color:#201600}.navigation-board{display:grid;grid-template-rows:repeat(2,52px) 45px 52px;gap:6px}.navigation-board .key-row{display:grid;grid-template-columns:repeat(3,1fr)}.navigation-board .key{min-width:0}.arrow-up{display:grid;grid-template-columns:repeat(3,1fr)}.arrow-up .key{grid-column:2}.numpad-board{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(5,52px);gap:6px}.numpad-board .key{min-width:0}.numpad-board .tall{grid-row:span 2}.numpad-board .wide{grid-column:span 2}.workspace-footer{min-height:78px;display:flex;align-items:center;gap:25px}.last-event{display:flex;align-items:center;flex:1;min-width:0}.last-event>p{width:153px;color:#c9d7e5;font-size:13px;white-space:nowrap}.last-event>p i{display:inline-block;width:13px;height:13px;margin-right:8px;border-radius:50%;background:var(--color-primary)}.last-event dl{display:flex;margin:0}.last-event dl div{min-width:90px;padding:0 18px;border-left:1px solid #294358}.last-event dt{margin-bottom:4px;color:#9eb3c7;font-size:12px}.last-event dd{margin:0;color:#f4f7fa;font-size:16px;font-weight:700}.modifier-list{min-width:300px;padding-left:25px;border-left:1px solid #2b475d}.modifier-list>span{display:block;margin-bottom:7px;color:#aabed0;font-size:12px}.modifier-list p{margin:0;display:flex;gap:10px}.modifier-list b{padding:4px 12px;border:1px solid #334f66;border-radius:8px;background:#172a3d;color:#b8c6d3;font-size:12px;font-weight:500}.modifier-list b.active{background:#1d6370;border-color:var(--color-primary);color:white}.tester-actions{display:flex;gap:10px}.tester-actions button{height:49px;min-width:122px;padding:0 17px;border:1px solid #38536b;border-radius:10px;background:#13263a;color:#e8f0f5;font:700 13px inherit;cursor:pointer}.tester-actions button span{padding-right:14px;font-size:23px;vertical-align:middle}.tester-actions .finish-button{min-width:156px;border-color:#39cda6;background:linear-gradient(115deg,#20c997,#16ac87);color:white}.tester-actions button:disabled{opacity:.45;cursor:not-allowed}.info-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.info-cards article{min-height:122px;padding:18px 20px;display:flex;gap:17px;align-items:flex-start;background:linear-gradient(135deg,#11263b,#0e2031);border:1px solid #263d52;border-radius:10px}.info-cards>article>i{width:59px;height:59px;flex:0 0 59px;display:grid;place-items:center;border-radius:50%;background:#1a3148;color:var(--color-primary);font-size:34px;font-style:normal}.info-cards>article>i.warning-icon{color:var(--color-warning)}.info-cards h2{margin:2px 0 4px;color:var(--color-text);font-size:16px}.info-cards p,.info-cards ol{margin:0;color:#afc0d1;font-size:13px;line-height:1.55}.info-cards ol{padding-left:18px}.info-cards>article>span{margin-left:auto;align-self:center;color:#a7c1d3;font-size:30px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:1550px){.keyboard-page{padding-left:32px;padding-right:32px}.tester-hero{grid-template-columns:minmax(480px,1fr) 330px 230px;gap:25px}.visual-keyboard{transform-origin:top left;zoom:.89}.keyboard-shell{min-height:330px}.workspace-footer{margin-top:-34px}.key-legend{gap:13px}}@media(max-width:1100px){.tester-hero{grid-template-columns:1fr 330px}.hero-benefits{display:none}.keyboard-shell{overflow:auto}.visual-keyboard{zoom:1}.keyboard-shell{min-height:auto}.workspace-footer{margin-top:0;flex-direction:column;align-items:stretch;padding:16px 0}.last-event{flex-wrap:wrap}.tester-actions{justify-content:flex-end}.key-legend{display:none}}@media(max-width:760px){.site-header nav,.header-tools{display:none}.keyboard-page{padding:16px}.tester-hero{grid-template-columns:1fr;gap:18px;margin:10px 0 20px}.hero-copy h1{font-size:38px}.hero-action{padding:0}.workspace-summary{height:auto;min-height:85px;padding:15px 4px;flex-wrap:wrap}.stat-tested{width:42%}.stat-progress{width:54%}.stat-pressed{display:none}.keyboard-shell{padding:7px}.workspace-footer{display:block}.last-event{display:grid;grid-template-columns:1fr}.last-event>p{margin:0 0 12px}.last-event dl{margin-bottom:14px}.last-event dl div{min-width:70px;padding:0 10px}.modifier-list{padding:0;border:0}.tester-actions{margin-top:18px;flex-wrap:wrap;justify-content:flex-start}.tester-actions button{min-width:calc(50% - 5px)}.info-cards{grid-template-columns:1fr}.info-cards article{min-height:auto}.breadcrumbs{font-size:12px}}
.header-tools{margin-left:auto;display:flex;gap:18px;align-items:center}.header-tools button{height:38px;padding:0 15px;border:1px solid #38516a;border-radius:9px;background:#102235;color:var(--color-text);font:700 13px inherit}.header-tools button span{padding-right:10px;color:var(--color-primary);font-size:18px}.header-tools label{width:270px;height:38px;display:flex;align-items:center;gap:10px;padding:0 13px;border:1px solid #38516a;border-radius:9px;color:#89a3bb}.header-tools label span{font-size:23px}.header-tools input{width:100%;border:0;outline:0;background:transparent;color:var(--color-text);font:13px inherit}.header-tools input::placeholder{color:#91a5b9}
.site-header nav a:last-child{font-size:14px}.site-header nav a:last-child:before,.site-header nav a:last-child:after{content:none;margin:0}
.visual-keyboard{min-width:1454px}.keyboard-top{padding-bottom:9px}@media (min-width:1101px) and (max-width:1550px){.keyboard-shell{min-height:0}.workspace-footer{margin-top:0}}
.keyboard-top .key-row{width:1157px}.keyboard-top .key{flex:1;min-width:0}
.numpad-board .key.tall{height:110px;align-self:stretch}
.hero-action .test-ready{height:55px;margin:12px 0 0;display:flex;align-items:center;justify-content:center;border:1px solid #28776f;border-radius:10px;background:#102b35;color:var(--color-primary);font-size:15px;font-weight:700}.hero-action .test-ready span{margin-right:10px;color:var(--color-primary);font-size:20px}
.last-event dl div{min-width:120px}.last-event dd{max-width:none;word-break:normal;white-space:nowrap;font-size:14px}.last-event dt{font-size:11px}.tester-actions button{min-width:110px;padding:0 14px}
