/* The Register Run – Easter egg styles (school red #e2001a / #a50012, matching the theme) */

/* 1. the lost register peeking out of the Fun corner */
.tsp-rr-lost{position:absolute;z-index:5;width:58px;height:74px;padding:0;border:0;background:none;cursor:pointer;
  transform-origin:50% 90%;animation:tsp-rr-peek 2.6s ease-in-out infinite;filter:drop-shadow(0 4px 6px rgba(0,0,0,.28))}
.tsp-rr-lost svg{display:block;width:100%;height:100%}
.tsp-rr-lost .tsp-rr-psst{position:absolute;left:50%;top:-30px;transform:translateX(-50%);background:#fff;color:#a50012;
  font:700 13px/1 "Baloo 2","Trebuchet MS","Segoe UI",sans-serif;padding:6px 10px;border-radius:999px;border:2px solid #e2001a;
  white-space:nowrap;opacity:0;transition:opacity .3s;pointer-events:none}
.tsp-rr-lost .tsp-rr-psst::after{content:"";position:absolute;left:50%;bottom:-7px;width:10px;height:10px;background:#fff;
  border-right:2px solid #e2001a;border-bottom:2px solid #e2001a;transform:translateX(-50%) rotate(45deg)}
.tsp-rr-lost:hover .tsp-rr-psst,.tsp-rr-lost:focus-visible .tsp-rr-psst,.tsp-rr-lost.is-wave .tsp-rr-psst{opacity:1}
.tsp-rr-lost:focus-visible{outline:4px solid #f2b705;outline-offset:4px;border-radius:12px}
.tsp-rr-lost.is-go{animation:tsp-rr-go .4s ease-in forwards}
@keyframes tsp-rr-peek{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
@keyframes tsp-rr-go{to{transform:translateY(-40px) scale(.5);opacity:0}}

/* 2. the mascot wiggles with each tap */
.tsp-rr-mascot{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
.tsp-rr-wiggle{animation:tsp-rr-wiggle .35s ease-in-out;transform-origin:50% 80%}
@keyframes tsp-rr-wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-10deg) scale(1.08)}75%{transform:rotate(10deg) scale(1.08)}}

/* 3 and 4. the card on the "page not found" and search pages */
.tsp-rr-card{display:flex;gap:18px;align-items:center;background:#fff;border:3px solid #e2001a;border-radius:20px;
  padding:18px 20px;margin:18px 0 26px;box-shadow:0 6px 0 #a50012;color:#1d1a33;text-align:left}
.tsp-rr-card .tsp-rr-card-art{flex:0 0 68px;width:68px}
.tsp-rr-card .tsp-rr-card-art svg{display:block;width:100%;height:auto;transform:rotate(-8deg)}
.tsp-rr-card h2{margin:0 0 4px;font:800 1.45rem/1.1 "Baloo 2","Trebuchet MS","Segoe UI",sans-serif;color:#a50012}
.tsp-rr-card p{margin:0 0 12px;font-size:1rem;line-height:1.45}
.tsp-rr-play{background:#e2001a;color:#fff;border:0;border-radius:999px;padding:12px 24px;
  font:700 1.05rem/1 "Baloo 2","Trebuchet MS","Segoe UI",sans-serif;cursor:pointer;box-shadow:0 4px 0 #a50012}
.tsp-rr-play:hover{background:#c80017}
.tsp-rr-play:active{transform:translateY(3px);box-shadow:0 1px 0 #a50012}
.tsp-rr-play:focus-visible{outline:4px solid #f2b705;outline-offset:3px}
@media (max-width:480px){.tsp-rr-card{flex-direction:column;text-align:center}.tsp-rr-card .tsp-rr-card-art{width:56px;flex-basis:auto}}

/* the game over the top of the page */
#tsp-rr-overlay{position:fixed;inset:0;z-index:2147483000;background:#15161c}
#tsp-rr-overlay[hidden]{display:none}
#tsp-rr-overlay iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:#15161c}
#tsp-rr-overlay .tsp-rr-close{position:absolute;z-index:2;top:calc(env(safe-area-inset-top,0px) + 10px);right:calc(env(safe-area-inset-right,0px) + 10px);
  width:46px;height:46px;border-radius:50%;border:3px solid #e2001a;background:#fff;color:#a50012;font:700 20px/1 "Segoe UI",system-ui,sans-serif;cursor:pointer;
  box-shadow:0 3px 8px rgba(0,0,0,.35)}
#tsp-rr-overlay.is-ready .tsp-rr-close{display:none} /* the game shows its own "Back to the website" button once loaded */
html.tsp-rr-open,html.tsp-rr-open body{overflow:hidden !important}

@media (prefers-reduced-motion: reduce){
  .tsp-rr-lost,.tsp-rr-lost.is-go,.tsp-rr-wiggle{animation:none}
  .tsp-rr-lost .tsp-rr-psst{opacity:1}
}
@media (prefers-color-scheme: dark){
  .tsp-rr-card{background:#1f1a3a;color:#f2effa;border-color:#ff3347;box-shadow:0 6px 0 #b3001a}
  .tsp-rr-card h2{color:#ff6b7a}
}