.x3{padding:70px 0;content-visibility:auto;contain-intrinsic-size:auto 700px}
.x3 h2{font:700 clamp(28px,4vw,42px)/1.1 "Space Grotesk",sans-serif;letter-spacing:-.02em;margin:0 0 8px}
.x3 .sub{opacity:.75;margin:0 0 26px;max-width:640px}
.x3g{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.x3c{display:block;text-decoration:none;color:inherit;border:1px solid rgba(127,127,127,.25);border-radius:18px;padding:18px;background:rgba(127,127,127,.06);transition:transform .25s cubic-bezier(.3,1.5,.5,1),border-color .2s;will-change:transform}
.x3c:hover{transform:translateY(-4px);border-color:#ff5fa2}
.x3c small{display:block;opacity:.6;font-size:12px;margin-bottom:6px;font-family:"JetBrains Mono",monospace}
.x3c b{display:block;font:700 17px/1.3 "Space Grotesk",sans-serif;margin-bottom:6px}
.x3c p{margin:0;opacity:.8;font-size:14px}.x3c .go{display:inline-block;margin-top:10px;color:#ff5fa2;font-weight:800;font-size:14px}
.x3app{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin:14px auto 0;text-decoration:none;font-weight:800;padding:10px 16px;border-radius:999px;background:linear-gradient(90deg,#ffb547,#ff5fa2);color:#1a1030;width:max-content;max-width:92%;text-align:center;transition:transform .2s;box-shadow:0 10px 24px -12px #ff5fa2}
.x3app:hover{transform:translateY(-2px) scale(1.02)}
.x3bots{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.x3bot{border-radius:18px;padding:16px;background:linear-gradient(160deg,rgba(139,92,246,.18),rgba(236,72,153,.08));border:1px solid rgba(127,127,127,.22);text-align:center;cursor:pointer}
.x3bot svg{width:100%;max-width:220px;height:auto;display:block;margin:0 auto 8px}
.x3bot .f{animation:x3f 3.4s ease-in-out infinite;transform-box:fill-box}
.x3bot:nth-child(2) .f{animation-delay:-1.1s}.x3bot:nth-child(3) .f{animation-delay:-2.2s}
.x3bot .ty{animation:x3t 1s steps(2) infinite}
.x3bot:hover .f{animation-duration:1.2s}
@keyframes x3f{50%{transform:translateY(-6px)}}@keyframes x3t{50%{opacity:.25}}
.x3pf{display:grid;grid-template-columns:1.4fr 1fr;gap:22px;align-items:center}
.x3pf .fr{position:relative;border-radius:16px;overflow:hidden;border:1px solid rgba(127,127,127,.3);aspect-ratio:16/10;background:#0b0a16}
.x3pf .fr .bw{height:28px;display:flex;gap:6px;align-items:center;padding:0 10px;background:rgba(127,127,127,.15);font:11px "JetBrains Mono",monospace}
.x3pf iframe{position:absolute;top:28px;left:0;width:200%;height:calc((100% - 28px) * 2);border:0;transform:scale(.5);transform-origin:0 0;pointer-events:none}
.x3pf .fr a{position:absolute;inset:0}
.x3chk label{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;border:1px solid rgba(127,127,127,.22);margin:8px 0;cursor:pointer}
.x3chk input{width:20px;height:20px;accent-color:#ff5fa2}
.x3res{margin-top:12px;font-weight:800;min-height:1.5em}
@media(max-width:760px){.x3pf{grid-template-columns:1fr}.x3{padding:50px 0}}
@media(prefers-reduced-motion:reduce){.x3bot .f,.x3bot .ty{animation:none}}