:root{ --fg:#e6e9f0; --line:rgba(255,255,255,.10); --glass1:rgba(0,0,0,.94); --glass2:rgba(255,255,255,.008); --halo:rgba(127,151,255,.22); }
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:#050505; color:var(--fg);
  font:600 15px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow:hidden; user-select:none; cursor:default;
}
a{color:inherit;text-decoration:none}

/* background (CPU fluid) */
#fluid2d{position:fixed; inset:0; width:100vw; height:100vh; display:block; pointer-events:none; z-index:-1; image-rendering:auto}

.wrap{ position:fixed; inset:0; display:grid; place-items:center; padding:22px; }
.card{ position:relative; z-index:1; width:min(760px,82vw);
  border-radius:24px; padding:28px clamp(22px,4.2vw,34px);
  border:1px solid var(--line);
  background:
    radial-gradient(120% 160% at 10% 0%, rgba(255,255,255,.02), rgba(255,255,255,0)),
    linear-gradient(180deg,var(--glass1),var(--glass2));
  backdrop-filter:blur(20px) saturate(1.05) contrast(1.03);
  -webkit-backdrop-filter:blur(20px) saturate(1.05) contrast(1.03);
  box-shadow:0 48px 160px rgba(0,0,0,.98), inset 0 0 0 1px rgba(255,255,255,.04), inset 0 1px 0 rgba(255,255,255,.06);
}
.brand{display:flex; align-items:center; gap:14px}
.ring{width:46px;height:46px;border-radius:999px;display:grid;place-items:center;flex:0 0 auto;
  background:radial-gradient(60% 60% at 50% 35%, rgba(255,255,255,.045), rgba(255,255,255,0));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06), 0 0 18px var(--halo);
}
.ring svg{width:20px;height:20px;color:#cfe0ff;opacity:.92;filter:drop-shadow(0 2px 8px var(--halo))}
.title{margin:0;font-weight:900;letter-spacing:.4px;line-height:1.1;font-size:clamp(28px,5.2vw,44px)}
.title .shine{
  background:linear-gradient(90deg,#c3cffc 0%,#ffffff 20%,#c3cffc 40%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  background-size:200% 100%;animation:idleShine 9s ease-in-out infinite;
  text-shadow:0 0 24px var(--halo);
}
@keyframes idleShine{0%,100%{background-position:0% 0}50%{background-position:100% 0}}
.sub{margin:6px 0 0 62px; font:700 12px/1.2 Inter; color:#aebcff; opacity:.9}
