We need to write an index.html file with self-contained CSS and JS. Flocking simulation: classic boids with separation, alignment, cohesion, plus mouse avoidance. Draw oriented triangles representing each boid.

Goal: full-screen. Use requestAnimationFrame. Use canvas. Use simple physics: position, velocity, acceleration. Compute steering forces.

Let's create a minimal but functional boids simulation with 100 boids maybe. Use mouse coordinates: when near, boids flee.

Implement in JS within script tag. Use event listeners to get mouse position.

Use CSS to set body margin 0, overflow hidden, canvas full-screen. Use canvas 100% width/height.

We'll create a class Boid with methods update, show.

Also ensure orientation: rotate triangle according to velocity direction. Draw triangle path.

Let's craft the code.

We need to output file content. Use write function with path "index.html". We'll write the entire content. Let's prepare string.

Also we might need to handle high DPI: set canvas.width/height to window.innerWidth * devicePixelRatio, but scaling accordingly.

Let's write index.html with DOCTYPE html, head with meta charset, title, style. body with canvas. script includes.

Let's write the JS: 

- let boids = [];
- let numBoids = 100;
- let canvas, ctx;
- mouse = { x: null, y: null };

Functions: setup(), draw(), animate().

Implement vector operations using simple objects with x,y; but we can just use arrays or simple functions.

Simpler: use arrays [x, y]. But we need to implement add, sub, mul, div, limit, magnitude, setMag, normalize, etc.

Let's implement small vector helper functions.

Implement Boid constructor with random position, velocity.

Update: 
- applyForce(boid, force)
- separation, alignment, cohesion each return vector.

Compute neighbor distance threshold, e.g., viewRadius = 50.

Implement separation: avoid neighbors within separationDistance.

Alignment: match velocity of neighbors.

Cohesion: move towards center of mass of neighbors.

Also mouse avoidance: if distance to mouse < mouseRadius, compute steering away.

Weight constants: separationWeight, alignmentWeight, cohesionWeight, mouseWeight.

Limit speed.

Then show: draw oriented triangle. Use ctx.save(); ctx.translate(x, y); ctx.rotate(angle); ctx.beginPath(); ctx.moveTo(0, -size); ctx.lineTo(-size/2, size/2); ctx.lineTo(size/2, size/2); ctx.closePath(); ctx.fillStyle = color; ctx.fill(); ctx.restore();

Set fill color maybe gradient or random.

Edge wrapping: if boid moves outside canvas, wrap to opposite side.

Let's craft final code.

Need to include some CSS to set canvas to full-screen.

Let's write index.html.

We'll produce the code via write function.

Let's create the content string.

Proceed.

We already wrote index.html. Need to confirm any issues: It's a single file with CSS and JS. It's full screen, uses mouse, no external resources. Should be fine. But we didn't include 'use strict'? not necessary. maybe also handle pointer events? But fine.

Check for potential missing semicolons? not critical. Provide final answer.