/* Quiet material, deliberate controls. All changes are scoped to the public home. */
@property --home-surface-yaw{syntax:'<angle>';inherits:false;initial-value:0deg;}

body:not(.case-mode){--home-card-radius:50px;--home-width-step:clamp(10px,1vw,16px);}
body:not(.case-mode) #world-list>.chapter-sheet:is(.web-chapter,#audio,#yoga,#activism,#library),
body:not(.case-mode) #design .sothys-motion-photo{border-radius:var(--home-card-radius);}

/* Width increases without changing the existing front-to-back stack order. */
body:not(.case-mode) #world-list>.web-chapter{--home-width-extra:0px;}
body:not(.case-mode) #world-list>#audio{--home-width-extra:calc(var(--home-width-step) * 2);}
body:not(.case-mode) #world-list>#yoga{--home-width-extra:calc(var(--home-width-step) * 4);}
body:not(.case-mode) #world-list>#activism{--home-width-extra:calc(var(--home-width-step) * 6);}
body:not(.case-mode) #world-list>#library{--home-width-extra:calc(var(--home-width-step) * 8);}
body:not(.case-mode) #world-list>.chapter-sheet:is(.web-chapter,#audio,#yoga,#activism,#library){
 width:calc(100% + var(--home-width-extra));max-width:none;
 margin-inline:calc(var(--home-width-extra) * -.5);
}
@media(max-width:700px){
 body:not(.case-mode) #world-list>.web-chapter{--home-width-extra:-24px;}
 body:not(.case-mode) #world-list>#audio{--home-width-extra:-18px;}
 body:not(.case-mode) #world-list>#yoga{--home-width-extra:-12px;}
 body:not(.case-mode) #world-list>#activism{--home-width-extra:-6px;}
 body:not(.case-mode) #world-list>#library{--home-width-extra:0px;}
}

body:not(.case-mode) #world-list>.chapter-sheet{
 transition:translate 300ms cubic-bezier(.2,.65,.3,1),--home-surface-tilt 300ms cubic-bezier(.2,.65,.3,1),--home-surface-yaw 300ms cubic-bezier(.2,.65,.3,1),box-shadow 300ms ease,border-color 260ms ease;
}
body:not(.case-mode) #world-list>.chapter-sheet:is(.web-chapter,#audio,#yoga,#activism,#library):before,
body:not(.case-mode) #design .sothys-motion-photo:after,
.design-gallery .dg-frame:after,
.design-gallery .dg-reel-photo:after,
.dg-view-surface:after,
.october-surface:after,
.design-gallery .gs-photo:after{
 /* A neutral fine grain sits behind the content. The restrained satin band
    changes angle and position with the pointer, revealing cool and warm hues. */
 background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='linear' slope='.075'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23grain)'/%3E%3C/svg%3E"),
  radial-gradient(ellipse 48% 65% at var(--home-light-x,50%) var(--home-light-y,50%),var(--foil-glow,color-mix(in srgb,var(--card-light) 15%,transparent)),transparent 72%),
  linear-gradient(var(--home-light-angle,118deg),transparent 18%,var(--foil-blue,#b7ddec09) 33%,var(--foil-green,#b4e3d91e) 43%,var(--foil-peak,#dce9f52e) 50%,var(--foil-warm,#f5ddb124) 57%,var(--foil-violet,#d0bddc12) 66%,transparent 78%);
 background-size:160px 160px,100% 100%,180% 180%;
 background-position:0 0,0 0,var(--home-light-band,50%) 50%;
 background-repeat:repeat,no-repeat,no-repeat;
 opacity:var(--home-light-opacity,.28);
}
/* The light surface uses a deeper interference palette, behind its text. */
body:not(.case-mode) #world-list>#activism,
body:not(.case-mode) #design .sothys-motion-photo.is-light-surface,
.design-gallery [data-surface=light],
.dg-view-surface[data-surface=light],
.october-surface[data-surface=light],
.design-gallery .gs-photo[data-surface=light]{
 --foil-glow:#355d732a;--foil-blue:#355b7226;--foil-green:#366c6633;
 --foil-peak:#64778e42;--foil-warm:#9c6d4438;--foil-violet:#745b8130;
}
body:not(.case-mode) #world-list>#activism:before{mix-blend-mode:multiply;}
body:not(.case-mode) #design .sothys-motion-photo.is-light-surface:after{
 mix-blend-mode:multiply;opacity:calc(var(--home-light-opacity,.28) * .8);
}
.design-gallery .dg-frame:after,.design-gallery .dg-reel-photo:after,.dg-view-surface:after,
.october-surface:after,
.design-gallery .gs-photo:after{
 content:'';position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;
 opacity:calc(var(--home-light-opacity,.28) * .55);
}
.design-gallery [data-surface=light] .dg-frame:after,.design-gallery .dg-reel-photo[data-surface=light]:after,.dg-view-surface[data-surface=light]:after,
.october-surface[data-surface=light]:after,
.design-gallery .gs-photo[data-surface=light]:after{
 mix-blend-mode:multiply;opacity:calc(var(--home-light-opacity,.28) * .8);
}
body:not(.case-mode) #design .sothys-closing>.text-link{
 display:inline-flex;align-items:center;min-height:48px;padding:10px 0;
 font-size:clamp(20px,2vw,26px);line-height:1.25;
}
/* Campaign photographs carry the same material on a separate, clipped layer,
   preserving their artwork and the crop-to-full-image scroll reveal. */
