.first-guide{--guide-light:#f1ce87;--guide-spark:#fff2c7;position:fixed;inset:0;width:auto;height:auto;margin:0;padding:0;border:0;background:transparent;overflow:visible;z-index:480;pointer-events:none;color:var(--guide-light);font-family:var(--sans,system-ui)}
.first-guide[hidden]{display:none}.first-guide::backdrop{background:transparent}
.first-guide[data-tone=rings],.first-guide[data-tone=starlake]{--guide-light:#a8cddd;--guide-spark:#e8f6ff}.first-guide[data-tone=garden]{--guide-light:#c3d99a;--guide-spark:#f4f3ca}.first-guide[data-tone=sunset]{--guide-light:#e9b995;--guide-spark:#ffecd5}
.guide-trail i{position:absolute;left:0;top:0;width:var(--size);height:var(--size);border-radius:50%;background:var(--guide-spark);box-shadow:0 0 5px 2px var(--guide-light),0 0 18px 4px #f5c76e88;opacity:0;animation:guide-arrive 6s cubic-bezier(.25,.55,.3,1) var(--delay) infinite;will-change:transform;pointer-events:none}
.guide-beacon{position:absolute;width:0;height:0;pointer-events:none}.guide-beacon i{position:absolute;left:-3px;top:-3px;width:6px;height:6px;border-radius:50%;background:var(--guide-spark);box-shadow:0 0 7px 2px var(--guide-light),0 0 19px 5px #f5c76eaa;animation:guide-hover 3.5s ease-in-out infinite;--dx:-18px;--dy:1px}.guide-beacon i:nth-child(2){--dx:0px;--dy:-3px;animation-delay:-1.2s;width:5px;height:5px}.guide-beacon i:nth-child(3){--dx:18px;--dy:1px;animation-delay:-2.2s;width:4px;height:4px}
.guide-landing{position:absolute;transform:translate(-50%,-50%);background:linear-gradient(90deg,transparent,var(--guide-spark),transparent);box-shadow:0 0 8px 2px var(--guide-light),0 0 22px 4px #f5c76e88;opacity:.95;animation:guide-breathe 3.5s ease-in-out infinite;pointer-events:none}
.first-guide[data-kind=wall] .guide-landing{border:2px solid var(--guide-spark);border-left-color:transparent;border-right-color:transparent;border-radius:50%;background:none;box-shadow:0 0 13px 3px #efcf8e88,inset 0 0 10px 1px #efcf8e55;animation:guide-orbit 6s linear infinite}
.first-guide[data-kind=wall] .guide-beacon i{--dx:-25px;--dy:-19px}.first-guide[data-kind=wall] .guide-beacon i:nth-child(2){--dx:24px;--dy:8px}.first-guide[data-kind=wall] .guide-beacon i:nth-child(3){--dx:-10px;--dy:27px}
.guide-skip{position:absolute;min-height:44px;padding:10px 12px;background:transparent;border:0;color:#c8cfce;font:11px/1.4 var(--sans,system-ui);letter-spacing:.08em;text-shadow:0 1px 5px #000,0 0 10px #000;opacity:.68;pointer-events:auto;cursor:pointer;animation:guide-reveal .3s ease-out both}.guide-skip:hover{opacity:1;color:#fff}.guide-skip:focus-visible{outline:1px solid var(--guide-light);outline-offset:0;border-radius:4px}
.guide-announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.first-guide.is-leaving{opacity:0;transition:opacity .24s ease-out}.first-guide.is-leaving .guide-skip{pointer-events:none}
@keyframes guide-arrive{0%{opacity:0;transform:translate3d(var(--sx),var(--sy),0) scale(.3)}4%{opacity:.95}16%{opacity:.85;transform:translate3d(var(--cx),var(--cy),0) scale(1)}29%{opacity:.65;transform:translate3d(var(--ex),var(--ey),0) scale(.5)}34%,100%{opacity:0;transform:translate3d(var(--ex),var(--ey),0) scale(.2)}}
@keyframes guide-hover{0%,100%{opacity:.5;transform:translate3d(var(--dx),var(--dy),0) scale(.7)}50%{opacity:1;transform:translate3d(calc(var(--dx) + 5px),calc(var(--dy) - 5px),0) scale(1)}}
@keyframes guide-breathe{50%{opacity:.3;transform:translate(-50%,-50%) scaleX(.78)}}
@keyframes guide-orbit{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes guide-reveal{from{opacity:0}to{opacity:.68}}
.settings-guide{width:100%;margin-top:9px!important;border:1px solid #cdb78845!important;background:#111a25!important;color:#eadfcf!important}
@media(max-width:900px) and (max-height:540px){.guide-trail i:nth-child(n+5){display:none}.guide-skip{font-size:10px}}
@media(max-width:650px) and (orientation:portrait){.first-guide{display:none!important}}
@media(prefers-reduced-motion:reduce){.guide-trail{display:none}.guide-beacon i,.guide-landing,.guide-skip{animation:none}.first-guide.is-leaving{transition:none}}
.first-guide.is-reduced .guide-trail{display:none}.first-guide.is-reduced .guide-beacon i,.first-guide.is-reduced .guide-landing,.first-guide.is-reduced .guide-skip{animation:none}
