/* LST-05: the item icon is an image; draw it as a mask so it takes the theme color like the design's inline icons. */
body .sb-lists .mark.has-icon{display:block;width:28px;height:32px;padding:0;margin-top:4px;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
/* The theme caps .section at 1240px; the edge bands (08, 09, 19) must touch both screen edges. */
body .sb-lists.sb-edge .section{max-width:none;width:100%}
/* Ink bands sit on a light row, so the row's --pb-border is a dark hairline; use the light one the design draws on ink. */
body .sb-lists .ink{--pb-border:color-mix(in srgb,var(--pb-on-dark) 22%,transparent)}
/* The theme's h3 color rule beats the category label's primary color; restore it (on ink bands the label stays light). */
body .sb-lists h3.category { color: var(--pb-primary) !important; }
body .sb-lists .ink h3.category { color: var(--pb-on-dark) !important; }
/* Row backgrounds: the design's ink band is its text color, and its surface is a slight tint of the page color; the stock Black/Surface rows are pure black and near white. */


/* Branding Sizes: role overrides kept outside the generated category CSS. */
body .sb-lists summary { font-size: var(--fs-titles-small) !important; }
body .sb-lists .l17 .lead h3 { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)) !important; }

/* 3.6.10: the two-column list sits beside the intro, so each column is narrow; at the Medium title size item titles
   wrapped one word per line (LST-16). */
body:not(.cc-look-pre-3-6-10) .sb-lists .l16 .grid2 .entry h3 { font-size: clamp(20px, 1.8vw, calc(var(--fs-medium) * .6)) !important; }

/* Look 3.6.18: the list looks' action button uses the Branding button colors (it painted --pb-on-dark words on Main,
   white on a bright orange failed 4.5:1). */
body:not(.cc-look-pre-3-6-18) .sb-lists .action { background: var(--btn-bg); border-color: var(--btn-border, var(--btn-bg)); color: var(--btn-color); }
body:not(.cc-look-pre-3-6-18) .sb-lists .action:hover { background: var(--btn-bg-hover, var(--btn-bg)); color: var(--btn-color-hover, var(--btn-color)); }