/* R158: complete project galleries and visible filters. Existing readers and carousel owners remain in charge. */
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-tray{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  grid-column:1 / -1;flex:none;width:100%;max-width:100%;min-width:0;
  margin:0;padding:8px;box-sizing:border-box;min-height:64px;
  border-top:1px solid #e5dbed;border-bottom:1px solid #e5dbed;
  background:linear-gradient(100deg,#f4eefb,#f8f7fc);color:#49315f;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-thumbs{
  display:flex;align-items:center;gap:4px;flex:0 0 auto;min-width:0;margin:0;padding:0;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-thumb{
  position:relative;display:flex!important;align-items:center;justify-content:center;flex:0 0 44px;
  width:44px!important;min-width:44px;max-width:44px;height:46px!important;min-height:44px;
  margin:0!important;padding:2px!important;box-sizing:border-box;
  border:1px solid #d6c7e6!important;border-radius:7px!important;background:#fff!important;
  text-decoration:none;overflow:hidden;box-shadow:0 1px 2px #3f235009;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) [data-record] .r158-gallery-thumb>img{
  display:block!important;width:100%!important;max-width:100%!important;
  height:100%!important;min-height:0!important;max-height:100%!important;
  margin:0!important;padding:0!important;aspect-ratio:auto!important;
  object-fit:contain!important;object-position:center!important;border-radius:3px!important;
  background:transparent!important;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-open{
  position:relative;display:flex!important;align-items:center;justify-content:center;gap:8px;
  flex:1 1 auto;min-width:0;min-height:46px;height:auto!important;max-width:none;
  margin:0!important;padding:7px 12px!important;box-sizing:border-box;
  border:1px solid #6240a0!important;border-radius:8px!important;
  background:#6542a4!important;color:#fff!important;text-decoration:none!important;
  font-family:inherit;font-size:14px;font-weight:700;line-height:1.35;text-align:center;
  box-shadow:0 3px 8px #59328c22;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-open>span{
  position:static!important;display:block!important;min-width:0;width:auto!important;
  margin:0!important;padding:0!important;inset:auto!important;transform:none!important;
  background:none!important;color:inherit!important;font:inherit!important;
  line-height:inherit!important;white-space:normal;overflow-wrap:normal;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-open>b{
  position:static;flex:none;color:inherit;font-size:18px;font-weight:500;line-height:1;
}
html[data-r158-portfolio] #writing-samples.r122-paper [data-r122-stage]>article[data-record] .r24-work-media:has(>.r158-gallery-tray){row-gap:8px!important}

/* Keep the existing plus disclosure, with an explicit, visible visual hierarchy. */
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r153-project-variants{
  margin:8px 0 10px;padding:0 12px;border:1px solid #bfa6dc;border-radius:10px;
  background:#f0e8f9;color:#553477;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r153-project-variants>summary{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  min-height:44px;box-sizing:border-box;padding:8px 0;font-size:14px;
  font-weight:700;line-height:1.4;color:#553477;list-style:none;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r153-project-variants>summary::after{
  display:grid;place-items:center;flex:none;width:26px;height:26px;
  border-radius:50%;background:#6846a2;color:#fff;font-size:20px;font-weight:400;line-height:1;
}

/* Enhanced controls dispatch to the original select; only explicitly marked native controls are suppressed. */
html[data-r158-portfolio] [data-r158-native]{display:none!important}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-filter{
  display:flex;align-items:center;gap:8px;min-width:0;max-width:100%;margin:0;
  color:#735e85;font:inherit;font-size:13px;line-height:1.4;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-filter-label{
  display:block;flex:none;max-width:100%;font-size:12px;font-weight:600;line-height:1.4;white-space:nowrap;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-filter-controls{
  display:flex;align-items:center;gap:5px;flex:1 1 auto;min-width:0;max-width:100%;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-pill-rail{
  display:flex;align-items:center;gap:5px;flex:1 1 auto;min-width:0;max-width:100%;
  padding:2px;box-sizing:border-box;overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;scroll-padding-inline:2px;scrollbar-width:thin;scrollbar-color:#c8b6db transparent;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-pill{
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  flex:0 0 auto;min-width:44px;min-height:44px;margin:0;padding:8px 13px;box-sizing:border-box;
  border:1px solid #dacde8;border-radius:999px;background:#fff;color:#674d7d;
  font-family:inherit;font-size:13px;font-weight:550;line-height:1.4;white-space:nowrap;
  cursor:pointer;scroll-snap-align:start;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-pill[aria-pressed=true]{
  border-color:#7954ac;background:#ede3f7;color:#4b2875;font-weight:700;box-shadow:inset 0 -2px #7954ac;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-filter[data-r158-kind=audience] .r158-pill-rail{
  flex:none;overflow:visible;scroll-snap-type:none;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-filter[data-r158-kind=type]{flex:1 1 280px}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) :is(.r158-scroll-prev,.r158-scroll-next){
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;
  width:44px;min-width:44px;min-height:44px;margin:0;padding:0;box-sizing:border-box;
  border:1px solid #d5c5e5;border-radius:9px;background:#faf7fd;color:#68458a;
  font-family:inherit;font-size:21px;font-weight:500;line-height:1;cursor:pointer;
}
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) :is(.r158-pill,.r158-scroll-prev,.r158-scroll-next):disabled{
  opacity:.38;cursor:default;box-shadow:none;
}

/* The homepage's three audience choices are static and must not inherit R108's clear-only hiding rule. */
html[data-r158-portfolio] #selected.r86-selected [data-r78-filters][data-r158-audiences]:not([hidden]){
  display:flex!important;align-items:center;flex-wrap:nowrap;gap:5px;flex:none;
  min-width:0;max-width:100%;margin:0;padding:0;
}
html[data-r158-portfolio] #selected.r86-selected [data-r158-audiences]>.r158-audience-pill{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  min-width:44px;min-height:44px;margin:0;padding:8px 11px;box-sizing:border-box;
  border:1px solid #dbcee9;border-radius:999px;background:#fff;color:#674d7d;
  font-family:inherit;font-size:13px;font-weight:550;line-height:1.4;white-space:nowrap;cursor:pointer;
}
html[data-r158-portfolio] #selected.r86-selected [data-r158-audiences]>.r158-audience-pill[aria-pressed=true]{
  border-color:#7954ac;background:#ede3f7;color:#4b2875;font-weight:700;box-shadow:inset 0 -2px #7954ac;
}
/* R120/R125 own a grid toolbar. Assign the replacements to its named areas instead of auto-placement. */
html[data-r158-portfolio] #selected.r86-selected .r108-work-toolbar:has([data-r158-audiences]){
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  grid-template-areas:"title categories controls" "filters filters filters";gap:8px;
}
html[data-r158-portfolio] #selected.r86-selected .r108-work-toolbar .r158-filter[data-r158-contract=home-type]{
  grid-area:categories;align-self:center;width:100%;min-width:0;max-width:100%;
}
html[data-r158-portfolio] #selected.r86-selected .r108-work-toolbar [data-r78-filters][data-r158-audiences]{
  grid-area:filters;justify-self:end;min-width:0;max-width:100%;
}
/* R109 used one non-wrapping row sized for a select. Let the visible audience group fit naturally. */
html[data-r158-portfolio] #case-studies[data-r109-cases] .r109-case-bar:has(>.r158-filter[data-r158-contract=home-case-audience]){
  flex-wrap:wrap;white-space:normal;
}
html[data-r158-portfolio] #case-studies[data-r109-cases] .r109-case-bar>.r158-filter[data-r158-contract=home-case-audience]{
  flex:1 1 280px;min-width:0;
}

