/* The Logo Edition reveal — styles for logo-edition.js. Sizes come from
   --le-s (the row's font size) and --le-mark-h (the baked asset's height),
   both set by the script from data-mark-h. Colours are the tokens. */
.le{position:relative;display:inline-block;height:var(--le-s);line-height:1;vertical-align:middle;white-space:nowrap;
  --wordmark-le:url('brand/cuts-wordmark-light.png')}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .le{--wordmark-le:url('brand/cuts-wordmark-dark.png')}}
:root[data-theme="dark"] .le{--wordmark-le:url('brand/cuts-wordmark-dark.png')}
.le-row{position:absolute;left:var(--le-row-x,0px);bottom:0;height:var(--le-s);font-size:var(--le-s)}
.le-l{position:absolute;left:0;bottom:0;height:var(--le-s);display:block;transform-origin:left bottom;will-change:transform,opacity;
  font-family:var(--sans);font-weight:400;font-style:normal;font-variation-settings:'opsz' 32,'wght' 400;letter-spacing:0;line-height:1;color:var(--ink)}
.le-l[data-face="bold"]{font-weight:700;font-variation-settings:'opsz' 32,'wght' 700}
.le-l[data-face="serif"]{font-family:var(--serif);font-style:italic;font-weight:400;font-variation-settings:normal}
.le-g{position:absolute;left:0;bottom:var(--le-g-bottom,0px);display:block;line-height:1;padding:0}
.le-l.le-ul .le-g{text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.08em}
.le-l.le-hl .le-g{margin:0 -.035em;padding:0 .035em;border-radius:.045em;
  background:color-mix(in srgb,var(--magenta) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--magenta) 18%,transparent)}
/* the strike: drawn from the left, in the letter's own colour (red for a cut, indigo for a retake) */
.le-strike{position:absolute;left:.02em;right:.06em;bottom:calc(var(--le-x-mid) - .03em);height:.06em;border-radius:1px;background:currentColor;transform:scaleX(0);transform-origin:left center}
/* the silence chip: the app's own — a surface capsule with three dots. The
   dots are DRAWN (the dot-matrix motif is never a font), so the strike can
   run through their exact centre. */
.le-sil{position:absolute;left:0;top:0;height:calc(var(--le-s) * .395);overflow:hidden;box-sizing:border-box;transform-origin:left center;
  border-radius:999px;background:var(--surface2);box-shadow:inset 0 0 0 1px var(--line-2);display:flex;align-items:center;justify-content:center}
.le-dots{display:flex;align-items:center;gap:calc(var(--le-s) * .075)}
.le-dots i{display:block;width:calc(var(--le-s) * .095);height:calc(var(--le-s) * .095);border-radius:50%;background:var(--ink-3)}
.le-sil-strike{position:absolute;left:12%;right:12%;top:50%;height:max(1.5px,calc(var(--le-s) * .024));transform:translateY(-50%) scaleX(0);transform-origin:left center;border-radius:1px;background:var(--ink-3)}
.le-sil.le-sil-red .le-sil-strike{background:var(--red)}
/* the caret: azure, the app's capsule, LIVE */
.le-caret{position:absolute;left:0;bottom:calc(var(--le-mark-h) * 28 / 519);width:calc(var(--le-mark-h) * 73 / 519);height:calc(var(--le-mark-h) * 463 / 519);border-radius:999px;background:var(--azure);will-change:transform}
/* the canonical asset, bottom-left: hidden until the swap at 3.66 s, then shown whole — a cut, not a fade */
.le-mark{position:absolute;left:0;bottom:0;height:var(--le-mark-h);width:calc(var(--le-mark-h) * 1031 / 519);opacity:0;display:block}
.le-mark i{display:block;width:100%;height:100%;background:var(--wordmark-le) 0 0/100% 100% no-repeat}
@media (prefers-reduced-motion: reduce){
  .le-row,.le-sil,.le-caret{display:none}
  .le-mark{opacity:1!important}
}
