/* Vidartico frontend system UI — loading/page transition */
.vid-page-transition{
  --vpt-bg:#090d14;
  --vpt-ink:#f5efe4;
  --vpt-muted:rgba(245,239,228,.58);
  --vpt-accent:#c8a96c;
  --vpt-burg:#7a1f2b;
  position:fixed;
  inset:0;
  z-index:2147482000;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 12%,rgba(122,31,43,.16),transparent 27%),
    radial-gradient(circle at 82% 78%,rgba(200,169,108,.09),transparent 29%),
    var(--vpt-bg);
  color:var(--vpt-ink);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .2s ease,visibility 0s linear .2s;
}
html[data-vid-theme="light"] .vid-page-transition{
  --vpt-bg:#f4eee4;
  --vpt-ink:#211814;
  --vpt-muted:rgba(57,44,37,.62);
  --vpt-accent:#7a1f2b;
  background:
    radial-gradient(circle at 16% 14%,rgba(122,31,43,.08),transparent 28%),
    radial-gradient(circle at 84% 80%,rgba(200,169,108,.12),transparent 28%),
    linear-gradient(145deg,#fbf7ef,#efe5d7 62%,#f8f2e8);
}
.vid-page-transition.is-merted{
  --vpt-bg:#05060a;
  --vpt-ink:#f8f7fb;
  --vpt-muted:rgba(248,247,251,.55);
  --vpt-accent:#ff4fa5;
  --vpt-burg:#ff4fa5;
  background:
    radial-gradient(circle at 75% 28%,rgba(255,79,165,.20),transparent 26%),
    radial-gradient(circle at 35% 72%,rgba(93,226,255,.13),transparent 31%),
    #05060a;
}
html.js.vid-page-entering .vid-page-transition,
html.js.vid-page-leaving .vid-page-transition{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .18s ease,visibility 0s linear 0s;
}
.vid-page-transition__grid{
  position:absolute;
  inset:-4%;
  opacity:.28;
  background-image:linear-gradient(rgba(200,169,108,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(200,169,108,.06) 1px,transparent 1px);
  background-size:48px 48px;
  transform:perspective(900px) rotateX(3deg) scale(1.05);
}
html[data-vid-theme="light"] .vid-page-transition__grid{
  background-image:linear-gradient(rgba(122,31,43,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(122,31,43,.045) 1px,transparent 1px);
}
.vid-page-transition.is-merted .vid-page-transition__grid{
  background-image:linear-gradient(rgba(93,226,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(93,226,255,.065) 1px,transparent 1px);
  background-size:42px 42px;
}
.vid-page-transition__inner{
  position:relative;
  z-index:1;
  display:grid;
  justify-items:center;
  width:min(360px,72vw);
  text-align:center;
}
.vid-page-transition__logo{
  display:grid;
  place-items:center;
  width:min(108px,32vw);
  min-height:68px;
  margin-bottom:1.15rem;
}
.vid-page-transition__logo-image{
  display:block;
  width:auto;
  max-width:100%;
  max-height:76px;
  object-fit:contain;
}
.vid-page-transition__logo-image--light{display:none;}
html[data-vid-theme="light"] .vid-page-transition__logo.has-light-logo .vid-page-transition__logo-image--default{display:none;}
html[data-vid-theme="light"] .vid-page-transition__logo.has-light-logo .vid-page-transition__logo-image--light{display:block;}
.vid-page-transition__mark{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  margin-bottom:1.3rem;
  border:1px solid color-mix(in srgb,var(--vpt-accent) 64%,transparent);
  color:var(--vpt-accent);
  font:700 1rem/1 Georgia,"Times New Roman",serif;
  letter-spacing:.04em;
}
.vid-page-transition__inner strong{
  font-family:"Cormorant Garamond","Playfair Display",Georgia,serif;
  font-size:clamp(1.45rem,4vw,2.35rem);
  font-weight:650;
  letter-spacing:.08em;
}
.vid-page-transition.is-merted .vid-page-transition__inner strong{
  font-family:Inter,Arial,sans-serif;
  font-weight:900;
  letter-spacing:.13em;
  text-shadow:-2px 0 rgba(255,79,165,.35),2px 0 rgba(93,226,255,.28);
}
.vid-page-transition__inner small{
  margin-top:.6rem;
  color:var(--vpt-muted);
  font:700 .58rem/1.3 Inter,system-ui,sans-serif;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.vid-page-transition__inner>i{
  position:relative;
  display:block;
  width:100%;
  height:1px;
  margin-top:1.4rem;
  overflow:hidden;
  background:color-mix(in srgb,var(--vpt-accent) 18%,transparent);
}
.vid-page-transition__inner>i b{
  position:absolute;
  inset:0 auto 0 0;
  width:38%;
  background:linear-gradient(90deg,transparent,var(--vpt-accent),transparent);
  animation:vidPageSignal 1.05s cubic-bezier(.45,0,.2,1) infinite;
}
@keyframes vidPageSignal{0%{transform:translateX(-120%)}100%{transform:translateX(365%)}}
@media(prefers-reduced-motion:reduce){
  .vid-page-transition{transition:none}
  .vid-page-transition__inner>i b{animation:none;width:100%;opacity:.65}
}

/* MERTED / Signal System 2.0 — round airy/gritty transition */
.vid-page-transition.is-merted{
  --vpt-bg:#07070b;
  --vpt-ink:#f7f3fa;
  --vpt-muted:rgba(247,243,250,.58);
  --vpt-accent:#ff4fac;
  background:
    radial-gradient(circle at 50% 46%,rgba(255,79,172,.11),transparent 21%),
    radial-gradient(circle at 43% 52%,rgba(97,229,245,.09),transparent 28%),
    #07070b;
}
html[data-vid-theme="light"] .vid-page-transition.is-merted{
  --vpt-bg:#f7f1f7;
  --vpt-ink:#171821;
  --vpt-muted:rgba(62,62,74,.62);
  --vpt-accent:#ff48a7;
  background:
    radial-gradient(circle at 50% 46%,rgba(255,72,167,.10),transparent 22%),
    radial-gradient(circle at 43% 52%,rgba(71,207,228,.11),transparent 29%),
    #f7f1f7;
}
.vid-page-transition.is-merted .vid-page-transition__grid{
  opacity:.55;
  background-image:linear-gradient(rgba(97,229,245,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(97,229,245,.055) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(circle at center,#000 0 38%,rgba(0,0,0,.25) 68%,transparent 88%);
  transform:none;
}
html[data-vid-theme="light"] .vid-page-transition.is-merted .vid-page-transition__grid{
  background-image:linear-gradient(rgba(71,207,228,.095) 1px,transparent 1px),linear-gradient(90deg,rgba(71,207,228,.075) 1px,transparent 1px);
}
.vid-page-transition.is-merted .vid-page-transition__inner{width:min(430px,82vw)}
.vid-page-transition__merted-orbit{position:relative;display:grid;place-items:center;width:min(245px,58vw);aspect-ratio:1;margin-bottom:1.25rem;border-radius:50%;isolation:isolate}
.vid-page-transition__merted-ring{position:absolute;inset:0;border:1px solid color-mix(in srgb,var(--vpt-accent) 38%,transparent);border-radius:50%;box-shadow:0 0 0 14px rgba(97,229,245,.018),0 0 0 28px rgba(255,79,172,.012)}
.vid-page-transition__merted-ring::before,.vid-page-transition__merted-ring::after{content:"";position:absolute;border-radius:50%;border:1px solid transparent}
.vid-page-transition__merted-ring::before{inset:14px;border-top-color:#61e5f5;border-right-color:rgba(97,229,245,.18);animation:mertedLoadOrbit 2.5s linear infinite}
.vid-page-transition__merted-ring::after{inset:34px;border-bottom-color:#ff4fac;border-left-color:rgba(255,79,172,.16);animation:mertedLoadOrbit 3.7s linear reverse infinite}
.vid-page-transition__merted-ring i{position:absolute;left:50%;top:50%;width:4px;height:4px;border-radius:50%;background:var(--vpt-ink);box-shadow:0 0 16px currentColor;transform-origin:0 0}
.vid-page-transition__merted-ring i:nth-child(1){transform:rotate(18deg) translateX(118px)}.vid-page-transition__merted-ring i:nth-child(2){transform:rotate(118deg) translateX(102px);background:#61e5f5}.vid-page-transition__merted-ring i:nth-child(3){transform:rotate(208deg) translateX(118px);background:#ff4fac}.vid-page-transition__merted-ring i:nth-child(4){transform:rotate(302deg) translateX(102px)}
.vid-page-transition__merted-grain{position:absolute;inset:19%;border-radius:50%;opacity:.22;background-image:radial-gradient(circle,rgba(255,255,255,.8) 0 1px,transparent 1.4px);background-size:9px 9px;mask-image:radial-gradient(circle,#000 0 44%,transparent 76%);animation:mertedLoadGrain .8s steps(2,end) infinite}
.vid-page-transition__merted-orbit>strong{position:relative;z-index:2;font-family:Inter,Arial,sans-serif;font-size:clamp(1.55rem,5vw,2.2rem);font-weight:950;letter-spacing:.14em;text-shadow:-2px 0 rgba(255,79,172,.32),2px 0 rgba(97,229,245,.28)}
.vid-page-transition__merted-orbit>em{position:absolute;z-index:2;top:59%;font:850 .48rem/1 Inter,Arial,sans-serif;letter-spacing:.22em;color:#61e5f5;font-style:normal}
.vid-page-transition.is-merted .vid-page-transition__inner>small{margin-top:0;font-size:.54rem;letter-spacing:.24em}
.vid-page-transition__merted-pulse{display:flex;align-items:flex-end;justify-content:center;gap:6px;width:120px;height:25px;margin-top:1rem}
.vid-page-transition__merted-pulse i{display:block;width:3px;height:7px;background:linear-gradient(#61e5f5,#ff4fac);animation:mertedLoadPulse 1.1s ease-in-out infinite}.vid-page-transition__merted-pulse i:nth-child(2){height:16px;animation-delay:-.2s}.vid-page-transition__merted-pulse i:nth-child(3){height:23px;animation-delay:-.5s}.vid-page-transition__merted-pulse i:nth-child(4){height:12px;animation-delay:-.7s}.vid-page-transition__merted-pulse i:nth-child(5){height:19px;animation-delay:-.35s}
@keyframes mertedLoadOrbit{to{transform:rotate(360deg)}}
@keyframes mertedLoadGrain{0%,100%{transform:translate(0,0);opacity:.16}50%{transform:translate(2px,-2px);opacity:.28}}
@keyframes mertedLoadPulse{0%,100%{transform:scaleY(.35);opacity:.35}50%{transform:scaleY(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.vid-page-transition__merted-ring::before,.vid-page-transition__merted-ring::after,.vid-page-transition__merted-grain,.vid-page-transition__merted-pulse i{animation:none}.vid-page-transition__merted-pulse i{opacity:.65}}
