.syn-university .university-orbit-frame{position:relative;isolation:isolate;border:1px solid var(--uni-line);border-radius:18px}
.syn-university .university-table-frame{overflow-x:auto;margin:16px 0;background:var(--uni-panel)}
.syn-university .university-edge-orbit{position:absolute;inset:0;pointer-events:none;z-index:4;border-radius:inherit;overflow:hidden}
.university-edge-orbit i{position:absolute;width:6px;height:6px;border-radius:50%;background:#087f98;box-shadow:0 0 7px #00cfe8,0 0 15px #8e5cff;offset-path:inset(3px round 18px);offset-distance:0%;animation:universityEdgeTravel 20s linear infinite;pointer-events:none}
html[data-theme="dark"] .university-edge-orbit i{background:#c5fff3;box-shadow:0 0 8px #00cfe8,0 0 18px #8e5cff}
.syn-university .university-orbit-frame:hover .university-edge-orbit i{box-shadow:0 0 9px #00cfe8,0 0 23px #8e5cff}
@keyframes universityEdgeTravel{to{offset-distance:100%}}
@supports not (offset-path:inset(1px round 10px)){.university-edge-orbit{display:none}}
@media(prefers-reduced-motion:reduce){.university-edge-orbit{display:none}}

/* Rotating light stays behind the course card's readable content. */
.syn-university .course-card{position:relative;isolation:isolate}
.syn-university .course-card>.university-card-glow{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:0}
.university-card-glow i{position:absolute;left:50%;top:50%;width:160%;aspect-ratio:1;border-radius:50%;background:conic-gradient(from 0deg,#5c33ff,#00cfe8,#50e49a,#8e5cff,#5c33ff);filter:blur(45px);opacity:.09;transform:translate(-50%,-50%) rotate(0deg);animation:universityCardSpin 24s linear infinite}
html[data-theme="dark"] .university-card-glow i{opacity:.16}
.syn-university .course-card:hover .university-card-glow i{opacity:.15}
html[data-theme="dark"] .syn-university .course-card:hover .university-card-glow i{opacity:.23}
.syn-university .course-card>:not(.university-card-glow):not(.university-edge-orbit){position:relative;z-index:1}
@keyframes universityCardSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.university-card-glow i{animation:none!important}}

.syn-university .university-alive-button{position:relative;isolation:isolate;overflow:hidden;border-radius:12px!important}
.university-button-label{position:relative;z-index:3;color:#fff}
.university-button-glow{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:inherit;z-index:1}
.university-button-glow i{position:absolute;left:50%;top:50%;width:170%;aspect-ratio:1;background:conic-gradient(#5c33ff,#00cfe8,#50e49a,#8e5cff,#5c33ff);filter:blur(14px);opacity:.36;transform:translate(-50%,-50%) rotate(0deg);animation:universityCardSpin 10s linear infinite}
.university-button-orbit{position:absolute;inset:0;pointer-events:none;z-index:4;border-radius:inherit}
.university-button-orbit i{position:absolute;width:5px;height:5px;border-radius:50%;background:#d8fff5;box-shadow:0 0 7px #00cfe8,0 0 15px #8e5cff;offset-path:inset(2px round 11px);offset-distance:0%;animation:universityEdgeTravel 7s linear infinite}
@supports not (offset-path:inset(1px round 10px)){.university-button-orbit{display:none}}
@media(prefers-reduced-motion:reduce){.university-button-glow i{animation:none!important}.university-button-orbit{display:none}}
/* Flowing border streak replaces the point-orb on course action buttons. */
@property --uni-button-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --uni-button-source{syntax:'<percentage>';inherits:false;initial-value:10%}
.syn-university .university-alive-button{border:2px solid transparent!important;background:linear-gradient(115deg,#485aff,#7059ff) padding-box,conic-gradient(from var(--uni-button-angle) at var(--uni-button-source) 50%,#6652ff55 0deg,#00e8c9 45deg,#c3fff0 68deg,#7059ff44 90deg,#7059ff44 235deg,#9a70ff 270deg,#6652ff55 310deg) border-box!important;animation:universityButtonFlow 6s ease-in-out infinite,universityButtonSource 5s ease-in-out infinite alternate;box-shadow:0 6px 20px #5c33ff24}
.university-alive-button .university-button-orbit{display:none!important}
@keyframes universityButtonFlow{0%{--uni-button-angle:0deg}100%{--uni-button-angle:360deg}}
@keyframes universityButtonSource{from{--uni-button-source:10%}to{--uni-button-source:90%}}
@media(prefers-reduced-motion:reduce){.syn-university .university-alive-button{animation:none!important}}
/* Direct selector: works even before the JS decoration is added. */
body.syn-app.syn-university .course-card .course-card-body>a.button{position:relative!important;isolation:isolate;overflow:hidden!important;background:var(--uni-panel)!important;color:var(--uni-text)!important;border:0!important;border-radius:12px!important;padding:13px 20px!important;animation:none!important;box-shadow:0 6px 20px #00cfe815!important}
body.syn-app.syn-university .course-card .course-card-body>a.button .university-button-label{color:var(--uni-text)!important}
body.syn-app.syn-university .course-card .course-card-body>a.button::before{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;pointer-events:none;z-index:5;background:conic-gradient(from var(--uni-button-angle) at var(--uni-button-source) 50%,transparent 0deg,#00d6ab 45deg,#b0ffec 65deg,transparent 92deg,transparent 360deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;animation:universityButtonFlow 5s linear infinite,universityButtonSource 5s ease-in-out infinite alternate}
body.syn-app.syn-university .course-card .course-card-body>a.button .university-button-glow{opacity:.3}
@media(prefers-reduced-motion:reduce){body.syn-app.syn-university .course-card .course-card-body>a.button::before{animation:none!important}}
/* Card border light: replaces the point orb without changing card content. */
@property --uni-card-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --uni-card-source{syntax:'<percentage>';inherits:false;initial-value:15%}
.syn-university .course-card>.university-edge-orbit i{display:none!important}
.syn-university .course-card>.university-edge-orbit{inset:0;padding:2px;border-radius:inherit;overflow:visible;background:conic-gradient(from var(--uni-card-angle) at var(--uni-card-source) 50%,transparent 0deg,#00cfa9 40deg,#b3ffeb 60deg,transparent 86deg,transparent 235deg,#8e5cff88 265deg,transparent 295deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;animation:universityCardBorderSlide 10s ease-in-out infinite,universityCardBorderShift 9s ease-in-out infinite alternate;pointer-events:none}
.syn-university .course-card:nth-child(2n)>.university-edge-orbit{animation-delay:-4s,-3s}
@keyframes universityCardBorderSlide{to{--uni-card-angle:360deg}}
@keyframes universityCardBorderShift{from{--uni-card-source:15%}to{--uni-card-source:85%}}
@media(prefers-reduced-motion:reduce){.syn-university .course-card>.university-edge-orbit{display:none!important;animation:none!important}}

/* University-wide border patch */
@property --hooks-edge-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --hooks-edge-source{syntax:'<percentage>';inherits:false;initial-value:15%}
.syn-university .hooks-glow-target{position:relative;isolation:isolate}
.hooks-glow-target>.hooks-edge-glow{position:absolute;inset:0;border-radius:inherit;padding:2px;pointer-events:none;z-index:6;background:conic-gradient(from var(--hooks-edge-angle) at var(--hooks-edge-source) 50%,transparent 0deg,#00cfa9 40deg,#b3ffeb 60deg,transparent 86deg,transparent 235deg,#8e5cff99 265deg,transparent 295deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;animation:hooksEdgeTurn 10s linear infinite,hooksEdgeShift 9s ease-in-out infinite alternate}
.hooks-glow-target.hooks-glow-button>.hooks-edge-glow{animation-duration:5s,5s;border-radius:inherit}
.hooks-glow-target>.hooks-edge-glow:nth-last-child(1){animation-delay:var(--hooks-glow-delay,0s),var(--hooks-glow-delay,0s)}
.hooks-cover-frame{display:block;position:relative;min-width:0;width:100%;border-radius:22px;line-height:0}
.hooks-cover-frame>.cover{display:block}
.hooks-course .course-real-art,.hooks-lesson .video{border-radius:18px}
@keyframes hooksEdgeTurn{to{--hooks-edge-angle:360deg}}
@keyframes hooksEdgeShift{from{--hooks-edge-source:15%}to{--hooks-edge-source:85%}}
html[data-theme=light] .hooks-edge-glow{opacity:.85}
html[data-theme=dark] .hooks-edge-glow{opacity:1}
@media(prefers-reduced-motion:reduce){.hooks-glow-target>.hooks-edge-glow{animation:none;opacity:.4}}
