/* Connect your accounts, and the wait while an account's videos come in (js/first-import.js) */
.onb{position:fixed;inset:0;z-index:1000;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding:16px;overflow:auto;background:var(--bg);
  background-image:radial-gradient(70% 55% at 50% 0,rgba(255,0,51,.1),transparent)}
.onb[hidden]{display:none}
html.onb-on,html.onb-on body{overflow:hidden}
.onb-card{width:100%;max-width:460px;padding:30px 28px;border:1px solid var(--line-2);border-radius:18px;background:var(--panel)}
.onb-logo{display:block;width:44px;height:44px;margin:0 0 18px}
.onb-logo .logo{display:block;width:100%;height:100%}
.onb h1{margin:0 0 8px;font-size:1.4rem;line-height:1.25;outline:0}
.onb .lede{margin:0;color:var(--muted);font-size:.93rem;line-height:1.5}
.onb-steps{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:12px}
.onb-steps[hidden],.onb-links[hidden],.onb-foot[hidden]{display:none}
.onb-step{display:flex;align-items:flex-start;gap:10px;font-size:.92rem;line-height:1.4;color:var(--ink)}
.onb-step .ms{flex:none;width:20px;overflow:hidden;font-size:20px}
.onb-step.ok .ms{color:var(--good)}
.onb-step.bad .ms{color:var(--warn)}
.onb-step.run{color:var(--muted)}
.onb-step.run .ms{color:var(--muted);animation:onb-spin 1s linear infinite}
@keyframes onb-spin{to{transform:rotate(360deg)}}
.onb-links{display:grid;gap:10px;margin-top:22px}
.onb-link{display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;padding:12px 14px;text-align:left}
.onb-link .ms{flex:none;width:24px;overflow:hidden;font-size:24px}  /* (width: an icon's name is wide text until its font loads) */
.onb-link-t{display:grid;gap:2px;min-width:0}
.onb-link-t small{font-weight:500;color:var(--muted);font-size:.8rem}
.onb .err:empty{display:none}
.onb .err{margin-top:14px}
.onb-foot{display:flex;justify-content:flex-end;margin-top:22px}
@media (prefers-reduced-motion:reduce){.onb-step.run .ms{animation:none}}