/* Three editorial themes share the campus content and adapt every campus page. */
html[data-theme=samudra]{--ink:#123e50;--muted:#557481;--paper:#f3fbfc;--soft:#deeff2;--line:#c6e0e5;--accent:#91e4df;--accent-ink:#123e50;--deep:#10495a;--motif:radial-gradient(ellipse at 50% 100%,transparent 44%,#14748b12 45%,#14748b12 46%,transparent 47%),radial-gradient(ellipse at 0 0%,#14748b0b 35%,transparent 36%);--motif-size:76px 54px;--radius:24px}
html[data-theme=aurora]{--ink:#352c5f;--muted:#716b91;--paper:#f8f7ff;--soft:#ebe8ff;--line:#d9d3f3;--accent:#b8f2de;--accent-ink:#253c55;--deep:#30285a;--motif:radial-gradient(circle at 20% 30%,#7663c21c 1px,transparent 2px),radial-gradient(circle at 70% 70%,#40b7a817 2px,transparent 3px),linear-gradient(145deg,transparent 48%,#7663c20b 49%,#7663c20b 50%,transparent 51%);--motif-size:48px 48px;--radius:20px}
html[data-theme=senja]{--ink:#603c35;--muted:#886e66;--paper:#fff9f5;--soft:#f8e9df;--line:#efd4c8;--accent:#ffc18e;--accent-ink:#603c35;--deep:#643b39;--motif:radial-gradient(ellipse at 100% 0%,#df80520d 36%,transparent 37%),repeating-linear-gradient(155deg,transparent 0 34px,#a44e3510 35px 36px);--motif-size:72px 72px;--radius:18px}

html[data-mode=dark][data-theme=samudra]{--paper:#101d22;--soft:#182b31;--ink:#e8f5f5;--muted:#aac1c2;--line:#334e54;--deep:#09171e}
html[data-mode=dark][data-theme=aurora]{--paper:#171522;--soft:#242035;--ink:#f0edff;--muted:#b9b2d1;--line:#403a58;--deep:#17112a}
html[data-mode=dark][data-theme=senja]{--paper:#211917;--soft:#332522;--ink:#fff1e7;--muted:#d0b4a6;--line:#503a33;--deep:#211414}

/* Give each atmosphere a distinct silhouette and ambient movement. */
html[data-theme=samudra] .campus-storefront:not(.no-campus-background){background-image:radial-gradient(ellipse at 12% 6%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 42%),radial-gradient(ellipse at 92% 88%,color-mix(in srgb,var(--deep) 9%,transparent),transparent 43%)}
html[data-theme=samudra] .campus-storefront .campaign-window{border-radius:34px 8px 34px 8px}
html[data-theme=samudra] .campus-storefront .explorer-tile{border-radius:24px 8px 24px 8px}
html[data-theme=samudra] .campus-atmosphere .wash-one{animation-duration:32s}html[data-theme=samudra] .campus-atmosphere .wash-two{animation-duration:38s}

html[data-theme=aurora] .campus-storefront:not(.no-campus-background){background-image:radial-gradient(ellipse at 8% 14%,color-mix(in srgb,#c3b5ff 31%,transparent),transparent 38%),radial-gradient(ellipse at 92% 74%,color-mix(in srgb,#a2f1dc 24%,transparent),transparent 41%)}
html[data-theme=aurora] .campus-storefront .campaign-window{border-radius:30px;box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 50%,transparent),0 24px 65px color-mix(in srgb,var(--deep) 17%,transparent)}
html[data-theme=aurora] .campus-storefront .explorer-tile{border-radius:20px;background:color-mix(in srgb,var(--paper) 88%,var(--accent))}
html[data-theme=aurora] .campus-storefront .hero-spark{animation:slow-spin 22s linear infinite}
html[data-theme=aurora] .campus-atmosphere .wash-one{animation-duration:24s}html[data-theme=aurora] .campus-atmosphere .wash-three{animation-duration:29s}

html[data-theme=senja] .campus-storefront:not(.no-campus-background){background-image:radial-gradient(ellipse at 12% 10%,color-mix(in srgb,#ffd2a0 34%,transparent),transparent 40%),radial-gradient(ellipse at 95% 82%,color-mix(in srgb,#d76c50 11%,transparent),transparent 42%)}
html[data-theme=senja] .campus-storefront .campaign-window{border-radius:8px 34px 8px 34px}
html[data-theme=senja] .campus-storefront .explorer-tile{border-radius:18px 18px 5px 18px}
html[data-theme=senja] .campus-atmosphere .wash-one{animation-duration:35s}html[data-theme=senja] .campus-atmosphere .wash-three{animation-duration:42s}

/* Keep uploaded portraits transparent; the outline follows the image alpha. */
.interactive-ready .ambassador-portrait{background:transparent}
.interactive-ready .ambassador-portrait:not(.is-triptych){border:0;border-radius:0;box-shadow:none}
.interactive-ready .ambassador-portrait:not(.is-triptych) .ambassador-photo{object-fit:contain;object-position:center top;filter:drop-shadow(0 12px 16px #102e3638)}
.interactive-ready .ambassador-caption.ambassador-poster{border-radius:16px;background:color-mix(in srgb,var(--deep) 91%,transparent);backdrop-filter:blur(10px);box-shadow:0 10px 26px -12px color-mix(in srgb,var(--deep) 48%,transparent),inset 0 1px 0 #ffffff2e,0 0 0 1px color-mix(in srgb,var(--accent) 24%,transparent);transform:rotate(-1.5deg)}
.interactive-ready .ambassador-poster:after{border-radius:inherit;opacity:.55}
html.interactive-ready body.no-campus-depth .ambassador-portrait:not(.is-triptych){box-shadow:none}
html.interactive-ready body.no-campus-depth .ambassador-caption.ambassador-poster{box-shadow:none}
html[data-theme=samudra] .theme-option .swatch{background:linear-gradient(135deg,#10495a 50%,#91e4df 50%)}
html[data-theme=aurora] .theme-option .swatch{background:linear-gradient(135deg,#30285a 50%,#b8f2de 50%)}
html[data-theme=senja] .theme-option .swatch{background:linear-gradient(135deg,#643b39 50%,#ffc18e 50%)}

@media(max-width:700px){html[data-theme=samudra] .campus-storefront .campaign-window,html[data-theme=senja] .campus-storefront .campaign-window{border-radius:23px}}
@media(prefers-reduced-motion:reduce){html[data-theme=aurora] .campus-storefront .hero-spark{animation:none}}

/* Keep the transparent student cutout recognizable and join its nameplate to the portrait. */
.interactive-ready .campus-ambassadors .ambassador-portrait.is-triptych{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;mask-image:none!important;-webkit-mask-image:none!important}
.interactive-ready .campus-ambassadors .ambassador-portrait.is-triptych{filter:none!important}
.interactive-ready .campus-ambassadors .ambassador-photo-size .ambassador-portrait:not(.is-triptych){width:100%}
.interactive-ready .campus-ambassadors .ambassador-portrait.is-triptych .ambassador-photo{filter:drop-shadow(1px 0 0 color-mix(in srgb,var(--paper) 92%,white)) drop-shadow(-1px 0 0 color-mix(in srgb,var(--paper) 92%,white)) drop-shadow(0 1px 0 color-mix(in srgb,var(--paper) 92%,white)) drop-shadow(0 -1px 0 color-mix(in srgb,var(--paper) 92%,white)) drop-shadow(0 0 3px color-mix(in srgb,var(--accent) 60%,transparent))}
.interactive-ready .campus-ambassadors .ambassador-caption.ambassador-poster{position:relative;z-index:5;margin-top:clamp(-28px,-4vw,-20px)!important;transform:rotate(-1.5deg) translateY(-10px)}
.interactive-ready body.no-campus-depth .campus-ambassadors .ambassador-portrait.is-triptych .ambassador-photo{filter:drop-shadow(1px 0 0 color-mix(in srgb,var(--paper) 92%,white)) drop-shadow(-1px 0 0 color-mix(in srgb,var(--paper) 92%,white)) drop-shadow(0 1px 0 color-mix(in srgb,var(--paper) 92%,white)) drop-shadow(0 -1px 0 color-mix(in srgb,var(--paper) 92%,white)) drop-shadow(0 0 2px color-mix(in srgb,var(--accent) 50%,transparent))}

/* Keep portrait adjustments independent from carousel and entrance animations. */
.interactive-ready .campus-ambassadors .ambassador-photo-size .ambassador-portrait{translate:none!important;transform:translate3d(var(--portrait-x,0px),calc(var(--portrait-offset,0%) + var(--portrait-y,0px)),0) scale(var(--portrait-scale,1.2));transform-origin:center top;transition:transform .35s ease-out}
.interactive-ready .campus-ambassadors .ambassador-photo-size{overflow:visible;align-items:start}
.interactive-ready .campus-ambassadors .ambassador-person.photo-outline-theme .ambassador-photo{filter:drop-shadow(1px 0 0 var(--accent)) drop-shadow(-1px 0 0 var(--accent)) drop-shadow(0 1px 0 var(--accent)) drop-shadow(0 -1px 0 var(--accent)) drop-shadow(0 0 3px color-mix(in srgb,var(--accent) 55%,transparent))}
.interactive-ready .campus-ambassadors .ambassador-person.photo-outline-white .ambassador-photo{filter:drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff) drop-shadow(0 0 3px #ffffffa6)}
@media(max-width:700px){
 .interactive-ready .campus-ambassadors .ambassador-person:not([hidden]){grid-template-columns:minmax(0,46%) minmax(0,54%);grid-template-rows:minmax(0,1fr);align-items:stretch;gap:8px;padding:4px 10px 8px 4px}
 .interactive-ready .campus-ambassadors .ambassador-photo-size{display:flex;justify-content:center;align-items:flex-start;height:100%;padding:8px 0 0;overflow:visible}
 .interactive-ready .campus-ambassadors .ambassador-photo-size .ambassador-portrait{height:100%;width:auto;max-width:100%;transform-origin:center top}
 .interactive-ready .campus-ambassadors .ambassador-caption.ambassador-poster{align-self:center;width:100%;max-width:none;margin:0!important;padding:10px 9px;box-sizing:border-box;border-radius:12px;transform:rotate(-1deg)}
 .interactive-ready .campus-ambassadors .ambassador-poster:after{left:-3px;top:-3px;right:4px;bottom:4px}
 .interactive-ready .campus-ambassadors .ambassador-caption.ambassador-poster h2{font-size:clamp(14px,3.8vw,21px)}
}
@media(prefers-reduced-motion:reduce){.interactive-ready .campus-ambassadors .ambassador-photo-size .ambassador-portrait{transition:none;transform:translate3d(0,var(--portrait-offset,0%),0) scale(var(--portrait-scale,1.2))!important}}
.motion-paused .campus-ambassadors .ambassador-photo-size .ambassador-portrait,.admin-motion-off .campus-ambassadors .ambassador-photo-size .ambassador-portrait,.ambassador-photo-paused .campus-ambassadors .ambassador-photo-size .ambassador-portrait{transform:translate3d(0,var(--portrait-offset,0%),0) scale(var(--portrait-scale,1.2))!important}

/* Clip the shared portrait sheet inside its own window, then draw its outline outside that window. */
.interactive-ready .campus-ambassadors .ambassador-photo-clip{position:absolute;inset:0;overflow:hidden}
.interactive-ready .campus-ambassadors .ambassador-portrait.is-triptych{overflow:visible;mask-image:none!important;-webkit-mask-image:none!important}
.interactive-ready .campus-ambassadors .ambassador-portrait.is-triptych .ambassador-photo{filter:none!important}
.interactive-ready .campus-ambassadors .ambassador-person.photo-outline-theme .ambassador-portrait.is-triptych .ambassador-photo-clip{filter:drop-shadow(1px 0 0 var(--accent)) drop-shadow(-1px 0 0 var(--accent)) drop-shadow(0 1px 0 var(--accent)) drop-shadow(0 -1px 0 var(--accent)) drop-shadow(0 0 3px color-mix(in srgb,var(--accent) 55%,transparent))}
.interactive-ready .campus-ambassadors .ambassador-person.photo-outline-white .ambassador-portrait.is-triptych .ambassador-photo-clip{filter:drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff) drop-shadow(0 0 3px #ffffffa6)}
/* On phones, keep the whole cutout visible and lift it clear of the ambassador controls. */
@media(max-width:700px){
 .interactive-ready .campus-ambassadors .ambassador-photo-size{padding:0 0 clamp(36px,6dvh,50px);box-sizing:border-box}
 .interactive-ready .campus-ambassadors .ambassador-photo-size .ambassador-portrait{transform:translate3d(calc(var(--portrait-x,0px) + var(--portrait-mobile-nudge,0px)),calc(max(var(--portrait-offset,0%),0%) + max(var(--portrait-y,0px),0px)),0) scale(min(var(--portrait-scale,1.2),1.3));transform-origin:center top}
}
@media(max-width:700px) and (prefers-reduced-motion:reduce){
 .interactive-ready .campus-ambassadors .ambassador-photo-size .ambassador-portrait{transition:none;transform:translate3d(calc(var(--portrait-x,0px) + var(--portrait-mobile-nudge,0px)),calc(max(var(--portrait-offset,0%),0%) + max(var(--portrait-y,0px),0px)),0) scale(min(var(--portrait-scale,1.2),1.3))!important}
}
@media(max-width:700px){
 .motion-paused .campus-ambassadors .ambassador-photo-size .ambassador-portrait,.admin-motion-off .campus-ambassadors .ambassador-photo-size .ambassador-portrait,.ambassador-photo-paused .campus-ambassadors .ambassador-photo-size .ambassador-portrait{transform:translate3d(calc(var(--portrait-x,0px) + var(--portrait-mobile-nudge,0px)),calc(max(var(--portrait-offset,0%),0%) + max(var(--portrait-y,0px),0px)),0) scale(min(var(--portrait-scale,1.2),1.3))!important}
}
@media(max-width:600px){
 .interactive-ready .campus-ambassadors .ambassador-person:not([hidden]){--portrait-mobile-nudge:clamp(0px,1.6vw,9px);--caption-mobile-nudge:clamp(-8px,-1.4vw,0px)}
 .interactive-ready .campus-ambassadors .ambassador-caption.ambassador-poster{transform:translateX(var(--caption-mobile-nudge,0px)) rotate(-1deg)}
}
@media(min-width:450px) and (max-width:600px){
 .interactive-ready .campus-ambassadors .ambassador-person:not([hidden]){--portrait-mobile-nudge:clamp(15px,3.2vw,18px);--caption-mobile-nudge:clamp(-22px,-4vw,-18px)}
}

/* Each campus theme gets a different ambient rhythm and slider-light signature.
   Motion stays transform/opacity based so the effects remain inexpensive. */
html[data-theme=universitas] .campus-atmosphere .wash-one{animation:campus-uni-breeze 34s ease-in-out infinite alternate}
html[data-theme=universitas] .campus-atmosphere .wash-two{animation:campus-uni-breeze 43s ease-in-out -17s infinite alternate-reverse}
html[data-theme=universitas] .campus-atmosphere .wash-three{animation:campus-uni-breeze 49s ease-in-out -9s infinite alternate}
html[data-theme=teknik] .campus-atmosphere .wash-one{animation:campus-tech-pulse 20s ease-in-out infinite}
html[data-theme=teknik] .campus-atmosphere .wash-two{animation:campus-tech-pulse 27s ease-in-out -8s infinite reverse}
html[data-theme=teknik] .campus-atmosphere .wash-three{animation:campus-tech-pulse 32s ease-in-out -15s infinite}
html[data-theme=kesehatan] .campus-atmosphere .wash-one{animation:campus-health-heartbeat 10s ease-in-out infinite}
html[data-theme=kesehatan] .campus-atmosphere .wash-two{animation:campus-health-heartbeat 13s ease-in-out -5s infinite reverse}
html[data-theme=kesehatan] .campus-atmosphere .wash-three{animation:campus-health-heartbeat 15s ease-in-out -9s infinite}
html[data-theme=bisnis] .campus-atmosphere .wash-one{animation:campus-business-rise 31s cubic-bezier(.3,.05,.65,1) infinite}
html[data-theme=bisnis] .campus-atmosphere .wash-two{animation:campus-business-rise 38s cubic-bezier(.3,.05,.65,1) -12s infinite reverse}
html[data-theme=bisnis] .campus-atmosphere .wash-three{animation:campus-business-rise 45s cubic-bezier(.3,.05,.65,1) -25s infinite}
html[data-theme=hukum] .campus-atmosphere .wash-one{animation:campus-law-balance 23s ease-in-out infinite}
html[data-theme=hukum] .campus-atmosphere .wash-two{animation:campus-law-balance 29s ease-in-out -12s infinite reverse}
html[data-theme=hukum] .campus-atmosphere .wash-three{animation:campus-law-balance 36s ease-in-out -20s infinite}
html[data-theme=seni] .campus-atmosphere .wash-one{animation:campus-art-orbit 48s linear infinite}
html[data-theme=seni] .campus-atmosphere .wash-two{animation:campus-art-orbit 59s linear -19s infinite reverse}
html[data-theme=seni] .campus-atmosphere .wash-three{animation:campus-art-orbit 67s linear -38s infinite}
html[data-theme=sains] .campus-atmosphere .wash-one{animation:campus-science-orbit 28s ease-in-out infinite}
html[data-theme=sains] .campus-atmosphere .wash-two{animation:campus-science-orbit 36s ease-in-out -12s infinite reverse}
html[data-theme=sains] .campus-atmosphere .wash-three{animation:campus-science-orbit 42s ease-in-out -21s infinite}
html[data-theme=pendidikan] .campus-atmosphere .wash-one{animation:campus-learning-page 30s ease-in-out infinite alternate}
html[data-theme=pendidikan] .campus-atmosphere .wash-two{animation:campus-learning-page 37s ease-in-out -16s infinite alternate-reverse}
html[data-theme=pendidikan] .campus-atmosphere .wash-three{animation:campus-learning-page 44s ease-in-out -28s infinite alternate}
html[data-theme=samudra] .campus-atmosphere .wash-one{animation:campus-ocean-swell 38s ease-in-out infinite alternate}
html[data-theme=samudra] .campus-atmosphere .wash-two{animation:campus-ocean-swell 47s ease-in-out -18s infinite alternate-reverse}
html[data-theme=samudra] .campus-atmosphere .wash-three{animation:campus-ocean-swell 55s ease-in-out -31s infinite alternate}
html[data-theme=aurora] .campus-atmosphere .wash-one{animation:campus-aurora-curtain 27s ease-in-out infinite alternate}
html[data-theme=aurora] .campus-atmosphere .wash-two{animation:campus-aurora-curtain 34s ease-in-out -14s infinite alternate-reverse}
html[data-theme=aurora] .campus-atmosphere .wash-three{animation:campus-aurora-curtain 41s ease-in-out -24s infinite alternate}
html[data-theme=senja] .campus-atmosphere .wash-one{animation:campus-sunset-drift 40s ease-in-out infinite alternate}
html[data-theme=senja] .campus-atmosphere .wash-two{animation:campus-sunset-drift 48s ease-in-out -21s infinite alternate-reverse}
html[data-theme=senja] .campus-atmosphere .wash-three{animation:campus-sunset-drift 57s ease-in-out -35s infinite alternate}

html[data-theme=teknik] .campus-atmosphere .atmosphere-grid{background-position:0 0,0 0;animation:campus-tech-grid 40s linear infinite}
html[data-theme=sains] .campus-atmosphere .atmosphere-orbits{transform-origin:50% 50%;animation:campus-science-lines 70s linear infinite}
html[data-theme=aurora] .campus-atmosphere .atmosphere-orbits{animation:campus-aurora-lines 48s ease-in-out infinite alternate}
html[data-theme=samudra] .campus-atmosphere .atmosphere-orbits{animation:campus-ocean-lines 54s ease-in-out infinite alternate}
html[data-theme=teknik] .campus-atmosphere .atmosphere-particles i{animation-name:campus-tech-node}
html[data-theme=kesehatan] .campus-atmosphere .atmosphere-particles i{animation-name:campus-health-particle}
html[data-theme=hukum] .campus-atmosphere .atmosphere-particles i{animation-name:campus-law-particle}
html[data-theme=seni] .campus-atmosphere .atmosphere-particles i{animation-name:campus-art-particle}
html[data-theme=sains] .campus-atmosphere .atmosphere-particles i{animation-name:campus-science-particle}
html[data-theme=pendidikan] .campus-atmosphere .atmosphere-particles i{animation-name:campus-learning-particle}
html[data-theme=samudra] .campus-atmosphere .atmosphere-particles i{animation-name:campus-ocean-particle}
html[data-theme=aurora] .campus-atmosphere .atmosphere-particles i{animation-name:campus-aurora-particle}
html[data-theme=senja] .campus-atmosphere .atmosphere-particles i{animation-name:campus-sunset-particle}

html[data-theme=universitas] .campus-storefront .campaign-window:after{background:linear-gradient(112deg,transparent 40%,#ffffff24 46%,#ffffffbd 50%,#ffffff26 54%,transparent 61%);animation:campus-sweep-organic 9s ease-in-out infinite}
html[data-theme=teknik] .campus-storefront .campaign-window:after{inset:-55% -12%;background:linear-gradient(180deg,transparent 46%,#ffffff18 48%,#ffffffb5 50%,#ffffff20 52%,transparent 55%);animation:campus-sweep-scan 5s linear infinite}
html[data-theme=kesehatan] .campus-storefront .campaign-window:after{inset:-20%;background:radial-gradient(ellipse at center,#ffffffaa 0, #ffffff36 22%,transparent 68%);animation:campus-sweep-heartbeat 7s ease-in-out infinite}
html[data-theme=bisnis] .campus-storefront .campaign-window:after{background:linear-gradient(145deg,transparent 39%,#fff4d44a 45%,#fff8d9d1 50%,#ffd66a3b 55%,transparent 62%);animation:campus-sweep-growth 8s cubic-bezier(.28,.08,.62,.95) infinite}
html[data-theme=hukum] .campus-storefront .campaign-window:after{inset:-20% -75%;background:linear-gradient(90deg,transparent 47%,#ffffff18 49%,#ffffffbd 50%,#ffffff18 51%,transparent 53%);animation:campus-sweep-balance 11s ease-in-out infinite}
html[data-theme=seni] .campus-storefront .campaign-window:after{background:linear-gradient(115deg,transparent 30%,#f5eaff44 39%,#ffffffa8 45%,#d7b5ff55 51%,#a9f5e488 57%,transparent 68%);animation:campus-sweep-prism 12s ease-in-out infinite}
html[data-theme=sains] .campus-storefront .campaign-window:after{background:radial-gradient(circle,#ffffffbd 0 1px,transparent 2px) 0 0/24px 24px,linear-gradient(120deg,transparent 39%,#ffffff8c 50%,transparent 60%);animation:campus-sweep-molecule 13s ease-in-out infinite}
html[data-theme=pendidikan] .campus-storefront .campaign-window:after{background:repeating-linear-gradient(112deg,transparent 0 34px,#ffffff14 35px 37px,#ffffff9c 38px 39px,transparent 41px 68px);animation:campus-sweep-pages 10s ease-in-out infinite}
html[data-theme=samudra] .campus-storefront .campaign-window:after{background:repeating-linear-gradient(168deg,transparent 0 24px,#c5ffff18 25px 27px,#ffffffa3 28px 30px,transparent 31px 52px);animation:campus-sweep-wave 12s ease-in-out infinite}
html[data-theme=aurora] .campus-storefront .campaign-window:after{background:linear-gradient(112deg,transparent 27%,#bfffe544 37%,#e7d5ff9c 46%,#ffffffb8 51%,#9fffe855 60%,transparent 73%);animation:campus-sweep-curtain 11s ease-in-out infinite}
html[data-theme=senja] .campus-storefront .campaign-window:after{background:linear-gradient(118deg,transparent 32%,#ffd7a333 42%,#fff3d4c9 49%,#ffb36c54 55%,transparent 67%);animation:campus-sweep-sunset 12s ease-in-out infinite}

@keyframes campus-uni-breeze{from{transform:translate3d(-2%,1%,0) scale(.98) rotate(-1deg)}to{transform:translate3d(3%,-3%,0) scale(1.035) rotate(1deg)}}
@keyframes campus-tech-pulse{0%,100%{transform:translate3d(-1%,0,0) scale(.985);opacity:.48}50%{transform:translate3d(1%,0,0) scale(1.02);opacity:.76}}
@keyframes campus-health-heartbeat{0%,48%,100%{transform:scale(1);opacity:.55}55%{transform:scale(1.045);opacity:.82}62%{transform:scale(1.012);opacity:.67}70%{transform:scale(1.035);opacity:.8}}
@keyframes campus-business-rise{0%,100%{transform:translate3d(0,2%,0) scale(.99);opacity:.56}50%{transform:translate3d(2%,-4%,0) scale(1.04);opacity:.78}}
@keyframes campus-law-balance{0%,100%{transform:translate3d(-1%,0,0) rotate(-1.5deg) scale(1)}50%{transform:translate3d(1%,0,0) rotate(1.5deg) scale(1.02)}}
@keyframes campus-art-orbit{from{transform:translate3d(-1%,0,0) rotate(-3deg) scale(.98)}to{transform:translate3d(1%,-1%,0) rotate(3deg) scale(1.04)}}
@keyframes campus-science-orbit{0%,100%{transform:translate3d(-2%,1%,0) scale(.99)}33%{transform:translate3d(1%,-2%,0) scale(1.025)}66%{transform:translate3d(2%,1%,0) scale(1.01)}}
@keyframes campus-learning-page{0%,100%{transform:translate3d(-1%,1%,0) skewY(-.6deg) scale(1)}50%{transform:translate3d(2%,-2%,0) skewY(.6deg) scale(1.03)}}
@keyframes campus-ocean-swell{from{transform:translate3d(-3%,1%,0) scale(1)}to{transform:translate3d(3%,-1%,0) scale(1.04)}}
@keyframes campus-aurora-curtain{0%,100%{transform:translate3d(-3%,2%,0) scaleX(.98);opacity:.53}50%{transform:translate3d(3%,-2%,0) scaleX(1.04);opacity:.82}}
@keyframes campus-sunset-drift{from{transform:translate3d(-1%,3%,0) scale(1.015);opacity:.72}to{transform:translate3d(2%,-2%,0) scale(.98);opacity:.54}}
@keyframes campus-tech-grid{to{background-position:32px 32px,-32px 32px}}
@keyframes campus-science-lines{to{transform:translateY(var(--page-drift)) rotate(1turn)}}
@keyframes campus-aurora-lines{from{transform:translateY(var(--page-drift)) skewY(-1deg)}to{transform:translateY(var(--page-drift)) skewY(1deg)}}
@keyframes campus-ocean-lines{from{transform:translateY(calc(var(--page-drift) - 5px))}to{transform:translateY(calc(var(--page-drift) + 5px))}}
@keyframes campus-tech-node{0%,100%{transform:translate3d(0,0,0);opacity:.12}50%{transform:translate3d(0,-5px,0);opacity:.36}}
@keyframes campus-health-particle{0%,100%{transform:scale(.72);opacity:.12}50%{transform:scale(1.25);opacity:.34}}
@keyframes campus-law-particle{0%,100%{transform:translateX(-4px);opacity:.1}50%{transform:translateX(4px);opacity:.24}}
@keyframes campus-art-particle{from{transform:rotate(0deg) translateX(0) scale(.8);opacity:.12}to{transform:rotate(180deg) translateX(8px) scale(1.1);opacity:.32}}
@keyframes campus-science-particle{0%,100%{transform:translate3d(-3px,2px,0);opacity:.12}50%{transform:translate3d(3px,-4px,0);opacity:.34}}
@keyframes campus-learning-particle{0%,100%{transform:translateY(3px) rotate(-3deg);opacity:.12}50%{transform:translateY(-5px) rotate(3deg);opacity:.3}}
@keyframes campus-ocean-particle{0%,100%{transform:translate3d(-5px,0,0);opacity:.12}50%{transform:translate3d(5px,2px,0);opacity:.3}}
@keyframes campus-aurora-particle{0%,100%{transform:translate3d(-4px,3px,0) scale(.8);opacity:.12}50%{transform:translate3d(5px,-4px,0) scale(1.15);opacity:.38}}
@keyframes campus-sunset-particle{0%,100%{transform:translateY(5px);opacity:.08}50%{transform:translateY(-5px);opacity:.3}}
@keyframes campus-sweep-organic{0%,12%{transform:translateX(-58%) rotate(-2deg)}72%,100%{transform:translateX(58%) rotate(2deg)}}
@keyframes campus-sweep-scan{from{transform:translateY(-48%)}to{transform:translateY(48%)}}
@keyframes campus-sweep-heartbeat{0%,48%,100%{transform:scale(.88);opacity:.34}55%{transform:scale(1.04);opacity:.72}68%{transform:scale(.94);opacity:.48}78%{transform:scale(1.02);opacity:.68}}
@keyframes campus-sweep-growth{0%,14%{transform:translate3d(-58%,5%,0)}75%,100%{transform:translate3d(58%,-5%,0)}}
@keyframes campus-sweep-balance{0%,10%{transform:translateX(-55%)}90%,100%{transform:translateX(55%)}}
@keyframes campus-sweep-prism{0%,10%{transform:translateX(-55%) rotate(-3deg)}90%,100%{transform:translateX(55%) rotate(3deg)}}
@keyframes campus-sweep-molecule{0%,10%{transform:translate3d(-55%,2%,0) rotate(-3deg)}90%,100%{transform:translate3d(55%,-2%,0) rotate(3deg)}}
@keyframes campus-sweep-pages{0%,10%{transform:translateX(-58%) skewX(-4deg)}90%,100%{transform:translateX(58%) skewX(4deg)}}
@keyframes campus-sweep-wave{0%,10%{transform:translate3d(-55%,4%,0) skewY(-2deg)}90%,100%{transform:translate3d(55%,-4%,0) skewY(2deg)}}
@keyframes campus-sweep-curtain{0%,10%{transform:translate3d(-55%,4%,0) skewX(-8deg)}90%,100%{transform:translate3d(55%,-4%,0) skewX(8deg)}}
@keyframes campus-sweep-sunset{0%,10%{transform:translate3d(-52%,5%,0) rotate(-2deg)}90%,100%{transform:translate3d(52%,-2%,0) rotate(2deg)}}

@media(prefers-reduced-motion:reduce){
 .campus-atmosphere .atmosphere-wash,.campus-atmosphere .atmosphere-grid,.campus-atmosphere .atmosphere-orbits,.campus-atmosphere .atmosphere-particles i,.campus-storefront .campaign-window:after,.theme-option .swatch:after{animation:none!important;transform:none!important}
}
html.motion-paused .campus-atmosphere :is(.atmosphere-wash,.atmosphere-grid,.atmosphere-orbits,.atmosphere-particles i),html.motion-paused .campus-storefront .campaign-window:after{animation-play-state:paused!important}

/* Theme picker swatches preview the same motion language as the selected theme. */
.theme-option .swatch{overflow:hidden;isolation:isolate}
.theme-option .swatch:after{content:"";position:absolute;inset:-18%;pointer-events:none;opacity:.78;mix-blend-mode:screen}
.theme-option[data-set-theme=universitas] .swatch:after{background:linear-gradient(112deg,transparent 36%,#fff 49%,transparent 62%);animation:campus-preview-organic 5.8s ease-in-out infinite}
.theme-option[data-set-theme=teknik] .swatch:after{inset:-8% 0;background:linear-gradient(180deg,transparent 41%,#fff 49%,transparent 59%);animation:campus-preview-scan 3.2s linear infinite}
.theme-option[data-set-theme=kesehatan] .swatch:after{background:radial-gradient(ellipse at 50% 52%,#fff9,transparent 60%);animation:campus-preview-pulse 3.6s ease-in-out infinite}
.theme-option[data-set-theme=bisnis] .swatch:after{background:repeating-linear-gradient(90deg,transparent 0 7px,#fff9 7px 9px);transform-origin:bottom;animation:campus-preview-growth 4.8s ease-in-out infinite}
.theme-option[data-set-theme=hukum] .swatch:after{inset:12% 40%;background:linear-gradient(90deg,transparent,#fff9 40% 60%,transparent);transform-origin:50% 85%;animation:campus-preview-balance 5.2s ease-in-out infinite}
.theme-option[data-set-theme=seni] .swatch:after{inset:8%;border:2px solid #fff9;border-radius:50%;background:conic-gradient(from 0deg,transparent,#fff9,transparent 35%,#fff6,transparent 70%);mask:radial-gradient(transparent 48%,#000 54%);animation:campus-preview-prism 12s linear infinite}
.theme-option[data-set-theme=sains] .swatch:after{background:radial-gradient(circle at 26% 34%,#fff 0 2px,transparent 3px),radial-gradient(circle at 72% 38%,#fff 0 2px,transparent 3px),radial-gradient(circle at 53% 75%,#fff 0 2px,transparent 3px);animation:campus-preview-molecule 7s ease-in-out infinite}
.theme-option[data-set-theme=pendidikan] .swatch:after{background:repeating-linear-gradient(135deg,transparent 0 8px,#fff9 8px 9px);animation:campus-preview-pages 5s ease-in-out infinite}
.theme-option[data-set-theme=samudra] .swatch:after{background:repeating-linear-gradient(170deg,transparent 0 7px,#fff9 8px 9px,transparent 10px 15px);animation:campus-preview-wave 6s ease-in-out infinite}
.theme-option[data-set-theme=aurora] .swatch:after{background:linear-gradient(125deg,transparent 15%,#fff9 36%,#ffffff3d 48%,transparent 70%);animation:campus-preview-curtain 7s ease-in-out infinite}
.theme-option[data-set-theme=senja] .swatch:after{background:radial-gradient(ellipse at 50% 108%,#fff9,transparent 64%);animation:campus-preview-sunset 6.5s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.theme-option .swatch:after{animation:none!important;transform:none!important}}
html.motion-paused .theme-option .swatch:after{animation-play-state:paused!important}
@keyframes campus-preview-organic{0%,100%{transform:translate3d(-115%,10%,0) rotate(-7deg)}50%{transform:translate3d(115%,-8%,0) rotate(7deg)}}
@keyframes campus-preview-scan{from{transform:translateY(-85%)}to{transform:translateY(85%)}}
@keyframes campus-preview-pulse{0%,100%{transform:scale(.72);opacity:.28}50%{transform:scale(1.18);opacity:.92}}
@keyframes campus-preview-growth{0%,100%{transform:scaleY(.48) translateY(18%);opacity:.35}55%{transform:scaleY(1.05) translateY(-4%);opacity:.8}}
@keyframes campus-preview-balance{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
@keyframes campus-preview-prism{to{transform:rotate(1turn)}}
@keyframes campus-preview-molecule{0%,100%{transform:translate(-5%,-4%)}50%{transform:translate(5%,4%)}}
@keyframes campus-preview-pages{0%,100%{transform:translateX(-35%);opacity:.35}50%{transform:translateX(35%);opacity:.78}}
@keyframes campus-preview-wave{0%,100%{transform:translateX(-15%) skewY(-4deg)}50%{transform:translateX(15%) skewY(4deg)}}
@keyframes campus-preview-curtain{0%,100%{transform:translate(-35%,8%) skewX(-8deg);opacity:.35}50%{transform:translate(35%,-8%) skewX(8deg);opacity:.95}}
@keyframes campus-preview-sunset{0%,100%{transform:translateY(16%);opacity:.35}50%{transform:translateY(-8%);opacity:.9}}