body:not(.case-mode) #design .sothys-motion-photo{
 --card-light:#dcece7;
 isolation:isolate;box-sizing:border-box;overflow:hidden;transform-origin:center center;
 border:1px solid #cce0dd2e;
 box-shadow:inset 0 1px 0 #f0fff510,0 15px 35px -28px #07182266;
 transition:translate 300ms cubic-bezier(.2,.65,.3,1),--home-surface-tilt 300ms cubic-bezier(.2,.65,.3,1),--home-surface-yaw 300ms cubic-bezier(.2,.65,.3,1),box-shadow 300ms ease,border-color 260ms ease;
}
body:not(.case-mode) #design .sothys-motion-photo:after{
 content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
 border-radius:inherit;
 opacity:calc(var(--home-light-opacity,.28) * .55);
 transition:opacity 300ms ease;
}
body:not(.case-mode) #design .sothys-motion-photo:before{
 content:'';position:absolute;top:0;left:clamp(12px,4%,40px);right:clamp(12px,4%,40px);height:1px;
 z-index:3;pointer-events:none;background:linear-gradient(90deg,transparent,#e6fff180,transparent);
 opacity:.5;transition:opacity 260ms ease;
}
body:not(.case-mode) #design .sothys-motion-photo.home-surface-active{
 transition:translate 300ms cubic-bezier(.2,.65,.3,1),box-shadow 300ms ease,border-color 260ms ease;
}
body:not(.case-mode) #design .sothys-motion-photo:focus-visible{outline:2px solid #173c49;outline-offset:6px;}
body:not(.case-mode) #world-list>.chapter-sheet:is(:hover,:focus-within){--home-surface-tilt:0deg;}
body:not(.case-mode) #world-list>.chapter-sheet.home-surface-active{
 /* The small pointer angles are already eased by the animation frame loop. */
 transition:translate 300ms cubic-bezier(.2,.65,.3,1),box-shadow 300ms ease,border-color 260ms ease;
}

