/* Milkman scrollslider 1.3.1 — values measured on the original; all selectors scoped so site CSS cannot leak in */
[data-ss-panel]{position:fixed;inset:0;height:100svh;overflow:clip;background:var(--_colors---90,#0a0a0a);opacity:0;pointer-events:none;transition:opacity .5s ease}
body.view-grid [data-ss-panel]{opacity:1;pointer-events:auto}
[data-scrollslider]{position:absolute;top:0;left:0;width:100%;height:100%;overflow:visible;opacity:0;transition:opacity .4s;user-select:none;-webkit-user-select:none;touch-action:none;cursor:grab}
[data-scrollslider].ss-show{opacity:1}
[data-scrollslider] .w-dyn-list[hidden]{display:none}
[data-scrollslider] .ss-grid{position:absolute;top:0;left:0;will-change:transform}
[data-scrollslider] .ss-grid-inner{position:absolute;transform-origin:center center}
[data-scrollslider] .ss-plane{position:relative;display:block}
[data-scrollslider] .ss-col{position:absolute;top:0;will-change:transform;box-sizing:border-box}
[data-scrollslider] .ss-img{position:relative;transform-origin:center center;will-change:transform}
[data-scrollslider][data-dragging]{cursor:grabbing}
[data-scrollslider] .ss-img>a,[data-scrollslider] .ss-img>.ss-card{display:block;text-decoration:none;color:inherit;outline:none}
[data-scrollslider] .ss-card:focus-visible{outline:2px solid #f7f7f7;outline-offset:2px}
[data-scrollslider] .ss-ph{position:relative;background:transparent}
[data-scrollslider] .ss-ph img{position:absolute;top:0;left:0;width:100%;height:100%;max-width:none;object-fit:cover;display:block;transition:opacity .35s}
[data-scrollslider] img.ss-lazy{opacity:1;filter:blur(25px);clip-path:inset(0px)}
[data-scrollslider] img.ss-loaded{filter:none;clip-path:none;opacity:1!important}
[data-scrollslider] .ss-overlay{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}
[data-scrollslider] .ss-pos{position:absolute;z-index:2;overflow:hidden;box-sizing:border-box;line-height:1.3;pointer-events:none;bottom:-44px;left:0;padding:0 10px 10px 0}
[data-scrollslider] .ss-legend{margin:0;font-family:var(--font-family--caption,"ABC Diatype",arial,sans-serif);font-size:12px;line-height:1.2;color:rgb(164,164,164);white-space:nowrap}
[data-scrollslider] .ss-legend span{display:inline;background:rgba(24,23,23,.6);padding:5px 10px 8px;border-radius:5px;margin:0 5px 0 0}
@keyframes ssIntro{from{transform:scale(1.3)}to{transform:scale(1)}}
[data-scrollslider] .ss-grid.ss-intro .ss-grid-inner{animation:ssIntro 1500ms ease-out forwards}


/* ===== MilkmanLightbox: full screen, on the body, above the nav, below the load screen ===== */
.mk-lb{position:fixed;inset:0;z-index:2147482999;display:none;cursor:zoom-out}
.mk-lb[data-open],.mk-lb:has(.mk-lb__media){display:block}
.mk-lb__bg{position:absolute;inset:0;background:rgba(0,0,0,.9);opacity:0;transition:opacity .3s cubic-bezier(.55,.085,.68,.53) .18s}
.mk-lb[data-open] .mk-lb__bg{opacity:1;transition:opacity .3s linear}
.mk-lb__media{position:absolute;display:block;max-width:none;object-fit:cover;transform-origin:center center;will-change:transform;user-select:none;-webkit-user-drag:none;background:#000}
/* the bar: the engine's own lightbox chrome, so both lightboxes read as one */
.mk-lb__bar{position:absolute;top:20px;right:20px;display:flex;gap:8px;align-items:center;opacity:0;transition:opacity .2s ease-out;cursor:default}
.mk-lb[data-open] .mk-lb__bar{opacity:1;transition:opacity .35s ease-out .15s}
.mk-lb__btn{position:static;background:rgba(255,255,255,.12);color:#fff;text-decoration:none;padding:9px 15px;border:0;border-radius:0;cursor:pointer;font:600 11px/1 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:.12em;text-transform:uppercase;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .2s,color .2s}
.mk-lb__btn:hover{background:#fff;color:#0c0c0c}
.mk-lb__case[hidden]{display:none}
html.mk-lb-open [data-scrollslider]{cursor:default}

/* nav on the black canvas: the homepage samples the spiral's brightness and
   keeps re-applying .is-on-light every pass, so the light mode is forced here
   by specificity rather than by touching the class. Values are the pill's own
   defaults. */
body.view-grid .revnav_pill.is-on-light{color:#f7f7f7;background-color:#ffffff29}
body.view-grid .revnav_logo.is-on-light{filter:none}
