/* The photograph is a middle depth of the landscape, not a gallery card. */
.memory-chapter { min-height:820px; padding:100px 0 74px; overflow:visible; background:#19384b; }
.memory-landscape { position:absolute; inset:-3%; width:106%; height:106%; max-width:none; object-fit:cover; opacity:.87; z-index:-4; transform:translateY(var(--scene-shift,0px)); -webkit-mask-image:linear-gradient(transparent 3%,#000 15%,#000 84%,transparent 97%); mask-image:linear-gradient(transparent 3%,#000 15%,#000 84%,transparent 97%); }
.memory-colorwash { position:absolute; inset:0; background:linear-gradient(#19384b 0%,#19384b66 18%,#19384b0a 42%,#19384b77 77%,#173446 100%); z-index:-3; pointer-events:none; }
.memory-heading { position:relative; z-index:5; width:calc(100% - 40px); margin:0 auto 18px; text-align:center; }
.memory-heading h2 { font-size:clamp(40px,4.7vw,65px); }
.memory-heading em { color:#f3dfb7; }
.memory-experience { position:relative; z-index:1; }
.memory-stage { position:relative; height:clamp(500px,65svh,680px); }
.memory-loop { position:absolute; inset:0 max(26px,calc((100% - 1120px)/2)); z-index:2; }
.memory-photo { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; margin:0; opacity:0; pointer-events:none; }
.memory-photo.is-active { opacity:1; }
.memory-photo-image {
  display:block; width:auto; height:auto; max-height:100%; max-width:min(100%,var(--photo-cap,820px)); object-fit:contain;
  -webkit-mask-image:var(--photo-mask,radial-gradient(ellipse,#000 48%,transparent 83%)),radial-gradient(ellipse,#000 32%,transparent 71%),radial-gradient(ellipse 18% 24% at var(--face-a,50% 30%),#000 82%,transparent 100%),radial-gradient(ellipse 18% 24% at var(--face-b,50% 45%),#000 82%,transparent 100%),radial-gradient(ellipse 18% 24% at var(--face-c,50% 60%),#000 82%,transparent 100%);
  mask-image:var(--photo-mask,radial-gradient(ellipse,#000 48%,transparent 83%)),radial-gradient(ellipse,#000 32%,transparent 71%),radial-gradient(ellipse 18% 24% at var(--face-a,50% 30%),#000 82%,transparent 100%),radial-gradient(ellipse 18% 24% at var(--face-b,50% 45%),#000 82%,transparent 100%),radial-gradient(ellipse 18% 24% at var(--face-c,50% 60%),#000 82%,transparent 100%);
  -webkit-mask-size:100% 100%; mask-size:100% 100%; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-composite:source-over; mask-composite:add;
  animation:memory-breath 23s ease-in-out infinite alternate; transform-origin:50% 55%;
}
.memory-photo[data-memory-photo='0'] { --photo-cap:460px; --photo-mask:url('/static/at-the-microphone.6f3f4aadf682e3da.svg'); }
.memory-photo[data-memory-photo='1'] { --photo-cap:850px; --photo-mask:url('/static/family-embrace.9d3a58910c51b39d.svg'); }
.memory-photo[data-memory-photo='2'] { --photo-cap:790px; --photo-mask:url('/static/by-the-ocean.5ebd31736a86c815.svg'); }
.memory-photo[data-memory-photo='3'] { --photo-cap:450px; --photo-mask:url('/static/baseball-days.dc52004a9702f794.svg'); }
.memory-photo[data-memory-photo='4'] { --photo-cap:840px; --photo-mask:url('/static/graduation.b2a5d20fef4b8e6d.svg'); }
.memory-photo[data-memory-photo='5'] { --photo-cap:850px; --photo-mask:url('/static/mountain-friends.b492042c50f609cc.svg'); }
.memory-photo[data-memory-photo='6'] { --photo-cap:500px; --photo-mask:url('/static/an-adventure.695d36735b020fd8.svg'); }
.memory-photo[data-memory-photo='7'] { --photo-cap:610px; --photo-mask:url('/static/wes-portrait.7f68c65b7e87d313.svg'); }
.memory-photo[data-memory-photo='8'] { --photo-cap:450px; --photo-mask:url('/static/christmas.a6f868b7cb67baad.svg'); }
.memory-photo[data-memory-photo='9'] { --photo-cap:465px; --photo-mask:url('/static/playing-bass.0539fde5ebeddd47.svg'); }
.cloud-layer,.memory-cloud { position:absolute; display:block; max-width:none; height:auto; pointer-events:none; animation:cloud-sail 40s ease-in-out infinite alternate; -webkit-mask-image:radial-gradient(ellipse,#000 43%,transparent 72%); mask-image:radial-gradient(ellipse,#000 43%,transparent 72%); }
.cloud-layer-back { width:128%; left:-14%; top:14%; opacity:.18; z-index:-2; animation-duration:63s; }
.memory-cloud-left { width:68%; left:-23%; top:33%; opacity:.31; z-index:3; animation-duration:43s; }
.memory-cloud-right { width:72%; right:-24%; top:41%; opacity:.28; z-index:3; animation-duration:49s; animation-direction:alternate-reverse; }
.memory-cloud-front { width:121%; left:-10%; top:66%; opacity:.42; z-index:4; animation-duration:32s; }
.memory-transition-veil { position:absolute; inset:0; z-index:5; pointer-events:none; opacity:0; background:url('/static/cloud-overlay.cb7dea6ec341ae3a.webp') center 78%/115% auto no-repeat; -webkit-mask-image:linear-gradient(transparent 12%,#000 48%,#000 78%,transparent); mask-image:linear-gradient(transparent 12%,#000 48%,#000 78%,transparent); transition:opacity .38s ease; }
.memory-chapter.is-transitioning .memory-transition-veil,.memory-chapter.is-memory-transitioning .memory-transition-veil,.memory-experience.is-transitioning .memory-transition-veil,.memory-stage.is-transitioning .memory-transition-veil { opacity:.36; }
@keyframes cloud-sail { from { transform:translate3d(-3%,0,0) scale(1.025); } to { transform:translate3d(3%,-2%,0) scale(1.065); } }
@keyframes memory-breath { from { transform:scale(.992) translateY(2px); } to { transform:scale(1.008) translateY(-3px); } }
.is-memory-paused .memory-photo-image,.is-memory-paused .memory-cloud,.is-memory-paused .cloud-layer { animation-play-state:paused; }
.memory-controls { position:relative; z-index:7; display:flex; justify-content:center; align-items:center; gap:8px; width:max-content; max-width:calc(100% - 32px); margin:15px auto 0; padding:4px 9px; border:1px solid #f0e4cc42; border-radius:30px; color:#fbf0d9; background:#1e405557; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.memory-controls button { display:inline-grid; place-items:center; min-width:44px; min-height:44px; padding:8px 12px; border:0; border-radius:22px; background:transparent; color:inherit; font-size:12px; }
.memory-controls button:hover { background:#fff1; }
.memory-controls button:focus-visible { outline-offset:1px; }
.memory-controls svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.45; stroke-linecap:round; stroke-linejoin:round; }
.memory-count { min-width:53px; text-align:center; font-size:11px; font-variant-numeric:tabular-nums; letter-spacing:.06em; }
.memory-loop-control { min-width:60px!important; }
.memory-open { margin-left:2px; }
.memory-progress { position:relative; z-index:7; width:122px; height:1px; margin:20px auto 0; overflow:hidden; background:#efdbba30; }
.memory-progress i { display:block; width:100%; height:100%; background:#e9c897b3; transform:scaleX(0); transform-origin:left; }
.memory-lightbox { width:min(1160px,calc(100vw - 40px)); max-height:calc(100svh - 36px); margin:auto; padding:22px; overflow-y:auto; border:1px solid #e5c38d55; border-radius:8px; background:#173443; color:var(--cream); }
.memory-lightbox::backdrop { background:#061520e8; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.memory-lightbox-top { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:16px; }
.memory-lightbox h2 { font:400 12px/1.6 var(--text); letter-spacing:.06em; }
.memory-lightbox button { min-height:44px; padding:8px 14px; border:1px solid #f4ddb93d; border-radius:5px; background:transparent; color:inherit; font-size:12px; }
.memory-lightbox>img { display:block; width:auto; height:auto; max-width:100%; max-height:calc(100svh - 185px); margin:auto; object-fit:contain; }
.memory-lightbox>p { margin:16px auto 0; max-width:70ch; color:var(--muted); font-size:12px; line-height:1.7; text-align:center; }
@media (max-width:600px) {
  .memory-chapter { min-height:730px; padding:46px 0 68px; }
  .memory-heading { width:calc(100% - 48px); margin-bottom:24px; }
  .memory-heading h2 { font-size:clamp(34px,10vw,43px); }
  .memory-heading em { display:block; }
  .memory-stage { height:clamp(390px,55svh,515px); }
  .memory-loop { inset:0 14px; }
  .memory-landscape { width:130%; left:-15%; object-position:50% 50%; }
  .cloud-layer-back { top:24%; width:230%; left:-70%; }
  .memory-cloud-left { width:140%; left:-78%; top:46%; }
  .memory-cloud-right { width:145%; right:-81%; top:50%; }
  .memory-cloud-front { width:210%; left:-55%; top:74%; opacity:.32; }
  .memory-transition-veil { background-size:240% auto; }
  .memory-controls { gap:3px; margin-top:18px; padding-inline:7px; }
  .memory-controls button { padding-inline:9px; }
  .memory-lightbox { width:calc(100vw - 20px); max-height:calc(100svh - 20px); padding:14px; }
  .memory-lightbox>img { max-height:calc(100svh - 165px); }
}
@media (prefers-reduced-motion:reduce) {
  html:not([data-motion='full']) .memory-landscape,html:not([data-motion='full']) .memory-photo-image,html:not([data-motion='full']) .memory-cloud,html:not([data-motion='full']) .cloud-layer { animation:none!important; transform:none!important; }
  html:not([data-motion='full']) .memory-transition-veil { display:none; }
}
html[data-motion='reduced'] .memory-landscape,html[data-motion='reduced'] .memory-photo-image,html[data-motion='reduced'] .memory-cloud,html[data-motion='reduced'] .cloud-layer { transform:none!important; }
html[data-motion='reduced'] .memory-transition-veil { display:none; }

/* Source-photo corrections: protect the full cap, ears and chin at the edges. */
.memory-photo[data-memory-photo="4"]{--photo-mask:url("/static/graduation-source.0abd3432c60c431b.svg")}
.memory-photo[data-memory-photo="7"]{--photo-mask:url("/static/wes-source-portrait.4882ce1d1faf0fb3.svg");--photo-cap:480px}

/* Foreground clouds overlap the perimeter; the static parent mask protects faces. */
.memory-cloud-left,.memory-cloud-right,.memory-cloud-front {z-index:3}
.memory-transition-veil {z-index:1}
.memory-family-addition {--photo-cap:1000px}
.memory-family-addition .memory-photo-image,.memory-print {
 -webkit-mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent),linear-gradient(to bottom,transparent,#000 4%,#000 91%,transparent);
 mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent),linear-gradient(to bottom,transparent,#000 4%,#000 91%,transparent);
 -webkit-mask-composite:source-in;mask-composite:intersect;
 -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
.memory-family-addition .memory-photo-image {
 -webkit-mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent),linear-gradient(to bottom,transparent,#000 18%,#000 91%,transparent);
 mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent),linear-gradient(to bottom,transparent,#000 18%,#000 91%,transparent);
}
.memory-print {position:relative;overflow:hidden;flex:none;isolation:isolate;
 -webkit-mask-image:linear-gradient(to right,transparent,#000 1.5%,#000 98.5%,transparent),linear-gradient(to bottom,transparent,#000 1.5%,#000 98.5%,transparent);
 mask-image:linear-gradient(to right,transparent,#000 1.5%,#000 98.5%,transparent),linear-gradient(to bottom,transparent,#000 1.5%,#000 98.5%,transparent);
}
.memory-print-plane {position:absolute;left:0;top:0;transform-origin:0 0}
.memory-print .memory-photo-image {position:absolute;left:0;top:0;max-width:none;max-height:none;object-fit:fill;transform-origin:0 0;-webkit-mask:none;mask:none;animation:none}
.memory-dialog-print {display:flex;justify-content:center;align-items:center;min-height:100px}
.memory-dialog-print .memory-print {-webkit-mask:none;mask:none}

/* Soft cloud edges without washing out the subjects or artwork interiors. */
.memory-artwork .memory-print {
  -webkit-mask-image: linear-gradient(to right,transparent,#000 1.6%,#000 98.4%,transparent),linear-gradient(to bottom,transparent,#000 1.6%,#000 98.4%,transparent);
  mask-image: linear-gradient(to right,transparent,#000 1.6%,#000 98.4%,transparent),linear-gradient(to bottom,transparent,#000 1.6%,#000 98.4%,transparent);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.memory-print .memory-reflection-repair {
  pointer-events: none;
  clip-path: polygon(27.4% 4%, 62% 4%, 62% 49%, 27.9% 49%);
  -webkit-mask-image: radial-gradient(ellipse 265px 235px at 510px 160px, #000 64%, transparent 100%);
  mask-image: radial-gradient(ellipse 265px 235px at 510px 160px, #000 64%, transparent 100%);
}
.memory-photo.memory-companions { --photo-cap: 930px; }
.memory-photo.memory-companions .memory-photo-image {
  -webkit-mask-image: url('/static/cloud-edge-mask.dcd96fc832a302fd.svg'), radial-gradient(ellipse 24% 34% at 20% 35%, #000 85%, transparent 100%), radial-gradient(ellipse 25% 35% at 75% 29%, #000 85%, transparent 100%);
  mask-image: url('/static/cloud-edge-mask.dcd96fc832a302fd.svg'), radial-gradient(ellipse 24% 34% at 20% 35%, #000 85%, transparent 100%), radial-gradient(ellipse 25% 35% at 75% 29%, #000 85%, transparent 100%);
  -webkit-mask-composite: source-over;
  mask-composite: add;
}
.memory-controls {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  gap: 10px;
}
.memory-controls button {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: .8;
  transition: opacity .2s ease, color .2s ease;
}
.memory-controls button:hover,
.memory-controls button:active { background: transparent; opacity: 1; color: #fff; }
.memory-controls button:focus-visible { outline: 1px solid currentColor; outline-offset: 2px; opacity: 1; }
.memory-controls button:disabled { opacity: .35; }
.memory-count { font-variant-numeric: tabular-nums; opacity: .75; }
@media (max-width: 600px) { .memory-controls { padding: 0; gap: 5px; } }

/* A single moving atmosphere across the scholarship and memory scenes. */
.cloud-bridge { position:absolute; inset:-145px 0 auto; height:320px; z-index:4; pointer-events:none; overflow:clip; -webkit-mask-image:linear-gradient(transparent,#000 35%,#000 58%,transparent); mask-image:linear-gradient(transparent,#000 35%,#000 58%,transparent); }
.cloud-bridge img { position:absolute; width:120%; max-width:none; height:420px; object-fit:cover; left:-10%; top:-100px; opacity:.35; animation:cloud-rise 22s ease-in-out infinite alternate; }
.cloud-bridge img+img { top:-30px; left:-18%; opacity:.23; animation-duration:29s; animation-delay:-11s; animation-direction:alternate-reverse; }
.memory-foreground { position:absolute; inset:-24px 0 -18px; z-index:3; pointer-events:none; overflow:clip; -webkit-mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 80%,transparent),radial-gradient(ellipse 59% 58% at 50% 44%,transparent 65%,#000 95%); mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 80%,transparent),radial-gradient(ellipse 59% 58% at 50% 44%,transparent 65%,#000 95%); -webkit-mask-composite:source-in; mask-composite:intersect; }
.memory-foreground .memory-cloud { animation-name:cloud-rise; }
.memory-foreground .memory-cloud-left { top:9%; left:-22%; width:88%; opacity:.66; animation-duration:18s; }
.memory-foreground .memory-cloud-right { top:5%; right:-24%; width:94%; opacity:.58; animation-duration:23s; animation-delay:-8s; }
.memory-foreground .memory-cloud-front { top:45%; left:-17%; width:135%; opacity:.62; animation-duration:20s; animation-delay:-6s; }
.cloud-layer-back { opacity:.3; animation-duration:32s; }
@keyframes cloud-rise { from { transform:translate3d(-7%,7%,0) scale(1.03); } to { transform:translate3d(7%,-9%,0) scale(1.09); } }
html.is-cloud-paused .cloud-bridge img,html.is-cloud-paused .recipient-mist img { animation-play-state:paused; }
html[data-motion='reduced'] .cloud-bridge img,html[data-motion='reduced'] .recipient-mist img { animation:none; }
@media (prefers-reduced-motion:reduce) {
  html:not([data-motion='full']) .cloud-bridge img,html:not([data-motion='full']) .recipient-mist img { animation:none; }
}
@media (max-width:600px) {
  .memory-chapter { padding-top:90px; }
  .cloud-bridge { top:-125px; height:285px; }
  .cloud-bridge img { width:190%; left:-45%; opacity:.3; }
  .memory-foreground .memory-cloud-left { width:155%; left:-86%; }
  .memory-foreground .memory-cloud-right { width:160%; right:-90%; }
  .memory-foreground .memory-cloud-front { width:215%; left:-58%; }
}

/* Seven curated slides; every original photograph retains its own crop. */
.memory-slide { position:absolute; inset:0; opacity:0; pointer-events:none; }
.memory-slide.is-active { opacity:1; }
.memory-pair { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(20px,4vw,52px); width:100%; height:100%; align-items:stretch; }
.memory-pair-single { grid-template-columns:minmax(0,1fr); max-width:840px; margin-inline:auto; }
.memory-pair .memory-photo { position:relative; inset:auto; width:100%; height:100%; min-width:0; min-height:0; opacity:1; }
.memory-pair .memory-photo-image { max-width:100%; max-height:100%; }
.memory-pair .memory-print .memory-photo-image { max-width:none; max-height:none; }
.memory-slide[aria-hidden='true'] { visibility:hidden; }
.memory-slide[aria-hidden='false'] { visibility:visible; }
.memory-slide.is-memory-leaving[aria-hidden='true'] {visibility:visible}
.memory-slide:not(.is-active) .memory-photo {animation-play-state:paused!important}
.memory-slide.is-active {isolation:isolate}
.memory-dialog-print { width:100%; }
.memory-dialog-print .memory-pair { height:min(650px,calc(100svh - 210px)); }
.memory-dialog-print .memory-photo>.memory-photo-image { -webkit-mask:none; mask:none; animation:none; }
.memory-dialog-print .memory-photo .memory-print { -webkit-mask:none; mask:none; }
@media(max-width:600px) {
  .memory-stage { height:650px; }
  .memory-pair { grid-template-columns:minmax(0,1fr); grid-template-rows:repeat(2,minmax(0,1fr)); gap:26px; }
  .memory-pair-single { grid-template-rows:minmax(0,1fr); }
  .memory-dialog-print .memory-pair { height:auto; grid-template-rows:none; gap:24px; }
  .memory-dialog-print .memory-photo { height:360px; }
}

/* Different elevations and speeds let each memory inhabit the cloud scene. */
.memory-pair .memory-photo {--depth-y:0%;--depth-scale:.96;--depth-tilt:0deg;animation:memory-float 21s ease-in-out -3s infinite;transform-origin:50% 60%}
.memory-pair .memory-photo:nth-child(2){animation-duration:27s;animation-delay:-12s}
.memory-slide[data-memory-frame='0'] .memory-photo:first-child {--depth-y:-5%;--depth-scale:.9;--depth-tilt:-1.4deg}
.memory-slide[data-memory-frame='0'] .memory-photo:nth-child(2) {--depth-y:5%;--depth-scale:.97;--depth-tilt:1deg}
.memory-slide[data-memory-frame='1'] .memory-photo:first-child {--depth-y:-3%;--depth-scale:.96}
.memory-slide[data-memory-frame='1'] .memory-photo:nth-child(2) {--depth-y:5%;--depth-scale:.9;--depth-tilt:1.1deg}
.memory-slide[data-memory-frame='2'] .memory-pair-single {max-width:1050px}
.memory-slide[data-memory-frame='2'] .memory-photo {--depth-scale:1}
.memory-slide[data-memory-frame='3'] .memory-photo:first-child {--depth-y:-6%;--depth-scale:.92;--depth-tilt:-1.1deg}
.memory-slide[data-memory-frame='3'] .memory-photo:nth-child(2) {--depth-y:5%;--depth-scale:.98;--depth-tilt:1.3deg}
.memory-slide[data-memory-frame='4'] .memory-photo:first-child {--depth-y:3%;--depth-tilt:-1deg}
.memory-slide[data-memory-frame='4'] .memory-photo:nth-child(2) {--depth-y:-4%;--depth-scale:.92}
.memory-slide[data-memory-frame='5'] .memory-photo:first-child {--depth-y:-3%;--depth-scale:1}
.memory-slide[data-memory-frame='5'] .memory-photo:nth-child(2) {--depth-y:5%;--depth-scale:.86;--depth-tilt:1.3deg;filter:drop-shadow(0 16px 20px #091c3540)}
.memory-slide[data-memory-frame='6'] .memory-photo:first-child {--depth-y:-5%;--depth-scale:.97;--depth-tilt:-1.8deg;filter:drop-shadow(5px 15px 18px #071c3545)}
.memory-slide[data-memory-frame='6'] .memory-photo:nth-child(2) {--depth-y:4%;--depth-scale:.86;--depth-tilt:1.5deg;filter:drop-shadow(-4px 20px 24px #071c3545)}
@keyframes memory-float {0%,100%{transform:translate(-3px,var(--depth-y)) rotate(var(--depth-tilt)) scale(var(--depth-scale))}50%{transform:translate(4px,calc(var(--depth-y) - 9px)) rotate(calc(var(--depth-tilt) + .35deg)) scale(calc(var(--depth-scale) + .008))}}
.is-memory-paused .memory-pair .memory-photo {animation-play-state:paused}
.memory-dialog-print .memory-pair .memory-photo {animation:none;transform:none;filter:none}

@media(max-width:600px){
 .memory-slide[data-memory-frame] .memory-pair .memory-photo {--depth-y:0%;--depth-scale:.92;--depth-tilt:0deg}
 .memory-slide[data-memory-frame] .memory-pair .memory-photo:nth-child(2) {--depth-scale:.96}
}

/* Three separately painted silhouettes. Black backing disappears through screen blending. */
.cloud-bank {display:block;position:absolute;pointer-events:none;background-image:url('/static/cloud-banks-varied-20260913.b179220c66fee96a.webp');background-repeat:no-repeat;background-size:100% 300%;mix-blend-mode:screen;-webkit-mask-image:linear-gradient(transparent,#000 9%,#000 90%,transparent);mask-image:linear-gradient(transparent,#000 9%,#000 90%,transparent);animation:cloud-bank-meander 29s ease-in-out infinite alternate}
.cloud-bank-a {background-position:center top}
.cloud-bank-b {background-position:center center;animation-duration:37s;animation-delay:-13s;animation-direction:alternate-reverse}
.cloud-bank-c {background-position:center bottom;animation-duration:43s;animation-delay:-24s}
@keyframes cloud-bank-meander {0%{transform:translate(-5%,3%) rotate(-2deg)}45%{transform:translate(1%,-4%) rotate(.8deg)}100%{transform:translate(6%,1%) rotate(2deg)}}
.cloud-bridge {mix-blend-mode:screen}
.scholarship-cloud-variation {left:8%;top:-30px;width:108%;height:310px;opacity:.32}
.recipient-mist {mix-blend-mode:screen}
.portrait-cloud-variation {width:180%;height:66%;left:-40%;top:10%;opacity:.28;rotate:-48deg}
.memory-cloud-variety {position:absolute;inset:0;z-index:1;pointer-events:none;overflow:clip;mix-blend-mode:screen;-webkit-mask-image:linear-gradient(transparent,#000 20%,#000 78%,transparent);mask-image:linear-gradient(transparent,#000 20%,#000 78%,transparent)}
.memory-cloud-variety .cloud-bank-b {left:-18%;top:3%;width:85%;height:54%;opacity:.28}
.memory-cloud-variety .cloud-bank-c {right:-22%;bottom:-3%;width:105%;height:66%;opacity:.24}
.is-memory-paused .cloud-bank,html.is-cloud-paused .cloud-bridge .cloud-bank,html.is-cloud-paused .recipient-mist .cloud-bank {animation-play-state:paused}
.memory-lightbox-top {justify-content:flex-end}

/* Convert the texture's black backing to transparency, then feather every tile edge. */
.cloud-bank {
  --cloud-position:center top;
  mix-blend-mode:normal;
  -webkit-mask-image:url('/static/cloud-banks-varied-20260913.b179220c66fee96a.webp'),linear-gradient(to right,transparent,#000 12%,#000 88%,transparent),linear-gradient(to bottom,transparent,#000 14%,#000 83%,transparent);
  mask-image:url('/static/cloud-banks-varied-20260913.b179220c66fee96a.webp'),linear-gradient(to right,transparent,#000 12%,#000 88%,transparent),linear-gradient(to bottom,transparent,#000 14%,#000 83%,transparent);
  -webkit-mask-size:100% 300%,100% 100%,100% 100%;
  mask-size:100% 300%,100% 100%,100% 100%;
  -webkit-mask-position:var(--cloud-position),center,center;
  mask-position:var(--cloud-position),center,center;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  mask-mode:luminance,alpha,alpha;
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}
.cloud-bank-b {--cloud-position:center center}
.cloud-bank-c {--cloud-position:center bottom}
.cloud-bridge,.recipient-mist,.memory-cloud-variety {mix-blend-mode:normal}
.cloud-bridge {isolation:isolate;-webkit-mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 34%,#000 58%,transparent);mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 34%,#000 58%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect}
.cloud-bridge>img {animation:scholarship-cloud-lift 34s ease-in-out -12s infinite alternate}
.scholarship-cloud-variation {animation:scholarship-cloud-curl 43s ease-in-out -23s infinite alternate}
.recipient-mist>img {animation:scholarship-cloud-curl 38s ease-in-out -8s infinite alternate}
.portrait-cloud-variation {animation:scholarship-cloud-lift 47s ease-in-out -29s infinite alternate}
@keyframes scholarship-cloud-lift {0%{transform:translate(-6%,6%) rotate(-1deg) scale(1.02)}35%{transform:translate(-1%,-2%) rotate(1.1deg) scale(1.07)}70%{transform:translate(4%,-6%) rotate(-.5deg) scale(1.04)}100%{transform:translate(7%,1%) rotate(1.8deg) scale(1.08)}}
@keyframes scholarship-cloud-curl {0%{transform:translate(5%,2%) rotate(2deg) scale(1.04)}42%{transform:translate(-2%,-5%) rotate(-1deg) scale(1.09)}75%{transform:translate(-5%,1%) rotate(.6deg) scale(1.02)}100%{transform:translate(1%,5%) rotate(-1.6deg) scale(1.06)}}

.memory-chapter {padding-top:54px}
.memory-controls button,.memory-controls button:disabled,.memory-controls button[aria-disabled='true'] {cursor:pointer}
@media(max-width:600px){.memory-chapter{padding-top:44px}}

/* Mobile is a single-photo sequence; desktop retains the curated pairings. */
.memory-stage {touch-action:pan-y pinch-zoom}
.memory-chapter.memory-mobile {min-height:0;padding:36px 0 38px}
.memory-mobile .memory-stage {height:var(--mobile-photo-height,380px);transition:height .55s cubic-bezier(.22,.61,.36,1)}
.memory-mobile .memory-loop {inset:12px 14px}
.memory-mobile .memory-pair {grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:0;max-width:none}
.memory-mobile .memory-slide[data-memory-frame] .memory-pair .memory-photo {--depth-y:0%;--depth-scale:1;--depth-tilt:0deg}
.memory-mobile .memory-photo:not(.memory-artwork)>.memory-photo-image {width:100%;height:100%;object-fit:contain}
.memory-mobile .memory-controls {margin-top:8px}
.memory-mobile .memory-progress {margin-top:10px}
@media(prefers-reduced-motion:reduce){.memory-mobile .memory-stage{transition:none}}
html[data-motion='reduced'] .memory-mobile .memory-stage{transition:none}

/* Slow wind-like drift, with eased acceleration and no size pulsing. */
.memory-slide .memory-pair .memory-photo {animation-duration:34s;animation-delay:-8s;animation-timing-function:cubic-bezier(.37,0,.63,1)}
.memory-slide .memory-pair .memory-photo:nth-child(2) {animation-duration:43s;animation-delay:-23s}
.memory-slide .memory-photo-image {animation:none}
@keyframes memory-float {
  0%,100% {transform:translate3d(-3px,var(--depth-y),0) rotate(var(--depth-tilt)) scale(var(--depth-scale))}
  25% {transform:translate3d(0,calc(var(--depth-y) - 3px),0) rotate(calc(var(--depth-tilt) + .08deg)) scale(var(--depth-scale))}
  50% {transform:translate3d(4px,calc(var(--depth-y) - 5px),0) rotate(calc(var(--depth-tilt) + .12deg)) scale(var(--depth-scale))}
  75% {transform:translate3d(1px,calc(var(--depth-y) - 2px),0) rotate(calc(var(--depth-tilt) + .04deg)) scale(var(--depth-scale))}
}