:root{--bg:#060a10;--panel:#0d1520;--panel2:#101b29;--line:#26364b;--text:#f4f7fb;--muted:#8796a9;--purple:#805cff;--cyan:#4ddcff;--green:#54e1ae;--red:#ff627d;--amber:#ffad45}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select,textarea{font:inherit}.btn{border:1px solid var(--line);background:#141f2d;color:#fff;border-radius:10px;padding:10px 13px;font-size:12px;font-weight:800;cursor:pointer}.btn:hover{filter:brightness(1.08)}.btn.primary{background:linear-gradient(135deg,#8c69ff,#6846ed);border-color:#9178ff}.btn.ghost{background:rgba(255,255,255,.025)}.btn.wide{width:100%}
.topbar{height:70px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:rgba(6,10,16,.92);backdrop-filter:blur(16px);position:sticky;top:0;z-index:30}.brand{display:flex;align-items:center;gap:10px}.brandMark,.authMark{width:38px;height:38px;border-radius:11px;background:#19162b;border:1px solid #40395f;display:grid;place-items:center;color:#c1b1ff}.brand b{display:block;font-size:14px}.brand small{display:block;font-size:7px;color:#748297;letter-spacing:1.3px;margin-top:3px}.userStrip{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.levelChip,.pointsChip,.accessChip,.rankChip{border:1px solid #2a3a51;border-radius:999px;padding:7px 9px;font-size:10px;background:#0d1520}.levelChip b{color:#ad9cff}.pointsChip b{color:#74e7c1}.accessChip.good{color:#70e2b5;border-color:#285b47}.accessChip.bad{color:#ff9bad;border-color:#603044}
.modeTabs{height:50px;display:flex;border-bottom:1px solid var(--line);overflow:auto;background:#080d14;position:sticky;top:70px;z-index:25;padding:0 10px}.modeTab{border:0;border-bottom:2px solid transparent;background:transparent;color:#7e8da0;padding:0 16px;font-size:12px;font-weight:850;cursor:pointer;white-space:nowrap}.modeTab.active{color:#fff;border-color:#7f5cff;background:linear-gradient(to top,rgba(127,92,255,.1),transparent)}
.appWrap{max-width:1520px;margin:auto;padding:16px}.expiredGate{border:1px solid #5e3e25;background:linear-gradient(135deg,#22170e,#17121c);border-radius:14px;padding:13px 15px;display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:12px}.expiredGate[hidden]{display:none}.expiredGate h2{font-size:16px;margin:0 0 3px}.expiredGate p{margin:0;color:#b59e87;font-size:10px}
.modePanel{display:none}.modePanel.active{display:block}.modeHeader{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:12px;min-height:48px}.modeHeader h1{font-size:28px;letter-spacing:-.8px;margin:0}.quickControls{display:flex;align-items:end;justify-content:flex-end;gap:8px;flex-wrap:wrap}.quickControls label{display:grid;gap:5px;color:#98a6b7;font-size:10px;font-weight:700}.quickControls select,.quickControls input{min-width:150px;border:1px solid #2b3b52;border-radius:9px;background:#0b121c;color:#fff;padding:9px}
.scoreStrip{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 11px}.scoreStrip span{border:1px solid #26374e;border-radius:9px;padding:9px 11px;background:#0c141e;color:#91a0b2;font-size:10px}.scoreStrip b{color:#fff;font-size:13px;margin-left:4px}
.keyboardZone{height:420px;border:1px solid #28374e;border-radius:17px;background:radial-gradient(ellipse at 50% 110%,rgba(112,76,255,.23),transparent 58%),linear-gradient(#09101a,#05080d);overflow:hidden;position:relative;margin-top:12px}.keyboardHead{position:absolute;z-index:3;left:13px;right:13px;top:11px;display:flex;justify-content:space-between;font-size:9px;color:#75859a}.keyboardHead span:first-child{color:#d7ddea;font-weight:800}.keyboardZone canvas{width:100%;height:100%;display:block}
.tileCanvas{width:100%;height:330px;border:1px solid #28374e;border-radius:14px;background:#070b11;display:block}
.wordFocus{height:330px;border:1px solid #2a3850;border-radius:17px;background:radial-gradient(circle at 50% 48%,rgba(123,86,255,.18),transparent 35%),linear-gradient(#09101a,#06090e);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}.wordFocus:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(121,91,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(121,91,255,.045) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(circle,#000,transparent 76%)}.wordMeta{position:absolute;z-index:2;top:13px;left:15px;right:15px;display:flex;justify-content:space-between;color:#78889d;font-size:9px}.focusWord{position:relative;z-index:2;font-size:clamp(46px,7vw,96px);font-weight:1000;letter-spacing:-2px;text-align:center;max-width:94%;word-break:break-word}.focusWord.pop{animation:pop .18s ease-out}@keyframes pop{from{opacity:.35;transform:scale(.9);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}.typedWord{position:relative;z-index:2;font:850 18px ui-monospace,Consolas,monospace;color:#71e7bd;letter-spacing:1px;margin-top:20px;min-height:24px}.typedWord.wrong{color:#ff778e}.wordTimer{position:absolute;left:12%;right:12%;bottom:22px;height:4px;border-radius:4px;background:#172334;overflow:hidden}.wordTimer i{display:block;height:100%;background:linear-gradient(90deg,#825eff,#51ddff);transform-origin:left}.pointPop{position:absolute;z-index:4;right:8%;top:38%;font-size:25px;font-weight:1000;color:#70e8b8;opacity:0}.pointPop.show{animation:pointUp .7s ease-out}@keyframes pointUp{0%{opacity:0;transform:translateY(12px) scale(.8)}30%{opacity:1}100%{opacity:0;transform:translateY(-45px) scale(1.08)}}.wordSpeedRow{display:flex;justify-content:flex-end;margin-top:8px}.wordSpeedRow label{display:flex;align-items:center;gap:8px;font-size:9px;color:#7f8fa2}.wordSpeedRow input{width:200px}
.nameStage{height:390px;border:1px solid #2c3450;border-radius:17px;background:#070b12;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.nameGrid{position:absolute;inset:-30%;background:linear-gradient(rgba(110,84,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(110,84,255,.08) 1px,transparent 1px);background-size:38px 38px;transform:perspective(600px) rotateX(63deg) translateY(35%);animation:gridMove 5s linear infinite}@keyframes gridMove{to{background-position:0 38px,38px 0}}.nameHalo{position:absolute;border-radius:50%;filter:blur(12px);opacity:.6}.nameHalo.h1{width:360px;height:360px;background:radial-gradient(circle,rgba(118,75,255,.55),transparent 65%);animation:halo 3.4s ease-in-out infinite alternate}.nameHalo.h2{width:520px;height:150px;background:radial-gradient(ellipse,rgba(45,213,255,.35),transparent 70%);animation:halo2 4.5s ease-in-out infinite alternate}@keyframes halo{to{transform:scale(1.18) rotate(25deg)}}@keyframes halo2{to{transform:scaleX(.72) rotate(-12deg)}}.nameOutput{position:relative;z-index:4;font-size:clamp(48px,8vw,104px);line-height:1;font-weight:1000;text-align:center;text-transform:uppercase;max-width:92%;word-break:break-word}.scanline{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#7deaff,transparent);animation:scan 3s linear infinite}@keyframes scan{from{top:-2%}to{top:102%}}.nameParticles{position:absolute;inset:0}.particle{position:absolute;width:3px;height:3px;border-radius:50%;background:#9b86ff;animation:particleFloat var(--dur) linear infinite}@keyframes particleFloat{from{transform:translateY(410px);opacity:0}15%{opacity:.75}to{transform:translateY(-50px);opacity:0}}.style-neon .nameOutput{color:#fff;text-shadow:0 0 8px #fff,0 0 26px #8e65ff,0 0 75px #5e3bf5;animation:neon 2.6s ease-in-out infinite alternate}@keyframes neon{to{transform:scale(1.025);text-shadow:0 0 10px #fff,0 0 36px #4be3ff,0 0 100px #7b51ff}}.style-hologram .nameOutput{color:#dcfcff;text-shadow:-4px 0 #ff43a2,4px 0 #42edff;animation:holo 1.8s steps(2) infinite}@keyframes holo{50%{transform:translateX(2px);filter:hue-rotate(110deg)}}.style-plasma .nameOutput{color:transparent;background:linear-gradient(90deg,#ff315f,#ffad32,#8b58ff,#3de9ff,#ff315f);background-size:300% 100%;background-clip:text;-webkit-background-clip:text;animation:plasma 4s linear infinite}@keyframes plasma{to{background-position:300% 0}}.style-matrix .nameOutput{color:#8bffb5;text-shadow:0 0 8px #47ff83,0 0 35px #00b84e;font-family:ui-monospace,monospace}.style-royal .nameOutput{color:#fff1a8;text-shadow:0 0 8px #fff6b0,0 0 28px #f8bd2d,0 0 70px #c67a00}.style-ice .nameOutput{color:#ecfdff;text-shadow:0 0 8px #c6fbff,0 0 30px #4beaff,0 0 85px #2772ff}
.leaderboardList{display:grid;gap:8px}.leaderRow{display:grid;grid-template-columns:55px minmax(0,1fr) auto auto;gap:12px;align-items:center;border:1px solid #26374e;background:#0c141f;border-radius:13px;padding:12px}.leaderRank{font-size:20px;font-weight:1000;color:#9884ff}.leaderUser b{display:block;font-size:13px}.leaderUser span{font-size:9px;color:#7d8da1}.leaderMetric{text-align:right}.leaderMetric b{display:block}.leaderMetric small{color:#7b8b9f}
.accountGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.accountCard{border:1px solid #26374e;background:#0c151f;border-radius:15px;padding:15px}.accountCard small{color:#7b8ba0;font-size:8px;letter-spacing:1.2px}.accountCard h2{margin:6px 0}.accountCard p{color:#8a99ab;font-size:10px}.accountCard label,.advancedControls label{display:grid;gap:5px;font-size:10px;color:#9cabbc;margin:10px 0}.accountCard input,.advancedControls input,.advancedControls select,.advancedControls textarea{width:100%;border:1px solid #2a3a51;background:#08111b;color:#fff;border-radius:8px;padding:9px}.bigLevel{font-size:38px;font-weight:1000;margin:10px 0}.levelTrack{height:8px;border-radius:999px;background:#192435;overflow:hidden}.levelTrack i{display:block;height:100%;background:linear-gradient(90deg,#7e5cff,#50dfff)}.plansGrid{display:grid;gap:7px}.plan{border:1px solid #2b3b52;border-radius:10px;padding:10px;display:flex;justify-content:space-between;align-items:center;gap:10px}.plan b,.plan span{display:block}.plan span{font-size:9px;color:#8292a6}.plan a{color:#fff}
.advancedControls{margin-top:12px;border:1px solid #26374e;border-radius:14px;background:#0a121c}.advancedControls summary{cursor:pointer;padding:13px 15px;font-size:11px;font-weight:850}.advancedGrid{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:0 15px 15px}.advancedGrid h3{font-size:14px}.advancedGrid textarea{min-height:110px;resize:vertical}.twoCols{display:grid;grid-template-columns:1fr 1fr;gap:8px}.miniText{font-size:8px;color:#7f8fa2}
#toastHost{position:fixed;right:15px;top:80px;z-index:100;display:grid;gap:7px}.toast{min-width:230px;max-width:360px;border:1px solid #33455f;background:#111d2b;border-radius:10px;padding:10px 12px;font-size:9px}.toast.good{border-color:#286149}.toast.bad{border-color:#653043}.toast.warn{border-color:#614b29}
.authBody{min-height:100vh;min-height:100dvh;display:grid;place-items:center;background:radial-gradient(circle at 50% 15%,#17112d,#080c13 54%,#05070b);overflow:auto;padding:20px}.authGlow{position:fixed;border-radius:50%;filter:blur(50px);opacity:.35}.authGlow.g1{width:350px;height:350px;background:#8050ff;left:-150px;top:-130px}.authGlow.g2{width:300px;height:300px;background:#34d9ff;right:-130px;bottom:-150px}.authCard{width:min(410px,100%);border:1px solid #303b52;background:rgba(12,19,29,.9);border-radius:20px;padding:26px;position:relative;box-shadow:0 30px 90px #0008}.authCard h1{font-size:24px}.authTabs{display:flex;gap:5px;margin:15px 0}.authTabs button{flex:1;border:1px solid #2a3a51;background:#0c151f;color:#8fa0b4;border-radius:8px;padding:9px;cursor:pointer}.authTabs button.active{background:#7655eb;color:white}.authPane{display:none}.authPane.active{display:block}.authPane label{display:grid;gap:5px;color:#8999ac;font-size:9px;margin:10px 0}.authPane input{border:1px solid #2b3b52;background:#08111a;color:#fff;border-radius:9px;padding:11px}.or{text-align:center;color:#5d6c80;font-size:8px;margin:11px}.otpBox{margin-top:10px}.authNote{font-size:9px;color:#7e8fa3}.authError{margin-top:10px;border:1px solid #633043;background:#2f1720;color:#ff9daf;border-radius:8px;padding:9px;font-size:9px}
@media(max-width:900px){.accountGrid,.advancedGrid{grid-template-columns:1fr}.modeHeader{align-items:flex-start;flex-direction:column}.quickControls{justify-content:flex-start}.keyboardZone{height:350px}}@media(max-width:620px){.topbar{padding:0 9px}.brand small,.pointsChip,.accessChip{display:none}.userStrip{gap:4px}.modeTabs{top:70px;padding:0 3px}.modeTab{padding:0 10px}.appWrap{padding:9px}.modeHeader h1{font-size:23px}.quickControls{width:100%}.quickControls label{flex:1}.quickControls select,.quickControls input{min-width:0;width:100%}.scoreStrip{gap:5px}.scoreStrip span{padding:7px}.wordFocus{height:270px}.focusWord{font-size:clamp(38px,12vw,66px)}.keyboardZone{height:285px}.leaderRow{grid-template-columns:42px 1fr}.leaderMetric{display:none}.nameStage{height:320px}.tileCanvas{height:250px}.wordSpeedRow label{width:100%}.wordSpeedRow input{flex:1}}

.accountWide{grid-column:1/-1}.accountStats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}.accountStats>div{border:1px solid #26374e;border-radius:10px;padding:11px;background:#09121c}.accountStats b{display:block;font-size:23px}.accountStats span{display:block;color:#8191a4;font-size:10px;margin-top:3px}.accessHistory{display:grid;gap:7px;margin-top:10px}.accessHistoryRow{display:grid;grid-template-columns:150px 1fr auto;gap:10px;border-bottom:1px solid #203047;padding:8px 0;font-size:10px}.accessHistoryRow span{color:#8c9bad}.accessHistoryRow b{font-size:10px}@media(max-width:620px){.accountStats{grid-template-columns:1fr 1fr 1fr}.accessHistoryRow{grid-template-columns:1fr}.accountWide{grid-column:auto}}
.modeSub{margin:5px 0 0;color:#8293a7;font-size:10px}.keyboardSlot{margin-top:12px}.keyboardSlot:empty{display:none}.modeSettings{margin-top:12px;border:1px solid #26374e;border-radius:14px;background:#0a121c}.modeSettings summary{cursor:pointer;padding:14px 16px;font-size:12px;font-weight:850;list-style:none}.modeSettings summary::-webkit-details-marker{display:none}.settingsGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;padding:0 16px 16px}.settingsGrid section{border:1px solid #23354b;border-radius:12px;padding:12px;background:#08111a}.settingsGrid h3{font-size:14px;margin:0 0 9px}.settingsGrid label{display:grid;gap:5px;font-size:10px;color:#96a5b7;margin:9px 0}.settingsGrid input,.settingsGrid select,.settingsGrid textarea{width:100%;border:1px solid #2b3c53;background:#07101a;color:#fff;border-radius:8px;padding:9px}.settingsGrid textarea{min-height:120px;resize:vertical}.settingsGrid input[type=color]{height:38px}.settingsGrid input[type=range]{padding:0}.subscriptionAccountHead{display:flex;justify-content:space-between;gap:10px}.plan{background:linear-gradient(145deg,#0b1723,#0c1320);padding:12px}.plan .planCopy{min-width:0}.plan .planCopy b{font-size:13px}.plan .planCopy span{font-size:10px;line-height:1.45}.plan .planCopy small{display:block;color:#6f8093;font-size:9px;margin-top:4px}.leaderboardList{display:grid;gap:10px}.leaderRow{display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 14px;border:1px solid #27384e;border-radius:14px;background:linear-gradient(145deg,#0c1621,#09111a)}.leaderRank{font-size:20px;font-weight:1000;color:#9a85ff}.leaderUser{display:grid;grid-template-columns:40px minmax(0,1fr);gap:10px;align-items:center}.leaderAvatar{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,#1d2940,#251b42);border:1px solid #3b4565;font-weight:1000;color:#c4b8ff}.leaderUser b{display:block;font-size:13px}.leaderUser span{display:block;color:#8495a8;font-size:9px;margin-top:3px}.leaderBadges{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}.leaderBadges i{font-style:normal;border:1px solid #2b3e56;border-radius:999px;padding:4px 6px;font-size:8px;color:#96a7ba}.leaderBadges i.today{border-color:#286047;color:#72e4b6}.leaderRight{display:grid;grid-template-columns:repeat(3,minmax(74px,auto));gap:7px}.leaderMetric{border:1px solid #27394f;border-radius:10px;padding:8px 9px;background:#09131d;text-align:left}.leaderMetric b{display:block;font-size:13px}.leaderMetric small{display:block;color:#77899d;font-size:8px;margin-top:2px}.leaderboardAdminChip{display:inline-block;border:1px solid #604a29;color:#ffd080;border-radius:999px;padding:5px 8px;font-size:8px;margin-left:8px}.quickControls .rankChip{font-size:10px}.keyboardZone{height:440px;margin-top:0}.tileCanvas{height:360px}.wordFocus{height:350px}.modeHeader{margin-top:2px}.modeHeader h1{font-size:30px}.quickControls label{font-size:10px}.quickControls select,.quickControls input{font-size:12px}.scoreStrip span{font-size:10px}.scoreStrip b{font-size:14px}@media(max-width:900px){.settingsGrid{grid-template-columns:1fr}.leaderRow{grid-template-columns:46px minmax(0,1fr)}.leaderRight{grid-column:2;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.keyboardZone{height:360px}}@media(max-width:620px){.modeSettings summary{padding:13px}.settingsGrid{padding:0 12px 12px}.keyboardZone{height:300px}.tileCanvas{height:260px}.wordFocus{height:280px}.leaderRow{grid-template-columns:38px minmax(0,1fr);padding:11px}.leaderUser{grid-template-columns:36px minmax(0,1fr)}.leaderAvatar{width:36px;height:36px}.leaderRight{grid-template-columns:1fr 1fr 1fr;gap:5px}.leaderMetric{padding:7px 6px}.modeHeader h1{font-size:25px}}

.modePanel:fullscreen{display:block!important;background:#060a10;color:#f4f7fb;padding:22px;overflow:auto;min-height:100vh}.modePanel:fullscreen .modeHeader{position:sticky;top:0;z-index:20;background:rgba(6,10,16,.92);backdrop-filter:blur(14px);padding:8px 0}.modePanel:fullscreen .keyboardZone{height:min(52vh,560px)}.modePanel:fullscreen .wordFocus{height:min(42vh,430px)}.modePanel:fullscreen .tileCanvas{height:min(40vh,430px)}.modePanel:fullscreen .nameStage{height:min(58vh,620px)}
@media(max-width:620px){#globalFullscreenBtn{padding:8px 9px;font-size:10px}.modePanel:fullscreen{padding:10px}.modePanel:fullscreen .keyboardZone{height:40vh}}

/* v4.1.1 auth/runtime polish */
.authLead{margin:7px 0 15px;color:#7e8fa3;font-size:10px;line-height:1.5}
.authCard .btn:disabled{opacity:.58;cursor:wait;transform:none}
@media(max-height:680px){.authBody{place-items:start center}.authCard{margin:10px 0 18px}}
@media(max-width:480px){.authBody{padding:12px}.authCard{padding:21px 18px;border-radius:17px}.authCard h1{font-size:21px}.authPane input{font-size:16px}}