/* v8 Guides — instructive, step-by-step; its own quiet motion */
.guide-page .era .era-n,.guide-page .era .sig-era{display:none}
.g-tiers{position:sticky;top:3.4rem;z-index:15;display:flex;gap:.2rem;width:max-content;max-width:100%;margin:0 auto 1rem;padding:.3rem;border:1px solid var(--rule-2,#2a2c2e);border-radius:999px;background:rgba(13,14,15,.92);backdrop-filter:blur(8px)}
.g-tiers button{all:unset;position:relative;z-index:1;cursor:pointer;display:inline-flex;align-items:baseline;gap:.5rem;padding:.6rem 1.05rem;border-radius:999px;font-size:.9rem;color:var(--fg-3,#8d8a84);transition:color .25s}
.g-tiers button[aria-selected=true]{color:var(--fg,#f2efe8)}
.g-tiers button:focus-visible{outline:1px solid var(--tq,#14a7a0);outline-offset:2px}
.g-tiers .gn{font-size:.75rem;color:var(--c,var(--tq,#14a7a0))}.g-tiers .gs{font-size:.72rem;color:var(--fg-4,#5d5b57)}
.g-ind{position:absolute;left:0;top:.3rem;bottom:.3rem;border-radius:999px;background:rgba(242,239,232,.06);border:1px solid rgba(20,167,160,.35);transition:transform .45s cubic-bezier(.2,.8,.2,1),width .45s cubic-bezier(.2,.8,.2,1)}
.g-prog{display:flex;align-items:center;gap:.8rem;justify-content:center;margin:0 auto 2rem;font-size:.8rem;color:var(--fg-3,#8d8a84)}
.g-prog .pb{width:9rem;height:2px;background:var(--rule,#1c1e20);border-radius:2px;overflow:hidden}.g-prog .pb i{display:block;height:100%;background:linear-gradient(90deg,var(--tq,#14a7a0),var(--em,#1f9e74));transform-origin:left;transform:scaleX(0);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.guide-page .era[hidden]{display:none!important}
.guide-page .era.g-in{animation:gIn .5s cubic-bezier(.2,.8,.2,1)}
@keyframes gIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
/* steps */
.guide-page .beat.g-step{position:relative}
.guide-page .beat.g-step .bt{position:relative;padding-left:3.4rem}
.guide-page .beat.g-step .bt::before{content:attr(data-n);position:absolute;left:0;top:.05rem;width:2.3rem;height:2.3rem;border-radius:50%;display:grid;place-items:center;font:500 .95rem var(--mono,monospace);color:var(--fg,#f2efe8);border:1px solid color-mix(in srgb,var(--c,#14a7a0) 55%,transparent);background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--c,#14a7a0) 14%,transparent),transparent 70%)}
.guide-page .beat.g-step .bt::after{content:"";position:absolute;left:1.15rem;top:2.6rem;bottom:-1.4rem;width:1px;background:linear-gradient(var(--rule-2,#2a2c2e),transparent)}
.guide-page .beat .bi{color:var(--fg-4,#5d5b57);text-transform:lowercase}
.guide-page .beat.g-ex .bt{border:1px solid var(--rule-2,#2a2c2e);border-radius:10px;padding:1.1rem 1.3rem;background:rgba(242,239,232,.025)}
.guide-page .beat.g-check .bt{border-left:2px solid var(--em,#1f9e74);padding:.9rem 1.2rem;background:linear-gradient(90deg,rgba(31,158,116,.07),transparent 70%);border-radius:0 8px 8px 0}
.guide-page .beat.g-check .bi::before{content:"✓ ";color:var(--em,#1f9e74)}
/* reveal: settle in from the left */
.guide-page .beat.g-rv{opacity:0;transform:translateX(-12px);transition:opacity .6s cubic-bezier(.2,.8,.2,1),transform .6s cubic-bezier(.2,.8,.2,1)}
.guide-page .beat.g-rv.g-seen{opacity:1;transform:none}
.guide-page .beat.g-step.g-rv .bt::before{transform:scale(.85);transition:transform .7s cubic-bezier(.2,1.4,.3,1) .1s}.guide-page .beat.g-step.g-seen .bt::before{transform:none}
@media (max-width:640px){.g-tiers{top:3.6rem;width:100%;justify-content:space-between}.g-tiers button{padding:.7rem .7rem;min-height:44px;box-sizing:border-box;font-size:15px}.g-tiers .gs{display:none}.guide-page .beat.g-step .bt{padding-left:2.9rem}}
@media (prefers-reduced-motion:reduce){.guide-page .beat.g-rv{opacity:1;transform:none;transition:none}.g-ind{transition:none}.guide-page .era.g-in{animation:none}}
