.skbp { --skbp-ink:var(--vvp-ds-ink,#263a61); --skbp-muted:var(--vvp-ds-muted,#63718a); --skbp-line:var(--vvp-ui-info-line,#dbe4ef); margin:0; padding:var(--vvp-ui-panel-padding,32px); border-radius:var(--vvp-ds-radius-panel,20px); background:#fff; color:var(--skbp-ink); }
.skbp__heading { margin-bottom:24px; }
.skbp__heading h2 { margin:0; font-size:24px; font-weight:600; line-height:1.3; }
.skbp__heading p { margin:10px 0 0; color:var(--skbp-muted); font-size:15px; line-height:1.6; }
.skbp__items,.skbp__choices ul { margin:0; padding:0; list-style:none; }
.skbp__items { display:grid; gap:12px; grid-template-columns:repeat(4,minmax(0,1fr)); }
.skbp--columns-1 .skbp__items { grid-template-columns:1fr; }.skbp--columns-2 .skbp__items { grid-template-columns:repeat(2,minmax(0,1fr)); }.skbp--columns-3 .skbp__items { grid-template-columns:repeat(3,minmax(0,1fr)); }.skbp--columns-5 .skbp__items { grid-template-columns:repeat(5,minmax(0,1fr)); }.skbp--columns-6 .skbp__items { grid-template-columns:repeat(6,minmax(0,1fr)); }
.skbp__item { min-width:0; }
.skbp__link { display:flex; align-items:center; justify-content:space-between; gap:16px; height:100%; min-height:64px; padding:20px; border:1px solid var(--skbp-line); border-radius:var(--vvp-ui-info-radius,14px); background:var(--vvp-ui-info-bg,#f3f7fc); color:var(--skbp-ink); font-size:15px; line-height:1.4; font-weight:500; overflow-wrap:anywhere; text-decoration:none; }
.skbp__link:hover { color:var(--skbp-ink); background:var(--vvp-ui-hover-bg,#e9edf2); border-color:var(--skbp-muted); }
.skbp__link img,.skbp__choices img { width:100%; max-width:160px; height:70px; object-fit:contain; }
.skbp__link:has(img) { flex-wrap:wrap; }.skbp__link img { flex-basis:100%; margin:auto; }
.skbp__all { display:inline-flex; align-items:center; gap:12px; margin-top:24px; color:var(--skbp-ink); font-size:14px; font-weight:500; text-underline-offset:4px; }
.skbp__choices { height:100%; padding:20px; border:1px solid var(--skbp-line); border-radius:var(--vvp-ui-info-radius,14px); }.skbp__choices h3 { margin:0 0 12px;font-size:16px; }.skbp__choices a { display:flex; justify-content:space-between; gap:12px; padding:8px 0; color:var(--skbp-ink); font-size:14px; }
.skbp--list .skbp__items { grid-template-columns:1fr; }.skbp--inline .skbp__items { display:flex; flex-wrap:wrap; gap:12px 24px; }.skbp--inline .skbp__link { min-height:44px;padding:8px 0;border:0;border-radius:0;background:none; }.skbp a:focus-visible { outline:2px solid currentColor;outline-offset:4px; }
@media(max-width:991px) { .skbp.skbp--grid .skbp__items { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:575px) { .skbp { padding:24px 20px; }.skbp__heading h2 { font-size:21px; }.skbp.skbp--grid .skbp__items { grid-template-columns:1fr; }.skbp__link { min-height:58px;padding:16px; }.skbp__heading { margin-bottom:20px; } }

/* Optional text wordmarks: repeat the rhythm for any native brand selection. */
.skbp--auto-typography .skbp__item:nth-child(6n + 1) { --skbp-brand-weight: 800; --skbp-brand-tracking: -.04em; }
.skbp--auto-typography .skbp__item:nth-child(6n + 2) { --skbp-brand-weight: 650; --skbp-brand-tracking: .07em; --skbp-brand-case: uppercase; }
.skbp--auto-typography .skbp__item:nth-child(6n + 3) { --skbp-brand-weight: 850; --skbp-brand-tracking: -.045em; }
.skbp--auto-typography .skbp__item:nth-child(6n + 4) { --skbp-brand-weight: 650; --skbp-brand-tracking: -.035em; --skbp-brand-style: italic; }
.skbp--auto-typography .skbp__item:nth-child(6n + 5) { --skbp-brand-weight: 750; --skbp-brand-tracking: -.045em; }
.skbp--auto-typography .skbp__item:nth-child(6n + 6) { --skbp-brand-weight: 800; --skbp-brand-tracking: .01em; --skbp-brand-case: uppercase; }
.skbp--auto-typography :is(.skbp__link > span:not([aria-hidden]),.skbp__choices > h3) { font-weight:var(--skbp-brand-weight,700); font-style:var(--skbp-brand-style,normal); letter-spacing:var(--skbp-brand-tracking,-.025em); text-transform:var(--skbp-brand-case,none); }

/* Inline brand selections keep their native scrolling on every screen size. */
.skbp--inline.skbp--brands .skbp__items { min-width:0; max-width:100%; flex-wrap:nowrap; justify-content:space-between; align-items:center; gap:clamp(24px,3vw,40px); overflow-x:auto; scrollbar-width:thin; }
.skbp--inline.skbp--brands .skbp__item { position:relative; display:flex; align-items:center; justify-content:center; flex:none; }
.skbp--inline.skbp--brands .skbp__item:first-child { justify-content:flex-start; }
.skbp--inline.skbp--brands .skbp__item:last-child { justify-content:flex-end; }
.skbp--inline.skbp--brands .skbp__link { max-width:100%; }
.skbp--inline.skbp--brands :is(.skbp__link > span:not([aria-hidden]),.skbp__choices > h3) { min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
