.shed-carousel {
    --sc-navy: #002b3e;
    --sc-inset: #0b3c51;
    --sc-lime: #72c100;
    background: var(--sc-navy);
    color: #fff;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(42px, 6vw, 84px) 0;
    position: relative;
}
.shed-carousel * { box-sizing: border-box; }
.shed-carousel button, .shed-carousel summary { font: inherit; }
.shed-carousel--empty { padding: 32px; }
.sc__viewport { margin: 0 auto; max-width: 1380px; outline-offset: -4px; overflow: visible; padding: 0 max(24px, calc((100vw - 1260px) / 2)); }
.sc__track { display: block; }
.sc__slide { margin: 0 auto; max-width: 1120px; padding: 0 0 4px; }
.sc__header { align-items: start; column-gap: 5%; display: grid; grid-template-columns: minmax(0, 35fr) minmax(0, 60fr) minmax(0, 5fr); margin: 0 0 28px; }
.sc__eyebrow { color: var(--sc-lime); display: block; font-size: 10px; font-weight: 800; letter-spacing: 1.4px; margin-bottom: 12px; text-transform: uppercase; }
.sc__header h2 { color: #fff; font-size: clamp(34px, 4.2vw, 58px); font-weight: 600; letter-spacing: -.065em; line-height: 1.08; margin: 0; }
.sc__header h2:after { background: var(--sc-lime); content: ""; display: block; height: 4px; margin-top: 18px; width: 58px; }
.sc__intro { border-bottom: 1px solid #6e91a2; border-top: 1px solid #6e91a2; color: #dbe8ee; font-size: 15px; line-height: 1.65; margin-top: 22px; padding: 13px 0; }
.sc__intro p, .sc__topic-description p { margin: 0; }
.sc__intro p + p, .sc__topic-description p + p { margin-top: 10px; }
.sc__counter { color: var(--sc-lime); font-size: 12px; font-weight: 800; letter-spacing: 1.4px; margin: 25px 0 0; white-space: nowrap; }
.sc__workspace { align-items: start; display: grid; gap: 20px; grid-template-columns: 230px minmax(0, 1fr); }
.sc__topics { background: var(--sc-inset); border-radius: 6px; display: grid; gap: 5px; padding: 8px; }
.sc__topic { align-items: center; background: #ffffff08; border: 1px solid #7393a5; border-radius: 3px; color: #fff; cursor: pointer; display: flex; gap: 10px; min-height: 56px; padding: 7px 9px; text-align: left; }
.sc__topic img { border-radius: 2px; display: block; flex: 0 0 auto; height: 37px; object-fit: cover; width: 46px; }
.sc__topic > span { flex: 1; font-size: 11px; font-weight: 750; line-height: 1.35; }
.sc__topic > b { font-size: 12px; opacity: 0; }
.sc__topic.is-active { background: var(--sc-lime); border-color: var(--sc-lime); box-shadow: inset 3px 0 var(--sc-navy); color: var(--sc-navy); }
.sc__topic.is-active b { opacity: 1; }
.sc__topic:hover:not(.is-active) { background: #184e63; border-color: #c9dce6; }
.sc__topic-slider-arrow { display: none; }
.sc__topic:focus-visible, .sc__arrow:focus-visible, .sc__reference > summary:focus-visible { outline: 3px solid var(--sc-lime); outline-offset: 2px; }
.sc__detail { background: #fff; border: 1px solid #98b2c1; border-radius: 6px; color: var(--sc-navy); min-width: 0; padding: 22px; }
.sc__topic-heading .sc__eyebrow { color: #607e8c; font-size: 8px; margin-bottom: 10px; }
/* Topic title remains visually identical to the former h3. */
.sc__topic-heading h2 { font-size: clamp(32px, 3.5vw, 44px); letter-spacing: -.05em; line-height: 1.08; margin: 0; }
/* The question retains the former bold subheading treatment. */
.sc__topic-heading h3 { font-size: 19px; font-weight: 750; letter-spacing: -.03em; line-height: 1.4; margin: 12px 0 0; }
.sc__topic-description { font-size: 14px; line-height: 1.75; margin-top: 14px; }
.sc__list-heading { align-items: baseline; display: flex; gap: 12px; justify-content: space-between; margin: 20px 0 10px; }
.sc__list-heading strong { font-size: 12px; }
.sc__materials { border-top: 1px solid #98b2c1; }
.sc__material { border-bottom: 1px solid #b7cbd6; border-left: 3px solid transparent; padding: 0 10px; transition: background .18s; }
.sc__material-summary { align-items: center; display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr) 64px minmax(58px, auto); min-height: 63px; }
.sc__reference > summary::-webkit-details-marker { display: none; }
.sc__material-name { align-items: center; display: flex; flex: 1; gap: 12px; min-width: 0; }
.sc__material-name img { border-radius: 2px; display: block; flex: 0 0 auto; height: 39px; object-fit: cover; width: 48px; }
.sc__material-copy { min-width: 0; }
.sc__material-name h4 { font-size: 1rem; font-weight: 700; line-height: 1.4; margin: 0; }
.sc__material-name .sc__classification { color: #607e8c; display: block; font-size: 9px; font-weight: 650; margin-top: 2px; white-space: nowrap; }
.sc_rating_icon { display: inline-grid; grid-template-columns: repeat(5, 1fr); width: 64px; }
.sc_rating_icon i { background: linear-gradient(90deg, var(--sc-lime) calc(var(--sc-rating-fill) * 100%), #b7cbd6 calc(var(--sc-rating-fill) * 100%)); background-clip: text; color: transparent; font-size: 13px; font-style: normal; line-height: 1; -webkit-background-clip: text; }
.sc_rating_icon i:before { content: "★"; }
.sc__score { font-size: 18px; font-weight: 800; min-width: 58px; text-align: right; white-space: nowrap; }
.sc__answer { font-size: 14px; line-height: 1.75; padding: 0 6px 18px 60px; white-space: pre-line; }
.sc__material.is-highlighted { background: #f4faec; border-left-color: var(--sc-lime); }
.sc__material:hover { background: #eaf1f5; }
.sc__material.is-highlighted:hover { background: #eaf5d9; }
.sc__disclaimer, .sc__reference { color: #cbdce5; font-size: 10px; margin: 18px 0 0; }
.sc__reference summary { align-items: center; color: #fff; cursor: pointer; display: flex; font-size: 11px; font-weight: 700; justify-content: space-between; list-style: none; min-height: 35px; }
.sc__reference p { line-height: 1.65; margin: 0 0 12px; }
.sc__arrow { -webkit-text-fill-color: transparent; align-items: center; background: transparent; border: 6px solid rgba(255,255,255,.96); border-radius: 50%; color: transparent!important; cursor: pointer; display: flex; font-size: 0!important; height: 154px; justify-content: center; line-height: 1; position: absolute; top: 50%; transform: translateY(-50%); width: 154px; z-index: 4; }
.sc__arrow:before { border: solid #fff; border-width: 0 7px 7px 0; content: ""; display: block; height: 43px; width: 43px; }
.sc__arrow--previous:before { margin-left: 18px; transform: rotate(135deg); }
.sc__arrow--next:before { margin-right: 18px; transform: rotate(-45deg); }
.sc__arrow:hover { background: rgba(255,255,255,.1); border-color: #fff; }
.sc__arrow--previous { left: max(16px, calc(10vw - 110px)); }
.sc__arrow--next { right: max(16px, calc(10vw - 110px)); }

@media (min-width: 901px) {
    .sc__viewport[data-sc-ready] { max-width: none; overflow: hidden; padding: 0; }
    .sc__viewport[data-sc-ready] .sc__track { align-items: flex-start; display: flex; gap: 128px; transition: transform .42s cubic-bezier(.22, .61, .36, 1); will-change: transform; }
    .sc__viewport[data-sc-ready] .sc__slide { flex: 0 0 min(1350px, 80vw); margin: 0; max-width: 80vw; width: 1350px; }
    .sc__viewport[data-sc-ready] .sc__slide:not(.is-active) { filter: saturate(.35); opacity: .18; pointer-events: none; transition: opacity .25s ease, filter .25s ease; user-select: none; }
    .sc__viewport[data-sc-ready] .sc__slide--before-active { clip-path: inset(0 0 0 75%); }
    .sc__viewport[data-sc-ready] .sc__slide--after-active { clip-path: inset(0 75% 0 0); }
    .sc__viewport[data-sc-ready] .sc__slide:not(.is-active) .sc__detail { max-height: 465px; overflow: hidden; }
    .sc__viewport[data-sc-ready] .sc__slide:not(.is-active) .sc__header { max-height: 164px; overflow: hidden; }
    .sc__viewport[data-sc-ready] .sc__slide:not(.is-active) .sc__disclaimer, .sc__viewport[data-sc-ready] .sc__slide:not(.is-active) .sc__reference { display: none; }
    .sc__materials { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
    .sc__arrow:after { -webkit-text-fill-color: #fff; color: #fff; font-size: clamp(24px, 2.2vw, 36px); font-weight: 800; left: 50%; line-height: 1; position: absolute; text-shadow: 0 1px 2px rgba(0,0,0,.18); top: calc(100% + 24px); transform: translateX(-50%); white-space: nowrap; }
    .sc__arrow--previous:after { content: "Previous"; }
    .sc__arrow--next:after { content: "Next"; }
}

@media (max-width: 900px) {
    .sc__viewport[data-sc-ready] { overflow: hidden; }
    .sc__viewport[data-sc-ready] .sc__slide { display: none; }
    .sc__viewport[data-sc-ready] .sc__slide.is-active { display: block; }
    .sc__header { grid-template-columns: minmax(0, 1fr) auto; }
    .sc__intro { grid-column: 1 / -1; margin-top: 0; }
    .sc__counter { margin-top: 0; }
    .sc__workspace { grid-template-columns: 1fr; }
    .sc__topics { grid-auto-columns: calc((100% - 18px) / 2); grid-auto-flow: column; grid-template-columns: none; overflow-x: auto; overscroll-behavior-x: contain; padding-bottom: 8px; position: relative; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; }
    .sc__topics::-webkit-scrollbar { display: none; }
    .sc__topic { min-width: 0; scroll-snap-align: center; scroll-snap-stop: always; }
    .sc__topics::after { background: linear-gradient(90deg, transparent, var(--sc-inset) 78%); content: ""; height: calc(100% - 8px); pointer-events: none; position: absolute; right: 0; top: 0; width: 44px; z-index: 1; }
    .sc__topic-slider-arrow { align-items: center; background: var(--sc-lime); border: 0; color: var(--sc-navy); cursor: pointer; display: flex; font-size: 26px; font-weight: 800; height: 36px; justify-content: center; line-height: 1; padding: 0; position: absolute; right: 5px; top: calc(50% - 4px); transform: translateY(-50%); width: 32px; z-index: 2; }
    .sc__topic-slider-arrow:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
    .sc__arrow { display: none; }
}

@media (max-width: 600px) {
    .shed-carousel { padding: 42px 0; }
    .sc__viewport { padding: 0 16px; }
    .sc__header h2 { font-size: 34px; }
    .sc__header { gap: 14px; margin-bottom: 20px; }
    .sc__intro { font-size: 14px; }
    .sc__detail { padding: 16px; }
    .sc__topic-heading h2 { font-size: 30px; }
    .sc__topic-heading h3 { font-size: 17px; }
    .sc__topic { min-height: 52px; }
    .sc__topic img { height: 34px; width: 42px; }
    .sc__material { padding: 0 6px; }
    .sc__material-summary { gap: 8px; grid-template-columns: minmax(0, 1fr) 52px minmax(45px, auto); min-height: 58px; }
    .sc_rating_icon { width: 52px; }
    .sc_rating_icon i { font-size: 11px; }
    .sc__material-name { gap: 8px; }
    .sc__material-name img { height: 34px; width: 39px; }
    .sc__material-name h4 { font-size: 1rem; }
    .sc__classification { display: none; }
    .sc__score { font-size: 15px; min-width: 45px; }
    .sc__answer { padding-left: 47px; }
    .sc__list-heading { align-items: flex-start; flex-direction: column; gap: 3px; }
}

@media (prefers-reduced-motion: reduce) {
    .sc__viewport[data-sc-ready] .sc__track, .sc__material { transition: none; }
}