/* A lightweight, sculpted CSS character: no model downloads or WebGL required. */
.campus-guide { position: fixed; z-index: 8; right: 22px; top: 112px; width: 202px; font-family: 'Segoe UI', sans-serif; }
.campus-guide[hidden], .guide-show[hidden] { display: none; }
.guide-bubble { position: relative; padding: 14px 16px; border: 1px solid #dce5d6; border-radius: 18px 18px 5px 18px; background: #fffffff5; box-shadow: 0 10px 35px #123f3214; }
.guide-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.guide-heading > span { color: #60816b; font-size: 9px; letter-spacing: .1em; font-weight: 750; }
.guide-hide { width: 28px; height: 28px; margin: -6px -7px -4px 0; border: 0; background: transparent; color: #5e7268; font-size: 20px; cursor: pointer; }
.guide-message { color: #214e3b; font-size: 12px; line-height: 1.6; margin: 8px 0 10px; }
.guide-next { padding: 5px 0; border: 0; background: transparent; color: #08694d; font: 650 11px 'Segoe UI', sans-serif; cursor: pointer; text-align: left; }
.guide-next:hover { text-decoration: underline; }
.guide-stage { position: relative; width: 152px; height: 174px; margin-left: auto; perspective: 600px; pointer-events: none; }
.guide-character { position: absolute; top: 18px; left: 32px; width: 90px; height: 132px; transform: rotateY(-14deg) rotateX(5deg); transform-style: preserve-3d; }
.guide-head { position: absolute; z-index: 4; top: 12px; left: 7px; width: 76px; height: 60px; border-radius: 26px 26px 23px 23px; background: radial-gradient(ellipse at 30% 15%, #fffef3 15%, #e3e9d7 62%, #9eaf94); box-shadow: inset -5px -5px 9px #6b816940, inset 3px 3px 5px white, 0 5px 4px #183b3220; }
.guide-face { position: absolute; inset: 15px 9px 12px; border-radius: 13px 13px 17px 17px; background: linear-gradient(135deg,#285744,#082e25); box-shadow: inset 0 3px 5px #001c21; }
.guide-face i { position: absolute; width: 7px; height: 10px; top: 9px; left: 13px; border-radius: 50%; background: #f8da87; box-shadow: 0 0 7px #f8da8750; }
.guide-face i:nth-child(2) { left: 37px; }
.guide-face b { position: absolute; left: 25px; top: 19px; width: 9px; height: 6px; border-bottom: 2px solid #f8da87; border-radius: 50%; }
.guide-antenna { position: absolute; top: 0; left: 44px; width: 4px; height: 18px; background: #91a88e; transform: rotate(12deg); }
.guide-antenna i { position: absolute; top: -5px; left: -4px; width: 12px; height: 12px; border-radius: 50%; background: radial-gradient(circle at 30% 25%,#fff4c3,#d6a738 70%); box-shadow: 0 0 0 4px #efc76620; }
.guide-body { position: absolute; z-index: 3; top: 67px; left: 19px; width: 53px; height: 43px; border-radius: 16px 16px 20px 20px; background: linear-gradient(110deg,#4e8b68,#156044 60%,#0a3c2d); box-shadow: inset 3px 2px 4px #80b48c, inset -4px -4px 6px #062f2b50; }
.guide-body span { display: grid; place-items: center; width: 23px; height: 23px; margin: 8px auto; border: 1px solid #f2d78690; border-radius: 50%; color: #f8da87; font-size: 21px; line-height: 1; }
.guide-pack { position: absolute; top: 69px; left: 62px; width: 21px; height: 36px; border-radius: 8px; background: linear-gradient(90deg,#dbb950,#8f742d); transform: translateZ(-8px); }
.guide-arm { position: absolute; z-index: 2; top: 73px; width: 15px; height: 35px; border-radius: 12px; background: linear-gradient(90deg,#f6f4df,#bac7ab); transform-origin: 50% 7px; box-shadow: inset -3px -2px 4px #6c81664a; }
.guide-arm-left { left: 6px; transform: rotate(20deg); }
.guide-arm-right { right: 3px; transform: rotate(-35deg); }
.guide-map { position: absolute; top: 21px; left: -7px; width: 31px; height: 26px; border: 3px solid #fff8dd; border-radius: 3px; background: repeating-linear-gradient(95deg,transparent 0 8px,#a8bea080 8px 9px),#e1ebcd; transform: rotate(16deg); box-shadow: 2px 3px 4px #123f3225; }
.guide-map span { position: absolute; width: 19px; height: 12px; top: 2px; left: 1px; border: 2px dashed #658d62; border-left: 0; border-bottom-right-radius: 9px; }
.guide-leg { position: absolute; top: 104px; width: 19px; height: 25px; border-radius: 6px 6px 9px 9px; background: linear-gradient(90deg,#e6ebd8,#aab99a); transform-origin: center top; border-bottom: 7px solid #204b39; }
.guide-leg-left { left: 23px; }
.guide-leg-right { left: 50px; }
.guide-shadow { position: absolute; width: 76px; height: 16px; bottom: 18px; left: 38px; border-radius: 50%; background: #204b3928; filter: blur(4px); }
.guide-orbit { position: absolute; bottom: 10px; left: 17px; width: 122px; height: 30px; border: 1px dashed #8ea77b99; border-radius: 50%; transform: rotate(-9deg); }
.guide-step { position: absolute; bottom: -1px; left: 63px; font: 600 8px 'Segoe UI',sans-serif; color: #58744e; letter-spacing: .15em; }
.guide-show { position: fixed; right: 20px; top: 112px; z-index: 8; padding: 10px 16px; border-radius: 999px; border: 1px solid #c6d2c8; background: #fff; color: #064a36; box-shadow: 0 5px 20px #123f3210; cursor: pointer; }
@keyframes guide-idle { 0%,100% { transform: translateY(0) rotateY(-14deg) rotateX(5deg); } 50% { transform: translateY(-5px) rotateY(8deg) rotateX(5deg); } }
@keyframes guide-wave { 0%,60%,100% { transform: rotate(20deg); } 70%,90% { transform: rotate(125deg); } 80% { transform: rotate(100deg); } }
@keyframes guide-blink { 0%,43%,47%,100% { transform: scaleY(1); } 45% { transform: scaleY(.15); } }
.motion-enabled .guide-character { animation: guide-idle 4s ease-in-out infinite; }
.motion-enabled .guide-arm-left { animation: guide-wave 8s ease-in-out infinite; }
.motion-enabled .guide-face i { animation: guide-blink 5s ease-in-out infinite; }
@keyframes guide-march {
  from { transform: rotate(-24deg) translateY(-2px); }
  to { transform: rotate(24deg) translateY(1px); }
}
@keyframes guide-walk-bob {
  from { transform: translateY(0) rotateY(-14deg) rotateX(5deg); }
  to { transform: translateY(-3px) rotateY(-14deg) rotateX(5deg); }
}
.motion-enabled .is-walking .guide-character { animation: guide-walk-bob .15s ease-in-out infinite alternate; }
.motion-enabled .is-walking .guide-leg-left,
.motion-enabled .is-walking .guide-arm-right { animation: guide-march .3s ease-in-out infinite alternate; }
.motion-enabled .is-walking .guide-leg-right,
.motion-enabled .is-walking .guide-arm-left { animation: guide-march .3s ease-in-out -.3s infinite alternate; }
body:has(.image-dialog[open]) .campus-guide, body:has(.image-dialog[open]) .guide-show { visibility: hidden; }
@media (max-width: 700px) {
  .campus-guide { right: 10px; top: 92px; width: 158px; display: flex; flex-direction: column; align-items: flex-end; }
  .guide-stage { width: 105px; height: 108px; transform: scale(.66); transform-origin: bottom right; margin-top: -42px; }
  .guide-bubble { padding: 10px 12px; }
  .guide-message { font-size: 11px; margin: 6px 0; }
  .guide-heading > span { font-size: 8px; }
  .guide-next { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) { .campus-guide { transform: none; } .campus-guide * { animation: none !important; } }


