:root{--bg: #160b2e;--bg-2: #0d0620;--ink: #f3ecff;--ink-dim: #b3a6d4;--line: rgba(190, 160, 255, .14);--card: rgba(255, 255, 255, .035);--display: "Bricolage Grotesque", system-ui, sans-serif;--body: "Inter", system-ui, sans-serif;--mono: "JetBrains Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg-2);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased}.hub{position:relative;min-height:100dvh;overflow:hidden;padding:clamp(20px,4vw,56px);display:flex;flex-direction:column}.mesh{position:fixed;top:-30%;right:-30%;bottom:-30%;left:-30%;z-index:0;background:radial-gradient(38% 44% at 18% 22%,#7c3aed88,transparent 70%),radial-gradient(34% 40% at 82% 18%,#22d3ee66,transparent 70%),radial-gradient(46% 50% at 72% 82%,#f43f5e66,transparent 70%),radial-gradient(40% 46% at 24% 84%,#fb923c55,transparent 70%),var(--bg);filter:saturate(1.15);animation:drift 26s ease-in-out infinite alternate}@keyframes drift{0%{transform:translate3d(-2%,-1%,0) scale(1.05)}50%{transform:translate3d(2%,2%,0) scale(1.12)}to{transform:translate3d(1%,-2%,0) scale(1.06)}}.grain{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;opacity:.06;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.hub>*:not(.mesh):not(.grain){position:relative;z-index:2}.masthead{display:flex;justify-content:space-between;align-items:baseline;gap:16px}.masthead__mark{font-family:var(--display);font-weight:800;font-size:20px;letter-spacing:-.02em}.masthead__right{display:flex;align-items:center;gap:16px}.masthead__meta{font-family:var(--mono);font-size:12px;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.08em}.lang{display:inline-flex;padding:3px;border-radius:999px;border:1px solid var(--line);background:#ffffff0a}.lang__btn{border:0;background:transparent;color:var(--ink-dim);font-family:var(--mono);font-size:12px;letter-spacing:.06em;padding:5px 11px;border-radius:999px;cursor:pointer;transition:color .2s ease,background .2s ease}.lang__btn.is-active{color:var(--bg);background:var(--ink)}.lang__btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.hero{margin:clamp(48px,12vh,140px) 0 clamp(32px,6vh,64px);max-width:18ch}.hero__eyebrow{font-family:var(--mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);margin:0 0 18px}.hero__title{font-family:var(--display);font-weight:800;font-size:clamp(56px,12vw,148px);line-height:.92;letter-spacing:-.04em;margin:0}.hero__accent{background:linear-gradient(100deg,#22d3ee,#7c3aed 45%,#f43f5e);-webkit-background-clip:text;background-clip:text;color:transparent}.hero__sub{font-size:clamp(15px,1.5vw,18px);line-height:1.5;color:var(--ink-dim);max-width:34ch;margin:22px 0 0}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:clamp(28px,7vh,56px)}@media (min-width: 620px){.grid{grid-template-columns:repeat(3,1fr);gap:18px}}@media (min-width: 980px){.grid{grid-template-columns:repeat(4,1fr)}}.state{font-family:var(--mono);font-size:13px;color:var(--ink-dim);grid-column:1 / -1}.state--error{color:#ffb4a8}.card{--rx: 0deg;--ry: 0deg;--mx: 50%;--my: 40%;position:relative;aspect-ratio:1 / 1;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(16px,4.5vw,26px);border-radius:clamp(20px,5vw,28px);border:1px solid var(--line);background:var(--card);color:var(--ink);text-decoration:none;overflow:hidden;isolation:isolate;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transform:perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .25s ease,border-color .25s ease;opacity:0;animation:rise .7s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--delay)}.card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}@keyframes rise{0%{opacity:0;transform:translateY(22px) perspective(1000px)}to{opacity:1;transform:translateY(0) perspective(1000px)}}.card__bloom{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(60% 70% at var(--mx) var(--my),var(--from),var(--to) 60%,transparent 100%);opacity:.16;transition:opacity .3s ease}.card:hover{border-color:color-mix(in srgb,var(--from) 55%,transparent)}.card:hover .card__bloom{opacity:.4}.card__icon{flex:none;display:grid;place-items:center;width:clamp(40px,12vw,52px);height:clamp(40px,12vw,52px);padding:clamp(6px,1.8vw,8px);border-radius:clamp(11px,3vw,15px);background:#fffffff0;box-shadow:0 6px 18px -10px #0009,inset 0 0 0 1px #ffffff80}.card__icon svg{width:100%;height:100%;display:block}.card__icon img{width:100%;height:100%;display:block;object-fit:contain}.card__glyph{font-family:var(--display);font-size:28px;line-height:1;background:linear-gradient(135deg,var(--from),var(--to));-webkit-background-clip:text;background-clip:text;color:transparent}.card__status{flex:none;font-family:var(--mono);font-size:clamp(9px,2.4vw,11px);letter-spacing:.08em;text-transform:uppercase;padding:4px 9px;border-radius:999px;border:1px solid var(--line);color:var(--ink-dim);white-space:nowrap}.card__status--live{color:#7cf5c4;border-color:#7cf5c455}.card__status--beta{color:#ffd27a;border-color:#ffd27a55}.card__body{display:flex;flex-direction:column;gap:4px}.card__name{font-family:var(--display);font-weight:800;font-size:clamp(19px,5.6vw,30px);letter-spacing:-.03em;line-height:1.02}.card__tagline{color:var(--ink-dim);font-size:clamp(12px,3.3vw,15px);line-height:1.25}.card:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.footer{margin-top:40px;display:flex;gap:12px;align-items:center;font-family:var(--mono);font-size:12px;color:var(--ink-dim);letter-spacing:.06em}.footer__dot{opacity:.5}@media (max-width: 520px){.masthead__meta{display:none}.hero{margin-top:clamp(40px,9vh,80px)}}@media (prefers-reduced-motion: reduce){.mesh{animation:none}.card{opacity:1;animation:none;transform:none;transition:border-color .25s ease}.card:hover{transform:none}}
