/* Item 7: the homepage's glass surface, scoped to the Journal browser. */
.j-glass-filters .j-category-rail .j-categories{position:relative;isolation:isolate;display:flex;flex-wrap:nowrap;gap:2px;width:max-content;max-width:100%;box-sizing:border-box;padding:5px;margin-block:10px;border-radius:999px;background:rgba(255,255,255,.34);-webkit-backdrop-filter:blur(16px) saturate(1.7);backdrop-filter:blur(16px) saturate(1.7);border:1px solid rgba(255,255,255,.65);box-shadow:0 14px 34px -16px rgba(12,40,28,.5),inset 0 1px 1px rgba(255,255,255,.9),inset 0 -1px 1px rgba(23,46,37,.07);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-snap-type:none;scroll-behavior:auto}
.j-glass-filters .j-categories::-webkit-scrollbar{display:none}
.j-glass-filters .j-categories::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(120% 160% at 18% -30%,rgba(255,255,255,.6),transparent 55%)}
.j-glass-filters .j-filter-pill{position:absolute;top:5px;bottom:5px;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,255,255,.8));box-shadow:0 6px 16px -8px rgba(12,40,28,.55),inset 0 1px 0 #fff,inset 0 -1px 0 rgba(23,46,37,.07);pointer-events:none;z-index:0}
.j-glass-filters .j-filter-pill.squish{animation:jFilterSquish .55s cubic-bezier(.3,.7,.3,1)}
.j-glass-filters .j-categories button{position:relative;z-index:1;flex:none;min-height:40px;padding:11px 17px;border:0;border-radius:999px;background:transparent;font-family:Inter,"Inter Fallback",system-ui,sans-serif;font-size:13px;font-weight:600;line-height:1.2;letter-spacing:-.005em;color:rgba(23,46,37,.65);white-space:nowrap;transition:color .4s;-webkit-tap-highlight-color:transparent}
.j-glass-filters .j-categories button[aria-pressed="true"]{color:#172E25;font-weight:600}
.j-glass-filters .j-categories button[aria-pressed="true"]::after{display:none}
.j-glass-filters .j-categories button:hover{color:#172E25}
.j-glass-filters .j-categories button:focus-visible{outline:2px solid #172E25;outline-offset:-2px}
.j-filter-feature-shell{display:flow-root}
@keyframes jFilterSquish{30%{transform:scaleY(.84) scaleX(1.03)}65%{transform:scaleY(1.05)}100%{transform:none}}
@media(max-width:760px){
  .j-glass-filters .j-category-rail{gap:8px}
  .j-glass-filters .j-category-rail .j-categories{width:auto;flex:1;padding:5px;scroll-padding-inline:5px}
  .j-glass-filters .j-categories button{font-size:12px;padding-inline:14px}
}
@media(prefers-reduced-motion:reduce){
  .j-glass-filters .j-filter-pill,.j-glass-filters .j-categories button{transition:none!important;animation:none!important}
}
@media print{.j-glass-filters .j-browse,.j-glass-filters .j-pagination,.j-glass-filters .j-reset{display:none!important}.j-filter-feature-shell{height:auto!important}.j-glass-filters .j-grid{height:auto!important;overflow:visible!important}}

/* 2026-11-08 phone: small arrows either side of the glass rail so the rail gets the room. */
@media(max-width:760px){
  .j-glass-filters .j-category-rail{gap:6px}
  .j-glass-filters .j-category-controls{display:contents}
  .j-glass-filters .j-category-controls button{width:32px;height:32px;min-width:32px}
  .j-glass-filters .j-category-controls button svg{width:13px;height:13px}
  .j-glass-filters .j-category-controls [data-category-previous]{order:-1}
  .j-glass-filters .j-category-controls [data-category-next]{order:1}
}
