/* ============================================================
   page_loader.css — the Robocast loader drawing: R mark drawing itself in, pulsing dot,
   signal waves and a sweeping progress bar. Shared by the landing, sign-in and app pages;
   each page decides when its overlay is visible (landing3.css: html.lp3-loading/lp3-leaving,
   standard.html: .portal-page-loader.is-hidden). Markup: views/landing3 :: pageLoaderMark.
   ============================================================ */
.lp3-loader__inner { display: flex; flex-direction: column; align-items: center; gap: 1.4rem; }
.lp3-loader__mark {
    width: 76px;
    height: 76px;
    border-radius: 18px;
    box-shadow: 0 24px 60px -24px rgba(191, 75, 143, 0.7);
    animation: lp3-loader-pop 0.6s cubic-bezier(.2, .8, .2, 1) both;
}
.lp3-loader__r { stroke-dasharray: 80; stroke-dashoffset: 80; animation: lp3-loader-draw 0.7s ease forwards 0.1s; }
.lp3-loader__dot { transform-box: fill-box; transform-origin: center; animation: lp3-loader-dot 1.2s ease-in-out infinite 0.6s; }
.lp3-loader__wave { opacity: 0; animation: lp3-loader-wave 1.2s ease-in-out infinite; }
.lp3-loader__wave--1 { animation-delay: 0.5s; }
.lp3-loader__wave--2 { animation-delay: 0.75s; }
.lp3-loader__bar {
    position: relative;
    width: 120px;
    height: 3px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--ink-line, rgba(127, 127, 127, 0.22));
}
.lp3-loader__bar > span {
    position: absolute;
    inset: 0 auto 0 0;
    width: 40%;
    border-radius: inherit;
    background: #bf4b8f;
    animation: lp3-loader-bar 1.1s cubic-bezier(.4, 0, .2, 1) infinite;
}
:root[dir="rtl"] .lp3-loader__bar > span { animation-name: lp3-loader-bar-rtl; inset: 0 0 0 auto; }
@keyframes lp3-loader-pop { from { opacity: 0; transform: scale(0.82); } to { opacity: 1; transform: none; } }
@keyframes lp3-loader-draw { to { stroke-dashoffset: 0; } }
@keyframes lp3-loader-dot { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.35); } }
@keyframes lp3-loader-wave { 0%, 100% { opacity: 0.15; } 40% { opacity: 1; } }
@keyframes lp3-loader-bar { from { transform: translateX(-110%); } to { transform: translateX(260%); } }
@keyframes lp3-loader-bar-rtl { from { transform: translateX(110%); } to { transform: translateX(-260%); } }

@media (prefers-reduced-motion: reduce) {
    .lp3-loader__mark, .lp3-loader__r, .lp3-loader__dot, .lp3-loader__wave, .lp3-loader__bar > span { animation: none; }
    .lp3-loader__r { stroke-dashoffset: 0; }
    .lp3-loader__wave { opacity: 1; }
}