export default function MicrostructureLoading() {
  return (
    <div className="pageStack">
      <div style={{ marginBottom: 16 }}>
        <div style={{ width: 140, height: 10, background: "rgba(159, 176, 204, 0.08)", borderRadius: 3, marginBottom: 6 }} />
        <div style={{ width: 260, height: 16, background: "rgba(159, 176, 204, 0.12)", borderRadius: 3 }} />
      </div>
      <div style={{ display: "flex", gap: 12, marginBottom: 16 }}>
        {[1, 2, 3].map((i) => (
          <div key={i} style={{ flex: 1, height: 56, background: "rgba(159, 176, 204, 0.06)", borderRadius: 4 }} />
        ))}
      </div>
      <div className="panel" style={{ padding: 16 }}>
        {[1, 2, 3, 4, 5, 6, 7, 8].map((j) => (
          <div key={j} style={{ height: 28, background: "rgba(159, 176, 204, 0.04)", borderRadius: 2, marginBottom: 4 }} />
        ))}
      </div>
    </div>
  );
}
