:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--bg:#101322;--bg2:#171b2e;--panel:#1b2035;--panel2:#222941;--text:#f5f7ff;--muted:#9da7c4;--line:#313a59;--purple:#8d6bff;--purple2:#6848f5;--mint:#55e6b3;--coral:#ff7d89;--yellow:#ffd166;--good:#63e6be;--bad:#ff6f91;--shadow:0 24px 70px #07091266;color:var(--text);background:var(--bg);font-synthesis:none;scroll-behavior:smooth}
html[data-theme="light"]{--bg:#f7f8fc;--bg2:#eef1f8;--panel:#fff;--panel2:#f4f6fb;--text:#181b2a;--muted:#66708a;--line:#dde2ee;--purple:#7357ea;--purple2:#5837dd;--mint:#13ad80;--coral:#e85469;--yellow:#b37700;--shadow:0 20px 55px #323d5d18}
*{box-sizing:border-box}body{margin:0;min-width:300px;background:radial-gradient(circle at 85% 8%,#754de22b,transparent 24%),radial-gradient(circle at 15% 25%,#13c99d18,transparent 20%),var(--bg);color:var(--text)}button,select,textarea{font:inherit}button,a,select{touch-action:manipulation}button{cursor:pointer}a{color:inherit}.shell{width:min(1180px,calc(100% - 40px));margin-inline:auto}.skip{position:absolute;top:-100px;left:15px;background:#fff;color:#111;padding:10px;z-index:50}.skip:focus{top:12px}
header{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid color-mix(in srgb,var(--line) 75%,transparent)}.nav{height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;font-weight:800;font-size:20px;letter-spacing:-.04em}.brand strong{color:var(--mint)}.logo{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,var(--purple),#b164ff);color:#fff;box-shadow:0 4px 0 #4b2cb8;font-weight:900}.nav nav,.foot nav{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.nav nav a,.foot nav a{text-decoration:none;color:var(--muted);font-size:13px;font-weight:700}.nav nav a:hover,.foot nav a:hover{color:var(--text)}
.ghost,.mini,.secondary,.primary{border:1px solid var(--line);border-radius:10px;background:var(--panel2);color:var(--text);font-weight:750}.ghost{padding:9px 12px}.ghost.big{padding:13px 17px}.mini{padding:8px 10px;font-size:12px}.mini.accent{background:var(--purple2);border-color:var(--purple2);color:#fff}.secondary,.primary{padding:11px 16px}.primary{background:linear-gradient(135deg,var(--purple),var(--purple2));border-color:transparent;color:#fff}.cta{display:inline-block;text-decoration:none;padding:13px 19px;border-radius:11px;background:linear-gradient(135deg,var(--mint),#16caa0);color:#10251e;font-weight:900;box-shadow:0 5px 0 #087c62}
.hero{min-height:430px;display:grid;grid-template-columns:1.25fr .75fr;gap:50px;align-items:center;padding-block:60px 54px}.kicker{margin:0 0 11px;font-size:11px;letter-spacing:.15em;font-weight:900;color:var(--mint)}.kicker.purple{color:#a990ff}.kicker.coral{color:var(--coral)}.kicker.mint{color:var(--mint)}.hero h1{font-size:clamp(45px,7vw,82px);line-height:.98;letter-spacing:-.075em;margin:0 0 21px}.hero h1 span{background:linear-gradient(90deg,var(--purple),#d58bff 45%,var(--mint));-webkit-background-clip:text;background-clip:text;color:transparent}.lead{font-size:18px;line-height:1.7;color:var(--muted);max-width:690px}.hero-actions{display:flex;gap:12px;align-items:center;margin-top:27px}.trust{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:12px;font-weight:700;margin-top:25px}.orbit-card{justify-self:end;width:min(330px,100%);aspect-ratio:1;border:1px solid var(--line);border-radius:34px;background:linear-gradient(155deg,color-mix(in srgb,var(--panel) 94%,#6f54ff 6%),var(--panel));box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;justify-content:center}.orbit{position:relative;width:170px;height:170px;border:1px dashed #8c77ff88;border-radius:50%;display:grid;place-items:center;animation:float 5s ease-in-out infinite}.orbit b{width:80px;height:80px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(135deg,var(--purple),#b14fff);font-size:38px;box-shadow:0 14px 30px #6a44e54d}.orbit span{position:absolute;width:34px;height:34px;border-radius:10px;background:var(--panel2);border:1px solid var(--line);display:grid;place-items:center;font-weight:900;color:var(--yellow)}.orbit span:nth-child(1){top:-16px}.orbit span:nth-child(2){right:-16px;bottom:34px}.orbit span:nth-child(3){left:-16px;bottom:34px}.orbit-card p{margin:20px 0 2px;color:var(--muted)}.orbit-card p strong{color:var(--text);font-size:25px}.orbit-card small{color:var(--muted)}@keyframes float{50%{transform:translateY(-7px)}}
.test-card,.panel,.learn,.faq{background:var(--panel);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}.test-card{padding:30px;margin-bottom:24px}.test-top,.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.test-top h2,.panel h2,.feature-section h2,.learn h2,.faq h2{margin:0;letter-spacing:-.045em;font-size:30px}.live-grid{display:grid;grid-template-columns:repeat(4,minmax(85px,1fr));gap:8px}.live-grid div{padding:10px 13px;border-radius:12px;background:var(--panel2);border:1px solid var(--line);text-align:center}.live-grid span,.score span,.stat-list span{display:block;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.live-grid strong{display:block;font-size:21px;margin-top:3px}
.modebar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:25px;padding:7px;border-radius:13px;background:var(--panel2);border:1px solid var(--line)}.seg,.chips{display:flex;gap:4px}.seg button,.chips button{border:0;background:transparent;color:var(--muted);padding:9px 11px;border-radius:8px;font-weight:800}.seg button.active,.chips button.active{background:var(--purple2);color:#fff}.hidden{display:none!important}
.settings-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:16px 0}.settings-row label{font-size:12px;color:var(--muted);font-weight:700}.settings-row select{margin-left:6px;padding:8px 9px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;color:var(--text)}.toggle{display:flex;gap:6px;align-items:center}.custom-panel{padding:14px;border:1px solid var(--line);border-radius:13px;background:var(--panel2);margin-bottom:14px}.custom-panel label{display:block;font-size:12px;font-weight:800;margin-bottom:8px}.custom-panel textarea{width:100%;resize:vertical;background:var(--bg);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:12px;line-height:1.6;margin-bottom:8px}.progress-line{height:5px;background:var(--panel2);border-radius:10px;overflow:hidden}.progress-line span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--purple),var(--mint));transition:width .15s}
.text-display{min-height:230px;padding:34px 8px 26px;font-size:clamp(25px,3.5vw,38px);line-height:1.65;letter-spacing:.015em;color:#737d9c;outline:0;cursor:text;user-select:none}.text-display .char{position:relative}.text-display .correct{color:var(--text)}.text-display .wrong{color:var(--bad);background:#ff6f911e;border-radius:3px}.text-display .current:before{content:"";position:absolute;left:-1px;top:.1em;height:1.15em;width:2px;background:var(--yellow);border-radius:4px;animation:blink 1s steps(2,end) infinite}@keyframes blink{50%{opacity:.2}}.text-display.finished .current:before{display:none}.input-trap{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}.test-hint,.test-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:12px}.test-actions{margin-top:15px}kbd{padding:2px 5px;border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;background:var(--panel2);font-size:10px}
.dashboard{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(260px,.45fr);gap:24px;margin-bottom:24px}.panel{padding:27px}.score-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:20px 0}.score{padding:15px;background:var(--panel2);border:1px solid var(--line);border-radius:13px}.score strong{display:block;font-size:26px;margin-top:4px}.hero-score{background:linear-gradient(145deg,#6946ed33,var(--panel2));border-color:#785cf280}.hero-score strong{color:#c1b0ff}.score small{color:var(--muted)}#wpmChart{display:block;width:100%;height:190px;background:var(--panel2);border:1px solid var(--line);border-radius:14px}.insight{padding:14px 16px;border-left:4px solid var(--mint);background:color-mix(in srgb,var(--mint) 8%,var(--panel2));border-radius:0 10px 10px 0;color:var(--muted);line-height:1.6}.stat-list{display:grid;gap:9px;margin:20px 0}.stat-list div{display:flex;justify-content:space-between;align-items:center;padding:13px;background:var(--panel2);border-radius:11px;border:1px solid var(--line)}.stat-list strong{font-size:17px}.goal{padding:14px;border:1px solid var(--line);border-radius:12px}.goal>div:first-child{display:flex;justify-content:space-between;font-size:12px}.goalbar{height:7px;background:var(--bg);border-radius:20px;overflow:hidden;margin-top:10px}.goalbar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--coral),var(--yellow))}.link-btn{border:0;background:transparent;color:var(--muted);padding:14px 0 0;text-decoration:underline}
.keyboard-panel{margin-bottom:24px}.keyboard{display:grid;gap:6px;margin-top:20px;max-width:950px}.key-row{display:flex;gap:6px;justify-content:center}.key{min-width:48px;height:48px;padding:0 10px;border:1px solid var(--line);border-bottom-width:3px;border-radius:9px;background:var(--panel2);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:var(--muted);transition:transform .08s}.key.hot1{background:#6f5b2c}.key.hot2{background:#87512e}.key.hot3{background:#8d3748;color:#fff}.key.pressed{transform:translateY(2px);border-bottom-width:1px}.key.space{min-width:250px}.weak-keys{margin-top:14px;color:var(--muted);font-size:13px}
.ad{margin-block:150px 55px}.ad>span{display:block;text-align:center;font-size:9px;letter-spacing:.16em;color:var(--muted);margin-bottom:9px}.ad>div{min-height:120px;border:1px dashed var(--line);background:var(--panel2);border-radius:14px;display:grid;place-items:center;text-align:center;color:var(--muted);padding:20px}.ad strong{color:var(--text)}.ad p{margin:4px 0 0;font-size:11px}
.feature-section{padding-block:15px 60px}.feature-section>h2{font-size:42px;margin-bottom:22px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.features article{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:23px}.features b{color:var(--purple);font-size:12px}.features h3{margin:11px 0 8px}.features p,.learn p,.faq p{color:var(--muted);line-height:1.75}.learn,.faq{padding:34px 38px;margin-bottom:24px}.learn h3{margin-top:28px}.formula{padding:18px;border-radius:12px;background:var(--panel2);border:1px solid var(--line);color:var(--mint);text-align:center}.tips{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.tips p{padding:16px;background:var(--panel2);border-radius:12px}.faq{margin-bottom:70px}.faq details{border-top:1px solid var(--line);padding:15px 0}.faq summary{font-weight:850;cursor:pointer}.faq details p{margin-bottom:0}
footer{border-top:1px solid var(--line);background:var(--bg2);padding:35px 0}.foot{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}.foot p,.foot small{color:var(--muted);font-size:12px}.muted{color:var(--muted);font-size:12px}
body.focus-mode header,body.focus-mode .hero,body.focus-mode .dashboard,body.focus-mode .keyboard-panel,body.focus-mode .ad,body.focus-mode .feature-section,body.focus-mode .learn,body.focus-mode .faq,body.focus-mode footer{display:none}body.focus-mode .test-card{margin-top:6vh;box-shadow:none;border-color:transparent;background:transparent}
@media(max-width:900px){.hero{grid-template-columns:1fr}.orbit-card{display:none}.dashboard{grid-template-columns:1fr}.features{grid-template-columns:repeat(2,1fr)}.live-grid{grid-template-columns:repeat(2,1fr)}.hero{min-height:auto}.ad{margin-top:100px}}
@media(max-width:620px){.shell{width:min(100% - 22px,580px)}.nav{height:auto;min-height:66px}.nav nav{gap:8px}.nav nav a{display:none}.brand{font-size:17px}.hero{padding-block:38px 32px}.hero h1{font-size:48px}.lead{font-size:15px}.trust{gap:10px}.test-card{padding:19px 12px;border-radius:17px}.test-top{display:block}.live-grid{margin-top:14px}.modebar{align-items:flex-start}.seg,.chips{width:100%;overflow:auto}.seg button,.chips button{flex:1;white-space:nowrap}.settings-row{gap:7px}.text-display{min-height:210px;font-size:25px;padding:25px 3px}.test-hint span:last-child{display:none}.score-grid{grid-template-columns:repeat(2,1fr)}.panel{padding:20px 15px}.features{grid-template-columns:1fr}.feature-section>h2{font-size:34px}.tips{grid-template-columns:1fr}.learn,.faq{padding:25px 19px}.key{min-width:30px;height:38px;padding:0 5px;font-size:10px}.key-row{gap:3px}.keyboard{gap:3px}.key.space{min-width:150px}.panel-head{display:block}.panel-head .muted{margin-top:6px}}
@media(max-width:390px){.hero h1{font-size:41px}.live-grid div{padding:8px}.live-grid strong{font-size:18px}.settings-row label:first-child{width:100%}.settings-row select{width:65%}.key{min-width:27px}.key.space{min-width:120px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}