/* BUKLIO onboarding unify v3 · keeps all three slides in one visual system. */
.buklio-onboarding-brand{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.buklio-onboarding-brand img{
  /* Exact transparent PNG mark on the cream canvas: no white card, no blending. */
  display:block;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  mix-blend-mode:normal!important;
}

/* Slides 1 and 2 inherit the same defined orbital language as slide 3. */
.buklio-onboarding-slide[data-onboarding-slide="0"] .buklio-orbit,
.buklio-onboarding-slide[data-onboarding-slide="1"] .buklio-orbit{
  width:min(82vw,365px);
  border-color:rgba(201,155,100,.66);
  opacity:.96;
}

/* Subtle animated accents around the first two ravens; the raven image itself stays static for Safari stability. */
.buklio-motion-accent{
  position:absolute;
  z-index:3;
  pointer-events:none;
  opacity:0;
  transition:opacity .35s ease;
}
.buklio-onboarding-slide.is-active .buklio-motion-accent{opacity:1}

.buklio-accent-gold{
  width:11px;height:11px;border-radius:50%;
  background:var(--buklio-ochre);
  box-shadow:0 0 0 7px rgba(201,155,100,.08);
  left:14%;top:28%;
  animation:buklioAccentPulse 3.8s ease-in-out infinite;
}
.buklio-accent-gold--small{
  width:8px;height:8px;border-radius:50%;
  background:var(--buklio-ochre);
  right:14%;top:43%;
  animation:buklioAccentPulse 4.4s ease-in-out -1.6s infinite;
}
.buklio-accent-sage{
  width:39px;height:11px;border-radius:999px;
  background:rgba(141,162,143,.82);
  left:19%;bottom:22%;
  transform:rotate(48deg);
  animation:buklioAccentFloatLeft 5.4s ease-in-out infinite;
}
.buklio-accent-sage--right{
  width:32px;height:10px;border-radius:999px;
  background:rgba(141,162,143,.76);
  right:18%;bottom:27%;
  transform:rotate(-48deg);
  animation:buklioAccentFloatRight 5.8s ease-in-out -2s infinite;
}
.buklio-accent-spark{
  width:13px;height:13px;
  right:23%;top:21%;
  animation:buklioSpark 3.5s ease-in-out -1s infinite;
}
.buklio-accent-spark::before,.buklio-accent-spark::after{
  content:"";position:absolute;inset:50% auto auto 50%;
  width:3px;height:13px;border-radius:999px;background:rgba(169,179,224,.9);
  transform:translate(-50%,-50%);
}
.buklio-accent-spark::after{transform:translate(-50%,-50%) rotate(90deg)}

/* Literary objects orbiting subtly around the first welcome raven. */
.buklio-literary-orbit{
  position:absolute;
  z-index:3;
  display:grid;
  place-items:center;
  pointer-events:none;
  opacity:0;
  color:#0F3D2E;
  filter:drop-shadow(0 4px 8px rgba(15,61,46,.06));
  transition:opacity .38s ease;
  will-change:transform;
}
.buklio-onboarding-slide[data-onboarding-slide="0"].is-active .buklio-literary-orbit{opacity:.72}
.buklio-literary-orbit svg{width:100%;height:100%;overflow:visible}
.buklio-literary-orbit svg path,
.buklio-literary-orbit svg rect{fill:rgba(246,243,237,.88);stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}

.buklio-literary-book{
  width:31px;height:31px;
  left:12%;top:39%;
  color:#0F3D2E;
  transform:rotate(-11deg);
  animation:buklioLiteraryFloatA 6.1s ease-in-out -.8s infinite;
}
.buklio-literary-book svg path:nth-child(1),
.buklio-literary-book svg path:nth-child(2){fill:rgba(246,243,237,.92)}
.buklio-literary-book svg path:last-child{stroke:#C99B64}

.buklio-literary-notebook{
  width:28px;height:28px;
  right:13%;top:34%;
  color:#0F3D2E;
  transform:rotate(9deg);
  animation:buklioLiteraryFloatB 6.8s ease-in-out -2.1s infinite;
}
.buklio-literary-notebook svg rect{fill:rgba(141,162,143,.35)}
.buklio-literary-notebook svg path:not(:first-of-type){stroke:#F6F3ED}

.buklio-literary-pencil{
  width:40px;height:16px;
  left:27%;bottom:20%;
  color:#0F3D2E;
  transform:rotate(-16deg);
  animation:buklioLiteraryFloatC 7s ease-in-out -1.4s infinite;
}
.buklio-literary-pencil svg path:first-child{fill:rgba(15,61,46,.9)}
.buklio-literary-pencil svg path:nth-child(2){fill:rgba(201,155,100,.9)}
.buklio-literary-pencil svg path:last-child{fill:rgba(246,243,237,.92)}

.buklio-literary-note{
  width:29px;height:25px;
  right:22%;bottom:22%;
  color:#0F3D2E;
  transform:rotate(8deg);
  animation:buklioLiteraryFloatD 6.5s ease-in-out -3s infinite;
}
.buklio-literary-note svg path:first-child{fill:rgba(246,243,237,.92)}
.buklio-literary-note svg path:last-child{stroke:#8DA28F}

/* Give the existing decorative leaves/dots a gentle motion on slides 1 and 2. */
.buklio-onboarding-slide[data-onboarding-slide="0"].is-active .leaf-a,
.buklio-onboarding-slide[data-onboarding-slide="1"].is-active .leaf-a{animation:buklioLeafA 6s ease-in-out infinite}
.buklio-onboarding-slide[data-onboarding-slide="0"].is-active .leaf-b,
.buklio-onboarding-slide[data-onboarding-slide="1"].is-active .leaf-b{animation:buklioLeafB 6.4s ease-in-out -2s infinite}
.buklio-onboarding-slide[data-onboarding-slide="0"].is-active .dot-a,
.buklio-onboarding-slide[data-onboarding-slide="1"].is-active .dot-a{animation:buklioDot 4.2s ease-in-out infinite}
.buklio-onboarding-slide[data-onboarding-slide="0"].is-active .dot-b,
.buklio-onboarding-slide[data-onboarding-slide="1"].is-active .dot-b{animation:buklioDot 4.8s ease-in-out -1.7s infinite}

@keyframes buklioAccentPulse{0%,100%{transform:scale(1);opacity:.82}50%{transform:scale(1.18);opacity:1}}
@keyframes buklioAccentFloatLeft{0%,100%{transform:rotate(48deg) translateY(0)}50%{transform:rotate(48deg) translateY(-5px)}}
@keyframes buklioAccentFloatRight{0%,100%{transform:rotate(-48deg) translateY(0)}50%{transform:rotate(-48deg) translateY(-5px)}}
@keyframes buklioSpark{0%,100%{transform:scale(.9) rotate(0deg);opacity:.62}50%{transform:scale(1.15) rotate(8deg);opacity:1}}
@keyframes buklioLeafA{0%,100%{transform:rotate(53deg) translateY(0)}50%{transform:rotate(53deg) translateY(-5px)}}
@keyframes buklioLeafB{0%,100%{transform:rotate(-48deg) scale(.8) translateY(0)}50%{transform:rotate(-48deg) scale(.8) translateY(-5px)}}
@keyframes buklioDot{0%,100%{opacity:.72;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}
@keyframes buklioLiteraryFloatA{0%,100%{transform:translate3d(0,0,0) rotate(-11deg)}50%{transform:translate3d(3px,-7px,0) rotate(-7deg)}}
@keyframes buklioLiteraryFloatB{0%,100%{transform:translate3d(0,0,0) rotate(9deg)}50%{transform:translate3d(-3px,-6px,0) rotate(13deg)}}
@keyframes buklioLiteraryFloatC{0%,100%{transform:translate3d(0,0,0) rotate(-16deg)}50%{transform:translate3d(4px,-5px,0) rotate(-12deg)}}
@keyframes buklioLiteraryFloatD{0%,100%{transform:translate3d(0,0,0) rotate(8deg)}50%{transform:translate3d(-4px,-7px,0) rotate(4deg)}}

@media (max-width:390px){
  .buklio-literary-book{left:11%;top:40%;transform:scale(.92) rotate(-11deg)}
  .buklio-literary-notebook{right:12%;top:35%;transform:scale(.92) rotate(9deg)}
  .buklio-literary-pencil{left:25%;bottom:19%;transform:scale(.92) rotate(-16deg)}
  .buklio-literary-note{right:20%;bottom:21%;transform:scale(.92) rotate(8deg)}
}

@media (prefers-reduced-motion:reduce){
  .buklio-motion-accent,
  .buklio-literary-orbit,
  .buklio-onboarding-slide .buklio-leaf,
  .buklio-onboarding-slide .buklio-gold-dot{animation:none!important}
}