:root{color-scheme:dark;--acid:#ceff62;--muted:#87918f}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#101218;color:#f0f4e9;font:14px system-ui,-apple-system,"Microsoft YaHei",sans-serif;touch-action:none}canvas{position:fixed;inset:0;width:100%;height:100%}header{position:fixed;top:0;left:0;right:0;padding:22px 30px;display:flex;justify-content:space-between;align-items:center;z-index:2;pointer-events:none}.brand{font-size:21px;letter-spacing:1px}.brand small{display:block;font:10px monospace;color:var(--muted);margin:5px 0 0 33px;letter-spacing:2px}.tools{display:flex;gap:8px;pointer-events:auto}button{font:inherit;color:inherit;border:1px solid #394139;background:#1c221de8;border-radius:10px;cursor:pointer;padding:11px 16px;touch-action:manipulation}button:hover{border-color:var(--acid)}button:focus-visible{outline:3px solid var(--acid);outline-offset:3px}#overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#070b116b;z-index:5;padding:80px 20px 24px;backdrop-filter:blur(6px)}#overlay[hidden],[hidden]{display:none!important}section{width:min(760px,100%);max-height:100%;overflow:auto;border:1px solid #404837;background:#171c19f5;border-radius:24px;padding:38px;box-shadow:0 24px 100px #0008}label.tag{font:11px monospace;letter-spacing:3px;color:var(--acid)}h1{font-size:clamp(38px,7vw,76px);line-height:1.04;letter-spacing:-3px;margin:21px 0}h1 em{color:var(--acid);font-style:normal}h2{font-size:30px;margin:15px 0}p{color:#a4aea6;line-height:1.8}.hero-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:26px}.primary{background:var(--acid);color:#18200e;font-weight:800;border:0;padding:16px 30px}.sub{font-size:12px;color:var(--muted)}.features{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #394139;margin-top:24px;padding-top:18px;gap:10px}.features b{display:block;font-size:17px;margin-bottom:5px}.features small{color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:22px 0}.card{text-align:left;min-height:160px;padding:20px;background:#20291e}.card strong{display:block;color:var(--acid);font-size:19px;margin:13px 0}.card span{font-size:12px;color:#acb6a7;line-height:1.6}.stats{display:flex;gap:30px}.stats small{display:block;font-size:10px;color:#9daa9f;margin-bottom:5px}.stats b{font:27px monospace}#hud{position:fixed;top:100px;left:30px;pointer-events:none}.bars{width:220px;margin-top:20px}.bars span{font-size:11px;color:#a7b3a7}.bars b{float:right}.track{height:6px;background:#2f3831;margin:8px 0;border-radius:3px;overflow:hidden}.track i{display:block;background:var(--acid);height:100%;width:100%}.track.xp{height:3px}.xp i{background:#70d9ff}#ticker{font-size:12px;color:#ceff62;max-width:280px}footer{position:fixed;bottom:22px;width:100%;text-align:center;font-size:11px;color:#7b897e;pointer-events:none}#touch{position:fixed;bottom:max(36px,env(safe-area-inset-bottom));left:28px;right:28px;display:flex;justify-content:space-between;align-items:end;pointer-events:none}#stick{width:112px;height:112px;border:1px solid #879d8255;background:#a0bc9212;border-radius:50%;position:relative;touch-action:none;pointer-events:auto}#knob{width:44px;height:44px;background:#ceff6266;border:1px solid #ceff62;border-radius:50%;position:absolute;left:33px;top:33px}#stick span{position:absolute;bottom:-23px;left:41px;font-size:10px;color:#84917b}.skills{display:flex;gap:12px;pointer-events:auto}.skills button{width:70px;height:70px;border-radius:50%;font-weight:bold;border-color:#9dbd66}.skills small{display:block;font:9px monospace;color:#93a18c;margin-top:5px}@media(max-width:600px){header{padding:16px}.brand{font-size:16px}.brand small{font-size:8px;letter-spacing:1px}.tools button{font-size:11px;padding:9px}#hud{top:82px;left:18px}.stats{gap:20px}.stats b{font-size:21px}.bars{width:185px;margin-top:12px}section{padding:25px;border-radius:18px}.hero-bottom{align-items:start;flex-direction:column;gap:12px}.hero-bottom button{width:100%}.features b{font-size:14px}.features small{font-size:10px}.cards{grid-template-columns:1fr;gap:8px}.card{min-height:0;padding:12px 16px}.card strong{display:inline;font-size:16px;margin-right:10px}.card span{display:block;margin-top:6px}footer{display:none}#ticker{font-size:10px}h1{letter-spacing:-1px}.skills{gap:8px}.skills button{width:62px;height:62px}#touch{left:18px;right:18px}}