/* Preserve the original six-category owner on mobile instead of duplicating its navigation. */
html[data-r158-portfolio] body[data-r116-ready=true] #portfolio-browser .r116-categories[data-r158-categories]:not([hidden]){
  display:flex!important;flex-wrap:nowrap;align-items:center;gap:5px;
  min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#c8b6db transparent;
}
html[data-r158-portfolio] body[data-r116-ready=true] #portfolio-browser .r116-categories[data-r158-categories]>button{
  flex:0 0 auto;min-width:44px;min-height:44px;scroll-snap-align:start;border-radius:999px;
}

html[data-r158-portfolio] :is(.r158-gallery-thumb,.r158-gallery-open,.r158-pill,.r158-scroll-prev,.r158-scroll-next,.r158-audience-pill):focus-visible{
  outline:3px solid #8a68b6;outline-offset:2px;
}
@media(hover:hover){
  html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-open:hover{background:#523286!important;border-color:#523286!important}
  html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-thumb:hover{border-color:#8a66b2!important}
}
@media(max-width:760px){
  html[data-r158-portfolio] #selected.r86-selected .r108-work-toolbar:has([data-r158-audiences]){
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"title controls" "categories categories" "filters filters";
  }
  html[data-r158-portfolio] #selected.r86-selected .r108-work-toolbar:has([data-r158-audiences]) #r78-selected-title{
    min-width:0;white-space:normal;
  }
  html[data-r158-portfolio] #selected.r86-selected .r108-work-toolbar:has([data-r158-audiences]) .r86-switchboard{
    width:auto;max-width:100%;justify-self:end;justify-content:flex-end;border-top:0;padding-top:0;
  }
  html[data-r158-portfolio] #selected.r86-selected .r108-work-toolbar [data-r78-filters][data-r158-audiences]{justify-self:stretch;width:100%}
  html[data-r158-portfolio] #case-studies[data-r109-cases] .r109-case-bar>.r158-filter[data-r158-contract=home-case-audience]{
    order:2;flex:1 0 100%;width:100%;
  }
}
@media(max-width:700px){
  /* R116's two-column mobile toolbar must not split either replacement filter into half a row. */
  html[data-r158-portfolio] body[data-r116-ready=true] #portfolio-browser .r116-toolbar>.r158-filter{
    grid-column:1 / -1;min-width:0;width:100%;
  }
  html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-filter{
    width:100%;flex:1 1 100%;gap:6px;
  }
  html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-filter[data-r158-kind=audience] .r158-pill-rail{
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));flex:1 1 auto;gap:4px;
  }
  html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) .r158-filter[data-r158-kind=audience] .r158-pill{min-width:0;padding-inline:7px;font-size:12px;white-space:normal;text-align:center;overflow-wrap:break-word}
  html[data-r158-portfolio] #selected.r86-selected [data-r78-filters][data-r158-audiences]:not([hidden]){width:100%;flex:1 1 100%}
  html[data-r158-portfolio] #selected.r86-selected [data-r158-audiences]>.r158-audience-pill{flex:1 1 0;min-width:0;padding-inline:6px;font-size:12px;white-space:normal;text-align:center;overflow-wrap:break-word}
}
@media(max-width:600px){
  html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-thumb:nth-child(n+3){display:none!important}
  html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser) .r158-gallery-open{font-size:13px;padding-inline:10px!important}
}
/* Do not resurrect an inactive card, filtered option, hidden native control or closed gallery bank. */
html[data-r158-portfolio] :is(#selected,#writing-samples,#portfolio-browser,#case-studies) :is(.r158-filter,.r158-gallery-tray,.r158-gallery-thumb,.r158-gallery-open,.r158-pill,.r158-scroll-prev,.r158-scroll-next,.r153-project-variants,[data-r158-audiences],[data-r158-categories])[hidden]{display:none!important}
html[data-r158-portfolio] #selected.r86-selected [data-r78-filters][data-r158-audiences][hidden]{display:none!important}
