/* ---- usage ---- */
.bar{height:6px;border-radius:99px;background:var(--surface-2);overflow:hidden;margin:11px 0 8px;position:relative}
.bar i{display:block;height:100%;background:var(--accent);border-radius:99px}
.bar u{position:absolute;top:-2px;bottom:-2px;left:80%;width:1px;background:var(--line-2)}
.kv{display:flex;justify-content:space-between;padding:7px 0;font-size:13.5px;border-bottom:1px solid var(--line)}
.kv:last-child{border-bottom:0}
.kv span:first-child{color:var(--faint)}
@media(max-width:520px){:root{--pad:17px}.msg{max-width:82%;font-size:15px;padding:11px 15px}}

/* Anything auto-animating past 5s is WCAG 2.2.2 Level A. Vestibular disorders
   are real — this ships WITH the first animation, never as a polish item. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;
    animation-iteration-count:1 !important;transition-duration:.001ms !important}
  #boot{display:none}
}
[data-motion="off"] *,[data-motion="off"] *::before,[data-motion="off"] *::after{
  animation-play-state:paused !important}