/* corners.css — one corner law for every control in the house.
 *
 * corner-shape is a NO-OP when border-radius is 0, so a universal rule reaches every rounded
 * corner without touching a single existing declaration. `*` also has zero specificity, so
 * the exclusions below win by being named once rather than by editing every circle.
 *
 * k is CSS's superellipse parameter and the real exponent is 2^k — verified against the
 * engine, which folds superellipse(1) to `round` and superellipse(2) to `squircle`. At 1.2 a
 * pill keeps its round cap while curvature eases to zero before the straight edge, so the cap
 * no longer meets the side at a curvature break.
 *
 * SAFARI has no corner-shape and fails it SILENTLY — plain border-radius, no warning. That is
 * the intended degradation: the corner every app shipped before this file. Nothing regresses.
 * Do not reach for a clip-path polyfill at this scale; clip-path also clips shadows, focus
 * rings and overflow.
 */

:root {
  --corner-k: 1.2;
  --stroke-hover: 1.2px;
  --stroke-press: 1.8px;

}

*, *::before, *::after { corner-shape: superellipse(var(--corner-k, 1.2)); }

/* ── Circles opt out ──────────────────────────────────────────────────────────────
   Every one is a true circle on a square box — a knob, a dot, a radio, a spinner — where a
   superellipse reads as a rounded square rather than a shape decision. There are no 50%
   radii on non-square boxes, so this list is complete and needs no judgement per site.
   Native range thumbs are named explicitly: vendor pseudo-elements are not reliably reached
   by the universal rule above. */
.spinner, .ui-spinner, .gg-geom-dot, .vslider-thumb, .preview-dot, .mode-throb,
.ui-dot, .ui-avatar, .ui-thumb, .ui-radio, .ui-radio.on::after, .ui-switch::after,
.ui-sk--circle, .ui-tl-dot, .ui-step-n, .ui-alert-ic,
input[type="radio"], input[type="radio"]:checked::after {
  corner-shape: round;
}

/* Each vendor thumb gets its OWN rule, and that is not a style preference.
   A comma-separated selector list is all-or-nothing: one selector the engine cannot
   parse invalidates the WHOLE rule. ::-moz-range-thumb is a SyntaxError in Chrome and
   ::-webkit-slider-thumb is one in Firefox, so listing them together with the circles
   above silently deleted every exclusion — avatars, dots, radios and switch knobs all
   rendered as superellipses. Keep them apart, and never fold a vendor pseudo-element
   into a shared list. */
/* ── Mimics opt out ───────────────────────────────────────────────────────────────
   font-proofer proofs type inside replicas of other people's products. Those surfaces
   exist to look like Cal.com and Coss, so the house corner is exactly the signature they
   must not carry — a squircle there is a wrong answer, not a house style. Namespace-wide,
   because the replicas grow and nobody should have to remember to add each new part. */
[class*="calcom-"], [class*="coss-"] { corner-shape: round; }

input[type="range"]::-webkit-slider-thumb { corner-shape: round; }
input[type="range"]::-moz-range-thumb { corner-shape: round; }

/* ── Press ────────────────────────────────────────────────────────────────────────
   The stroke lands before the fill: it acknowledges the tap, the fill confirms on release.
   :active deliberately beats whatever selected or filled state sits under it.

   CAVEAT, observed in Chromium: an inset box-shadow follows border-radius but NOT
   corner-shape, so on a superellipse control this ring paints as a rounded rectangle
   inside a squircle, and the mismatch shows while the tap is held. It is least
   noticeable at small radii, which is where most of these controls live. Where a
   control is a PILL — radius half its height, the whole edge curved — press it with a
   background or border-colour change instead; both are clipped to the real shape. */
.ui-btn:active:not(:disabled), .ui-seg > span:active, .ui-tab:active, .ui-chip:active,
.ui-tool:active, .gp-copy:active:not(:disabled), .ssd-btn:active:not(:disabled),
.inline-emph-btn:active:not(:disabled) {
  background: none;
  box-shadow: inset 0 0 0 var(--stroke-press, 1.8px) currentColor;
}
