/* ════════════════════════════════════════════════════════════════════════
   AUTOCOMPLETELY — BRAND THEME
   ────────────────────────────────────────────────────────────────────────
   The only file you edit to re-skin this site. Structure, type scale, radii,
   layout and motion all live in product.css, which loads first; this file
   overrides just what makes AUTOCOMPLETELY look like itself.
   ════════════════════════════════════════════════════════════════════════ */
:root{
  --accent:#B92FE8; --accent-text:#E08CFF;
  --accent-soft:rgba(185,47,232,.14); --accent-line:rgba(214,110,255,.45);
  --glow:0 10px 40px -8px rgba(185,47,232,.5); --glow-soft:rgba(185,47,232,.35);

  --bg:#050308; --surface:#100B16; --surface-2:#17111F;
  --nav-bg:rgba(5,3,8,.72);
}

@media (prefers-color-scheme:light){
  :root{
    --accent-text:#A21CC7;
    --accent-soft:rgba(185,47,232,.09); --accent-line:rgba(185,47,232,.32);
    --glow:0 10px 34px -10px rgba(185,47,232,.42); --glow-soft:rgba(185,47,232,.22);

    --bg:#FFFFFF; --surface:#FAF7FB; --surface-2:#F4EEF7;
    --nav-bg:rgba(255,255,255,.78);
  }
}

/* logo — SWAP: replace with the real Autocompletely mark */
.logo{position:relative;border-radius:28%;
  background:linear-gradient(145deg,#D66EFF,var(--accent));box-shadow:var(--glow)}
.logo i{position:absolute;background:var(--on-accent);border-radius:1px}
.logo i:nth-child(1){left:30%;top:22%;width:8%;height:56%}
.logo i:nth-child(2){left:48%;top:33%;width:30%;height:8%}
.logo i:nth-child(3){left:48%;top:52%;width:19%;height:8%;opacity:.55}