/* Shared readable control material; content surfaces stay solid.
 * Apple HIG Materials reference. CSS approximates glass, not optical refraction. */
:root {
  --jj-glass-fill:linear-gradient(165deg,#ffffffb8,#ffffff52 55%,#ffffff85);
  --jj-glass-edge:inset 0 1px 0 #fff,inset 1px 0 0 #ffffff99,inset 0 -1px 0 #ffffff66;
  --jj-glass-shadow:0 0 0 1px #00000009,0 3px 12px #0000000d;
  --jj-glass-tint:linear-gradient(180deg,#ffffff26,#ffffff00 65%),var(--jj-blue);
}
.jj-search,.jj-filters,.jj-mobile-filter summary,.jj-filter-panel,
:is(.jj-page .jj-back,.jj-mobile-back),.jj-auth-header .jj-pill {
  background:var(--jj-glass-fill);
  background-color:#ffffff73;
  border:1px solid #ffffffd9;
  box-shadow:var(--jj-glass-edge),var(--jj-glass-shadow);
  -webkit-backdrop-filter:blur(20px) saturate(120%);
  backdrop-filter:blur(20px) saturate(120%);
  color:var(--jj-ink);
}
.jj-filters{background-color:#f5f5f58c}
.jj-filter-panel{background-color:#ffffffd9;box-shadow:var(--jj-glass-edge),0 0 0 1px #0000000a,0 12px 30px #00000014}
.jj-search:focus-within{border-color:#fff;box-shadow:var(--jj-glass-edge),0 0 0 2px #1254ff66,var(--jj-glass-shadow)}
.jj-mobile-filter[open] summary{color:var(--jj-blue);border-color:#fff;box-shadow:var(--jj-glass-edge),0 0 0 1px #1254ff66,var(--jj-glass-shadow)}
.jj-page .jj-primary,.jj-page .wp-block-search__button,
.jj-sidebar .jj-nav-item.is-active,.jj-filters a.is-active,.jj-filter-panel a.is-active,
.jj-auth.login .button-primary,.jj-auth-tabs a[aria-current] {
  background:var(--jj-glass-tint);
  border-color:#ffffff52;
  color:#fff;
  box-shadow:inset 0 1px 0 #ffffff80,inset 0 0 0 1px #ffffff1a,0 2px 6px #00000014;
}
@media(max-width:700px) {
  .jj-sidebar nav {
    background:var(--jj-glass-fill);background-color:#ffffff59;
    border:1px solid #ffffffd9;
    box-shadow:var(--jj-glass-edge),0 0 0 1px #00000008,0 6px 24px #00000014;
    -webkit-backdrop-filter:blur(24px) saturate(120%);
    backdrop-filter:blur(24px) saturate(120%);
  }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .jj-search,.jj-filters,.jj-mobile-filter summary,.jj-filter-panel,:is(.jj-page .jj-back,.jj-mobile-back),.jj-auth-header .jj-pill{background:#f7f7f7}
  @media(max-width:700px){.jj-sidebar nav{background:#f7f7f7}}
}
@media(prefers-reduced-transparency:reduce) {
  .jj-search,.jj-filters,.jj-mobile-filter summary,.jj-filter-panel,:is(.jj-page .jj-back,.jj-mobile-back),.jj-auth-header .jj-pill{background:#f7f7f7;-webkit-backdrop-filter:none;backdrop-filter:none}
  @media(max-width:700px){.jj-sidebar nav{background:#f7f7f7;-webkit-backdrop-filter:none;backdrop-filter:none}}
}
/* Two independent, highly translucent reading controls; no enclosing surface. */
@media(min-width:701px){
 .jj-reading-bar :is(.jj-reading-back,.jj-reading-bar-title){
  border-radius:999px;border:1px solid #ffffffb3;
  background:linear-gradient(165deg,#ffffff85,#ffffff24 52%,#ffffff52);
  background-color:#ffffff40;color:var(--jj-ink);
  -webkit-backdrop-filter:blur(32px) saturate(135%);backdrop-filter:blur(32px) saturate(135%);
  box-shadow:inset 0 1px 0 #fffffff2,inset 1px 0 0 #ffffff80,inset 0 -1px 0 #ffffff59,0 0 0 1px #17171706,0 4px 16px #17171712;
 }
 @media(any-hover:hover){
  :where(:root:not([data-jj-pointer=touch])) .jj-reading-back:hover{background-color:#ffffff85;color:var(--jj-blue)}
 }
 .jj-reading-back:is(:active,.is-pressed){background-color:#ffffffa3;box-shadow:inset 0 2px 5px #17171714,0 0 0 1px #ffffffb3;transform:scale(.985)}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .jj-reading-bar :is(.jj-reading-back,.jj-reading-bar-title){background:#f8f8f8}
}
@media(prefers-reduced-transparency:reduce){
 .jj-reading-bar :is(.jj-reading-back,.jj-reading-bar-title){background:#f8f8f8;backdrop-filter:none;-webkit-backdrop-filter:none}
}