/* Results theme pills (2026-11-12, Daniel: "we like the concept but hate the execution- lets change this to something more standard
   and straightforward for selection"). They replace the 2026-10-22 bubbles, which were sized by count and coloured orange for worries a
   visitor brings, steel for praise and mist for small themes, and floated. Now one wrapping row of static anodized aluminium pills: the
   silver face of the segmented controls' track at rest, the steel face of their thumb when picked (segmented-controls.css; tokens from
   button-finish.css). The segmented controls' sliding thumb is one row only, so each pill carries its own face. No colour coding by
   theme and no motion: hover and press only, as the site's other controls. */
.rv-themes-lead{margin:8px 0 14px;font-size:16px;color:var(--muted)}
.rv-themes-lead strong{color:var(--ink)}
.rv-themes{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:10px;margin:0 0 28px;padding:0}
.rv-theme{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;gap:8px;min-width:48px;min-height:48px;margin:0;padding:10px 18px;border:0;border-radius:999px;
  background:var(--dio-alu-silver,linear-gradient(180deg,#e6e8e8 0%,#d4d7d7 38%,#c9cdcd 100%));color:#1c3341;text-shadow:0 1px 0 rgba(255,255,255,.55);
  box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(20,40,52,.28),0 1px 2px rgba(16,32,42,.22);
  font:600 16px/1.25 var(--font,'Avenir Next',Avenir,Nunito Sans,system-ui,sans-serif);text-align:left;white-space:nowrap;cursor:pointer}
.rv-theme::after{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;opacity:.22;mix-blend-mode:overlay;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.rv-theme-n{font-weight:500;font-variant-numeric:tabular-nums}
/* Picked pill (2026-11-12, Daniel: "i want the pill to highlight orange when its clicked"): the orange face and ink text of the site's
   buttons when hovered or pressed (button-finish.css: #f4a165 / #ed873c / #e9853b with its highlight and shade, #203846 text, 4.74:1 on
   #ed873c, 4.60:1 at the darkest stop). This replaces the steel thumb face above. The focus ring stays the Reviews section's navy
   outline, drawn outside the pill. */
.rv-theme[aria-pressed=true]{background:linear-gradient(180deg,#f4a165 0%,#ed873c 40%,#e9853b 100%);color:#203846;text-shadow:0 1px 0 rgba(255,255,255,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(110,45,0,.32),inset 1px 0 0 rgba(255,255,255,.2),inset -1px 0 0 rgba(110,45,0,.12),0 2px 4px rgba(16,32,42,.25)}
@media(hover:hover){.rv-theme[aria-pressed=false]:hover{box-shadow:inset 0 0 0 1px #56737f,inset 0 1px 0 #fff,inset 0 -1px 0 rgba(20,40,52,.28),0 1px 2px rgba(16,32,42,.22)}}
.rv-theme[aria-pressed=false]:active{background:linear-gradient(0deg,#e6e8e8 0%,#d4d7d7 38%,#c9cdcd 100%);box-shadow:inset 0 1px 2px rgba(20,40,52,.28)}
/* Focus ring: the Reviews section's own (feature-pass.css, #reviews :focus-visible: 2px navy, 4px out), as its search box and cards. */
mark.rv-hit{background:rgba(237,135,60,.22);color:inherit;border-bottom:2px solid var(--orange);padding:0 1px}
@media(max-width:599px){.rv-themes{gap:8px}.rv-theme{min-height:44px;padding:9px 14px;gap:6px;font-size:15px}}
@media(forced-colors:active){.rv-theme{border:1px solid ButtonText;box-shadow:none}.rv-theme::after{display:none}
  .rv-theme[aria-pressed=true]{background:Highlight;color:HighlightText;forced-color-adjust:none}}
