/* GENERATED by `npm run her:orb` from src/lib/her/orb/ — do not edit. Change her there and she changes everywhere. */
/* HER ORB — the one stylesheet (part of `src/lib/her/orb/`). Change her here and she changes everywhere.
   The renderer (`renderer.ts`) draws her into a canvas inside each mark and sets `data-gl` (+ `.gl` for the static
   pages). Until then — or without WebGL — the mark shows the same clear glass with a ring of her colours (hero lab
   round 13): never the old swirl. Sizes come from the element; the shadow scales with it (font-size = the size). */

[data-her-orb] {
  position: relative;
  display: inline-block;
  flex: none;
  vertical-align: middle;
  border-radius: 50%;
  isolation: isolate;
  line-height: 0;
  background:
    radial-gradient(circle, rgba(250, 249, 255, 0.97) 0 46%, rgba(221, 214, 254, 0.75) 64%, rgba(255, 255, 255, 0) 82%),
    conic-gradient(from 200deg, #818cf8, #a78bfa, #f472b6, #7dd3fc, #818cf8);
  box-shadow: 0 0 0 0.04em rgba(99, 102, 241, 0.16), 0 0.12em 0.42em -0.12em rgba(99, 102, 241, 0.5);
}
[data-her-orb][data-gl] { background: none; }
[data-her-orb] > canvas.glc,
.gl > canvas.glc {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;
  pointer-events: none;
}
@media (forced-colors: active) {
  [data-her-orb] { border: 1px solid CanvasText; }
}

/* ── The static pages' marks (`public/home`, `public/product`): `.orb2` (the living one), `.k-orb` (small), `.x-orb`.
   Same glass before the first frame, the rendered orb after. The app never uses these classes (the guard test). ── */
.orb2, .k-orb, .x-orb { position: relative; display: inline-block; flex: none; border-radius: 50%; isolation: isolate; }
.orb2:not(.gl), .k-orb:not(.gl), .x-orb:not(.gl) {
  background:
    radial-gradient(circle, rgba(250, 249, 255, 0.97) 0 46%, rgba(221, 214, 254, 0.75) 64%, rgba(255, 255, 255, 0) 82%),
    conic-gradient(from 200deg, #818cf8, #a78bfa, #f472b6, #7dd3fc, #818cf8) !important;
}
.orb2:not(.gl) > i, .orb2:not(.gl)::after, .x-orb:not(.gl)::before, .x-orb:not(.gl)::after { display: none !important; }
.orb2.gl { background: none; box-shadow: 0 0 0 1px rgba(99, 102, 241, 0.14), 0 8px 24px -8px rgba(99, 102, 241, 0.45), 0 0 28px -4px rgba(244, 114, 182, 0.25); }
.orb2.gl > i, .orb2.gl::after { display: none; }
.k-orb.gl, .x-orb.gl { background: none !important; overflow: visible; }
.k-orb.gl::before, .k-orb.gl::after, .x-orb.gl::before, .x-orb.gl::after { display: none !important; }
.k-orb.gl { box-shadow: 0 0 0 0.5px rgba(99, 102, 241, 0.16), 0 2px 7px -2px rgba(99, 102, 241, 0.5) !important; }
.x-orb.gl { box-shadow: 0 0 0 1px rgba(99, 102, 241, 0.14), 0 10px 22px -8px rgba(79, 70, 229, 0.5) !important; animation: none; }
