/* Ruban Size storefront widget. Inherits the theme's font and colors. The Appearance page of the app sets --rbs-* on the
   widget's style attribute (ruban.settings.style -> snippets/ruban-style.liquid, schema in shared/style.js): every rule
   reads them with the default look as fallback, so an unset value changes nothing. Internal values stay --rb-*.
   Units are em, never rem: some themes (Dawn) set the root font size to 62.5%. */
.rb{--rb-accent:var(--rbs-acc,#1a1a1a);--rb-radius:var(--rbs-radius,8px);--rb-on-acc:var(--rbs-onacc,#fff);--rb-line:color-mix(in srgb,currentColor 14%,transparent);--rb-soft:color-mix(in srgb,currentColor 5%,transparent);--rb-tint:color-mix(in srgb,var(--rb-accent) 12%,transparent);--rb-surface:var(--rb-bg,#fff);--rb-ink:var(--rb-fg,#1a1a1a);font:inherit;font-family:var(--rbs-font,inherit);color:inherit;text-align:start}
/* An accent chosen on the Appearance page wins over the readability fallback of ruban-plus.js, which only sets the root */
.rb[style*="--rbs-acc:"]>*{--rb-accent:var(--rbs-acc);--rb-tint:color-mix(in srgb,var(--rbs-acc) 12%,transparent)}
.rb *,.rb *::before,.rb *::after{box-sizing:border-box}
.rb [hidden]{display:none!important}
.rb button{font:inherit;color:inherit;cursor:pointer}

/* Trigger: text link, icon and text, button, pill */
.rb--modal,.rb--drawer{display:flex;justify-content:var(--rb-align,start);margin:.5em 0}
.rb .rb-trigger{display:inline-flex;align-items:center;justify-content:var(--rbs-ljust,normal);flex-direction:var(--rbs-ldir,row);gap:.4em;width:var(--rbs-lwid,auto);background:var(--rbs-lbg,none);color:var(--rbs-lfg,inherit);border:var(--rbs-lbw,0) solid var(--rbs-lbd,currentColor);border-radius:var(--rbs-lr,0);padding:var(--rbs-lpy,.25em) var(--rbs-lpx,0);font-size:var(--rbs-lsize,inherit);font-weight:var(--rbs-lw,inherit);font-style:var(--rbs-lst,inherit)}
.rb[style*="--rbs-lcase:"] .rb-trigger{text-transform:var(--rbs-lcase)}
.rb[style*="--rbs-ltr:"] .rb-trigger{letter-spacing:var(--rbs-ltr)}
.rb .rb-trigger span{text-decoration-line:var(--rbs-lul,none);text-underline-offset:.25em;text-decoration-thickness:1px}
.rb .rb-trigger--link span,.rb .rb-trigger--icon span{text-decoration-line:var(--rbs-lul,underline)}
.rb .rb-trigger:hover{color:var(--rbs-lhfg,var(--rbs-lfg,inherit));background:var(--rbs-lhbg,var(--rbs-lbg,none))}
.rb .rb-trigger:hover span{text-decoration-thickness:2px;text-decoration-line:var(--rbs-lulh,var(--rbs-lul,none))}
.rb .rb-trigger--link:hover span,.rb .rb-trigger--icon:hover span{text-decoration-line:var(--rbs-lulh,var(--rbs-lul,underline))}
.rb .rb-trigger--button{border:var(--rbs-lbw,1px) solid var(--rbs-lbd,currentColor);border-radius:var(--rbs-lr,var(--rb-radius));padding:var(--rbs-lpy,.55em) var(--rbs-lpx,1em)}
.rb .rb-trigger--button:hover{background:var(--rbs-lhbg,var(--rbs-lbg,var(--rb-soft)))}
.rb .rb-trigger--pill{background:var(--rbs-lbg,var(--rb-accent));color:var(--rbs-lfg,var(--rb-on-acc));border-color:var(--rbs-lbd,transparent);border-radius:var(--rbs-lr,999px);padding:var(--rbs-lpy,.6em) var(--rbs-lpx,1.25em);font-weight:var(--rbs-lw,600)}
.rb .rb-trigger--pill:hover{background:var(--rbs-lhbg,var(--rbs-lbg,var(--rb-accent)));color:var(--rbs-lhfg,var(--rbs-lfg,var(--rb-on-acc)));filter:var(--rbs-lhf,brightness(1.12))}
.rb-icon{flex:none}
.rb .rb-trigger .rb-icon,.rb .rb-float .rb-icon,.rb .rb-acc__sum .rb-icon{width:var(--rbs-isize,18px);height:var(--rbs-isize,18px);color:var(--rbs-licol,currentColor)}
.rb .rb-icon--img{object-fit:contain}
.rb-close svg{width:1.25em;height:1.25em}
/* Themes size every button (button{width:100%;height:50px}): the link keeps its own height */
.rb .rb-trigger:not(.rb-trigger--button){height:auto;min-height:0}
.rb-trigger:focus-visible,.rb button:focus-visible,.rb-scroll:focus-visible,.rb input:focus-visible,.rb summary:focus-visible{outline:2px solid var(--rb-accent);outline-offset:2px;border-radius:4px}

/* Dialog: centered on desktop, bottom sheet on mobile, side panel for the drawer layout */
.rb .rb-dialog{--rb-surface:var(--rbs-wbg,var(--rb-mode-bg,var(--rb-bg,#fff)));--rb-ink:var(--rbs-wfg,var(--rb-mode-fg,var(--rb-fg,#1a1a1a)));border:0;padding:0;color:var(--rb-ink)!important;background:var(--rb-surface)!important;opacity:1;border-radius:var(--rbs-wr,calc(var(--rb-radius) + 4px));width:min(var(--rbs-ww,880px),calc(100vw - 2em));max-height:var(--rbs-wh,min(86vh,900px));margin:var(--rbs-wm,auto);box-shadow:var(--rbs-wsh,0 24px 64px rgba(0,0,0,.22));overflow:hidden;font:inherit}
.rb-dialog[open]{display:flex;flex-direction:column;animation:var(--rbs-anim,rb-pop) .18s ease-out}
/* Old theme resets (normalize: dialog{display:block}) would show the closed dialog in the page */
.rb .rb-dialog:not([open]){display:none}
.rb-dialog::backdrop{background:color-mix(in srgb,var(--rbs-ov,#0f0f0f) var(--rbs-ovo,45%),transparent);backdrop-filter:blur(var(--rbs-blur,2px))}
.rb-dialog__head{font-size:var(--rbs-size,max(15px,1em));display:flex;align-items:center;justify-content:space-between;gap:1em;padding:1em var(--rbs-wpad,1.25em) var(--rbs-hpb,.75em);border-bottom:var(--rbs-hline,1px solid var(--rb-line));background:var(--rbs-hbg,var(--rbs-hbg0,none));color:var(--rbs-hfg,var(--rbs-hfg0,inherit))}
.rb-dialog__title{flex:1;margin:0;font-size:var(--rbs-tsize,1.15em);font-weight:var(--rbs-hw,600);letter-spacing:0;text-align:var(--rbs-htal,start);padding-inline-start:var(--rbs-htpad,0)}
.rb .rb-close{display:inline-flex;align-items:center;justify-content:center;gap:.35em;flex:none;min-width:2.25em;width:var(--rbs-clw,2.25em);height:2.25em;padding:0 var(--rbs-clpx,0);border-radius:var(--rbs-clr,999px);border:0;background:var(--rbs-clbg,var(--rb-soft));color:inherit}
.rb .rb-close:hover{background:var(--rb-line)}
.rb-close__t{display:var(--rbs-clt,none);font-size:.9em}
.rb-dialog__body{font-size:var(--rbs-size,max(15px,1em));overflow:auto;padding:var(--rbs-wpad,1em 1.25em 1.5em);overscroll-behavior:contain}
.rb .rb-dialog--drawer{margin:0 0 0 auto;height:100dvh;max-height:100dvh;width:min(var(--rbs-ww,600px),100vw);border-radius:0}
.rb .rb-dialog--drawer[open]{animation:var(--rbs-anim2,rb-slide) .22s ease-out}
@media (max-width:749px){
  .rb .rb-dialog--modal{margin:var(--rbs-mm,auto 0 0);width:var(--rbs-mw,100vw);max-width:var(--rbs-mw,100vw);height:var(--rbs-mht,fit-content);max-height:var(--rbs-mh,92dvh);border-radius:var(--rbs-mr,var(--rbs-wr,16px) var(--rbs-wr,16px) 0 0)}
  .rb .rb-dialog--modal[open]{animation:var(--rbs-anim2,var(--rbs-manim,rb-up)) .22s ease-out}
  .rb-dialog--modal .rb-dialog__head::before{content:"";display:var(--rbs-mgrip,block);position:absolute;left:50%;top:6px;width:36px;height:4px;margin-left:-18px;border-radius:2px;background:var(--rb-line)}
  .rb-dialog__head{position:relative;padding-top:1.1em}
}
@keyframes rb-pop{from{opacity:0;transform:translateY(8px) scale(.98)}}
@keyframes rb-up{from{transform:translateY(100%)}}
@keyframes rb-slide{from{transform:translateX(100%)}}
@keyframes rb-fade{from{opacity:0}}
[dir=rtl] .rb .rb-dialog--drawer{margin:0 auto 0 0}
[dir=rtl] .rb .rb-dialog--drawer[open]{animation-name:var(--rbs-anim2,rb-slide-rtl)}
@keyframes rb-slide-rtl{from{transform:translateX(-100%)}}
/* Drawer on the start side (Appearance page) */
.rb .rb-dialog--drawer.rb-dialog--start{margin:0 auto 0 0}
.rb .rb-dialog--drawer.rb-dialog--start[open]{animation-name:var(--rbs-anim2,rb-slide-rtl)}
[dir=rtl] .rb .rb-dialog--drawer.rb-dialog--start{margin:0 0 0 auto}
[dir=rtl] .rb .rb-dialog--drawer.rb-dialog--start[open]{animation-name:var(--rbs-anim2,rb-slide)}
/* Window always light or always dark (Appearance page); "automatic" follows the theme (ruban-plus.js) */
.rb .rb-mode-light{--rb-mode-bg:#fff;--rb-mode-fg:#1a1a1a;--rb-accent:var(--rbs-acc,#1a1a1a);--rb-on-acc:var(--rbs-onacc,#fff);--rb-line:color-mix(in srgb,currentColor 14%,transparent)}
.rb .rb-mode-dark{--rb-mode-bg:#161616;--rb-mode-fg:#f2f2f2;--rb-accent:var(--rbs-acc,#f2f2f2);--rb-on-acc:var(--rbs-onacc,#161616);--rb-line:color-mix(in srgb,currentColor 22%,transparent)}
.rb .rb-mode-light,.rb .rb-mode-dark{--rb-tint:color-mix(in srgb,var(--rb-accent) 12%,transparent)}
@media (prefers-reduced-motion:reduce){.rb .rb-dialog[open],[dir=rtl] .rb .rb-dialog--drawer[open]{animation:none!important}}
/* Full screen popup on computers (Appearance page, window.full) */
@media (min-width:750px){.rb[style*="--rbs-fw:"] .rb-dialog--modal{width:var(--rbs-fw);max-width:var(--rbs-fw);height:var(--rbs-fh);max-height:var(--rbs-fh);margin:0;border-radius:0}}
/* Text before and after the link (link.before, link.after) */
.rb .rb-pre,.rb .rb-post{align-self:center}
.rb .rb-pre{margin-inline-end:.35em}
.rb .rb-post{margin-inline-start:.35em}
/* Product images in the window (window.images): a strip that scrolls, or a column beside the chart on computers */
.rb .rb-pics{display:flex;gap:.5em;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 0 1em;padding-bottom:.25em;scrollbar-width:thin}
.rb .rb-pics .rb-pic{flex:none;display:block;width:auto;max-width:none;height:9em;object-fit:cover;scroll-snap-align:start;border-radius:calc(var(--rb-radius) / 2);background:var(--rb-soft)}
@media (min-width:750px){
  .rb .rb-withpics--side{display:grid;grid-template-columns:minmax(0,11em) minmax(0,1fr);gap:1.25em;align-items:start}
  .rb .rb-withpics--side .rb-pics{flex-direction:column;overflow:auto;max-height:min(70vh,40em);scroll-snap-type:y mandatory;margin:0;position:sticky;top:0}
  .rb .rb-withpics--side .rb-pics .rb-pic{width:100%;height:auto}
}


/* Toolbar */
.rb-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.5em;margin:0 0 .75em}
.rb-toolbar:not(:has(> :not([hidden]))){display:none}
.rb-seg{display:inline-flex;border:1px solid var(--rbs-segbd,var(--rb-line));border-radius:var(--rbs-segr,999px);padding:2px;background:var(--rbs-segbg,var(--rb-soft))}
.rb-seg button{border:0;background:none;padding:.3em .8em;border-radius:var(--rbs-segr,999px);font-size:.85em;line-height:1.2}
.rb .rb-seg button[aria-pressed=true]{background:var(--rbs-segonbg,var(--rb-accent));color:var(--rbs-segonfg,var(--rb-on-acc));text-decoration:var(--rbs-segul,none);text-underline-offset:.3em}
.rb .rb-find-btn{display:inline-flex;align-items:center;gap:.4em;margin-inline-start:auto;border:1px solid var(--rbs-fbd,var(--rbs-fc,var(--rb-accent)));color:var(--rbs-ffillc,var(--rbs-fc,var(--rb-accent)));background:var(--rbs-ffill,none);border-radius:999px;padding:.35em var(--rbs-fpx,.9em);font-size:.85em;text-decoration:var(--rbs-ful,none);text-underline-offset:.25em}
.rb .rb-find-btn[aria-expanded=true],.rb .rb-find-btn:hover{background:var(--rbs-fhbg,var(--rbs-fc,var(--rb-accent)));color:var(--rbs-fhfg,var(--rbs-fon,var(--rb-on-acc)))}

/* Tabs */
.rb-tablist{display:flex;gap:var(--rbs-tgap,.25em);overflow-x:auto;border-bottom:var(--rbs-tlb,1px solid var(--rb-line));margin:0 0 1em;scrollbar-width:none}
.rb-tab{flex:none;border:0;background:var(--rbs-tbg,none);padding:.55em .8em;border-bottom:var(--rbs-tbd,2px solid transparent);margin-bottom:var(--rbs-tmb,-1px);opacity:.7;font-size:.92em;white-space:nowrap}
.rb-tab[aria-selected=true]{opacity:1;border-bottom-color:var(--rbs-tbc,var(--rb-accent));font-weight:600}
.rb-tab:hover{opacity:1}
/* Tab styles (Appearance page): filled, outlined, pills */
.rb[style*="--rbs-tbd:"] .rb-tab{border:var(--rbs-tbd);border-radius:var(--rbs-tr)}
.rb[style*="--rbs-tonbd:"] .rb-tab[aria-selected=true]{border-color:var(--rbs-tonbd)}
.rb[style*="--rbs-ton:"] .rb-tab[aria-selected=true]{background:var(--rbs-ton);color:var(--rbs-tbf,var(--rb-on-acc))}

/* Chart content */
.rb-chart__title{margin:0 0 .5em;font-size:1.05em;font-weight:600;letter-spacing:0}
.rb-rt{margin:.5em 0;font-size:.92em;line-height:1.55}
.rb-rt p{margin:.35em 0}
.rb-fig{margin:.75em 0}
.rb-fig img,.rb-htm__img{display:block;max-width:100%;height:auto;border-radius:var(--rb-radius)}
.rb-fig figcaption{font-size:.82em;opacity:.7;margin-top:.35em}
.rb-h4{margin:0 0 .5em;font-size:1em;font-weight:600}
.rb-htm{margin:1em 0;padding:1em;border-radius:var(--rb-radius);background:var(--rb-soft)}
.rb-htm__body{display:flex;gap:1em;align-items:flex-start}
.rb-htm__img{width:min(40%,220px)}
.rb-htm__steps{margin:0;padding-inline-start:1.2em;font-size:.9em;line-height:1.5}
.rb-htm__steps li{margin:.3em 0}
.rb-cols{display:grid;grid-template-columns:repeat(var(--rb-cols,2),minmax(0,1fr));gap:1.25em;align-items:start}
@media (max-width:749px){.rb-cols{grid-template-columns:1fr}.rb-htm__body{flex-direction:column}.rb-htm__img{width:100%}}

/* Divider, image and text, gallery, accordion in a chart (snippets/ruban-block-2.liquid) */
.rb .rb-div{display:block;height:0;margin:1.25em 0;padding:0;border:0;border-top:1px solid var(--rb-line);background:none;color:inherit}
.rb .rb-div--dotted{border-top:2px dotted var(--rb-line)}
.rb .rb-div--space{border-top:0;margin:.75em 0;height:.5em}
.rb .rb-div--label{display:flex;align-items:center;gap:.75em;height:auto;border:0;font-size:.85em;font-weight:600;line-height:1.3}
.rb .rb-div--label::before,.rb .rb-div--label::after{content:"";flex:1 1 1em;border-top:1px solid var(--rb-line)}
.rb .rb-div--label.rb-div--dotted::before,.rb .rb-div--label.rb-div--dotted::after{border-top:2px dotted var(--rb-line)}
.rb .rb-div--label.rb-div--space::before,.rb .rb-div--label.rb-div--space::after{content:none}
.rb-it{container-type:inline-size;margin:.75em 0}
.rb-it__in{display:grid;grid-template-columns:1fr 1fr;gap:1em;align-items:start}
.rb-it--r13,.rb-it--end.rb-it--r23{grid-template-columns:1fr 2fr}
.rb-it--r23,.rb-it--end.rb-it--r13{grid-template-columns:2fr 1fr}
.rb-it--end .rb-it__img{order:2}
.rb .rb-it__img{display:block;width:100%;max-width:100%;height:auto;margin:0;border-radius:var(--rb-radius)}
.rb .rb-it__text{margin:0;min-width:0}
@media (max-width:749px){.rb-it .rb-it__in{grid-template-columns:1fr}.rb-it .rb-it--end .rb-it__img{order:0}}
@container (max-width:28em){.rb-it .rb-it__in{grid-template-columns:1fr}.rb-it .rb-it--end .rb-it__img{order:0}}
.rb-gal{margin:.75em 0;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:thin}
.rb-gal:focus-visible{outline:2px solid var(--rb-accent);outline-offset:2px;border-radius:4px}
.rb .rb-gal__list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(min(9em,72%),1fr);gap:.75em;margin:0;padding:0 0 .35em;list-style:none}
.rb .rb-gal__item{scroll-snap-align:start;margin:0;padding:0;list-style:none}
.rb .rb-gal__item::before{content:none}
.rb .rb-gal__fig{margin:0}
.rb .rb-gal__fig img{display:block;width:100%;max-width:100%;height:auto;border-radius:var(--rb-radius)}
.rb-gal__fig figcaption{font-size:.82em;opacity:.75;margin-top:.35em}
.rb-acb{margin:.75em 0;border-top:1px solid var(--rb-line)}
.rb-acb__item{border-bottom:1px solid var(--rb-line)}
.rb .rb-acb__sum{display:flex;align-items:center;gap:.5em;padding:.75em 0;cursor:pointer;list-style:none;font-weight:600;font-size:.95em}
.rb-acb__sum::-webkit-details-marker{display:none}
.rb-acb__sum::after{content:"";flex:none;margin-inline:auto .35em;width:var(--rbs-aciw,.42em);height:var(--rbs-aciw,.42em);border-right:var(--rbs-acibd,1px solid currentColor);border-bottom:var(--rbs-acibd,1px solid currentColor);transform:var(--rbs-acit,translateY(-25%) rotate(45deg));transition:transform .15s}
.rb-acb__item[open]>.rb-acb__sum::after{transform:var(--rbs-acito,translateY(25%) rotate(-135deg))}
.rb-acb__body{padding:0 0 .75em}
@media (prefers-reduced-motion:reduce){.rb-acb__sum::after{transition:none}}

/* Grid */
.rb-grid{margin:.75em 0}
.rb-scroll{overflow:auto;max-height:60vh;border:var(--rbs-bow,1px) solid var(--rbs-tline,var(--rb-line));border-radius:var(--rb-radius);
  background:linear-gradient(to right,var(--rb-surface) 30%,transparent) left/2em 100% no-repeat local,linear-gradient(to left,var(--rb-surface) 30%,transparent) right/2em 100% no-repeat local,
  radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.14),transparent) left/12px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.14),transparent) right/12px 100% no-repeat scroll}
.rb-inline .rb-scroll,.rb-acc .rb-scroll,.rb-page .rb-scroll{max-height:none}
.rb-table{border-collapse:separate;border-spacing:0;width:100%;font-size:var(--rbs-tsz,.9em);font-variant-numeric:tabular-nums;line-height:1.3}
.rb-table caption{caption-side:top;text-align:start;padding:.5em .75em;font-size:.85em;opacity:.75}
.rb-table th,.rb-table td{padding:var(--rbs-cpy,.65em) var(--rbs-cpx,.75em);text-align:var(--rbs-tal,center);white-space:nowrap;border-bottom:var(--rbs-brw,1px) solid var(--rbs-tline,var(--rb-line));border-inline-end:var(--rbs-bcw,0px) solid var(--rbs-tline,var(--rb-line))}
.rb .rb-table tr>:last-child{border-inline-end-width:0}
.rb .rb-table tr>:first-child,.rb .rb-table [rowspan]{border-inline-end:var(--rbs-bc1,1px) solid var(--rbs-tline,var(--rb-line))}
.rb .rb-table thead th{font-size:.92em;letter-spacing:.01em}
.rb .rb-table tbody tr:has(>[rowspan]):not(:first-child)>*{border-top:var(--rbs-brw,1px) solid color-mix(in srgb,currentColor 30%,transparent)}
.rb-table tbody tr:last-child>*{border-bottom:0}
.rb-table th{font-weight:600;background:var(--rbs-thbg,color-mix(in srgb,var(--rb-ink) 5%,var(--rb-surface)));color:var(--rbs-thfg,inherit)}
.rb-table thead th{position:sticky;top:var(--rbs-stht,0);z-index:2}
.rb-table tbody th{position:sticky;inset-inline-start:var(--rbs-stcl,0);z-index:1;text-align:start}
.rb-table thead th:first-child{inset-inline-start:var(--rbs-stcl,0);z-index:3}
.rb-table thead th:first-child{position:sticky}

.rb .rb-table tbody tr:nth-child(even){background:var(--rbs-stripe,none)}
.rb-table td.rb-x{background:var(--rbs-hovx,var(--rbs-hov,color-mix(in srgb,var(--rb-accent) 6%,transparent)))}
.rb-table tbody tr:hover td{background:var(--rbs-hov,color-mix(in srgb,var(--rb-accent) 6%,transparent))}
.rb-table .rb-cur{background:var(--rbs-cur,var(--rb-tint))!important;font-weight:600}
.rb-table th.rb-cur{box-shadow:inset 0 -3px 0 var(--rb-accent)}
.rb-table tr.rb-cur>*{background:var(--rbs-cur,var(--rb-tint))!important;font-weight:600}
/* A selected header cell keeps the header's color underneath, so its text stays readable on a colored header */
.rb .rb-table th.rb-cur:not(.rb-best),.rb .rb-table tr.rb-cur:not(.rb-best)>th{background:color-mix(in srgb,var(--rb-accent) 12%,var(--rbs-thbg,var(--rb-surface)))!important}
.rb-table .rb-best{background:var(--rbs-best,color-mix(in srgb,var(--rb-accent) 22%,transparent))!important;font-weight:700}

/* Fit scale: five fixed steps and the level in words, nothing that looks draggable */
.rb-fit{display:flex;align-items:center;gap:.6em;margin:.25em 0 .35em;font-size:.88em}
.rb-fit__k{font-weight:600}
.rb-fit__scale{display:inline-flex;gap:3px}
.rb-fit__step{width:1.6em;height:.4em;border-radius:2px;background:var(--rb-line)}
.rb-fit__step.rb-on{background:var(--rb-accent)}
.rb-fit__note{margin:0 0 1em;font-size:.85em;opacity:.85}

/* Find my size */
.rb-finder{margin:0 0 1em;padding:1em;border:1px solid var(--rbs-fbd2,var(--rb-line));border-radius:var(--rb-radius);background:var(--rbs-fform,var(--rb-soft))}
.rb-finder p{margin:0 0 .75em;font-size:.88em}
.rb-finder__fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.6em}
.rb-finder label{display:flex;flex-direction:column;gap:.25em;font-size:.82em;font-weight:600}
.rb-finder__in{display:flex;align-items:center;border:1px solid var(--rbs-fbd2,var(--rb-line));border-radius:calc(var(--rb-radius) - 2px);background:var(--rbs-ffield,var(--rb-surface));overflow:hidden}
.rb .rb-finder input{width:100%;min-width:0;border:0;padding:.55em .6em;font:inherit;font-weight:400;background:none;color:inherit;box-shadow:none!important;outline:0!important;-moz-appearance:textfield;appearance:textfield}
.rb-finder input::-webkit-inner-spin-button,.rb-finder input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.rb-finder__in:focus-within{border-color:var(--rb-accent);box-shadow:0 0 0 1px var(--rb-accent)}
.rb-finder__u{padding:0 .6em;font-weight:400;opacity:.6}
.rb .rb-finder__go{margin-top:.75em;border:0;border-radius:999px;background:var(--rbs-gobg,var(--rb-accent));color:var(--rbs-gofg,var(--rb-on-acc));padding:.6em 1.2em;font-weight:600}
.rb .rb-finder__go:hover{filter:brightness(1.15)}
.rb-finder__out{margin-top:.9em;font-size:.95em}
.rb-finder__out:not(:empty){padding:.9em 1em;border-radius:var(--rb-radius);background:var(--rbs-ffield,var(--rb-surface));border-inline-start:4px solid var(--rb-accent)}
.rb-finder__out strong{font-size:1.2em}
.rb-finder__out br{display:none}
.rb-finder__out .rb-finder__go{display:block;margin-top:.6em}

/* Inline, accordion, floating */
.rb-inline{margin:1em 0;padding:var(--rbs-inp,0);border:var(--rbs-inb,0) solid var(--rb-line);border-radius:var(--rb-radius);background:var(--rbs-inbg,none);font-size:var(--rbs-size,1em)}
.rb-acc{border:var(--rbs-acb,0) solid var(--rb-line);border-block-width:var(--rbs-acbb,1px);border-radius:var(--rbs-acr,0);padding-inline:var(--rbs-acpi,0);margin:.5em 0}
.rb-acc__sum{display:flex;align-items:center;gap:.5em;padding:.9em 0;cursor:pointer;list-style:none;font-weight:500}
.rb-acc__sum::-webkit-details-marker{display:none}
.rb-acc__sum::after{content:"";flex:none;margin-inline:auto .35em;width:var(--rbs-aciw,.42em);height:var(--rbs-aciw,.42em);border-right:var(--rbs-acibd,1px solid currentColor);border-bottom:var(--rbs-acibd,1px solid currentColor);background:var(--rbs-acibg,none);transform:var(--rbs-acit,translateY(-25%) rotate(45deg));transition:transform .15s}
.rb-acc[open]>.rb-acc__sum::after{transform:var(--rbs-acito,translateY(25%) rotate(-135deg))}
.rb-acc__body{padding:0 0 1em;font-size:var(--rbs-size,1em)}
.rb-float{position:fixed;inset-inline-start:1em;bottom:1em;z-index:30;display:inline-flex;align-items:center;gap:.45em;border:0;border-radius:var(--rbs-flrad,999px);padding:.7em 1.05em;background:var(--rbs-flbg,var(--rb-accent));color:var(--rbs-flfg,var(--rb-on-acc))!important;box-shadow:0 8px 24px rgba(0,0,0,.2);font-size:.9em;writing-mode:var(--rbs-flwm,horizontal-tb)}

/* Video */
.rb-video{position:relative;aspect-ratio:16/9;margin:.75em 0;border-radius:var(--rb-radius);overflow:hidden;background:#111}
.rb-video__play{position:absolute;inset:0;width:100%;border:0;padding:0;background:none;color:#fff}
.rb-video__play img{width:100%;height:100%;object-fit:cover;opacity:.8}
.rb-video__icon{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(0,0,0,.6)}
.rb-video__icon::after{content:"";position:absolute;left:26px;top:20px;border-left:18px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent}
.rb-video__label{position:absolute;left:0;right:0;bottom:.75em;font-size:.9em}
.rb-video iframe,.rb-video video{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Size guide page */
.rb-page{margin:2em auto;max-width:960px}
.rb-page__title{margin:0 0 1em}
.rb-page__tools{display:flex;flex-wrap:wrap;gap:.6em;align-items:center;margin:0 0 1em}
.rb-search{flex:1 1 240px;border:1px solid var(--rb-line);border-radius:999px;padding:.6em 1em;font:inherit;background:none;color:inherit}
.rb-chips{display:flex;flex-wrap:wrap;gap:.4em}
.rb-chips button{border:1px solid var(--rb-line);background:none;border-radius:999px;padding:.3em .8em;font-size:.85em}
.rb .rb-chips button[aria-pressed=true]{background:var(--rb-accent);border-color:var(--rb-accent);color:var(--rb-on-acc)}
.rb-chip-tag{margin-inline-start:auto;margin-inline-end:.75em;font-size:.75em;font-weight:400;padding:.15em .55em;border-radius:999px;background:var(--rb-soft)}
.rb-brand{margin:1em 0 0;font-size:.75em;opacity:.6;text-align:end}
.rb-brand a{color:inherit}
.rb-debug{font-size:12px;background:#fffbe6;border:1px dashed #c90;padding:6px;margin:8px 0}
.rb-debug pre{white-space:pre-wrap;margin:0}
@media print{.rb-dialog{position:static;box-shadow:none;max-height:none}.rb-toolbar,.rb-close{display:none}}

/* Remembered measurements: "Your size: M" */
.rb .rb-badge{display:inline-flex;align-items:center;gap:.45em;margin-inline-start:1em;border:0;border-radius:var(--rbs-bdgr,0);background:var(--rbs-bdgbg,none);padding:var(--rbs-bdgp,.25em 0);color:inherit;font-size:.95em;line-height:1.3}
.rb .rb-badge::before{content:"";display:var(--rbs-bdgdot,inline);width:.5em;height:.5em;border-radius:50%;background:var(--rbs-bdg,var(--rb-accent))}
.rb .rb-badge__go{font-weight:600;color:var(--rbs-bdg,var(--rb-accent));text-decoration:underline;text-underline-offset:.25em;text-decoration-thickness:1px}
.rb .rb-badge:hover .rb-badge__go{text-decoration-thickness:2px}
.rb-toolbar .rb-badge{margin-inline-start:0}
.rb-finder__foot{margin:.75em 0 0;font-size:.78em;opacity:.75}
.rb .rb-link{border:0;background:none;padding:0;text-decoration:underline;font-size:inherit}
/* Size hints on the theme's picker */
.rb-tip{position:absolute;z-index:2147483000;max-width:260px;padding:.6em .8em;border-radius:8px;background:#1a1a1a;color:#fff;font-size:13px;line-height:1.45;box-shadow:0 8px 24px rgba(0,0,0,.25);pointer-events:none}
.rb-tip strong{display:block;margin-bottom:.15em}
.rb-tip::after{content:"";position:absolute;left:50%;bottom:-6px;margin-left:-6px;border:6px solid transparent;border-bottom:0;border-top-color:#1a1a1a}
/* Sold-out sizes: readable values, a "Sold out" tag under the size */
.rb .rb-table .rb-out,.rb .rb-table tr.rb-out>*{opacity:var(--rbs-soo,.62)}
.rb .rb-table td.rb-out,.rb .rb-table tr.rb-out>td{text-decoration:var(--rbs-sod,none)}
.rb .rb-table [data-out]::after{content:attr(data-out);display:block;margin-top:.15em;font-size:.72em;font-weight:500;white-space:nowrap}
.rb .rb-table [data-tag][data-out]::after{content:attr(data-tag) " · " attr(data-out)}
/* Interactive figure and measure highlight */
.rb-figure{display:block;width:min(42%,200px);height:auto;flex:none}
.rb-figure__body{fill:color-mix(in srgb,var(--rb-ink) 7%,var(--rb-surface));stroke:var(--rb-ink);stroke-width:1.6;stroke-linejoin:round}
.rb-figure__toes ellipse{fill:color-mix(in srgb,var(--rb-ink) 7%,var(--rb-surface));stroke:var(--rb-ink);stroke-width:1.4}
.rb-m{fill:none;stroke:var(--rb-accent);stroke-width:1.8;stroke-dasharray:4 3;opacity:.55;transition:opacity .15s,stroke-width .15s}
.rb-m.rb-hl{opacity:1;stroke-width:3.2;stroke-dasharray:none}
.rb-htm__steps li{border-radius:6px;padding:.2em .35em;margin-inline-start:-.35em}
.rb-htm__steps li[data-measure]{cursor:default}
.rb-htm__steps li.rb-hl{background:var(--rb-tint)}
.rb-table tr.rb-hl>*,.rb-table th.rb-hl{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--rb-accent) 10%,transparent)}
.rb-finder label.rb-hl .rb-finder__in{border-color:var(--rb-accent)}
.rb-guide{margin-top:1em}
.rb-guide .rb-htm__body{padding:.25em 0 .5em}
@media (max-width:749px){.rb-figure{width:min(60%,200px);margin:0 auto}}
/* Dark themes */
.rb-dark{--rb-line:color-mix(in srgb,currentColor 22%,transparent);--rb-on-acc:var(--rbs-onacc,var(--rb-bg,#111))}
.rb-dark .rb-tip{background:#f2f2f2;color:#111}
@media (prefers-reduced-motion:reduce){.rb-m{transition:none}}
/* Find my size: 16px fields (iOS zooms into smaller ones), units next to the intro */
.rb .rb-finder input,.rb .rb-finder select{font-size:16px}
.rb .rb-finder__intro{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5em}
/* The recommended size wins over the size picked in the theme: outlined tint and a "Your size" tag */
.rb .rb-table .rb-best{background:var(--rbs-best,color-mix(in srgb,var(--rb-accent) 14%,var(--rb-surface)))!important;font-weight:700}
.rb .rb-table:has(.rb-best) td.rb-cur:not(.rb-best),.rb .rb-table:has(.rb-best) tr.rb-cur:not(.rb-best)>td{background:none!important;font-weight:inherit}
.rb .rb-table:has(.rb-best) th.rb-cur:not(.rb-best),.rb .rb-table:has(.rb-best) tr.rb-cur:not(.rb-best)>th{background:var(--rbs-thbg,color-mix(in srgb,var(--rb-ink) 5%,var(--rb-surface)))!important}
.rb .rb-table tr.rb-cur>:first-child{box-shadow:inset 3px 0 0 var(--rb-accent)}
.rb .rb-table [data-tag]::after{content:attr(data-tag);display:block;margin-top:.15em;font-size:.72em;font-weight:600;color:var(--rbs-bdg,var(--rb-accent));white-space:nowrap}
/* A result folds the form away; "Edit my measurements" brings it back */
.rb .rb-finder--done>:not(.rb-finder__out):not(.rb-finder__foot){display:none!important}
.rb .rb-finder--done .rb-finder__out{margin-top:0}
.rb .rb-finder__out .rb-finder__edit{display:block;margin-top:.7em;font-size:.88em}
.rb .rb-finder p.rb-finder__why{margin:.35em 0 0;font-size:.85em;opacity:.8}
/* Feet and inches side by side under one label */
.rb .rb-finder__pair{display:flex;flex-direction:column;gap:.25em;font-size:.82em;font-weight:600}
.rb .rb-finder__row{display:flex;gap:.4em}
.rb .rb-finder .rb-finder__pair label.rb-finder__in{flex:1;flex-direction:row;gap:0;font-size:1em;font-weight:400}
/* One chart in a popup: its name under the dialog title */
.rb .rb-dialog__sub{display:var(--rbs-sub,block);margin-top:.1em;font-size:.78em;font-weight:400;opacity:.7}
/* Headings follow the dialog's colors, not the theme's heading color (dark sections) */
.rb .rb-dialog h2,.rb .rb-dialog h3,.rb .rb-dialog h4,.rb .rb-inline h3,.rb .rb-acc h3,.rb .rb-acc h4{color:inherit}
/* Heading font and weight from the Appearance page, only when chosen: otherwise the theme's own heading styles */
.rb[style*="--rbs-hfont:"] :is(.rb-dialog__title,.rb-chart__title,.rb-h4,.rb-acc__sum,.rb-page__title){font-family:var(--rbs-hfont)}
.rb[style*="--rbs-hw:"] :is(.rb-chart__title,.rb-h4){font-weight:var(--rbs-hw)}
/* Touch screens: 44px targets */
@media (pointer:coarse){
  .rb .rb-seg button{min-height:40px;padding-inline:1em}
  .rb .rb-close{min-width:44px;width:var(--rbs-clw,44px);height:44px}
  .rb .rb-find-btn,.rb .rb-trigger,.rb .rb-badge{min-height:44px}
  .rb .rb-link{padding:.6em 0}
  .rb .rb-finder__in{min-height:44px}
}
/* Size guide page: category tag next to the title, a pager that matches the page */
.rb .rb-chip-tag{margin-inline-start:.75em}
.rb .rb-page__pager{display:flex;flex-wrap:wrap;gap:.35em;align-items:center;margin:1.5em 0 0}
.rb .rb-page__pager a{color:inherit}
.rb .rb-page__pager .page>*,.rb .rb-page__pager .next a,.rb .rb-page__pager .prev a{display:inline-grid;place-items:center;min-width:2.75em;min-height:2.75em;padding:0 .6em;border-radius:999px;text-decoration:none}
.rb .rb-page__pager .page a:hover,.rb .rb-page__pager .next a:hover,.rb .rb-page__pager .prev a:hover{background:var(--rb-soft)}
.rb .rb-page__pager .page.current{display:inline-grid;place-items:center;min-width:2.75em;min-height:2.75em;border-radius:999px;background:var(--rb-accent);color:var(--rb-on-acc)}
.rb .rb-page__partial{font-size:.9em;opacity:.85}
/* Drawer: full width on phones (the browser keeps a margin on modal dialogs otherwise) */
.rb .rb-dialog--drawer{max-width:100vw}
/* Accordions sit flush with the theme's own, no doubled rules */
.rb .rb-acc{margin:var(--rbs-acm,0)}
.rb .rb-acc+.rb-acc{border-top-width:var(--rbs-acbt,0)}
.rb .rb-inline .rb-guide{margin-top:1em}
/* Floating button clears the iPhone home bar; position, content and phone behaviour from the Appearance page.
   ruban-float.js moves it to <body> (a theme transform would pin it to the product column): hidden until then. */
[data-rb] .rb-float{visibility:hidden}
.rb .rb-float{inset-inline-start:var(--rbs-fls,var(--rbs-flo,1em));inset-inline-end:var(--rbs-fle,auto);top:var(--rbs-flt,auto);bottom:var(--rbs-flb,calc(var(--rbs-flo,1em) + env(safe-area-inset-bottom,0px)));transform:var(--rbs-fltr,none)}
.rb .rb-float span{display:var(--rbs-fltx,inline)}
.rb .rb-float .rb-icon{display:var(--rbs-flic,inline-block)}
/* Reminder (remind.*, ruban-remind.js): a small note at the bottom of the screen, never in the way */
.rb-remind-host{position:fixed;inset-inline-end:1em;bottom:calc(1em + env(safe-area-inset-bottom,0px));z-index:31;max-width:min(24em,calc(100vw - 2em));pointer-events:none}
.rb .rb-remind{pointer-events:auto;position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:.25em .5em;padding:.8em 3em .8em 1em;border-radius:calc(var(--rb-radius) + 4px);background:var(--rbs-wbg,var(--rb-mode-bg,var(--rb-bg,#fff)));color:var(--rbs-wfg,var(--rb-mode-fg,var(--rb-fg,#1a1a1a)));box-shadow:0 8px 28px rgba(0,0,0,.18);font-size:.9em;line-height:1.4}
.rb .rb-remind__go{border:0;background:none;padding:0;font-weight:600;text-decoration:underline;text-underline-offset:.2em}
.rb .rb-remind__x{position:absolute;top:50%;inset-inline-end:.4em;transform:translateY(-50%);display:grid;place-items:center;width:2.5em;height:2.5em;padding:0;border:0;border-radius:50%;background:none}
.rb .rb-remind__x:hover{background:var(--rb-line)}
@media (prefers-reduced-motion:no-preference){.rb .rb-remind{animation:rb-pop .25s ease-out}}
@media (max-width:749px){.rb-remind-host{inset-inline-start:1em}}
@media (max-width:749px){
  .rb .rb-float{display:var(--rbs-flmd,inline-flex);inset-inline-start:var(--rbs-flml,var(--rbs-fls,var(--rbs-flo,1em)));inset-inline-end:var(--rbs-flme,var(--rbs-fle,auto));top:var(--rbs-flmt,var(--rbs-flt,auto));bottom:var(--rbs-flmb,var(--rbs-flb,calc(var(--rbs-flo,1em) + env(safe-area-inset-bottom,0px))));transform:var(--rbs-flmtr,var(--rbs-fltr,none));writing-mode:var(--rbs-flmwm,var(--rbs-flwm,horizontal-tb));margin:var(--rbs-flmm,0);width:var(--rbs-flmwd,auto)}
  .rb .rb-float span{display:var(--rbs-flmtx,var(--rbs-fltx,inline))}
}
@media (max-width:749px){.rb .rb-table th,.rb .rb-table td{padding:var(--rbs-cpym,.8em) var(--rbs-cpxm,.7em)}}
/* Numbers read left to right in every language: "34 – 35" stays in order on right-to-left stores */
.rb .rb-table td[data-min]{direction:ltr;unicode-bidi:isolate}
[dir=rtl] .rb .rb-table tr.rb-cur>:first-child{box-shadow:inset -3px 0 0 var(--rb-accent)}
.rb .rb-page__partial a{color:inherit}
/* ===== Size recommendation (ruban-rec.js, ruban-score.js, ruban-finder.js): fit preference, confidence, notes ===== */
.rb .rb-pref{display:flex;flex-wrap:wrap;align-items:center;gap:.5em;margin:.75em 0 0;font-size:.82em;font-weight:600}
.rb .rb-pref .rb-seg button{font-weight:400}
/* The preference stays under a result: changing it updates the size at once */
.rb .rb-finder.rb-finder--done>.rb-pref.rb-pref{display:flex!important;margin:0 0 .6em}
.rb .rb-finder p.rb-finder__conf{display:flex;align-items:center;gap:.45em;margin:.35em 0 0;font-size:.8em;font-weight:600}
.rb .rb-finder__conf::before{content:"";flex:none;width:.6em;height:.6em;border-radius:50%;background:currentColor;opacity:.3}
.rb .rb-finder__conf[data-level=high]::before{background:var(--rb-accent);opacity:1}
.rb .rb-finder__conf[data-level=medium]::before{background:var(--rb-accent);opacity:.55}
.rb .rb-finder p.rb-finder__note{margin:.35em 0 0;font-size:.85em;opacity:.8}
/* ===== End of size recommendation ===== */
/* ===== Fit by product type (ruban-kind.js): ring help, breed list ===== */
.rb .rb-kind__help{margin:.6em 0 0;font-size:.85em}
.rb .rb-kind__help summary{cursor:pointer;font-weight:600}
.rb .rb-finder .rb-kind__help p{margin:.35em 0 0;font-size:1em}
.rb .rb-finder label.rb-kind__breed{max-width:20em;margin:0 0 .6em}
.rb .rb-finder p.rb-kind__or{margin:0 0 .4em;font-weight:600}