:root{--bg:#070a12;--panel:rgba(15,20,34,.72);--panel2:rgba(20,27,45,.78);--line:rgba(148,163,184,.14);--line2:rgba(148,163,184,.23);--text:#f4f7fb;--muted:#8e9bb1;--soft:#b7c1d3;--accent:#7c9cff;--accent2:#8ce6ff;--good:#6be7a8;--danger:#ff6b82;--shadow:0 24px 80px rgba(0,0,0,.35);--radius:22px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 15% 0%,rgba(93,112,255,.15),transparent 32rem),radial-gradient(circle at 90% 15%,rgba(80,220,255,.1),transparent 30rem),var(--bg);color:var(--text);font:14px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;min-height:100vh;overflow-x:hidden}.noise{position:fixed;inset:0;pointer-events:none;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");z-index:50}.ambient{position:fixed;width:420px;height:420px;border-radius:50%;filter:blur(100px);pointer-events:none;opacity:.12}.ambient-a{background:#6c7dff;left:-220px;top:30%}.ambient-b{background:#35d7ff;right:-240px;bottom:10%}.container{width:min(1180px,calc(100% - 40px));margin:auto}.topbar{height:74px;width:min(1240px,calc(100% - 32px));margin:auto;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:60}.brand{display:flex;align-items:center;gap:11px;color:var(--text);text-decoration:none;font-size:13px;letter-spacing:.08em}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--line2);border-radius:11px;background:linear-gradient(145deg,rgba(124,156,255,.25),rgba(140,230,255,.04));box-shadow:0 0 30px rgba(124,156,255,.12);font-weight:800}.brand-copy{display:flex;gap:4px;align-items:center;flex-wrap:wrap}.brand-copy b{font-weight:500}.brand-copy small{width:100%;font-size:8px;color:var(--muted);letter-spacing:.2em}.topbar nav{display:flex;gap:7px}.topbar nav a{padding:8px 12px;border-radius:10px;color:var(--muted);text-decoration:none;transition:.2s}.topbar nav a:hover{background:rgba(255,255,255,.05);color:var(--text)}.top-actions{display:flex;gap:7px}.icon-btn{width:34px;height:34px;border:1px solid var(--line);background:rgba(255,255,255,.025);color:var(--soft);border-radius:10px;cursor:pointer}.icon-btn:hover{border-color:var(--line2);color:var(--text);transform:translateY(-1px)}button{font:inherit}.hero{display:grid;grid-template-columns:1.08fr .92fr;gap:70px;align-items:center;padding:88px 0 66px;min-height:600px}.eyebrow{color:#8795af;font-size:10px;letter-spacing:.19em;font-weight:700;display:flex;align-items:center;gap:8px}.pulse-dot,.live-badge span{width:6px;height:6px;border-radius:50%;background:var(--good);box-shadow:0 0 14px var(--good);display:inline-block}.hero h1{font-size:clamp(48px,7vw,82px);line-height:1.02;letter-spacing:-.055em;margin:22px 0}.hero h1 em,.about h2 em{font-style:normal;background:linear-gradient(100deg,#fff 10%,#9baeff 55%,#83e8ff);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy>p{max-width:590px;color:var(--muted);font-size:16px}.hero-actions{display:flex;gap:10px;margin:30px 0 22px}.btn{border:1px solid var(--line2);border-radius:13px;padding:12px 18px;text-decoration:none;color:var(--text);cursor:pointer;background:rgba(255,255,255,.03)}.btn.primary{border:0;background:linear-gradient(110deg,#718eff,#65d9ff);color:#08101c;box-shadow:0 10px 35px rgba(102,143,255,.24);font-weight:750}.btn:hover{transform:translateY(-2px)}.btn.ghost span{margin-left:12px;color:var(--accent2)}.hero-meta{display:flex;gap:10px;align-items:center;color:#68758d;font-size:9px;letter-spacing:.15em}.hero-meta i{width:3px;height:3px;background:#566277;border-radius:50%}.hero-console{border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,rgba(21,28,47,.78),rgba(9,13,23,.78));box-shadow:var(--shadow);padding:18px;position:relative;overflow:hidden}.hero-console:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(124,156,255,.08),transparent 45%);pointer-events:none}.console-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.15em;color:#8996ab}.console-top span{display:flex;gap:8px;align-items:center}.console-top i{width:6px;height:6px;border-radius:50%;background:var(--good);box-shadow:0 0 12px var(--good)}.console-top b{font-weight:600;color:var(--good)}.orb{height:245px;display:grid;place-items:center;position:relative}.orb-core{width:86px;height:86px;border-radius:27px;display:grid;place-items:center;font-size:35px;font-weight:800;background:linear-gradient(145deg,#7b94ff,#67dfff);color:#08101c;box-shadow:0 0 70px rgba(112,151,255,.35)}.orb-ring{position:absolute;border:1px solid rgba(124,156,255,.22);border-radius:50%;transform:rotate(-18deg)}.r1{width:185px;height:110px}.r2{width:245px;height:155px;transform:rotate(55deg);border-color:rgba(140,230,255,.12)}.telemetry{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.telemetry div{padding:11px;border:1px solid var(--line);background:rgba(0,0,0,.13);border-radius:12px}.telemetry span{display:block;color:#68758d;font-size:8px;letter-spacing:.13em}.telemetry strong{font-size:12px;margin-top:3px;display:block}.terminal{margin-top:10px;padding:14px;border-radius:13px;background:#060912;border:1px solid rgba(255,255,255,.05);font:11px/1.9 ui-monospace,SFMono-Regular,monospace;color:#8591a8}.terminal b{display:block;color:var(--good);font-weight:500}.terminal small{color:#58657a}.command-strip{display:flex;gap:12px;align-items:center;margin-bottom:34px}.search-box{min-height:54px;flex:1;border:1px solid var(--line);background:rgba(16,22,37,.7);border-radius:16px;color:var(--muted);display:flex;align-items:center;padding:0 15px;gap:12px;cursor:text;text-align:left}.search-box>span{font-size:23px;color:var(--accent)}.search-box strong{font-size:12px;color:var(--soft)}.search-box small{color:#66738a}.search-box kbd{margin-left:auto;border:1px solid var(--line2);border-radius:7px;padding:3px 7px;font-size:9px;color:#8290a7}.live-badge{white-space:nowrap;border:1px solid rgba(107,231,168,.14);color:#77869e;padding:11px 14px;border-radius:13px;font-size:9px;letter-spacing:.1em}.dashboard{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:12px}.dash-card{min-height:142px;border:1px solid var(--line);background:var(--panel);border-radius:18px;padding:19px;position:relative;overflow:hidden}.dash-card:hover{border-color:var(--line2)}.dash-label{font-size:9px;letter-spacing:.16em;color:#69768c}.dash-label span{float:right;color:#4f5d73}.level-line{display:flex;align-items:end;justify-content:space-between;margin:13px 0 9px}.level-line strong{font-size:40px;line-height:1}.level-line span{font:10px ui-monospace;color:#8290a7}.progress{height:5px;background:#20283a;border-radius:9px;overflow:hidden}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#6d8cff,#7ce2ff);box-shadow:0 0 14px rgba(110,157,255,.45)}.dash-card p{color:#68758c;font-size:11px;margin:10px 0 0}.stat-card strong{display:block;font-size:22px;margin-top:13px}.mini-signal{position:absolute;right:20px;bottom:22px;width:70px;height:22px;background:repeating-linear-gradient(90deg,transparent 0 7px,rgba(124,156,255,.18) 8px 9px);clip-path:polygon(0 80%,12% 65%,20% 78%,32% 30%,42% 55%,54% 18%,66% 50%,77% 10%,90% 45%,100% 0,100% 100%,0 100%)}.mini-bars{display:flex;gap:4px;position:absolute;right:20px;bottom:22px;align-items:end}.mini-bars i{width:5px;background:#657eff;border-radius:3px}.mini-bars i:nth-child(1){height:9px}.mini-bars i:nth-child(2){height:16px}.mini-bars i:nth-child(3){height:12px}.mini-bars i:nth-child(4){height:22px}.mini-bars i:nth-child(5){height:14px}.section{padding:94px 0 0}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:26px}.section-head h2{font-size:34px;letter-spacing:-.035em;margin:6px 0 4px}.section-head p{margin:0;color:#69768b}.section-head>span{font:9px ui-monospace;color:#65738a;letter-spacing:.12em}.tool-controls{display:flex;align-items:center;gap:7px;margin-bottom:18px;overflow:auto;padding-bottom:2px}.filter-label{font:9px ui-monospace;color:#58657a;margin-right:5px}.filter-label span{color:#8a98ae}.filter-chip{border:1px solid var(--line);background:rgba(255,255,255,.02);color:#7d8aa1;border-radius:9px;padding:7px 12px;cursor:pointer;white-space:nowrap}.filter-chip.active,.filter-chip:hover{background:rgba(124,156,255,.1);border-color:rgba(124,156,255,.3);color:#c7d3ff}.tool-category{margin:28px 0}.category-title{font-size:11px;color:#8d9ab0;letter-spacing:.12em;text-transform:uppercase;display:flex;gap:10px;align-items:center}.category-title:after{content:"";height:1px;background:var(--line);flex:1}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:11px}.tool-card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(18,25,42,.8),rgba(11,16,28,.75));border-radius:17px;padding:17px;text-align:left;color:var(--text);cursor:pointer;min-height:116px;position:relative;overflow:hidden;transition:.22s}.tool-card:after{content:"↗";position:absolute;right:15px;top:15px;color:#526078;font-size:13px}.tool-card:hover{transform:translateY(-3px);border-color:rgba(124,156,255,.35);box-shadow:0 18px 45px rgba(0,0,0,.2)}.tool-icon{font-size:23px;margin-bottom:12px}.tool-card b{display:block;font-size:14px}.tool-card small,.tool-card .muted{display:block;color:#66748b;margin-top:4px;font-size:10px}.tool-card .fav{position:absolute;right:14px;bottom:13px;color:#6d7b92}.tool-card .fav.active{color:#9aafff}.empty{padding:30px;color:#68758a;border:1px dashed var(--line);border-radius:16px}.compact{grid-template-columns:repeat(4,1fr)}.compact .tool-card{min-height:90px}.playground-section{padding-bottom:0}.game-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.game-card{position:relative;min-height:170px;text-align:left;border:1px solid var(--line);border-radius:19px;background:linear-gradient(145deg,rgba(19,27,46,.82),rgba(9,13,23,.8));color:var(--text);padding:19px;cursor:pointer;overflow:hidden}.game-card:before{content:"";position:absolute;width:120px;height:120px;right:-50px;top:-55px;border-radius:50%;background:rgba(124,156,255,.12);filter:blur(5px)}.game-card:hover{transform:translateY(-3px);border-color:rgba(124,156,255,.3)}.game-card .game-index{display:block;color:#5e6d84;font:9px ui-monospace;margin-bottom:45px}.game-card b{display:block;font-size:16px}.game-card>span:not(.game-index){display:block;color:#69768b;font-size:10px;margin-top:3px}.game-card i{position:absolute;right:17px;bottom:17px;font-style:normal;color:#8090ad}.game-card.featured{background:linear-gradient(145deg,rgba(74,96,177,.28),rgba(11,17,31,.82))}.challenge{margin-top:12px}.challenge-inner{border:1px solid var(--line);border-radius:16px;background:rgba(15,21,35,.65);padding:15px}.challenge-inner strong{display:block}.challenge-text{color:#7d8ba2;font-size:11px}.about{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;padding-bottom:90px}.about h2{font-size:42px;line-height:1.1;letter-spacing:-.04em;margin:12px 0}.about-copy>p{color:#8b98ad;max-width:650px;font-size:15px}.about-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:30px}.about-grid div{border-top:1px solid var(--line);padding-top:12px}.about-grid b{display:block;font-size:10px;letter-spacing:.14em}.about-grid span{display:block;color:#647188;font-size:10px;margin-top:4px}.footer{border-top:1px solid var(--line);padding:22px 0 30px;color:#59667b;font-size:9px;letter-spacing:.12em;display:flex;justify-content:space-between}.footer b{color:#8795ac}.footer a{color:#738199;text-decoration:none}.modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px}.modal.open{display:flex}.modal-backdrop{position:absolute;inset:0;background:rgba(2,5,10,.75);backdrop-filter:blur(10px)}.modal-card{position:relative;width:min(700px,100%);max-height:88vh;overflow:auto;border:1px solid var(--line2);background:#0d1321;border-radius:24px;padding:22px;box-shadow:0 35px 100px rgba(0,0,0,.55);z-index:1}.modal-head{display:flex;justify-content:space-between;gap:20px;margin-bottom:20px}.modal-head h2{margin:4px 0;font-size:27px}.close{border:1px solid var(--line);background:rgba(255,255,255,.04);color:#9aa7bb;width:34px;height:34px;border-radius:10px;cursor:pointer;font-size:21px}.tool-form{display:grid;gap:10px}.tool-form input,.tool-form textarea,.tool-form select,#paletteInput{width:100%;border:1px solid var(--line);background:#080d18;color:var(--text);border-radius:12px;padding:11px 12px;outline:none}.tool-form input:focus,.tool-form textarea:focus,#paletteInput:focus{border-color:rgba(124,156,255,.5);box-shadow:0 0 0 3px rgba(124,156,255,.08)}.tool-action{border:0;background:#7895ff;color:#07101c;border-radius:11px;padding:10px 14px;font-weight:700;cursor:pointer}.result,.muted-box{padding:12px;border:1px solid var(--line);border-radius:11px;background:rgba(0,0,0,.14);color:#9aa7bb;white-space:pre-wrap;word-break:break-word}.result.good{color:var(--good);border-color:rgba(107,231,168,.2)}.result.error{color:#ff8998;border-color:rgba(255,107,130,.2)}.tool-row{display:flex;gap:8px;align-items:center}.tool-row>*{flex:1}.secondary{background:rgba(255,255,255,.05);color:#b7c1d3}.game-big{text-align:center;padding:10px}.reaction-box{height:190px;border:1px solid var(--line);border-radius:18px;display:grid;place-items:center;font-size:20px;cursor:pointer;background:#151b2b}.reaction-box.go{background:#163e2b;color:#9ff2c5;box-shadow:0 0 45px rgba(107,231,168,.18)}.color-options{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}.color-choice{width:48px;height:48px;border:2px solid rgba(255,255,255,.1);border-radius:50%;cursor:pointer}.quiz-option{display:block;width:100%;margin:8px 0;padding:12px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.025);color:#c0cad8;text-align:left;cursor:pointer}.quiz-option:hover{border-color:rgba(124,156,255,.4);background:rgba(124,156,255,.08)}.toast{position:fixed;z-index:120;bottom:25px;left:50%;transform:translate(-50%,20px);padding:10px 15px;background:#111827;border:1px solid var(--line2);border-radius:11px;color:#d9e1ee;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}.palette{position:fixed;inset:0;z-index:110;display:none;align-items:flex-start;justify-content:center;padding:12vh 20px}.palette.show{display:flex}.palette-backdrop{position:absolute;inset:0;background:rgba(1,4,9,.72);backdrop-filter:blur(9px)}.palette-card{position:relative;width:min(620px,100%);background:#0d1321;border:1px solid var(--line2);border-radius:20px;overflow:hidden;box-shadow:0 35px 100px rgba(0,0,0,.6)}.palette-head,.palette-foot{display:flex;justify-content:space-between;padding:12px 15px;color:#66748a;font-size:9px;letter-spacing:.12em}.palette-head kbd{border:1px solid var(--line);padding:2px 6px;border-radius:5px}.palette-card>input{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;background:#090e19;font-size:14px;padding:15px;outline:0}.palette-item{width:100%;display:flex;align-items:center;gap:12px;border:0;border-bottom:1px solid rgba(255,255,255,.035);background:transparent;color:#bdc7d7;padding:12px 15px;text-align:left;cursor:pointer}.palette-item:hover{background:rgba(124,156,255,.09);color:#fff}.palette-item b{margin-left:auto;color:#66748b}.palette-num{font:9px ui-monospace;color:#53617a}.palette-empty{padding:28px;text-align:center;color:#66748a}.lowfx *{animation:none!important;transition:none!important}.lowfx .ambient,.lowfx .noise,.lowfx .orb-ring{display:none}.light{--bg:#f2f5fa;--panel:rgba(255,255,255,.76);--panel2:#fff;--line:rgba(35,48,70,.12);--line2:rgba(35,48,70,.2);--text:#152034;--muted:#5f6d83;--soft:#39475d}.light{background:radial-gradient(circle at 10% 0%,rgba(109,141,255,.18),transparent 30rem),#f2f5fa}.light .hero-console,.light .tool-card,.light .game-card,.light .dash-card,.light .search-box,.light .palette-card,.light .modal-card{background:rgba(255,255,255,.8)}.light .terminal,.light .palette-card>input,.light .tool-form input,.light .tool-form textarea,.light .tool-form select{background:#f5f7fb;color:#1b2638}.light .orb-core{color:white}.light .hero h1 em,.light .about h2 em{background:linear-gradient(100deg,#152034,#5e79e9,#1b9ac0);-webkit-background-clip:text;background-clip:text}.light .modal-backdrop,.light .palette-backdrop{background:rgba(235,240,249,.7)}@media(max-width:900px){.hero{grid-template-columns:1fr;gap:30px;padding-top:55px}.hero-console{max-width:620px}.tool-grid{grid-template-columns:repeat(2,1fr)}.game-grid{grid-template-columns:repeat(2,1fr)}.compact{grid-template-columns:repeat(2,1fr)}.about{grid-template-columns:1fr;gap:25px}.about-grid{grid-template-columns:repeat(2,1fr)}.dashboard{grid-template-columns:1fr 1fr}.level-card{grid-column:1/-1}.command-strip{align-items:stretch}.live-badge{display:none}}@media(max-width:620px){.container{width:min(100% - 24px,1180px)}.topbar{width:calc(100% - 20px);height:62px}.topbar nav{display:none}.brand-copy{font-size:11px}.hero{padding:48px 0 40px;min-height:auto}.hero h1{font-size:48px;margin:17px 0}.hero-copy>p{font-size:14px}.hero-actions{margin-top:22px}.hero-actions .btn{flex:1;text-align:center}.hero-console{border-radius:20px}.orb{height:190px}.telemetry{grid-template-columns:1fr 1fr}.telemetry div:last-child{grid-column:1/-1}.search-box small{display:none}.search-box kbd{display:none}.dashboard{grid-template-columns:1fr}.level-card{grid-column:auto}.section{padding-top:65px}.section-head h2{font-size:28px}.tool-grid,.compact,.game-grid{grid-template-columns:1fr}.tool-controls{margin-right:-12px}.about{padding-bottom:65px}.about h2{font-size:34px}.footer{gap:12px;flex-wrap:wrap}.footer a{width:100%}.modal{padding:10px}.modal-card{border-radius:19px;padding:16px}.top-actions .command-trigger{display:none}}
body.light .hero-console .terminal{color:#5d6a7e}.light .terminal b{color:#138a58}
button:focus{outline:none}.tool-card:focus,.tool-card:focus-visible,.game-card:focus,.game-card:focus-visible,.btn:focus,.btn:focus-visible{outline:none;box-shadow:none}.ion{position:fixed;width:5px;height:5px;border-radius:50%;background:#8ce6ff;box-shadow:0 0 12px #7c9cff;pointer-events:none;z-index:200;animation:ion .55s ease-out forwards}@keyframes ion{to{transform:translate(var(--dx),var(--dy)) scale(.15);opacity:0}}
/* V4 mobile focus/tap hardening */
button,a,[role="button"],.tool-card,.game-card{-webkit-tap-highlight-color:transparent;outline:none;}
button:focus,button:focus-visible,a:focus,a:focus-visible,[role="button"]:focus,[role="button"]:focus-visible,.tool-card:focus,.tool-card:focus-visible,.game-card:focus,.game-card:focus-visible{outline:none!important;box-shadow:none!important;}
