/* Local study: photographic material, editorial exit, and left-to-right kinetic takeover. */
.fabric-material-study .study-ribbon{
  position:fixed;right:18px;bottom:18px;z-index:30;padding:8px 11px;
  color:#efe3c5;background:#142742d9;border:1px solid #c6a15355;
  font:500 9px/1.2 "Barlow Condensed",Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;
  backdrop-filter:blur(12px);pointer-events:none
}
.fabric-material-study .fabric{
  min-height:100svh;transition:min-height 1450ms cubic-bezier(.16,.76,.18,1),padding 1450ms cubic-bezier(.16,.76,.18,1)
}
.fabric-material-study .fabric .copy{
  display:block!important;transition:opacity 760ms cubic-bezier(.2,.65,.2,1),transform 980ms cubic-bezier(.16,.76,.18,1),filter 760ms ease;
  will-change:opacity,transform,filter
}
.fabric-material-study .fabric .copy[hidden]{display:none!important}
.fabric-material-study .fabric[data-cloth-dragging="true"]{cursor:grabbing}
.fabric-material-study .fabric[data-cloth-ready="true"]:not([data-cloth-dragging="true"]){cursor:grab}
.fabric-material-study .fabric>img.art{
  transform:scale(1.015) translate3d(0,0,0);transform-origin:63% 8%;
  transition:transform 1850ms cubic-bezier(.12,.72,.14,1),filter 1400ms ease,opacity 900ms ease;
  filter:brightness(.96) saturate(.88) contrast(1.035)
}
.fabric-material-study #fabric-breath{
  opacity:0!important;clip-path:inset(0 100% 0 0);transform:scale(1.015) translate3d(0,0,0);transform-origin:63% 8%;
  transition:clip-path 1750ms cubic-bezier(.64,0,.2,1),opacity 260ms ease,transform 1850ms cubic-bezier(.12,.72,.14,1);
  will-change:clip-path,transform
}
.fabric-material-study .woven-network{
  transition:opacity 800ms ease,transform 1850ms cubic-bezier(.12,.72,.14,1)
}
.fabric-material-study .system-viewport{display:contents}
.fabric-material-study.exploring-system{--fabric-stretch:1}
.fabric-material-study.exploring-system .system-viewport{
  display:flex;flex-direction:column;height:100svh;min-height:520px;overflow:hidden;background:#1d2f4e
}
.fabric-material-study.exploring-system .fabric{
  flex:1 1 auto;height:auto;min-height:0;padding:0;
  transition:none;
  background:linear-gradient(#1d2f4e33,#1d2f4e55),url('../images/fabric-photoreal-study-v2.png') center/cover no-repeat
}
.fabric-material-study.exploring-system .fabric .copy{
  display:none!important
}
.fabric-material-study.exploring-system .fabric>img.art,
.fabric-material-study.exploring-system #fabric-breath{
  width:100%;height:100%;left:0;right:0;object-fit:fill;object-position:50% 50%;
  -webkit-mask-image:linear-gradient(#000 0%,#000 91%,transparent 100%);mask-image:linear-gradient(#000 0%,#000 91%,transparent 100%);
  transform-origin:50% 50%;transform:none
}
.fabric-material-study.exploring-system .woven-network{width:100%;height:100%;left:0;right:0;mask-image:none;transform:none}
.fabric-material-study.exploring-system .fabric>img.art{filter:brightness(.82) saturate(.82) contrast(1.06)}
.fabric-material-study.exploring-system #fabric-breath{opacity:1!important;clip-path:inset(0 0 0 0)}
.fabric-material-study.exploring-system .woven-network{mask-image:none;opacity:1;animation:none}
.fabric-material-study.exploring-system .woven-method{
  flex:0 0 auto;height:auto;max-height:min(46svh,390px);min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:auto
}
.fabric-material-study.exploring-system .method-expanded{max-height:none;overflow:visible;padding-right:0}
.fabric-material-study.exploring-system .fabric::before{
  content:none
}
@keyframes material-light-pass{0%{opacity:0;transform:translateX(-100%)}18%{opacity:.5}70%{opacity:.26}100%{opacity:0;transform:translateX(100%)}}
@keyframes study-network-settle{from{opacity:0;filter:blur(5px)}to{opacity:1;filter:blur(0)}}
@media(max-width:700px){
  .fabric-material-study .study-ribbon{right:10px;bottom:10px}
  .fabric-material-study.exploring-system{--fabric-stretch:1}
  .fabric-material-study.exploring-system .system-viewport{min-height:480px}
  .fabric-material-study.exploring-system .woven-method{max-height:61svh}
  .fabric-material-study.exploring-system .fabric>img.art,
  .fabric-material-study.exploring-system #fabric-breath{object-fit:contain;object-position:50% 50%;transform-origin:50% 50%;transform:none}
}
@media(prefers-reduced-motion:reduce){
  .fabric-material-study .fabric,.fabric-material-study .fabric .copy,.fabric-material-study .fabric>img.art,
  .fabric-material-study #fabric-breath,.fabric-material-study .woven-network{transition:none}
  .fabric-material-study.exploring-system .fabric::before,.fabric-material-study.exploring-system .woven-network{animation:none}
}