/*
 * component-tokens.css — generated from packages/design-tokens-api/tokens.json
 * DO NOT EDIT. Regenerate with:
 *   node specs/080-create-a-plan/docs/scripts/generate-tokens.mjs
 */
.cmp-frame[data-mode="dark"] {
  /* component layer · layers.component.dark.* */
  /* hero */
  --t-hero-titleMaxFontSize: 26px;
  --t-hero-titleMinFontSize: 16px;
  --t-hero-autoAdvanceIntervalMs: 3000;
  --t-hero-aspectRatioMobile: 0.75;
  --t-hero-aspectRatioTablet: 0.394;
  --t-hero-indicatorDotSize: 6px;
  --t-hero-indicatorDotSelectedWidth: 20px;
  --t-hero-indicatorDotSpacing: 3px;
  --t-hero-cornerRadius: 24px;
  --t-hero-contentPadding: 24px;
  --t-hero-pageSpacing: 16px;
  --t-hero-tabletTitleFontSize: 26px;
  --t-hero-tabletTitleLineHeight: 28px;
  --t-hero-tabletTitleFontWeight: Medium;
  --t-hero-tabletDescFontSize: 14px;
  --t-hero-tabletDescLineHeight: 18px;
  --t-hero-tabletDescFontWeight: Medium;
  --t-hero-mobileTitleFontSize: 16px;
  --t-hero-mobileTitleFontWeight: SemiBold;
  --t-hero-mobileDescFontSize: 12px;
  --t-hero-mobileDescFontWeight: Normal;
  /* cardOverlay */
  --t-cardOverlay-gradientStartOpacity: 0;
  --t-cardOverlay-gradientEndOpacity: 1;
  --t-cardOverlay-cornerRadius: 16px;
  --t-cardOverlay-textPadding: 16px;
  --t-cardOverlay-titleFontSize: 14px;
  --t-cardOverlay-titleFontWeight: SemiBold;
  --t-cardOverlay-titleLineHeight: 15px;
  --t-cardOverlay-subtitleFontSize: 11px;
  --t-cardOverlay-subtitleFontWeight: Normal;
  --t-cardOverlay-subtitleLineHeight: 13px;
  --t-cardOverlay-metadataFontSize: 10px;
  --t-cardOverlay-metadataFontWeight: Normal;
  --t-cardOverlay-metadataLineHeight: 13px;
  --t-cardOverlay-eyebrowTitleSpacing: 2px;
  --t-cardOverlay-actionInset: 48px;
  /* cardSplit */
  --t-cardSplit-infoAreaPaddingHorizontal: 10px;
  --t-cardSplit-infoAreaPaddingVertical: 10px;
  --t-cardSplit-cornerRadius: 16px;
  --t-cardSplit-titleFontSize: 14px;
  --t-cardSplit-titleFontWeight: SemiBold;
  --t-cardSplit-titleLineHeight: 15px;
  --t-cardSplit-subtitleFontSize: 11px;
  --t-cardSplit-subtitleFontWeight: Normal;
  --t-cardSplit-subtitleLineHeight: 13px;
  --t-cardSplit-metadataFontSize: 10px;
  --t-cardSplit-metadataFontWeight: Normal;
  --t-cardSplit-metadataLineHeight: 13px;
  --t-cardSplit-titleFooterSpacing: 16px;
  --t-cardSplit-eyebrowTitleSpacing: 2px;
  --t-cardSplit-actionInset: 48px;
  /* cardImageOnly */
  --t-cardImageOnly-cornerRadius: 16px;
  --t-cardImageOnly-widthSmall: 200px;
  --t-cardImageOnly-widthMedium: 280px;
  --t-cardImageOnly-widthLarge: 360px;
  --t-cardImageOnly-bgColor: #141B1F;
  /* cardPoster */
  --t-cardPoster-cornerRadius: 16px;
  --t-cardPoster-widthSmall: 120px;
  --t-cardPoster-widthMedium: 160px;
  --t-cardPoster-widthLarge: 200px;
  --t-cardPoster-aspectRatio: 0.5625;
  --t-cardPoster-borderColor: rgba(255, 255, 255, 0.15);
  --t-cardPoster-borderWidth: 1px;
  --t-cardPoster-shadowElevation: 8px;
  --t-cardPoster-shadowColor: rgba(0, 0, 0, 0.3);
  --t-cardPoster-bgColor: #141B1F;
  --t-cardPoster-fallbackGradientEnd: #080D16;
  --t-cardPoster-fallbackTextColor: #EBF0F2;
  /* cardTop10 */
  --t-cardTop10-rankFontSize: 64px;
  --t-cardTop10-cardAspectRatio: 0.5625;
  --t-cardTop10-gradientColors: #7A8B94 #252F35;
  --t-cardTop10-posterWidth: 160px;
  --t-cardTop10-rankNumFontSize: 200px;
  --t-cardTop10-rankNumStrokeWidth: 3px;
  --t-cardTop10-rankNumLetterOverlapFactor: -0.2px;
  --t-cardTop10-rankNumOuterOverlap: 100px;
  --t-cardTop10-rankNumBorderColorDark: rgba(255, 255, 255, 0.25);
  --t-cardTop10-rankNumBorderColorLight: rgba(26, 26, 26, 0.25);
  /* playlist */
  --t-playlist-rowHorizontalPadding: 16px;
  --t-playlist-rowItemSpacing: 16px;
  --t-playlist-rowTitleFontSize: 16px;
  --t-playlist-rowTitleFontWeight: Medium;
  --t-playlist-rowTitleBottomSpacing: 8px;
  /* section */
  --t-section-verticalSpacing: 24px;
  --t-section-horizontalPadding: 16px;
  /* buttonGroup */
  --t-buttonGroup-spacing: 8px;
  --t-buttonGroup-cornerRadius: 50px;
  --t-buttonGroup-height: 32px;
  /* badge */
  --t-badge-height: 18px;
  --t-badge-cornerRadius: 34px;
  --t-badge-horizontalPadding: 8px;
  --t-badge-fontSize: 10px;
  --t-badge-fontWeight: Medium;
  --t-badge-letterSpacing: 0.5px;
  --t-badge-defaultBackgroundColor: rgba(0, 0, 0, 0.6);
  --t-badge-textColor: #FFFFFF;
  --t-badge-textColorOnLight: #1A1A1A;
  /* cardAvatar */
  --t-cardAvatar-initialsFontWeight: Bold;
  --t-cardAvatar-labelFontSize: 12px;
  --t-cardAvatar-labelFontWeight: Medium;
  --t-cardAvatar-defaultSize: 128px;
  --t-cardAvatar-borderColor: rgba(255, 255, 255, 0.15);
  --t-cardAvatar-borderWidth: 1px;
  --t-cardAvatar-shadowElevation: 8px;
  --t-cardAvatar-shadowColor: rgba(0, 0, 0, 0.3);
  --t-cardAvatar-bgColor: #141B1F;
  /* liveTv */
  --t-liveTv-progressBarColor: #FFA014;
  --t-liveTv-livePillBackgroundColor: #FF0000;
  --t-liveTv-channelLogoSize: 48px;
  /* progress */
  --t-progress-barHeight: 4px;
  --t-progress-barCornerRadius: 2px;
  --t-progress-barColor: #FFFFFF;
  --t-progress-barTrackColor: rgba(255, 255, 255, 0.15);
  /* heroCarousel */
  --t-heroCarousel-autoAdvanceIntervalMs: 3000;
  --t-heroCarousel-aspectRatioMobile: 0.75;
  --t-heroCarousel-aspectRatioTablet: 0.394;
  --t-heroCarousel-indicatorDotSize: 6px;
  --t-heroCarousel-indicatorDotSelectedWidth: 20px;
  --t-heroCarousel-indicatorDotSpacing: 3px;
  --t-heroCarousel-indicatorDotCornerRadius: 4px;
  --t-heroCarousel-contentPadding: 24px;
  --t-heroCarousel-pageSpacing: 16px;
  --t-heroCarousel-cornerRadius: 24px;
  --t-heroCarousel-borderColor: rgba(255, 255, 255, 0.15);
  --t-heroCarousel-borderWidth: 1px;
  --t-heroCarousel-elevation: 16px;
  --t-heroCarousel-shadowColor: #000000;
  --t-heroCarousel-tabletImageWidthFraction: 0.7;
  --t-heroCarousel-tabletGradientWidthFraction: 0.5;
  --t-heroCarousel-tabletContentWidthFraction: 0.4;
  /* heroVideo */
  --t-heroVideo-titleMaxFontSize: 26px;
  --t-heroVideo-titleMinFontSize: 16px;
  --t-heroVideo-tabletTitleFontSize: 26px;
  --t-heroVideo-tabletTitleLineHeight: 28px;
  --t-heroVideo-tabletTitleFontWeight: Medium;
  --t-heroVideo-tabletDescFontSize: 14px;
  --t-heroVideo-tabletDescLineHeight: 18px;
  --t-heroVideo-tabletDescFontWeight: Medium;
  --t-heroVideo-mobileTitleFontSize: 16px;
  --t-heroVideo-mobileTitleFontWeight: SemiBold;
  --t-heroVideo-mobileDescFontSize: 12px;
  --t-heroVideo-mobileDescFontWeight: Normal;
  --t-heroVideo-contentTopPadding: 140px;
  --t-heroVideo-iconSize: 14px;
  --t-heroVideo-maxLines-mobileTitle: 2px;
  --t-heroVideo-maxLines-mobileDescription: 3px;
  --t-heroVideo-maxLines-tabletPortraitTitle: 2px;
  --t-heroVideo-maxLines-tabletPortraitDescription: 3px;
  --t-heroVideo-maxLines-tabletPortraitCrowdedTitle: 2px;
  --t-heroVideo-maxLines-tabletPortraitCrowdedDescription: 2px;
  --t-heroVideo-maxLines-tabletLandscapeTitle: 3px;
  --t-heroVideo-maxLines-tabletLandscapeDescription: 5px;
  --t-heroVideo-titleFontSize-thresholdShortChars: 20px;
  --t-heroVideo-titleFontSize-thresholdMediumChars: 30px;
  --t-heroVideo-titleFontSize-thresholdLongChars: 40px;
  --t-heroVideo-titleFontSize-thresholdVeryLongChars: 50px;
  --t-heroVideo-titleFontSize-spShort: 28px;
  --t-heroVideo-titleFontSize-spMedium: 24px;
  --t-heroVideo-titleFontSize-spLong: 22px;
  --t-heroVideo-titleFontSize-spVeryLong: 20px;
  --t-heroVideo-titleFontSize-spXVeryLong: 18px;
  --t-heroVideo-titleFontSize-lineHeightDelta: 2px;
  --t-heroVideo-gradient-stops: [object Object] [object Object] [object Object] [object Object] [object Object] [object Object] [object Object];
  --t-heroVideo-scrimFadeShift: 52px;
  --t-heroVideo-scrimFadeHeight: 240px;
  /* heroBibleVerse */
  --t-heroBibleVerse-tabletTitleFontSize: 26px;
  --t-heroBibleVerse-tabletTitleLineHeight: 28px;
  --t-heroBibleVerse-tabletTitleFontWeight: Medium;
  --t-heroBibleVerse-tabletDescFontSize: 14px;
  --t-heroBibleVerse-tabletDescLineHeight: 18px;
  --t-heroBibleVerse-tabletDescFontWeight: Medium;
  --t-heroBibleVerse-mobileVerseFontSizeMax: 36px;
  --t-heroBibleVerse-mobileVerseFontSizeMin: 16px;
  --t-heroBibleVerse-contentTopPadding: 140px;
  /* heroFeatured */
  --t-heroFeatured-tabletTitleFontSize: 26px;
  --t-heroFeatured-tabletTitleLineHeight: 28px;
  --t-heroFeatured-tabletTitleFontWeight: Medium;
  --t-heroFeatured-tabletDescFontSize: 14px;
  --t-heroFeatured-tabletDescLineHeight: 18px;
  --t-heroFeatured-tabletDescFontWeight: Medium;
  --t-heroFeatured-mobileTitleFontSize: 16px;
  --t-heroFeatured-mobileTitleFontWeight: SemiBold;
  --t-heroFeatured-mobileDescFontSize: 12px;
  --t-heroFeatured-mobileDescFontWeight: Normal;
  --t-heroFeatured-contentTopPadding: 140px;
  --t-heroFeatured-scrimFadeShift: 52px;
  --t-heroFeatured-scrimFadeHeight: 240px;
  --t-heroFeatured-tabletPortraitTitleMaxLines: 2;
  --t-heroFeatured-tabletPortraitDescMaxLines: 3;
  --t-heroFeatured-tabletImageWidthFraction: 0.7;
  --t-heroFeatured-tabletGradientWidthFraction: 0.5;
  --t-heroFeatured-tabletContentWidthFraction: 0.4;
  /* heroLive */
  --t-heroLive-cornerRadius: 24px;
  /* cardLandscape */
  --t-cardLandscape-aspectRatio: 1.7778;
  --t-cardLandscape-cornerRadius: 12px;
  --t-cardLandscape-borderColor: rgba(255, 255, 255, 0.15);
  --t-cardLandscape-borderWidth: 1px;
  --t-cardLandscape-shadowElevation: 8px;
  --t-cardLandscape-shadowColor: rgba(0, 0, 0, 0.3);
  --t-cardLandscape-bgColor: #141B1F;
  --t-cardLandscape-fallbackTitleFontSize: 14px;
  --t-cardLandscape-fallbackTitleFontWeight: SemiBold;
  --t-cardLandscape-fallbackTitleLineHeight: 15px;
  /* cardNotification */
  --t-cardNotification-aspectRatio: 1.7778;
  /* mediaCard */
  --t-mediaCard-defaultMaxWidth: 280px;
  --t-mediaCard-defaultHeight: 256px;
  --t-mediaCard-metadataSpacing: 3px;
  --t-mediaCard-overlayLinearAlphaMiddle: 0.2;
  --t-mediaCard-overlayLinearAlphaEnd: 0.6;
  --t-mediaCard-overlayRadialAlphaMiddle: 0.3;
  --t-mediaCard-overlayRadialAlphaEnd: 0.7;
  --t-mediaCard-overlayAngledAlphaFirst: 0.2;
  --t-mediaCard-overlayAngledAlphaMid: 0.5;
  --t-mediaCard-overlayAngledAlphaEnd: 0.8;
  --t-mediaCard-overlayFallbackAlphaEnd: 0.4;
  /* programGuideCard */
  --t-programGuideCard-borderWidth: 1px;
  --t-programGuideCard-cornerRadius: 34px;
  --t-programGuideCard-dotSize: 6px;
  --t-programGuideCard-progressHeight: 3px;
  --t-programGuideCard-progressCornerRadius: 1.5px;
  --t-programGuideCard-liveBadgeBackgroundAlpha: 0.4;
  /* btvTopBar */
  --t-btvTopBar-height: 42px;
  /* btvDropdown */
  --t-btvDropdown-minWidth: 250px;
  /* loadingSpinner */
  --t-loadingSpinner-strokeWidth: 3px;
  /* playlistVideoListItem */
  --t-playlistVideoListItem-thumbnailWidth: 120px;
  --t-playlistVideoListItem-thumbnailCornerRadius: 2px;
  --t-playlistVideoListItem-thumbnailVerticalPadding: 2px;
  /* episodeListItem */
  --t-episodeListItem-aspectRatio: 1.7778;
  /* detailHeroMobile */
  --t-detailHeroMobile-aspectRatio: 1.7778;
  --t-detailHeroMobile-spacerWidth: 2px;
  /* protoBibleButton */
  --t-protoBibleButton-borderWidth: 1px;
  --t-protoBibleButton-pressedAlpha: 0.12;
  --t-protoBibleButton-disabledAlpha: 0.38;
  --t-protoBibleButton-hoverAlpha: 0.08;
  /* btvLogo */
  --t-btvLogo-starBibelGap: 5px;
  --t-btvLogo-bibelAppGap: 3px;
  --t-btvLogo-bibelWidth: 52px;
  --t-btvLogo-appWidth: 28px;
  /* rowSection */
  --t-rowSection-cardAspectRatio: 0.5625;
  /* cardHero */
  --t-cardHero-cornerRadius: 16px;
  --t-cardHero-minHeight: 480px;
  --t-cardHero-badgePaddingHorizontal: 10px;
  --t-cardHero-badgePaddingVertical: 5px;
  --t-cardHero-badgeCornerRadius: 6px;
  --t-cardHero-badgeFontSize: 11px;
  --t-cardHero-eyebrowFontSize: 12px;
  --t-cardHero-titleFontSize: 22px;
  --t-cardHero-descriptionFontSize: 14px;
  --t-cardHero-buttonHeight: 44px;
  --t-cardHero-buttonFontSize: 14px;
  --t-cardHero-buttonHorizontalPadding: 20px;
  --t-cardHero-gradientStartFraction: 0.3;
  --t-cardHero-contentBottomPadding: 24px;
  --t-cardHero-contentHorizontalPadding: 20px;
  --t-cardHero-eyebrowTopSpacing: 4px;
  --t-cardHero-descriptionTopSpacing: 6px;
  --t-cardHero-buttonTopSpacing: 12px;
  --t-cardHero-progressBarHeight: 4px;
  --t-cardHero-fallbackTitleFontSize: 14px;
  --t-cardHero-fallbackTitleFontWeight: SemiBold;
  --t-cardHero-fallbackTitleLineHeight: 15px;
  /* slider */
  --t-slider-titleFontSize: 18px;
  --t-slider-titleBottomPadding: 12px;
  --t-slider-horizontalPadding: 16px;
  --t-slider-itemSpacing: 12px;
  /* sliderHero */
  --t-sliderHero-heightMobile: 520px;
  --t-sliderHero-heightTablet: 600px;
  --t-sliderHero-autoAdvanceIntervalMs: 5000;
  --t-sliderHero-indicatorBottomPadding: 16px;
  /* bannerOverlay */
  --t-bannerOverlay-scrimAlpha: 0.6;
  --t-bannerOverlay-closeButtonBackgroundAlpha: 0.5;
  /* menuDrawer */
  --t-menuDrawer-rowBgColor: #3A474F;
  --t-menuDrawer-overlayBgAlpha: 0.95;
  /* button */
  --t-button-primary-bg: rgba(235, 240, 242, 0.75);
  --t-button-primary-bg-pressed: rgba(235, 240, 242, 0.85);
  --t-button-primary-bg-disabled: rgba(235, 240, 242, 0.3);
  --t-button-primary-text: #252F35;
  --t-button-primary-text-disabled: rgba(37, 47, 53, 0.4);
  --t-button-primary-secondary-text: rgba(37, 47, 53, 0.7);
  --t-button-primary-secondary-text-disabled: rgba(37, 47, 53, 0.4);
  --t-button-primary-border: rgba(0, 0, 0, 0);
  --t-button-secondary-bg: rgba(235, 240, 242, 0.15);
  --t-button-secondary-bg-pressed: rgba(235, 240, 242, 0.25);
  --t-button-secondary-bg-disabled: rgba(235, 240, 242, 0.08);
  --t-button-secondary-text: #EBF0F2;
  --t-button-secondary-text-disabled: rgba(235, 240, 242, 0.4);
  --t-button-secondary-secondary-text: rgba(235, 240, 242, 0.7);
  --t-button-secondary-secondary-text-disabled: rgba(235, 240, 242, 0.4);
  --t-button-secondary-border: rgba(235, 240, 242, 0.3);
  --t-button-tertiary-bg: rgba(0, 0, 0, 0);
  --t-button-tertiary-bg-pressed: rgba(235, 240, 242, 0.1);
  --t-button-tertiary-bg-disabled: rgba(0, 0, 0, 0);
  --t-button-tertiary-text: #EBF0F2;
  --t-button-tertiary-text-disabled: rgba(235, 240, 242, 0.4);
  --t-button-tertiary-secondary-text: rgba(235, 240, 242, 0.7);
  --t-button-tertiary-secondary-text-disabled: rgba(235, 240, 242, 0.4);
  --t-button-tertiary-border: rgba(0, 0, 0, 0);
  --t-button-overlay-bg: rgba(37, 47, 53, 0.5);
  --t-button-overlay-bg-pressed: rgba(37, 47, 53, 0.65);
  --t-button-overlay-bg-disabled: rgba(37, 47, 53, 0.25);
  --t-button-overlay-text: #EBF0F2;
  --t-button-overlay-text-disabled: rgba(235, 240, 242, 0.4);
  --t-button-overlay-secondary-text: rgba(235, 240, 242, 0.7);
  --t-button-overlay-secondary-text-disabled: rgba(235, 240, 242, 0.3);
  --t-button-overlay-border: rgba(0, 0, 0, 0);
  --t-button-tertiary-dark-bg: rgba(0, 0, 0, 0);
  --t-button-tertiary-dark-bg-pressed: rgba(37, 47, 53, 0.1);
  --t-button-tertiary-dark-bg-disabled: rgba(0, 0, 0, 0);
  --t-button-tertiary-dark-text: #252F35;
  --t-button-tertiary-dark-text-disabled: rgba(37, 47, 53, 0.4);
  --t-button-tertiary-dark-secondary-text: rgba(37, 47, 53, 0.7);
  --t-button-tertiary-dark-secondary-text-disabled: rgba(37, 47, 53, 0.3);
  --t-button-tertiary-dark-border: rgba(0, 0, 0, 0);
}

