/* Magic UI-inspired light effects, adapted to TeacherHub's silver/white palette. */
.magic-card{isolation:isolate;--magic-x:50%;--magic-y:50%}
.magic-card::before{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:radial-gradient(310px circle at var(--magic-x) var(--magic-y),#d9d9d955,transparent 100%);opacity:0;transition:opacity .35s ease}
.magic-card.magic-pointer::before{opacity:1}
.magic-card:focus-within::before{opacity:.55}
.contribution-choice:focus-visible::before{opacity:.55}

/* The mask exposes only the 1px rim. It never covers content or intercepts a click. */
.border-beam{position:absolute;inset:-1px;z-index:2;padding:1px;overflow:hidden;border-radius:inherit;pointer-events:none;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.border-beam>span{position:absolute;top:0;left:0;width:100px;height:100px;offset-path:rect(0 auto auto 0 round 8px);offset-anchor:50% 50%;background:linear-gradient(90deg,transparent,#a8afbc 40%,#616a7a 65%,transparent);animation:hub-border-beam 8s linear infinite;animation-play-state:paused}
.auth-dialog>.border-beam{inset:0}
[data-magic-visible]>.border-beam>span{animation-play-state:running}
@keyframes hub-border-beam{from{offset-distance:0%}to{offset-distance:100%}}
@supports not (offset-path:rect(0 auto auto 0 round 8px)){.border-beam{display:none}}

/* A pseudo-element leaves the button label intact when copy feedback changes it. */
.shiny-button{position:relative;isolation:isolate;overflow:hidden}
.shiny-button::after{content:'';position:absolute;inset:-60% -10%;pointer-events:none;background:linear-gradient(110deg,transparent 32%,#ffffff05 40%,#ffffff30 50%,#ffffff05 60%,transparent 68%);transform:translateX(-140%);animation:hub-button-shine 7s ease-in-out infinite;animation-play-state:paused}
.shiny-button[data-magic-visible]:not(:disabled)::after{animation-play-state:running}
.shiny-button:disabled::after{display:none}
@keyframes hub-button-shine{0%,8%{transform:translateX(-140%)}35%,100%{transform:translateX(140%)}}
.magic-paused .border-beam>span,.magic-paused .shiny-button::after{animation-play-state:paused!important}
@media(hover:none),(pointer:coarse){.magic-card::before{display:none}}
@media(prefers-reduced-motion:reduce){.magic-card::before{transition:none;display:none}.border-beam,.shiny-button::after{display:none}}
@media(forced-colors:active){.magic-card::before,.border-beam,.shiny-button::after{display:none}}