/* Loaded by build/build.js as css: ["other"] on every page that renders
   partials.otherList(); the .ol-* rules assume the site's px/clamp scale, so
   .pp-other resets the blog pages' em system (font-size:14px) on entry. */
/* ==========================================================================
   OTHER LIST — shared by the project pages ("Other projects") and the blog
   articles ("Other blogs"). NOT Senawa. Vendored from the Yovanny Hyde build
   (site/assets/css/listing.css §5 "OTHER LISTINGS", a Base31 port). Their
   rem values are design px @1920, written here as px / clamp() because this
   stylesheet has no rem system. Hover inverts the row to slate/wool the way
   their rows invert to black/white; the two meta cells keep an explicit muted
   colour so they stay muted through the inversion (oak on slate).
   ========================================================================== */
.pp-other{font-size:14px;line-height:var(--leading-body);background:var(--wool);border-top:1px solid #a8967e33;padding:clamp(48px,7vw,120px) clamp(24px,6vw,96px) clamp(40px,6vw,96px);position:relative}
.ol-h{font-family:var(--font-display);font-weight:300;letter-spacing:-.02em;line-height:.95;font-size:clamp(2rem,5vw,4.6rem);margin:0 0 clamp(32px,4vw,64px)}
.ol-list{position:relative;width:100%}
.ol-row{position:relative;display:flex;align-items:center;gap:20px;width:100%;padding:clamp(24px,2.4vw,44px) 0;color:var(--slate);text-decoration:none;transition:background-color .15s cubic-bezier(.4,0,.2,1),color .15s cubic-bezier(.4,0,.2,1)}
.ol-row::after,.ol-row:first-child::before{content:"";position:absolute;left:0;width:100%;height:1px;background-color:currentColor;opacity:.15;pointer-events:none}
.ol-row::after{bottom:0}
.ol-row:first-child::before{top:0}
@media (hover:hover){.ol-row:hover{background-color:var(--slate);color:var(--wool)}}
.ol-body{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:20px}
.ol-t{position:relative;flex:1 1 auto;min-width:0;display:flex;align-items:center}
.ol-tri{position:absolute;left:0;top:50%;width:28px;height:24px;margin-top:-12px;opacity:0;transform:translateX(0) rotate(90deg);transition:opacity .25s cubic-bezier(.4,0,.2,1),transform .25s cubic-bezier(.4,0,.2,1)}
.ol-name{display:block;font-family:var(--font-display);font-weight:400;letter-spacing:-.02em;line-height:1.1;font-size:clamp(1.35rem,2.1vw,2.85rem);transition:transform .25s cubic-bezier(.4,0,.2,1)}
@media (hover:hover){.ol-row:hover .ol-tri{opacity:1;transform:translateX(12px) rotate(90deg)}.ol-row:hover .ol-name{transform:translateX(44px)}}
.ol-meta{flex:none;display:flex}
.ol-type,.ol-place{display:block;width:clamp(120px,12.5vw,240px);padding:0 12px;text-align:right;font-family:var(--font-body);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:400;color:var(--walnut);transition:color .15s cubic-bezier(.4,0,.2,1)}
@media (hover:hover){.ol-row:hover .ol-type,.ol-row:hover .ol-place{color:var(--oak)}}
.pp-other .pp-detail-nav-all{display:inline-block;margin-top:clamp(28px,3vw,48px)}
/* ONE shared preview, fixed at the origin and moved only by transform; 240 real px
   because the +20 / -120 cursor offsets in project-page.js are client px too. */
.ol-prev{position:fixed;top:0;left:0;z-index:50;display:none;width:240px;height:240px;overflow:hidden;border-radius:4px;pointer-events:none}
.ol-prev img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (min-width:1024px){.ol-prev.is--on{display:block}}
.ol-thumb{display:none}
@media (max-width:767.98px){
  .pp-other{padding-top:48px}
  .ol-h{margin-bottom:28px}
  .ol-row{padding:20px 0;gap:16px}
  .ol-body{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:8px}
  .ol-tri{display:none}
  .ol-meta{display:flex;gap:16px}
  .ol-type,.ol-place{width:auto;padding:0;text-align:left;white-space:nowrap}
  .ol-thumb{display:block;flex:none;width:88px;height:88px;overflow:hidden;border-radius:4px}
  .ol-thumb img{width:100%;height:100%;object-fit:cover}
}
@media (prefers-reduced-motion:reduce){.ol-row,.ol-name,.ol-tri,.ol-type,.ol-place{transition-duration:.01ms}}