/* Generated by scripts/build_assets.py; edit the sources, not this file. */
/* /assets/css/creations-loading-v5.css */
/* One hero mark, one set of glow/cursor animation clocks, from cover to page. */
html { scrollbar-gutter:stable; }
html.creations-loading,html.creations-loading body { overflow:hidden; }
html.creations-loading #creationsLoader { background:transparent;isolation:isolate; }
#creationsLoader::before { content:"";display:block;position:absolute;inset:0;background:#171717;opacity:1;transition:opacity .9s cubic-bezier(.4,0,.2,1); }
#creationsLoader.is-leaving::before { opacity:0; }
/* Let the hero mark rise above the cover instead of trapping it in the hero layer. */
html.creations-loading main .page-hero { overflow:visible;isolation:auto; }
html.creations-loading .creations-hero-brand { position:relative;z-index:10001; }
html.creations-loading main .creations-hero-mark { transform-origin:0 0;pointer-events:none;will-change:transform; }
html.creations-loading.creations-mark-positioned main .creations-hero-mark { visibility:visible; }
html.creations-loading .creations-hero-brand>.creations-parent { opacity:0;transition:opacity .9s ease; }
html.creations-revealing .creations-hero-brand>.creations-parent { opacity:1; }
#creationsLoader .creations-loading-caption { position:absolute;inset:auto 24px 12%;text-align:center;transition:opacity .2s ease; }
#creationsLoader .creations-loading-caption p { margin:0 auto;max-width:42ch;font:400 12px/1.6 'DM Sans',sans-serif;color:#aeb3bb; }
#creationsLoader.is-leaving .creations-loading-caption { opacity:0; }
#creationsLoader [data-loading-retry] { margin-top:16px;padding:10px 18px;border:1px solid #aaa6;border-radius:3px;background:transparent;color:#f3f3ed;font:400 13px 'DM Sans',sans-serif;cursor:pointer; }
#creationsLoader [data-loading-retry]:focus-visible { outline:2px solid currentColor;outline-offset:4px; }
#creationsLoader [hidden] { display:none!important; }
@media(max-width: 0px){#creationsLoader::before,#creationsLoader .creations-loading-caption,html.creations-loading .creations-hero-brand>.creations-parent{transition:none}}

/* Phone-only note beneath the status; fades out with the caption. */
#creationsLoader .creations-loading-caption .creations-loading-note { display:none; }
@media(max-width:760px){#creationsLoader .creations-loading-caption .creations-loading-note { display:block;margin-top:6px;font-size:11px;color:#858a92; }}