`corner-shape` property

Summary: Enable fine-tuning corners, on top of the existing border-radius, by specifying the shape/curvature of the corner. This allows shapes like squircles, notches, scoops etc., and animating between them.

Intent: https://groups.google.com/a/chromium.org/g/blink-dev/c/UKLLVghiHYQ/m/tv0ANlToEQAJ

Spec: https://drafts.csswg.org/css-borders-4/#corner-shaping

Explainer: https://github.com/noamr/explainers/blob/main/corner-shape-explainer.md

Other Resources:

=== This is a demo of CSS corner-shape ===

https://drafts.csswg.org/css-borders-4/#typedef-corner-shape-value

// corner-shape: squircle;, which equals to superellipse(4).

Squircle

// corner-shape: round;, which equals to superellipse(2).

Round

// corner-shape: bevel;, which equals to superellipse(1).

Bevel

// corner-shape: notch;, which equals to superellipse(0).

Notch

// corner-shape: scoop;, which equals to superellipse(0.5).

Scoop

// corner-shape: straight;, which equals to superellipse(infinity).

Straight