/* The guided next step: a brass ring around one control, with a short tag. Brass means "do this next" across the page. */
.guide-beacon{position:fixed;inset:0;pointer-events:none;z-index:90;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility 0s linear .35s}
.guide-beacon.is-visible{opacity:1;visibility:visible;transition:opacity .35s ease}
.guide-ring{position:fixed;border:1.5px solid var(--ui-accent,#946a33);animation:guide-pulse 2.2s cubic-bezier(.2,.7,.2,1) infinite}
.guide-tag{position:fixed;white-space:nowrap;padding:6px 10px;border-radius:8px;background:var(--ui-accent,#946a33);color:#fff;font:500 12px/1.2 var(--sans);letter-spacing:.01em;box-shadow:0 4px 14px #5a3f1a2e}
.guide-tag:after{content:'';position:absolute;left:var(--tip-x,50%);bottom:-4px;width:8px;height:8px;background:inherit;border-radius:1px;transform:translateX(-50%) rotate(45deg)}
.guide-tag.below:after{bottom:auto;top:-4px}
@keyframes guide-pulse{0%{box-shadow:0 0 0 0 #a7804659}70%,100%{box-shadow:0 0 0 8px #a7804600}}
@media(prefers-reduced-motion:reduce){.guide-ring{animation:none;box-shadow:0 0 0 4px #a780461f}}
@media(max-width:700px){.guide-tag{padding:5px 9px;font-size:11px}}