/* The opening's first paint (APPSHIP-3, design round 6 auf6-satz, state satz). A stylesheet of its own in
   index.html's head (vite.config.ts, plugin "start"; never inline since APPSHIP-5), which blocks the first paint:
   the ground and the name from the first frame, in light and dark (the phone's, or the one this device chose:
   first.js sets data-theme before the first frame).
   The arrival runs here, in CSS, from that first frame: each letter from a hairline (100) to its weight (430), one
   after another (each letter's delay is a rule by its place, src/ui/start/markup.ts firstLetterCss), with the
   prototype's "slow" stop as a sampled linear() (src/ui/start/satz.ts, slowLinear). ./opening.ts takes over when it
   has loaded: the o's ring, the waiting, the lens.
   Face: Fraunces (Undercase Type, SIL Open Font License 1.1), the round-4 subset of the name's letters only. */
@font-face{font-family:"Fraunces Name";font-weight:100 500;font-display:block;src:url(fonts/Fraunces-name.woff2) format("woff2")}
:root{--start-ground:#FFFFFF;--start-ink:#131518}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--start-ground:#15171A;--start-ink:#EEECE8}}
:root[data-theme="dark"]{--start-ground:#15171A;--start-ink:#EEECE8}
html{background:var(--start-ground)}
#start{position:fixed;inset:0;z-index:2147483000;overflow:hidden;cursor:default;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none}
#start .start-ground{position:absolute;inset:0;background:var(--start-ground)}
#start .start-ink{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;color:var(--start-ink);pointer-events:none}
#start .start-ring{fill:currentColor;fill-rule:evenodd;stroke:none}
#start .start-set{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);line-height:1;white-space:nowrap;color:var(--start-ink);
  font-family:"Fraunces Name","PT Serif",Georgia,serif;font-size:40px;font-weight:430;letter-spacing:-.024em;font-synthesis:none}
#start .start-l{display:inline-block;will-change:transform;
  animation:start-wght 760ms cubic-bezier(.45,.05,.3,1) both,start-in 137ms linear both;
  animation-timing-function:linear(0,.0121,.0466,.1,.1687,.2483,.3349,.4244,.5134,.5987,.6778,.7488,.8105,.8624,.9043,.9368,.9608,.9776,.9884,.9948,.9981,.9995,.9999,1,1),linear}
#start .start-l.is-ghost{color:transparent}
@keyframes start-wght{from{font-weight:100}to{font-weight:430}}
@keyframes start-in{from{opacity:0}to{opacity:1}}
/* Animationen aus, or the phone's "reduce motion": the set name at once, no motion */
@media (prefers-reduced-motion:reduce){#start .start-l{animation:none}}
:root[data-motion="off"] #start .start-l{animation:none}
/* no opening on this start (a reload for an update; a test browser that did not ask for it): first.js says so */
:root[data-opening="off"] #start{display:none}

#start .start-l:nth-child(1){animation-delay:0ms}
#start .start-l:nth-child(2){animation-delay:92ms;margin-left:-0.012em}
#start .start-l:nth-child(3){animation-delay:184ms}
#start .start-l:nth-child(4){animation-delay:276ms}
#start .start-l:nth-child(5){animation-delay:368ms}
#start .start-l:nth-child(6){animation-delay:460ms;margin-left:0.004em}
#start .start-l:nth-child(7){animation-delay:552ms;margin-left:-0.028em}
#start .start-l:nth-child(8){animation-delay:644ms;margin-left:-0.008em}
#start .start-l:nth-child(9){animation-delay:736ms}