/* Studio Blocks: blog. Without JS the topic filter and rail arrows are inert, so hide them. */
body .sb-blog:not(.sb-js) .b05-f,body .sb-blog:not(.sb-js) .b10-ctl{display:none}
/* Dark rows turn --pb-text light, so the cream button on a dark band lost its (ink) text and play icon. */
body .sb-blog .dark .btn,body .sb-blog .dark a.btn:hover{color:var(--pb-ink) !important}
body .sb-blog.sb-blk.sb-blk:not(.sb-dark){--pb-surface:var(--pb-tint)}


/* Branding Sizes: role overrides kept outside the generated category CSS. */
body .sb-blog .btn { font-size: var(--fs-buttons) !important; }
body .sb-blog .b10-ctl button { font-size: var(--fs-buttons) !important; }
body .sb-blog .sel select,body .sb-blog .fin { font-size: var(--fs-copy) !important; }
body .sb-blog .lb .close { font-size: var(--fs-buttons) !important; }
body .sb-blog .b02-r h3 { font-size: var(--fs-titles-small); }
body .sb-blog .b02-r .ar { font-size: var(--fs-buttons) !important; }
body .sb-blog .b03-t { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b03-r .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b04-h { font-size: clamp(calc(var(--fs-titles) * .65), 4.0625vw, var(--fs-titles)); }
body .sb-blog .b04-t { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b04 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b05 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b06 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b07 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b09-t { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b09 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b10 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b11 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b11-r time { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)) !important; }
body .sb-blog .b12-tile b { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)) !important; }
body .sb-blog .b12 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b13 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b14 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b15-c blockquote { font-size: var(--fs-quotes); }
body .sb-blog .b15 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b16 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b17-r h3 { font-size: var(--fs-titles-small); }
body .sb-blog .b18 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)); }
body .sb-blog .b19 .tt { font-size: clamp(calc(var(--fs-medium) * .75), 2.1875vw, var(--fs-medium)) !important; }

/* 3.6.10: looks drawn as a dark band (.dark) sit on the row's Background, which paints the band. On a light row their
   words, rules, buttons and links follow the row (dark text), not white (BLG-07, BLG-17 and BLG-19 printed white on white). On a
   Secondary row they follow that color's lightness; Main, Black and photo rows keep the white design. */
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blog:not(.sb-edge):not(.sb-dark, :is(.bg-sec, .bg-main, .bg-black, .bg-image) *) > .dark { --pb-on-dark: var(--pb-text); --pb-muted-on-dark: var(--color-muted); --pb-muted: var(--color-muted); --pb-border: var(--color-line); --pb-rule-on-dark: var(--color-line); color: var(--pb-text); }
body:not(.cc-look-pre-3-6-10) .bg-sec .sb-blk.sb-blk.sb-blog:not(.sb-edge):not(.sb-dark) > .dark { --pb-on-dark: oklch(from var(--color-sec) clamp(0, (0.62 - l) * 1000, 1) 0 0); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blk.sb-blog:not(.sb-edge):not(.sb-dark, :is(.bg-sec, .bg-main, .bg-black, .bg-image) *) > .dark .btn:not(.ghost) { background: var(--btn-fill); color: var(--btn-color) !important; border-color: var(--btn-border); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blk.sb-blog:not(.sb-edge):not(.sb-dark, :is(.bg-sec, .bg-main, .bg-black, .bg-image) *) > .dark .btn:not(.ghost):hover { background: var(--btn-fill-hover); color: var(--btn-color-hover) !important; border-color: var(--btn-border-hover); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blk.sb-blog:not(.sb-edge):not(.sb-dark, :is(.bg-sec, .bg-main, .bg-black, .bg-image) *) > .dark .btn.ghost { background: transparent; color: var(--btn-outline) !important; border-color: var(--btn-outline); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blog:not(.sb-edge):not(.sb-dark, :is(.bg-sec, .bg-main, .bg-black, .bg-image) *) > .dark .tlink { color: var(--color-link); }

/* 3.6.10: looks that paint their own band (BLG-08: the category's page color, a tint or a dark bar of their own)
   keep their light-row colors on a dark row, so they render the same on every row. The dark row only turned their
   text white (white on their own light band) and faded their surface color to an 8% tint. */
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blog.sb-edge.sb-dark:is(.sb-look-08) { --pb-text: var(--color-body, var(--color-headings)); --pb-muted: var(--color-muted); --pb-border: var(--color-line); --pb-surface: var(--color-surface, var(--color-fourth)); --form-label-color: inherit; color: var(--pb-text); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blk.sb-blog.sb-edge.sb-dark:is(.sb-look-08) .btn:not(.ghost):not(:is(.dark, .ink, .is-dark, .on-dark) *) { background: var(--btn-fill); color: var(--btn-color); border-color: var(--btn-border); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blk.sb-blog.sb-edge.sb-dark:is(.sb-look-08) .btn.ghost:not(:is(.dark, .ink, .is-dark, .on-dark) *) { background: transparent; color: var(--btn-outline); border-color: var(--btn-outline); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blk.sb-blog.sb-edge.sb-dark:is(.sb-look-08) .tlink:not(:is(.dark, .ink, .is-dark, .on-dark, .photo, .ov) *) { color: var(--color-link); }
