#gandalfGuide{position:fixed;inset:auto;margin:0;padding:0;border:0;background:transparent;overflow:visible;right:max(16px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));z-index:90;width:84px;color:var(--ink);font:15px/1.45 Georgia,serif;pointer-events:none}
#gandalfGuide[hidden],#gandalfGuide .gandalf-bubble[hidden]{display:none}
#gandalfGuide.gandalf-suspended{visibility:hidden;pointer-events:none}
#gandalfGuide button{pointer-events:auto;font:600 12px/1.4 system-ui,sans-serif;cursor:pointer}
#gandalfGuide .gandalf-character{touch-action:manipulation;display:block;margin-left:auto;padding:0;border:0;border-radius:8px;background:transparent;width:80px;height:108px}
#gandalfGuide .gandalf-character img{width:80px;height:108px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 3px 2px #0002)}
#gandalfGuide button:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
#gandalfGuide .gandalf-bubble{pointer-events:auto;position:absolute;right:6px;bottom:119px;width:min(290px,calc(100vw - 40px));max-height:calc(100dvh - 160px);overflow-y:auto;padding:18px 20px 16px;border:1px solid var(--line);border-radius:12px 12px 3px 12px;background:var(--panel);box-shadow:0 5px 24px #0002;text-align:left}
#gandalfGuide .gandalf-name{margin:0 22px 7px 0;font:600 11px system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
#gandalfGuide .gandalf-message{margin:0;text-wrap:pretty}
#gandalfGuide .gandalf-close{position:absolute;right:9px;top:7px;border:0;background:transparent;color:var(--muted);font-size:21px;padding:3px 7px}
#gandalfGuide .gandalf-actions{display:flex;flex-wrap:wrap;gap:8px 12px;margin-top:13px}
#gandalfGuide .gandalf-actions:empty{display:none}
#gandalfGuide .gandalf-actions button{background:transparent;border:0;border-bottom:1px solid var(--line);padding:4px 0;color:var(--muted)}
#gandalfGuide .gandalf-actions button:hover{color:var(--ink);border-color:currentColor}
#gandalfGuide.gandalf-greeting .gandalf-character{animation:gandalf-greet .6s steps(3,end) 1}
@keyframes gandalf-greet{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-3px) rotate(-3deg)}70%{transform:translateY(-1px) rotate(2deg)}}
@media(prefers-reduced-motion:reduce){#gandalfGuide.gandalf-greeting .gandalf-character{animation:none}}
#gandalfGuide.gandalf-still .gandalf-character{animation:none}
@media(max-width:600px){#gandalfGuide{right:10px;bottom:max(8px,env(safe-area-inset-bottom));width:62px}#gandalfGuide .gandalf-character,#gandalfGuide .gandalf-character img{width:60px;height:84px}#gandalfGuide .gandalf-bubble{bottom:94px;right:0;font-size:14px}}
@media print{#gandalfGuide{display:none!important}}

/* Counsel has its own top-layer modal while another dialog is open. */

#gandalfGuide .gandalf-character{position:relative}
#gandalfGuide .gandalf-return-light{display:none;pointer-events:none;position:absolute;width:160px;height:200px;left:50%;bottom:-12px;transform:translateX(-50%);z-index:2;image-rendering:pixelated}
#gandalfGuide .gandalf-return-light svg{width:100%;height:100%;shape-rendering:crispEdges}
#gandalfGuide.gandalf-returning .gandalf-return-light{display:block;animation:gandalf-return-light 1400ms steps(1,end) 1}
@keyframes gandalf-return-light{0%,100%{opacity:0}14%,85%{opacity:1}}
@media(max-width:600px){#gandalfGuide .gandalf-return-light{width:128px;height:160px}}
@media(prefers-reduced-motion:reduce){#gandalfGuide .gandalf-return-light{display:none!important}}
#gandalfGuide.gandalf-still .gandalf-return-light{display:none!important}

/* The wizard's own silhouette catches the light, without an opaque cover box. */
#gandalfGuide.gandalf-returning .gandalf-character img{animation:gandalf-return-silhouette 1400ms steps(8,end) 1}
@keyframes gandalf-return-silhouette{
  0%,100%{filter:drop-shadow(0 3px 2px #0002)}
  30%,65%{filter:brightness(0) invert(1)}
}
@media(prefers-reduced-motion:reduce){#gandalfGuide.gandalf-returning .gandalf-character img{animation:none}}
#gandalfGuide.gandalf-still.gandalf-returning .gandalf-character img{animation:none}

#gandalfGuide.gandalf-returning .return-inner{animation:gandalf-pixel-inner 1400ms steps(1,end) 1}
#gandalfGuide.gandalf-returning .return-outer{animation:gandalf-pixel-outer 1400ms steps(1,end) 1}
#gandalfGuide.gandalf-returning .return-rays{animation:gandalf-pixel-rays 1400ms steps(1,end) 1}
@keyframes gandalf-pixel-inner{0%,100%{opacity:0}14%,72%{opacity:1}85%{opacity:0}}
@keyframes gandalf-pixel-outer{0%,100%{opacity:0}28%,72%{opacity:1}85%{opacity:0}}
@keyframes gandalf-pixel-rays{0%,100%{opacity:0}42%,58%{opacity:1}72%{opacity:0}}



/* A single stepped burst around Gandalf's staff, with no full-screen flash. */
#gandalfGuide.gandalf-rebuke-flash .gandalf-character::after{content:"";position:absolute;pointer-events:none;left:29%;top:12%;width:8px;height:8px;background:#fffef0;box-shadow:0 -8px #fffad8,0 8px #fffad8,-8px 0 #fffad8,8px 0 #fffad8,0 -16px #fff3b5,0 16px #fff3b5,-16px 0 #fff3b5,16px 0 #fff3b5,0 -24px #f1dfa2,0 24px #f1dfa2,-24px 0 #f1dfa2,24px 0 #f1dfa2,0 -32px #d5c38b,0 32px #d5c38b,-32px 0 #d5c38b,32px 0 #d5c38b,-8px -8px #fff6c9,8px -8px #fff6c9,-8px 8px #fff6c9,8px 8px #fff6c9,-16px -16px #ecdba2,16px -16px #ecdba2,-16px 16px #ecdba2,16px 16px #ecdba2,-24px -24px #d7c68e,24px -24px #d7c68e,-24px 24px #d7c68e,24px 24px #d7c68e;animation:gandalf-rebuke-burst .16s steps(3,end) both}
@keyframes gandalf-rebuke-burst{0%{opacity:0;transform:scale(.5)}20%{opacity:1;transform:scale(1)}55%{opacity:1;transform:scale(1.25)}100%{opacity:0;transform:scale(1.5)}}
@media(prefers-reduced-motion:reduce){#gandalfGuide.gandalf-rebuke-flash .gandalf-character::after{animation:none;display:none}}
#gandalfGuide.gandalf-still.gandalf-rebuke-flash .gandalf-character::after{display:none}

/* Never expose the old decoded sprite while the replacement is pending. */
#gandalfGuide.gandalf-awaiting-white .gandalf-character>img{visibility:hidden}
#gandalfGuide.gandalf-awaiting-white .gandalf-return-light{display:block;animation:none;opacity:1}


/* Persistent version of the existing staff flash. Original sprites unchanged. */
#gandalfGuide .gandalf-character{position:relative;overflow:visible}
#gandalfGuide .gandalf-character .gandalf-moria-light{position:absolute;pointer-events:none;left:28%;top:8%;width:8px;height:8px;background:#fffef0;box-shadow:0 -8px #fffad8,0 8px #fffad8,-8px 0 #fffad8,8px 0 #fffad8,0 -16px #fff3b5,0 16px #fff3b5,-16px 0 #fff3b5,16px 0 #fff3b5,0 -24px #f1dfa2,0 24px #f1dfa2,-24px 0 #f1dfa2,24px 0 #f1dfa2,0 -32px #d5c38b,0 32px #d5c38b,-32px 0 #d5c38b,32px 0 #d5c38b,-8px -8px #fff6c9,8px -8px #fff6c9,-8px 8px #fff6c9,8px 8px #fff6c9,-16px -16px #ecdba2,16px -16px #ecdba2,-16px 16px #ecdba2,16px 16px #ecdba2,-24px -24px #d7c68e,24px -24px #d7c68e,-24px 24px #d7c68e,24px 24px #d7c68e;animation:none;display:block;z-index:2;transform:scale(.6);transform-origin:50% 50%}
#gandalfGuide .gandalf-moria-light[hidden]{display:none}



/* The persistent light owns the transformation; swapping img nodes must not restart it. */
#gandalfGuide.gandalf-returning .gandalf-character img{animation:none}