body:not(.case-mode) #world-list>.chapter-sheet :is(a,button):focus-visible,
body:not(.case-mode) #contact :is(a,button):focus-visible{
 outline:2px solid currentColor;outline-offset:6px;
}
body:not(.case-mode) #world-list>.chapter-sheet :is(.text-link,.yh-link){
 min-height:44px;display:inline-flex;align-items:center;gap:16px;
 transition:color 180ms ease,border-color 180ms ease;
}
body:not(.case-mode) #world-list>.chapter-sheet .dw-project{border-radius:18px;}
body:not(.case-mode) #world-list>.chapter-sheet .dw-image{
 border:1px solid #f2f5e71f;box-shadow:0 10px 24px -20px #020b1280;
 transition:border-color 240ms ease,box-shadow 240ms ease;
}
body:not(.case-mode) #world-list>.chapter-sheet .dw-project:is(:hover,:focus-visible) .dw-image{
 border-color:#e5f0e85c;box-shadow:0 15px 28px -20px #020b12c2;
}
body:not(.case-mode) #world-list>.chapter-sheet .remix-cards a{
 border-radius:8px;transition:background-color 180ms ease,color 180ms ease;
}
body:not(.case-mode) #world-list>.chapter-sheet .remix-cards a:is(:hover,:focus-visible){background:#fff7ed08;}
body:not(.case-mode) #world-list>#library a{
 transition:background-color 180ms ease,border-color 180ms ease,box-shadow 180ms ease;
}
body:not(.case-mode) #world-list>#library a:is(:hover,:focus-visible){
 border-color:#f1fff680;box-shadow:inset 0 1px 0 #fff9,0 5px 16px -10px #020b12b3;
}
body:not(.case-mode) #contact .email{
 padding-bottom:8px;background:linear-gradient(currentColor,currentColor) left bottom/0 1px no-repeat;
 transition:background-size 260ms cubic-bezier(.2,.65,.3,1),color 180ms ease;
}
body:not(.case-mode) #contact .email:is(:hover,:focus-visible){background-size:100% 1px;}
body:not(.case-mode) #contact .footer-bottom a{
 color:#c3ced1;transition:color 180ms ease;
}
body:not(.case-mode) #contact .footer-bottom a:is(:hover,:focus-visible){color:#fff7ed;}
body:not(.case-mode) #contact #replay{
 border:1px solid #e5f0e82e;border-radius:30px;padding:10px 16px;min-height:44px;
 transition:background-color 180ms ease,border-color 180ms ease;
}
body:not(.case-mode) #contact #replay:is(:hover,:focus-visible){background:#e5f0e808;border-color:#e5f0e873;}

@media(hover:hover) and (pointer:fine){
 body:not(.case-mode) #world-list>.chapter-sheet :is(.text-link,.yh-link):hover{border-color:currentColor;}
}
@media(min-width:701px) and (hover:hover) and (pointer:fine){
 body:not(.case-mode) #design .sothys-motion-photo:is(:hover,:focus-visible){
  border-color:#d6ebe16b;
  box-shadow:inset 0 1px 0 #f0fff520,0 22px 42px -26px #0718228c,0 0 26px -20px #a8d7c34d;
  translate:0 -4px;
 }
 body:not(.case-mode) #design .sothys-motion-photo:is(:hover,:focus-visible):before{opacity:1;}
}
@media(hover:none),(pointer:coarse){
 body:not(.case-mode) #world-list>.chapter-sheet:is(.web-chapter,#audio,#yoga,#activism,#library):before{opacity:.28;}
 body:not(.case-mode) #world-list>.chapter-sheet :is(.text-link,.yh-link,#library a):active,
 body:not(.case-mode) #contact #replay:active{opacity:.76;}
 body:not(.case-mode) #design .sothys-motion-photo:active{border-color:#d6ebe16b;}
}
@media(prefers-reduced-motion:reduce){
 body:not(.case-mode) #world-list>.chapter-sheet,
 body:not(.case-mode) #world-list>.chapter-sheet:before,
 body:not(.case-mode) #world-list>.chapter-sheet :is(a,button,.dw-image),
 body:not(.case-mode) #contact :is(a,button){transition:none;}
 body:not(.case-mode) #design .sothys-motion-photo,
 body:not(.case-mode) #design .sothys-motion-photo:before,
 body:not(.case-mode) #design .sothys-motion-photo:after{transition:none;translate:none!important;}
}