.cmp-frame[data-mode="light"] {
  /* component layer · layers.component.light.* */
  /* hero */
  --t-hero-titleMaxFontSize: 26px;
  --t-hero-titleMinFontSize: 16px;
  --t-hero-autoAdvanceIntervalMs: 3000;
  --t-hero-aspectRatioMobile: 0.75;
  --t-hero-aspectRatioTablet: 0.394;
  --t-hero-indicatorDotSize: 6px;
  --t-hero-indicatorDotSelectedWidth: 20px;
  --t-hero-indicatorDotSpacing: 3px;
  --t-hero-cornerRadius: 24px;
  --t-hero-contentPadding: 24px;
  --t-hero-pageSpacing: 16px;
  --t-hero-tabletTitleFontSize: 26px;
  --t-hero-tabletTitleLineHeight: 28px;
  --t-hero-tabletTitleFontWeight: Medium;
  --t-hero-tabletDescFontSize: 14px;
  --t-hero-tabletDescLineHeight: 18px;
  --t-hero-tabletDescFontWeight: Medium;
  --t-hero-mobileTitleFontSize: 16px;
  --t-hero-mobileTitleFontWeight: SemiBold;
  --t-hero-mobileDescFontSize: 12px;
  --t-hero-mobileDescFontWeight: Normal;
  /* cardOverlay */
  --t-cardOverlay-gradientStartOpacity: 0;
  --t-cardOverlay-gradientEndOpacity: 0.85;
  --t-cardOverlay-cornerRadius: 16px;
  --t-cardOverlay-textPadding: 16px;
  --t-cardOverlay-titleFontSize: 14px;
  --t-cardOverlay-titleFontWeight: SemiBold;
  --t-cardOverlay-titleLineHeight: 15px;
  --t-cardOverlay-subtitleFontSize: 11px;
  --t-cardOverlay-subtitleFontWeight: Normal;
  --t-cardOverlay-subtitleLineHeight: 13px;
  --t-cardOverlay-metadataFontSize: 10px;
  --t-cardOverlay-metadataFontWeight: Normal;
  --t-cardOverlay-metadataLineHeight: 13px;
  --t-cardOverlay-eyebrowTitleSpacing: 2px;
  --t-cardOverlay-actionInset: 48px;
  /* cardSplit */
  --t-cardSplit-infoAreaPaddingHorizontal: 10px;
  --t-cardSplit-infoAreaPaddingVertical: 10px;
  --t-cardSplit-cornerRadius: 16px;
  --t-cardSplit-titleFontSize: 14px;
  --t-cardSplit-titleFontWeight: SemiBold;
  --t-cardSplit-titleLineHeight: 15px;
  --t-cardSplit-subtitleFontSize: 11px;
  --t-cardSplit-subtitleFontWeight: Normal;
  --t-cardSplit-subtitleLineHeight: 13px;
  --t-cardSplit-metadataFontSize: 10px;
  --t-cardSplit-metadataFontWeight: Normal;
  --t-cardSplit-metadataLineHeight: 13px;
  --t-cardSplit-titleFooterSpacing: 16px;
  --t-cardSplit-eyebrowTitleSpacing: 2px;
  --t-cardSplit-actionInset: 48px;
  /* cardImageOnly */
  --t-cardImageOnly-cornerRadius: 16px;
  --t-cardImageOnly-widthSmall: 200px;
  --t-cardImageOnly-widthMedium: 280px;
  --t-cardImageOnly-widthLarge: 360px;
  --t-cardImageOnly-bgColor: #FFFFFF;
  /* cardPoster */
  --t-cardPoster-cornerRadius: 16px;
  --t-cardPoster-widthSmall: 120px;
  --t-cardPoster-widthMedium: 160px;
  --t-cardPoster-widthLarge: 200px;
  --t-cardPoster-aspectRatio: 0.5625;
  --t-cardPoster-borderColor: rgba(26, 26, 26, 0.15);
  --t-cardPoster-borderWidth: 1px;
  --t-cardPoster-shadowElevation: 8px;
  --t-cardPoster-shadowColor: rgba(0, 0, 0, 0.3);
  --t-cardPoster-bgColor: #FFFFFF;
  --t-cardPoster-fallbackGradientEnd: #FFFFFF;
  --t-cardPoster-fallbackTextColor: #252F35;
  /* cardTop10 */
  --t-cardTop10-rankFontSize: 64px;
  --t-cardTop10-cardAspectRatio: 0.5625;
  --t-cardTop10-gradientColors: #F8F9FA #CFD9DD;
  --t-cardTop10-posterWidth: 160px;
  --t-cardTop10-rankNumFontSize: 200px;
  --t-cardTop10-rankNumStrokeWidth: 3px;
  --t-cardTop10-rankNumLetterOverlapFactor: -0.2px;
  --t-cardTop10-rankNumOuterOverlap: 100px;
  --t-cardTop10-rankNumBorderColorDark: rgba(255, 255, 255, 0.25);
  --t-cardTop10-rankNumBorderColorLight: rgba(26, 26, 26, 0.25);
  /* playlist */
  --t-playlist-rowHorizontalPadding: 16px;
  --t-playlist-rowItemSpacing: 16px;
  --t-playlist-rowTitleFontSize: 16px;
  --t-playlist-rowTitleFontWeight: Medium;
  --t-playlist-rowTitleBottomSpacing: 8px;
  /* section */
  --t-section-verticalSpacing: 24px;
  --t-section-horizontalPadding: 16px;
  /* buttonGroup */
  --t-buttonGroup-spacing: 8px;
  --t-buttonGroup-cornerRadius: 50px;
  --t-buttonGroup-height: 32px;
  /* badge */
  --t-badge-height: 18px;
  --t-badge-cornerRadius: 34px;
  --t-badge-horizontalPadding: 8px;
  --t-badge-fontSize: 10px;
  --t-badge-fontWeight: Medium;
  --t-badge-letterSpacing: 0.5px;
  --t-badge-defaultBackgroundColor: rgba(0, 0, 0, 0.6);
  --t-badge-textColor: #FFFFFF;
  --t-badge-textColorOnLight: #1A1A1A;
  /* cardAvatar */
  --t-cardAvatar-initialsFontWeight: Bold;
  --t-cardAvatar-labelFontSize: 12px;
  --t-cardAvatar-labelFontWeight: Medium;
  --t-cardAvatar-defaultSize: 128px;
  --t-cardAvatar-borderColor: rgba(26, 26, 26, 0.15);
  --t-cardAvatar-borderWidth: 1px;
  --t-cardAvatar-shadowElevation: 8px;
  --t-cardAvatar-shadowColor: rgba(0, 0, 0, 0.3);
  --t-cardAvatar-bgColor: #FFFFFF;
  /* liveTv */
  --t-liveTv-progressBarColor: #FFA014;
  --t-liveTv-livePillBackgroundColor: #FF0000;
  --t-liveTv-channelLogoSize: 48px;
  /* progress */
  --t-progress-barHeight: 4px;
  --t-progress-barCornerRadius: 2px;
  --t-progress-barColor: #141B1F;
  --t-progress-barTrackColor: rgba(0, 0, 0, 0.15);
  /* heroCarousel */
  --t-heroCarousel-autoAdvanceIntervalMs: 3000;
  --t-heroCarousel-aspectRatioMobile: 0.75;
  --t-heroCarousel-aspectRatioTablet: 0.394;
  --t-heroCarousel-indicatorDotSize: 6px;
  --t-heroCarousel-indicatorDotSelectedWidth: 20px;
  --t-heroCarousel-indicatorDotSpacing: 3px;
  --t-heroCarousel-indicatorDotCornerRadius: 4px;
  --t-heroCarousel-contentPadding: 24px;
  --t-heroCarousel-pageSpacing: 16px;
  --t-heroCarousel-cornerRadius: 24px;
  --t-heroCarousel-borderColor: rgba(26, 26, 26, 0.15);
  --t-heroCarousel-borderWidth: 1px;
  --t-heroCarousel-elevation: 16px;
  --t-heroCarousel-shadowColor: #000000;
  --t-heroCarousel-tabletImageWidthFraction: 0.7;
  --t-heroCarousel-tabletGradientWidthFraction: 0.6;
  --t-heroCarousel-tabletContentWidthFraction: 0.4;
  /* heroVideo */
  --t-heroVideo-titleMaxFontSize: 26px;
  --t-heroVideo-titleMinFontSize: 16px;
  --t-heroVideo-tabletTitleFontSize: 26px;
  --t-heroVideo-tabletTitleLineHeight: 28px;
  --t-heroVideo-tabletTitleFontWeight: Medium;
  --t-heroVideo-tabletDescFontSize: 14px;
  --t-heroVideo-tabletDescLineHeight: 18px;
  --t-heroVideo-tabletDescFontWeight: Medium;
  --t-heroVideo-mobileTitleFontSize: 16px;
  --t-heroVideo-mobileTitleFontWeight: SemiBold;
  --t-heroVideo-mobileDescFontSize: 12px;
  --t-heroVideo-mobileDescFontWeight: Normal;
  --t-heroVideo-contentTopPadding: 140px;
  --t-heroVideo-iconSize: 14px;
  --t-heroVideo-maxLines-mobileTitle: 2px;
  --t-heroVideo-maxLines-mobileDescription: 3px;
  --t-heroVideo-maxLines-tabletPortraitTitle: 2px;
  --t-heroVideo-maxLines-tabletPortraitDescription: 3px;
  --t-heroVideo-maxLines-tabletPortraitCrowdedTitle: 2px;
  --t-heroVideo-maxLines-tabletPortraitCrowdedDescription: 2px;
  --t-heroVideo-maxLines-tabletLandscapeTitle: 3px;
  --t-heroVideo-maxLines-tabletLandscapeDescription: 5px;
  --t-heroVideo-titleFontSize-thresholdShortChars: 20px;
  --t-heroVideo-titleFontSize-thresholdMediumChars: 30px;
  --t-heroVideo-titleFontSize-thresholdLongChars: 40px;
  --t-heroVideo-titleFontSize-thresholdVeryLongChars: 50px;
  --t-heroVideo-titleFontSize-spShort: 28px;
  --t-heroVideo-titleFontSize-spMedium: 24px;
  --t-heroVideo-titleFontSize-spLong: 22px;
  --t-heroVideo-titleFontSize-spVeryLong: 20px;
  --t-heroVideo-titleFontSize-spXVeryLong: 18px;
  --t-heroVideo-titleFontSize-lineHeightDelta: 2px;
  --t-heroVideo-gradient-stops: [object Object] [object Object] [object Object] [object Object] [object Object] [object Object];
  --t-heroVideo-scrimFadeShift: 52px;
  --t-heroVideo-scrimFadeHeight: 240px;
  /* heroBibleVerse */
  --t-heroBibleVerse-tabletTitleFontSize: 26px;
  --t-heroBibleVerse-tabletTitleLineHeight: 28px;
  --t-heroBibleVerse-tabletTitleFontWeight: Medium;
  --t-heroBibleVerse-tabletDescFontSize: 14px;
  --t-heroBibleVerse-tabletDescLineHeight: 18px;
  --t-heroBibleVerse-tabletDescFontWeight: Medium;
  --t-heroBibleVerse-mobileVerseFontSizeMax: 36px;
  --t-heroBibleVerse-mobileVerseFontSizeMin: 16px;
  --t-heroBibleVerse-contentTopPadding: 140px;
  /* heroFeatured */
  --t-heroFeatured-tabletTitleFontSize: 26px;
  --t-heroFeatured-tabletTitleLineHeight: 28px;
  --t-heroFeatured-tabletTitleFontWeight: Medium;
  --t-heroFeatured-tabletDescFontSize: 14px;
  --t-heroFeatured-tabletDescLineHeight: 18px;
  --t-heroFeatured-tabletDescFontWeight: Medium;
  --t-heroFeatured-mobileTitleFontSize: 16px;
  --t-heroFeatured-mobileTitleFontWeight: SemiBold;
  --t-heroFeatured-mobileDescFontSize: 12px;
  --t-heroFeatured-mobileDescFontWeight: Normal;
  --t-heroFeatured-contentTopPadding: 140px;
  --t-heroFeatured-scrimFadeShift: 52px;
  --t-heroFeatured-scrimFadeHeight: 240px;
  --t-heroFeatured-tabletPortraitTitleMaxLines: 2;
  --t-heroFeatured-tabletPortraitDescMaxLines: 3;
  --t-heroFeatured-tabletImageWidthFraction: 0.7;
  --t-heroFeatured-tabletGradientWidthFraction: 0.6;
  --t-heroFeatured-tabletContentWidthFraction: 0.4;
  /* heroLive */
  --t-heroLive-cornerRadius: 24px;
  /* cardLandscape */
  --t-cardLandscape-aspectRatio: 1.7778;
  --t-cardLandscape-cornerRadius: 12px;
  --t-cardLandscape-borderColor: rgba(26, 26, 26, 0.15);
  --t-cardLandscape-borderWidth: 1px;
  --t-cardLandscape-shadowElevation: 8px;
  --t-cardLandscape-shadowColor: rgba(0, 0, 0, 0.3);
  --t-cardLandscape-bgColor: #FFFFFF;
  --t-cardLandscape-fallbackTitleFontSize: 14px;
  --t-cardLandscape-fallbackTitleFontWeight: SemiBold;
  --t-cardLandscape-fallbackTitleLineHeight: 15px;
  /* cardNotification */
  --t-cardNotification-aspectRatio: 1.7778;
  /* mediaCard */
  --t-mediaCard-defaultMaxWidth: 280px;
  --t-mediaCard-defaultHeight: 256px;
  --t-mediaCard-metadataSpacing: 3px;
  --t-mediaCard-overlayLinearAlphaMiddle: 0.2;
  --t-mediaCard-overlayLinearAlphaEnd: 0.6;
  --t-mediaCard-overlayRadialAlphaMiddle: 0.3;
  --t-mediaCard-overlayRadialAlphaEnd: 0.7;
  --t-mediaCard-overlayAngledAlphaFirst: 0.2;
  --t-mediaCard-overlayAngledAlphaMid: 0.5;
  --t-mediaCard-overlayAngledAlphaEnd: 0.8;
  --t-mediaCard-overlayFallbackAlphaEnd: 0.4;
  /* programGuideCard */
  --t-programGuideCard-borderWidth: 1px;
  --t-programGuideCard-cornerRadius: 34px;
  --t-programGuideCard-dotSize: 6px;
  --t-programGuideCard-progressHeight: 3px;
  --t-programGuideCard-progressCornerRadius: 1.5px;
  --t-programGuideCard-liveBadgeBackgroundAlpha: 0.4;
  /* btvTopBar */
  --t-btvTopBar-height: 42px;
  /* btvDropdown */
  --t-btvDropdown-minWidth: 250px;
  /* loadingSpinner */
  --t-loadingSpinner-strokeWidth: 3px;
  /* playlistVideoListItem */
  --t-playlistVideoListItem-thumbnailWidth: 120px;
  --t-playlistVideoListItem-thumbnailCornerRadius: 2px;
  --t-playlistVideoListItem-thumbnailVerticalPadding: 2px;
  /* episodeListItem */
  --t-episodeListItem-aspectRatio: 1.7778;
  /* detailHeroMobile */
  --t-detailHeroMobile-aspectRatio: 1.7778;
  --t-detailHeroMobile-spacerWidth: 2px;
  /* protoBibleButton */
  --t-protoBibleButton-borderWidth: 1px;
  --t-protoBibleButton-pressedAlpha: 0.12;
  --t-protoBibleButton-disabledAlpha: 0.38;
  --t-protoBibleButton-hoverAlpha: 0.08;
  /* btvLogo */
  --t-btvLogo-starBibelGap: 5px;
  --t-btvLogo-bibelAppGap: 3px;
  --t-btvLogo-bibelWidth: 52px;
  --t-btvLogo-appWidth: 28px;
  /* rowSection */
  --t-rowSection-cardAspectRatio: 0.5625;
  /* cardHero */
  --t-cardHero-cornerRadius: 16px;
  --t-cardHero-minHeight: 480px;
  --t-cardHero-badgePaddingHorizontal: 10px;
  --t-cardHero-badgePaddingVertical: 5px;
  --t-cardHero-badgeCornerRadius: 6px;
  --t-cardHero-badgeFontSize: 11px;
  --t-cardHero-eyebrowFontSize: 12px;
  --t-cardHero-titleFontSize: 22px;
  --t-cardHero-descriptionFontSize: 14px;
  --t-cardHero-buttonHeight: 44px;
  --t-cardHero-buttonFontSize: 14px;
  --t-cardHero-buttonHorizontalPadding: 20px;
  --t-cardHero-gradientStartFraction: 0.3;
  --t-cardHero-contentBottomPadding: 24px;
  --t-cardHero-contentHorizontalPadding: 20px;
  --t-cardHero-eyebrowTopSpacing: 4px;
  --t-cardHero-descriptionTopSpacing: 6px;
  --t-cardHero-buttonTopSpacing: 12px;
  --t-cardHero-progressBarHeight: 4px;
  --t-cardHero-fallbackTitleFontSize: 14px;
  --t-cardHero-fallbackTitleFontWeight: SemiBold;
  --t-cardHero-fallbackTitleLineHeight: 15px;
  /* slider */
  --t-slider-titleFontSize: 18px;
  --t-slider-titleBottomPadding: 12px;
  --t-slider-horizontalPadding: 16px;
  --t-slider-itemSpacing: 12px;
  /* sliderHero */
  --t-sliderHero-heightMobile: 520px;
  --t-sliderHero-heightTablet: 600px;
  --t-sliderHero-autoAdvanceIntervalMs: 5000;
  --t-sliderHero-indicatorBottomPadding: 16px;
  /* bannerOverlay */
  --t-bannerOverlay-scrimAlpha: 0.6;
  --t-bannerOverlay-closeButtonBackgroundAlpha: 0.5;
  /* menuDrawer */
  --t-menuDrawer-rowBgColor: #EBF0F2;
  --t-menuDrawer-overlayBgAlpha: 0.95;
  /* button */
  --t-button-primary-bg: #252F35;
  --t-button-primary-bg-pressed: rgba(37, 47, 53, 0.8);
  --t-button-primary-bg-disabled: rgba(37, 47, 53, 0.3);
  --t-button-primary-text: #EBF0F2;
  --t-button-primary-text-disabled: rgba(235, 240, 242, 0.5);
  --t-button-primary-secondary-text: rgba(235, 240, 242, 0.7);
  --t-button-primary-secondary-text-disabled: rgba(235, 240, 242, 0.4);
  --t-button-primary-border: rgba(0, 0, 0, 0);
  --t-button-secondary-bg: rgba(37, 47, 53, 0.1);
  --t-button-secondary-bg-pressed: rgba(37, 47, 53, 0.15);
  --t-button-secondary-bg-disabled: rgba(37, 47, 53, 0.05);
  --t-button-secondary-text: #252F35;
  --t-button-secondary-text-disabled: rgba(37, 47, 53, 0.4);
  --t-button-secondary-secondary-text: rgba(37, 47, 53, 0.7);
  --t-button-secondary-secondary-text-disabled: rgba(37, 47, 53, 0.3);
  --t-button-secondary-border: rgba(37, 47, 53, 0.15);
  --t-button-tertiary-bg: rgba(0, 0, 0, 0);
  --t-button-tertiary-bg-pressed: rgba(37, 47, 53, 0.1);
  --t-button-tertiary-bg-disabled: rgba(0, 0, 0, 0);
  --t-button-tertiary-text: #252F35;
  --t-button-tertiary-text-disabled: rgba(37, 47, 53, 0.4);
  --t-button-tertiary-secondary-text: rgba(37, 47, 53, 0.7);
  --t-button-tertiary-secondary-text-disabled: rgba(37, 47, 53, 0.3);
  --t-button-tertiary-border: rgba(0, 0, 0, 0);
  --t-button-overlay-bg: rgba(37, 47, 53, 0.5);
  --t-button-overlay-bg-pressed: rgba(37, 47, 53, 0.65);
  --t-button-overlay-bg-disabled: rgba(37, 47, 53, 0.25);
  --t-button-overlay-text: #EBF0F2;
  --t-button-overlay-text-disabled: rgba(235, 240, 242, 0.4);
  --t-button-overlay-secondary-text: rgba(235, 240, 242, 0.7);
  --t-button-overlay-secondary-text-disabled: rgba(235, 240, 242, 0.3);
  --t-button-overlay-border: rgba(0, 0, 0, 0);
  --t-button-tertiary-dark-bg: rgba(0, 0, 0, 0);
  --t-button-tertiary-dark-bg-pressed: rgba(37, 47, 53, 0.1);
  --t-button-tertiary-dark-bg-disabled: rgba(0, 0, 0, 0);
  --t-button-tertiary-dark-text: #252F35;
  --t-button-tertiary-dark-text-disabled: rgba(37, 47, 53, 0.4);
  --t-button-tertiary-dark-secondary-text: rgba(37, 47, 53, 0.7);
  --t-button-tertiary-dark-secondary-text-disabled: rgba(37, 47, 53, 0.3);
  --t-button-tertiary-dark-border: rgba(0, 0, 0, 0);
}

