/* Full-bleed photography belongs to content cards, never to working canvases,
   screenplay paper, messages, form fields or individual table/calendar cells. */
@media screen {
html[data-ag-theme][data-ag-ui] {
 --campus-card-image:url('/assets/portfolio/set.jpg');
 --campus-card-position:72% 48%;
 --campus-card-fade:linear-gradient(106deg,color-mix(in srgb,var(--theme-panel) 98%,transparent) 0%,color-mix(in srgb,var(--theme-panel) 95%,transparent) 35%,color-mix(in srgb,var(--theme-panel) 93%,transparent) 66%,color-mix(in srgb,var(--theme-panel) 92%,transparent) 100%);
 --campus-card-muted:color-mix(in srgb,var(--theme-muted) 70%,var(--theme-text));
 --campus-editorial-fade:linear-gradient(104deg,color-mix(in srgb,var(--theme-panel) 98%,transparent) 0%,color-mix(in srgb,var(--theme-panel) 95%,transparent) 35%,color-mix(in srgb,var(--theme-panel) 88%,transparent) 68%,color-mix(in srgb,var(--theme-panel) 72%,transparent) 100%);
}

/* The background itself fills the box. No extra photo strip, fixed height or
   content overlay is needed, so long titles and expanded forms keep growing. */
html[data-ag-theme][data-ag-ui] :is(
 .staff-page .staff-card,.staff-scope,.access-requests-page .requests-overview,.access-requests-page .access-request,
 .backup-card,.restore-card,.recognition-person-card,.shared-scripts-preview,
 :where(#faculty-app) .fc-card:not(.fc-activation),:where(#faculty-app) .fc-metric,
 .enrollment-page .enrollment-card,.attendance-panel,.attendance-check-in,.attendance-stat,.work-panel,.work-clock,.work-stat,
 .scrum-panel,.scrum-stat,.meetings,.meeting-panel,.meeting-stat,.education-schedule,
 .roadmap,.roadmap-home,.recognition-panel,.training-profile-summary,
 .campus-page [data-campus-widget="weekly"]>.campus-panel,
 .campus-page [data-campus-widget="employability"]>.campus-panel,
 :where(#campus-events) .campus-event-card,
 body.education-tool .library-grid .library-card,body.education-tool .project-grid .project-card
){
 background-color:var(--theme-panel)!important;
 background-image:var(--campus-card-fade),var(--campus-card-image)!important;
 background-size:cover!important;
 background-position:center,var(--campus-card-position)!important;
 background-repeat:no-repeat!important;
 border-color:color-mix(in srgb,var(--theme-accent) 22%,var(--theme-line))!important;
}

/* Match the subject to its function, including staff destinations. */
html[data-ag-theme] :is(.work-panel,.work-clock,.work-stat,.staff-card[href*='/work']){--campus-card-image:url('/assets/campus-home/work.webp');--campus-card-position:64% 53%}
html[data-ag-theme] :is(.enrollment-page .enrollment-card,.attendance-panel,.attendance-check-in,.attendance-stat,.staff-card[href*='/attendance']){--campus-card-image:url('/assets/campus-home/attendance.webp');--campus-card-position:65% 46%}
html[data-ag-theme] :is(.scrum-panel,.scrum-stat,.recognition-panel,.recognition-person-card,.training-profile-summary,.staff-card[href*='/scrum'],.staff-card[href*='/training']){--campus-card-image:url('/assets/campus-home/scrum.webp');--campus-card-position:65% 43%}
html[data-ag-theme] :is(.roadmap,.roadmap-home,.staff-card[href*='/roadmap'],body.education-tool.tool-screenwriting .library-card){--campus-card-image:url('/assets/campus-home/roadmap.webp');--campus-card-position:58% 51%}
html[data-ag-theme] :is(.education-schedule,.staff-card[href*='/schedule']){--campus-card-image:url('/assets/campus-home/schedule.webp');--campus-card-position:65% 48%}
html[data-ag-theme] :is(.meetings,.meeting-panel,.meeting-stat,.staff-card[href*='/meetings']){--campus-card-image:url('/assets/campus-home/meetings.webp');--campus-card-position:58% 48%}
html[data-ag-theme] :is(.requests-overview,.access-request,.campus-event-card,.staff-card[href*='/events'],.staff-card[href*='/requests']){--campus-card-image:url('/assets/campus-home/events.webp');--campus-card-position:65% 52%}
html[data-ag-theme] :is(.shared-scripts-preview,.campus-page [data-campus-widget="weekly"]>.campus-panel,.staff-card[href*='/submissions'],.staff-card[href*='/studio-week'],body.education-tool .project-grid .project-card){--campus-card-image:url('/assets/campus-home/submissions.webp');--campus-card-position:64% 58%}
html[data-ag-theme] :is(.campus-page [data-campus-widget="employability"]>.campus-panel,.staff-card[href*='/employability']){--campus-card-image:url('/assets/portfolio/space.jpg');--campus-card-position:76% 48%}
html[data-ag-theme] :is(.backup-card,.restore-card,.staff-scope,#faculty-app .fc-card:not(.fc-activation),#faculty-app .fc-metric){--campus-card-image:url('/assets/portfolio/shoot.jpg');--campus-card-position:76% 48%}

/* Existing photographic catalogue and learning cards retain their own images
   and animated SVG outlines; only their continuous fade is shared. */
html[data-ag-theme][data-ag-ui] .education-catalog .module-card::after,
html[data-ag-theme][data-ag-ui] #home-screen.photography-route .route-module.module-card::after{
 background-image:var(--campus-editorial-fade)!important;pointer-events:none;
}
html[data-ag-theme][data-ag-ui] :is(.education-catalog .module-photo,#home-screen.photography-route .route-module-photo){
 opacity:1!important;object-fit:cover;filter:saturate(.86) contrast(1.03);
}
html[data-ag-theme][data-ag-ui] .education-catalog .is-locked .module-photo{filter:saturate(.55) contrast(1.02)}
html[data-ag-theme][data-ag-ui] body[data-course] :is(.route-card,.lesson-banner){
 background-image:var(--campus-card-fade),var(--course-image,var(--campus-card-image))!important;
 background-size:cover!important;background-position:center,74% 46%!important;background-repeat:no-repeat!important;
}
html[data-ag-theme][data-ag-ui] .education-section-band::before{
 background-image:var(--campus-editorial-fade),var(--education-photo,var(--campus-card-image))!important;
 background-size:cover!important;background-position:center,74% 48%!important;
}
html[data-ag-theme][data-ag-ui] .profile-module-summary::before{
 background-image:var(--campus-card-fade),var(--profile-photo,var(--campus-card-image))!important;
 background-size:cover!important;background-position:center,74% 48%!important;pointer-events:none;
}

/* Keep secondary copy distinct on a photographic surface, in light themes too. */
html[data-ag-theme][data-ag-ui] :is(.staff-card,.access-request,.requests-overview,.backup-card,.restore-card,.recognition-person-card,.shared-scripts-preview) :is(h2,h3,strong),
html[data-ag-theme][data-ag-ui] body.education-tool :is(.library-grid .library-card h3,.project-grid .project-card h3){color:var(--theme-text)!important}
html[data-ag-theme][data-ag-ui] :is(.staff-card,.access-request,.backup-card,.restore-card,.shared-scripts-preview) :is(p,small),
html[data-ag-theme][data-ag-ui] body.education-tool :is(.library-grid .library-card,.project-grid .project-card) :is(.muted,p){color:var(--campus-card-muted)!important}
html[data-ag-theme][data-ag-ui] :is(.request-label,.request-username,.request-meta,.request-resolved,.requests-overview>span,.requests-overview>p,.staff-scope){color:var(--campus-card-muted)!important}
html[data-ag-theme][data-ag-ui] #home-screen.photography-route .route-module :is(h2,.question,li,.route-module-count){color:var(--theme-text)!important}
html[data-ag-theme][data-ag-ui] #home-screen.photography-route .route-module :is(.route-module-label,.route-objectives){color:var(--campus-card-muted)!important}

/* Theme lighting at the edge gives feedback without moving content or placing
   a clickable layer over actions. The established outlines remain intact. */
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 html[data-ag-theme][data-ag-ui] :is(.staff-card,.access-request,.backup-card,.campus-event-card,body.education-tool .library-grid .library-card,body.education-tool .project-grid .project-card){transition:border-color .3s ease,box-shadow .35s ease}
 html[data-ag-theme][data-ag-ui] :is(.staff-card,.access-request,.backup-card,.campus-event-card,body.education-tool .library-grid .library-card,body.education-tool .project-grid .project-card):is(:hover,:focus-within){border-color:var(--theme-accent)!important;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--theme-accent) 30%,transparent),0 9px 28px color-mix(in srgb,var(--theme-bg) 16%,transparent)}
}
/* Small screens need the same full image, with a denser fade behind wrapping
   text. No mobile height or overflow rule is introduced. */
@media(max-width:700px){
 html[data-ag-theme][data-ag-ui]{--campus-card-fade:linear-gradient(110deg,color-mix(in srgb,var(--theme-panel) 97%,transparent),color-mix(in srgb,var(--theme-panel) 93%,transparent));--campus-editorial-fade:linear-gradient(110deg,color-mix(in srgb,var(--theme-panel) 97%,transparent),color-mix(in srgb,var(--theme-panel) 88%,transparent))}
}
}