/* korriwan.com: what <vine-text> needs from the page: its typeface, to be a block, and its line height for
   as long as the page's script has not yet run. The rest of its styling is its own, inside the element
   (vine-text.js). */
@font-face {
  /* Tendrilis, a vine script by Anomalis. Its guide allows this use; it is credited at the foot of the page. */
  font-family: "Tendrilis";
  src: url("../../fonts/Tendrilis-v2.1-Regular.woff") format("woff");
  font-display: block;
}
@layer components {
  vine-text { display: block; }
  /* The page is painted before its script runs, and until the script has defined the element a text has no
     styling of its own: it would take the line height it inherits, and its own only when the script came. On
     a load from the browser's cache that was a jump, the heading by 16 pixels and the links by 25, and for
     the texts whose inherited line height is a number, a transition that the opening vines then cut short.
     So before it is defined, a text is given the line height it will have closed. Once it is defined this
     rule no longer fits it, and the element's own takes over, with the same value.
     It must stay tied to :not(:defined). A rule here that still fitted afterwards would win over the
     element's own, and no text could open room for its vine. */
  vine-text:not(:defined) { line-height: var(--lh, 1.4); }
}