.cmp-frame[data-mode="dark"] {
  /* semantic layer · ai.gradient subset (FR-009) */
  --s-ai-gradient-defaultStart: #0097A7;
  --s-ai-gradient-defaultEnd: #4D3F71;
  --s-ai-gradient-hoverStart: #00ACC1;
  --s-ai-gradient-hoverEnd: #5E4D89;
  --s-ai-gradient-pressedStart: #00838F;
  --s-ai-gradient-pressedEnd: #2B2341;
  --s-ai-gradient-disabledStart: #00838F;
  --s-ai-gradient-disabledEnd: #6A5A9A;
  --s-ai-gradient-angleDeg: 135px;
}

.cmp-frame[data-mode="light"] {
  /* semantic layer · ai.gradient subset (FR-009) */
  --s-ai-gradient-defaultStart: #00ACC1;
  --s-ai-gradient-defaultEnd: #5E4D89;
  --s-ai-gradient-hoverStart: #26C6DA;
  --s-ai-gradient-hoverEnd: #6A5A9A;
  --s-ai-gradient-pressedStart: #0097A7;
  --s-ai-gradient-pressedEnd: #4D3F71;
  --s-ai-gradient-disabledStart: #B2EBF2;
  --s-ai-gradient-disabledEnd: #9F8FC2;
  --s-ai-gradient-angleDeg: 135px;
}