/* kai-mhome.css: phone/tablet parity with the reference site, loaded last.
   The reference sets the root font size to 13px below 1300px (14px above) and sizes everything in rem, so every
   value below is the reference rem value x 13px. Only the home page (.kai-home) is touched; >= 1300px is unchanged
   except the share bar, which now matches the reference (gif, "7k Shares", labelled buttons) at every width. */

/* ==========================================================================
   Share bar "Love this site?" (inline mode on the home page)
   The reference uses ShareThis: fixed px buttons (50 wide icon-only, 120 wide with a label), labels are dropped
   from the last button backwards until everything fits the row, then Reddit / Facebook are hidden.
   ========================================================================== */
:is(.kai-home, .social-share-watch) #social-sharing { container-type: inline-size; }
:is(.kai-home, .social-share-watch) #social-sharing .sharing-info { flex-shrink: 0; align-items: center; }
:is(.kai-home, .social-share-watch) #social-sharing .gif-sharing {
	flex: 0 0 auto;
	width: calc(var(--kr, 14px) * 4);
	height: calc(var(--kr, 14px) * 4);
	margin-right: calc(var(--kr, 14px) * .4);
	border-radius: 50%;
	background: center / cover no-repeat;
}
:is(.kai-home, .social-share-watch) #social-sharing .text-sharing h2.share-title { font-size: calc(var(--kr, 14px) * 1.5); line-height: 1.2; }
:is(.kai-home, .social-share-watch) #social-sharing .share-buttons { flex-wrap: nowrap; align-items: flex-start; justify-content: center; gap: 0; height: 34.5px; margin: 0; }
:is(.kai-home, .social-share-watch) #social-sharing .st-total {
	box-sizing: border-box;
	flex: 0 0 auto;
	width: 47.2px;
	height: 34px;
	padding: 4px 8px;
	color: #555;
	font: 500 16px/17px "Helvetica Neue", Verdana, Helvetica, Arial, sans-serif;
	text-align: center;
}
:is(.kai-home, .social-share-watch) #social-sharing .st-total span { display: block; }
:is(.kai-home, .social-share-watch) #social-sharing .st-total .st-shares { font-size: 9px; line-height: 9px; }
:is(.kai-home, .social-share-watch) #social-sharing .share-btn {
	box-sizing: border-box;
	flex: 0 0 auto;
	min-width: 50px;
	height: 32px;
	margin: 0 8px 0 0;
	padding: 0 8px;
	gap: 0;
	border-radius: 20px;
	font: 500 11px/32px "Helvetica Neue", Verdana, Helvetica, Arial, sans-serif;
	letter-spacing: 0;
}
:is(.kai-home, .social-share-watch) #social-sharing .share-btn:last-child { margin-right: 0; }
:is(.kai-home, .social-share-watch) #social-sharing .share-btn i { font-size: 15px; }
:is(.kai-home, .social-share-watch) #social-sharing .share-btn span { display: none; padding: 0 6px; letter-spacing: .5px; }
:is(.kai-home, .social-share-watch) #social-sharing .share-btn:hover { opacity: .9; transform: none; }

/* wide (>= 1300px, 14px root): labels while they fit: sharing-info 257.3 + gap 42 + 329 + 70 per label */
@media (min-width: 1300px) {
	@container (min-width: 698.3px) { :is(.kai-home, .social-share-watch) #social-sharing .share-telegram { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-telegram span { display: block; } }
	@container (min-width: 768.3px) { :is(.kai-home, .social-share-watch) #social-sharing .share-x { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-x span { display: block; } }
	@container (min-width: 838.3px) { :is(.kai-home, .social-share-watch) #social-sharing .share-facebook { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-facebook span { display: block; } }
	@container (min-width: 908.3px) { :is(.kai-home, .social-share-watch) #social-sharing .share-reddit { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-reddit span { display: block; } }
}

@media (max-width: 1299.98px) {
	:is(.kai-home, .social-share-watch) #social-sharing { gap: 39px; padding: 19.5px; border-radius: 7.8px; }
	:is(.kai-home, .social-share-watch) #social-sharing .text-sharing h2.share-title { font-size: calc(16.575px + .3vw); }
	/* row layout (> 700px): sharing-info 239 + gap 39 + 329 + 70 per label */
	@container (min-width: 677px) { :is(.kai-home, .social-share-watch) #social-sharing .share-telegram { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-telegram span { display: block; } }
	@container (min-width: 747px) { :is(.kai-home, .social-share-watch) #social-sharing .share-x { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-x span { display: block; } }
	@container (min-width: 817px) { :is(.kai-home, .social-share-watch) #social-sharing .share-facebook { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-facebook span { display: block; } }
	@container (min-width: 887px) { :is(.kai-home, .social-share-watch) #social-sharing .share-reddit { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-reddit span { display: block; } }
}
@media (max-width: 1199.98px) {
	:is(.kai-home, .social-share-watch) #social-sharing .text-sharing h2.share-title { font-size: calc(16.575px + .3vw); }
}
@media (min-width: 1200px) and (max-width: 1299.98px) {
	:is(.kai-home, .social-share-watch) #social-sharing .text-sharing h2.share-title { font-size: 19.5px; }
}
@media (max-width: 700px) {
	:is(.kai-home, .social-share-watch) #social-sharing { flex-direction: column; gap: 0; text-align: center; }
	:is(.kai-home, .social-share-watch) #social-sharing .sharing-info { margin-bottom: 6.5px; text-align: center; white-space: normal; }
	:is(.kai-home, .social-share-watch) #social-sharing .gif-sharing { display: none; }
	/* column layout: buttons get the whole row: 329 + 70 per label */
	@container (min-width: 399px) { :is(.kai-home, .social-share-watch) #social-sharing .share-telegram { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-telegram span { display: block; } }
	@container (min-width: 469px) { :is(.kai-home, .social-share-watch) #social-sharing .share-x { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-x span { display: block; } }
	@container (min-width: 539px) { :is(.kai-home, .social-share-watch) #social-sharing .share-facebook { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-facebook span { display: block; } }
	@container (min-width: 609px) { :is(.kai-home, .social-share-watch) #social-sharing .share-reddit { min-width: 120px; } :is(.kai-home, .social-share-watch) #social-sharing .share-reddit span { display: block; } }
	@container (max-width: 328.9px) { :is(.kai-home, .social-share-watch) #social-sharing .share-reddit { display: none; } }
	@container (max-width: 270.9px) { :is(.kai-home, .social-share-watch) #social-sharing .share-facebook { display: none; } }
}

/* ==========================================================================
   Hero slider (#featured). Reference heights: 650 (<= 1299), 715 (<= 1259), 650 (<= 1059), 585 (<= 866), 455 (<= 666)
   ========================================================================== */
@media (max-width: 1299.98px) {
	.kai-home #featured .container { padding-left: 24.7px; padding-right: 24.7px; }
	.kai-home #featured #featuredSwiper { height: 650px; }
	.kai-home #featured .swiper-slide::after { height: 325px; }
	.kai-home #featured .detail { max-width: 715px; margin: 0 0 117px; }
	.kai-home #featured .detail .title { max-height: 91px; margin: 0 0 13px; font-size: 33.8px; line-height: 45.5px; }
	.kai-home #featured .detail .info { margin-bottom: 16.9px; }
	.kai-home #featured .detail .info > span + span { margin-left: 13px; }
	.kai-home #featured .detail .info > span:not(.sub):not(.dub) { font-size: 13px; line-height: 1.5; }
	.kai-home #featured .detail .desc { margin: 0 0 13px; padding: 10.4px 0; font-size: 13px; line-height: 19.5px; }
	.kai-home #featured .mics { max-width: 400px; margin-bottom: 26px; padding: 13px 18.2px; border-radius: 7.8px; }
	.kai-home #featured .mics > div > div { font-size: 11.7px; }
	.kai-home #featured .mics > div > span { font-size: 16.9px; }
	.kai-home #featured .watch-btn { max-width: 270px; padding: 9.1px 15.6px; font-size: 18.2px; }
	.kai-home #featured button.info-btn.hero-bookmark { display: inline-block; margin-left: 13px; padding: 6.5px 19.5px; border-radius: 6.5px; font-size: 20.8px; line-height: 1.5; }
	.kai-home #featured .featured-nav { bottom: 117px; }
	.kai-home #featured .featured-prev i, .kai-home #featured .featured-next i { font-size: 20.8px; }
	.kai-home #featured .featured-nav-wrap > div + div { margin-left: 13px; }
	.kai-home #featured .featured-pagination span { padding: 0 13px; font-size: 13px; }
	.kai-home #featured .featured-pagination .sep { padding: 0; }
	.kai-home #featured .featured-pagination .swiper-pagination-current { font-size: 20.8px; }
	.kai-home #featured + .container > .dual-col { margin-top: -65px; padding-top: 0; }
}
@media (min-width: 1260px) and (max-width: 1299.98px) { .kai-home #featured .swiper-slide > .slide-bg { width: 90%; } }
@media (max-width: 1259.98px) {
	.kai-home #featured #featuredSwiper { height: 715px; }
	.kai-home #featured .detail .title { max-height: 72.8px; font-size: 28.6px; line-height: 36.4px; }
}
@media (max-width: 1059.98px) {
	.kai-home #featured #featuredSwiper { height: 650px; }
	.kai-home #featured .swiper-slide > .slide-bg { width: 120%; }
}
@media (min-width: 967px) and (max-width: 991.98px) {
	.kai-home #featured .detail .desc { display: -webkit-box; }
}
@media (max-width: 966.98px) {
	.kai-home #featured .swiper-slide > .slide-bg { width: 140%; }
	.kai-home #featured .mics { max-width: 300px; }
}
@media (max-width: 866.98px) {
	.kai-home #featured #featuredSwiper { height: 585px; }
}
/* 667 - 767: the reference keeps the desktop hero here (the phone hero starts at 666.9) */
@media (min-width: 666.99px) and (max-width: 767.98px) {
	.kai-home #featured .swiper-slide { background-color: var(--kai-bg); }
	.kai-home #featured .swiper-slide::before { display: block; }
	.kai-home #featured .swiper-slide::after { height: 325px; background: linear-gradient(180deg, rgba(12, 17, 22, 0) 0%, #0c1116 100%); }
	.kai-home #featured .swiper-slide > .slide-bg { right: 0; left: auto; width: 140%; background-size: cover; background-position: 50% 0; }
	.kai-home #featured .detail { display: block; align-items: stretch; max-width: 715px; margin: 0 0 117px; text-align: left; }
	.kai-home #featured .detail .info { order: 0; justify-content: flex-start; margin-bottom: 16.9px; }
	.kai-home #featured .detail .title { order: 0; max-height: 72.8px; font-size: 28.6px; line-height: 36.4px; }
	.kai-home #featured .swiper-ctrl { order: 0; margin-top: 0; }
	.kai-home #featured .mics { display: flex; }
	.kai-home #featured .watch-btn { width: 100%; height: auto; padding: 9.1px 15.6px; font-size: 18.2px; }
	.kai-home #featured .watch-btn i { display: none; }
	.kai-home #featured button.info-btn.hero-bookmark { display: inline-block; width: auto; height: auto; margin-left: 13px; padding: 6.5px 19.5px; border-radius: 6.5px; background: transparent; font-size: 20.8px; }
	.kai-home #featured .hero-bookmark.marked { background: transparent; color: var(--kai-primary); }
	.kai-home #featured .featured-nav { left: auto; right: 0; bottom: 117px; width: 100%; margin: 0; transform: none; }
	.kai-home #featured .featured-nav-wrap { justify-content: flex-end; }
}
@media (max-width: 666.98px) {
	.kai-home #featured .container { padding-left: 13px; padding-right: 13px; }
	.kai-home #featured #featuredSwiper { height: 455px; }
	.kai-home #featured .swiper-slide::before { display: none; }
	.kai-home #featured .swiper-slide::after { height: 260px; }
	.kai-home #featured .swiper-slide > .slide-bg { right: auto; left: 0; width: 150%; background-size: 100% auto; background-position: 0 0; }
	.kai-home #featured .detail { display: flex; flex-direction: column; align-items: center; max-width: 450px; margin: 0 auto 143px; text-align: center; }
	.kai-home #featured .detail .info { order: 1; justify-content: center; margin-bottom: 6.5px; }
	.kai-home #featured .detail .title { order: 2; max-height: 52px; font-size: 18.2px; line-height: 26px; }
	.kai-home #featured .mics { display: none; }
	.kai-home #featured .swiper-ctrl { order: 3; margin: 0; }
	.kai-home #featured .watch-btn { display: flex; width: 65px; height: 32.5px; margin: 0; padding: 0; font-size: 15.6px; }
	.kai-home #featured .watch-btn i { display: block; font-size: 15.6px; }
	.kai-home #featured .watch-btn span { display: none; }
	.kai-home #featured button.info-btn.hero-bookmark { display: flex; align-items: center; justify-content: center; width: 65px; height: 32.5px; margin-left: 13px; padding: 0; border-radius: 6.5px; background: var(--kai-green); font-size: 15.6px; }
	.kai-home #featured .featured-nav { left: 0; right: 0; bottom: 91px; width: 130px; margin: 0 auto; transform: scale(.7); }
	.kai-home #featured .featured-nav-wrap { justify-content: flex-end; }
}

/* ==========================================================================
   Notice, section heads, card grid
   ========================================================================== */
@media (max-width: 1299.98px) {
	.kai-home { font-size: 13px; }
	.kai-home #latest-updates { margin-top: 0; }
	.kai-home #featured .featured-prev, .kai-home #featured .featured-next { flex: 0 0 13px; width: 13px; height: 31.2px; }
	.kai-home #text-home .alert, .kai-home .alert { margin: 0 0 13px; padding: 13px; border-radius: 7.8px; font-size: 13px; font-weight: 300; line-height: 1.5; }

	.kai-home .aitem-wrapper.regular { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 13px 0 !important; margin: 0 -10.4px !important; }
	.kai-home .aitem-wrapper.regular .aitem .inner { padding: 10.4px; }
	.kai-home .aitem .poster > div { padding-bottom: 144%; border-radius: 15.6px; }
	.kai-home .aitem .inner > .title { height: 33.8px; max-height: 33.8px; margin: 7.8px 0; font-size: 13px; line-height: 16.9px; }
	.kai-home .aitem .inner > .info { gap: 0; margin-top: 0; }
	.kai-home .aitem .inner > .info > span { line-height: 1.5; }
	.kai-home .aitem .inner > .info > span:not(.sub):not(.dub) { font-size: 11.7px; }
	.kai-home .aitem .inner > .info > span + span { margin-left: 6.5px; }
	.kai-home .aitem .inner > .info > span:last-child { margin-left: auto; }
	.kai-home .aitem .inner > .info > .sub, .kai-home .aitem .inner > .info > .dub { height: 15.6px; padding: 0 2.6px; border-radius: 5.2px; font-size: 10.4px; line-height: 1.5; }
	.kai-home #featured .detail .info > .sub, .kai-home #featured .detail .info > .dub { height: 15.6px; padding: 0 2.6px; border-radius: 5.2px; font-size: 10.4px; line-height: 1.5; }
}
@media (max-width: 1059.98px) { .kai-home .aitem-wrapper.regular { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; } }
@media (max-width: 991.98px) {
	.kai-home .aitem-wrapper.regular { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
	.kai-home .r-update { position: relative; padding-bottom: 39px; }
}
@media (max-width: 767.98px) { .kai-home .aitem-wrapper.regular { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 639.98px) {
	.kai-home #latest-updates .shead.lg { flex-direction: column; }
}
@media (max-width: 575.98px) {
	.kai-home .aitem-wrapper.regular { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	.kai-home #latest-updates .shead.lg .shead-r { margin-top: 13px; }
	.kai-home #latest-updates .snav { text-align: center; }
}

/* ==========================================================================
   Sub / dub badge icons: the reference draws the CC / microphone glyphs from an SVG sprite, not Font Awesome.
   The same paths (inc/kai-helpers.php sprite) are used here as masks so the helper markup stays untouched.
   ========================================================================== */
.kai-home #featured .info > .sub > i, .kai-home #featured .info > .dub > i,
.kai-home .aitem-wrapper.regular .info > .sub > i, .kai-home .aitem-wrapper.regular .info > .dub > i { display: none; }
.kai-home #featured .info > .sub::before, .kai-home #featured .info > .dub::before,
.kai-home .aitem-wrapper.regular .info > .sub::before, .kai-home .aitem-wrapper.regular .info > .dub::before {
	content: "";
	flex: 0 0 auto;
	width: calc(var(--kr, 14px) * 1.1);
	height: calc(var(--kr, 14px) * 1.1);
	margin-right: calc(var(--kr, 14px) * .2);
	background: currentColor;
	-webkit-mask: var(--kai-ico-sub) center / contain no-repeat;
	mask: var(--kai-ico-sub) center / contain no-repeat;
}
.kai-home #featured .info > .dub::before, .kai-home .aitem-wrapper.regular .info > .dub::before {
	width: calc(var(--kr, 14px) * .8);
	height: calc(var(--kr, 14px) * .8);
	-webkit-mask-image: var(--kai-ico-dub);
	mask-image: var(--kai-ico-dub);
}
.kai-home { --kai-ico-sub: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 15 9%22%3E%3Cpath d=%22M5.04346 5.85205H6.92334C6.89827 6.39632 6.75146 6.87614 6.48291 7.2915C6.21436 7.70687 5.84196 8.03092 5.36572 8.26367C4.89307 8.49284 4.33447 8.60742 3.68994 8.60742C3.16715 8.60742 2.69987 8.51969 2.28809 8.34424C1.87988 8.16878 1.53255 7.91634 1.24609 7.58691C0.963216 7.25749 0.746582 6.85824 0.596191 6.38916C0.449382 5.92008 0.375977 5.39193 0.375977 4.80469V4.38037C0.375977 3.79313 0.452962 3.26497 0.606934 2.7959C0.764486 2.32324 0.986491 1.9222 1.27295 1.59277C1.56299 1.25977 1.91032 1.00553 2.31494 0.830078C2.71956 0.654622 3.16895 0.566895 3.66309 0.566895C4.34342 0.566895 4.91813 0.688639 5.38721 0.932129C5.85628 1.17562 6.21973 1.51042 6.47754 1.93652C6.73535 2.35905 6.88753 2.84066 6.93408 3.38135H5.0542C5.04704 3.08773 4.99691 2.84245 4.90381 2.64551C4.81071 2.44499 4.6639 2.2946 4.46338 2.19434C4.26286 2.09408 3.99609 2.04395 3.66309 2.04395C3.43034 2.04395 3.22803 2.08691 3.05615 2.17285C2.88428 2.25879 2.74105 2.39486 2.62646 2.58105C2.51188 2.76725 2.42594 3.00895 2.36865 3.30615C2.31494 3.59977 2.28809 3.95426 2.28809 4.36963V4.80469C2.28809 5.22005 2.31315 5.57454 2.36328 5.86816C2.41341 6.16178 2.49398 6.40169 2.60498 6.58789C2.71598 6.77409 2.85921 6.91195 3.03467 7.00146C3.2137 7.0874 3.43213 7.13037 3.68994 7.13037C3.9764 7.13037 4.2181 7.08561 4.41504 6.99609C4.61198 6.90299 4.76416 6.76335 4.87158 6.57715C4.979 6.38737 5.0363 6.14567 5.04346 5.85205ZM12.2622 5.85205H14.1421C14.117 6.39632 13.9702 6.87614 13.7017 7.2915C13.4331 7.70687 13.0607 8.03092 12.5845 8.26367C12.1118 8.49284 11.5532 8.60742 10.9087 8.60742C10.3859 8.60742 9.91862 8.51969 9.50684 8.34424C9.09863 8.16878 8.7513 7.91634 8.46484 7.58691C8.18197 7.25749 7.96533 6.85824 7.81494 6.38916C7.66813 5.92008 7.59473 5.39193 7.59473 4.80469V4.38037C7.59473 3.79313 7.67171 3.26497 7.82568 2.7959C7.98324 2.32324 8.20524 1.9222 8.4917 1.59277C8.78174 1.25977 9.12907 1.00553 9.53369 0.830078C9.93831 0.654622 10.3877 0.566895 10.8818 0.566895C11.5622 0.566895 12.1369 0.688639 12.606 0.932129C13.075 1.17562 13.4385 1.51042 13.6963 1.93652C13.9541 2.35905 14.1063 2.84066 14.1528 3.38135H12.2729C12.2658 3.08773 12.2157 2.84245 12.1226 2.64551C12.0295 2.44499 11.8826 2.2946 11.6821 2.19434C11.4816 2.09408 11.2148 2.04395 10.8818 2.04395C10.6491 2.04395 10.4468 2.08691 10.2749 2.17285C10.103 2.25879 9.9598 2.39486 9.84521 2.58105C9.73063 2.76725 9.64469 3.00895 9.5874 3.30615C9.53369 3.59977 9.50684 3.95426 9.50684 4.36963V4.80469C9.50684 5.22005 9.5319 5.57454 9.58203 5.86816C9.63216 6.16178 9.71273 6.40169 9.82373 6.58789C9.93473 6.77409 10.078 6.91195 10.2534 7.00146C10.4325 7.0874 10.6509 7.13037 10.9087 7.13037C11.1951 7.13037 11.4368 7.08561 11.6338 6.99609C11.8307 6.90299 11.9829 6.76335 12.0903 6.57715C12.1978 6.38737 12.255 6.14567 12.2622 5.85205Z%22/%3E%3C/svg%3E"); --kai-ico-dub: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 8.9 9.6%22%3E%3Cpath d=%22M7.9.7c-1.1-.9-2.8-.8-3.7.3-.9,1.1-.8,2.8.3,3.7,1.1.9,2.8.8,3.7-.3.9-1.1.8-2.8-.3-3.7Z%22/%3E%3Cpath d=%22M3,3.9L.1,8l1.7,1.4,3.6-3.5c-.5-.1-1-.3-1.5-.7-.4-.4-.8-.8-1-1.4Z%22/%3E%3C/svg%3E"); }

.kai-home #featured .info > .sub, .kai-home #featured .info > .dub,
.kai-home .aitem-wrapper.regular .info > .sub, .kai-home .aitem-wrapper.regular .info > .dub { gap: 0; }

/* ==========================================================================
   Rules shared by every width (they follow the reference's markup behaviour, not its breakpoints)
   ========================================================================== */
/* .info is a block (not a flex column) inside .inner in the reference: the title's bottom margin and the info's top margin collapse */
.kai-home .aitem .inner > .info { margin-top: 0; }
.kai-home .aitem .inner > .info > span { line-height: 1.5; }
.kai-home #featured .detail .info > span:not(.sub):not(.dub) { font-size: var(--kr, 14px); line-height: 1.5; }
:is(.kai-home, .social-share-watch) #social-sharing .share-btn i { font-size: 14px; }
/* Reference grid columns on the home page: 5 (1300 - 1517), 6 (>= 1518); phone/tablet counts are set above */
@media (min-width: 1300px) and (max-width: 1517.98px) { .kai-home .aitem-wrapper.regular { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; } }
@media (min-width: 1518px) { .kai-home .aitem-wrapper.regular { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; } }
@media (max-width: 700px) { :is(.kai-home, .social-share-watch) #social-sharing .share-buttons { align-self: center; width: fit-content; } }

/* Section head of Latest Updates (reference: .shead mb 1.3rem; title 1.5rem; tabs are inline spans 1.1rem) */
:is(.kai-home, .social-share-watch) #social-sharing { margin: 0 0 calc(var(--kr, 14px) * 3); }
.kai-home #latest-updates .shead { gap: 0; min-height: 0; margin-bottom: calc(var(--kr, 14px) * 1.3); }
.kai-home #latest-updates .shead .stitle { font-size: calc(var(--kr, 14px) * 1.5); line-height: 1.5; }
.kai-home #latest-updates .snav { display: block; }
.kai-home #latest-updates .snav .tab { display: inline; padding: calc(var(--kr, 14px) * .2) calc(var(--kr, 14px) * .5); font-size: calc(var(--kr, 14px) * 1.1); line-height: 1.5; }
.kai-home #latest-updates .tab-nav { gap: 0; margin-left: var(--kr, 14px); }
.kai-home #latest-updates .tab-nav .btn { font-size: calc(var(--kr, 14px) * 1.5); line-height: 1.5; }
.kai-home #latest-updates .tab-nav .btn + .btn { margin-left: calc(var(--kr, 14px) * .5); }
@media (max-width: 991.98px) {
	.kai-home #latest-updates .tab-nav { position: absolute; right: 0; bottom: 0; left: 0; justify-content: center; width: 100%; margin: 0 auto; }
	.kai-home #latest-updates .tab-nav > .btn i { font-size: 23.4px; }
	.kai-home #latest-updates .tab-nav > .btn + .btn { margin-left: 52px; }
}
@media (min-width: 701px) { :is(.kai-home, .social-share-watch) #social-sharing .share-buttons { justify-content: flex-end; } }

/* ==========================================================================
   Sidebar: Top Trending (below the list under 1300px) and the sections' spacing
   ========================================================================== */
@media (max-width: 1299.98px) {
	.kai-home #main-sidebar { gap: 26px; }
}
.kai-home #main-sidebar { gap: 0; }
.kai-home #main-sidebar .sidebar-section { padding: calc(var(--kr, 14px) * 1.5); border-radius: calc(var(--kr, 14px) * 1.2); margin-bottom: calc(var(--kr, 14px) * 3); }
.kai-home #main-sidebar .sidebar-section .shead { min-height: 0; margin-bottom: calc(var(--kr, 14px) * 1.3); }
.kai-home #main-sidebar .sidebar-section .shead .stitle { font-size: calc(var(--kr, 14px) * 1.5); line-height: 1.5; }
.kai-home #main-sidebar .sidebar-section .shead .stitle i { flex: 0 0 calc(var(--kr, 14px) * 2); width: calc(var(--kr, 14px) * 2); height: calc(var(--kr, 14px) * 2); margin-right: calc(var(--kr, 14px) * .5); font-size: calc(var(--kr, 14px) * .9); }
.kai-home #main-sidebar .top-anime { display: block; }
.kai-home #main-sidebar .top-anime .aitem { padding: calc(var(--kr, 14px) * 1.5); border-radius: calc(var(--kr, 14px) * .6); }
.kai-home #main-sidebar .top-anime .aitem + .aitem { margin-top: calc(var(--kr, 14px) * .5); }
.kai-home #main-sidebar .top-anime .num { flex: 0 0 calc(var(--kr, 14px) * 2.2); width: calc(var(--kr, 14px) * 2.2); min-width: calc(var(--kr, 14px) * 2.2); height: calc(var(--kr, 14px) * 2.2); margin-right: calc(var(--kr, 14px) * 1.2); font-size: calc(var(--kr, 14px) * 1.1); line-height: 1.5; }
.kai-home #main-sidebar .top-anime .detail .title { font-size: calc(var(--kr, 14px) * 1.15); line-height: 1.5; }
.kai-home #main-sidebar .top-anime .detail .info { margin-top: calc(var(--kr, 14px) * .5); gap: 0; }
.kai-home #main-sidebar .top-anime .detail .info > span { line-height: 1.5; }
.kai-home #main-sidebar .top-anime .detail .info > span:not(.sub):not(.dub) { font-size: calc(var(--kr, 14px) * .9); }
.kai-home #main-sidebar .top-anime .detail .info > span + span { margin-left: var(--kr, 14px); }
.kai-home #main-sidebar .top-anime .detail .info > .sub, .kai-home #main-sidebar .top-anime .detail .info > .dub { height: calc(var(--kr, 14px) * 1.2); padding: 0 calc(var(--kr, 14px) * .2); border-radius: calc(var(--kr, 14px) * .4); font-size: calc(var(--kr, 14px) * .8); line-height: 1.5; gap: 0; }
/* Reference: sections sit side by side from ~1100px (Top Trending takes the room, Schedule keeps its content width) and stack below */
@media (max-width: 1099.98px) { .kai-home .dual-col .sidebar > section { flex: 1 1 100%; } }
@media (min-width: 1100px) and (max-width: 1299.98px) {
	.kai-home .dual-col .sidebar > #trending-anime { flex: 1 1 0; min-width: 0; }
	.kai-home .dual-col .sidebar > #schedule { flex: 0 0 261.6px; min-width: 0; }
}
@media (max-width: 700px) {
	.kai-home #main-sidebar .sidebar-section.hide-bg-mobile { padding: 0; background: transparent; }
}
.kai-home #main-sidebar .top-anime .detail .info > .sub > i, .kai-home #main-sidebar .top-anime .detail .info > .dub > i { display: none; }
.kai-home #main-sidebar .top-anime .detail .info > .sub::before, .kai-home #main-sidebar .top-anime .detail .info > .dub::before {
	content: "";
	flex: 0 0 auto;
	width: calc(var(--kr, 14px) * 1.1);
	height: calc(var(--kr, 14px) * 1.1);
	margin-right: calc(var(--kr, 14px) * .2);
	background: currentColor;
	-webkit-mask: var(--kai-ico-sub) center / contain no-repeat;
	mask: var(--kai-ico-sub) center / contain no-repeat;
}
.kai-home #main-sidebar .top-anime .detail .info > .dub::before {
	width: calc(var(--kr, 14px) * .8);
	height: calc(var(--kr, 14px) * .8);
	-webkit-mask-image: var(--kai-ico-dub);
	mask-image: var(--kai-ico-dub);
}

/* ==========================================================================
   Estimated Schedule (#schedule). Reference layout: [prev | day strip (70% wide) | next] row, the day list on
   #181d22, then a footer row with the clock on the left and "More" on the right. Sizes are the reference rem x --kr.
   The widget markup is rendered by template-parts/home/schedule-widget.php (REST), so it is re-skinned here.
   ========================================================================== */
.kai-home #main-sidebar #schedule, .kai-home #schedule { padding: 0; overflow: hidden; }
.kai-home #schedule #schedule-block { padding: 0; }
.kai-home #schedule .schedule-full { display: grid; grid-template-columns: minmax(0, 1fr) auto; margin: 0; padding: 0; overflow: hidden; border-radius: 0; background: none; }
.kai-home #schedule .block_area-content, .kai-home #schedule .table_schedule { display: contents; }
.kai-home #schedule .table_schedule-date {
	grid-column: 1 / -1;
	grid-row: 1;
	position: static;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 calc(var(--kr, 14px) * 1.3);
	padding: calc(var(--kr, 14px) * 1.5) calc(var(--kr, 14px) * 1.5) calc(var(--kr, 14px) * .5);
}
.kai-home #schedule .table_schedule-date .swiper-container { position: relative; order: 1; flex: 1 1 1px; width: 1px; max-width: 70%; padding: 0; overflow: hidden; }
.kai-home #schedule .table_schedule-date .swiper-container::before,
.kai-home #schedule .table_schedule-date .swiper-container::after { content: ""; position: absolute; top: 0; z-index: 2; width: var(--kr, 14px); height: 100%; pointer-events: none; }
.kai-home #schedule .table_schedule-date .swiper-container::before { left: 0; background: linear-gradient(90deg, #11161b 0%, rgba(17, 22, 27, 0) 100%); }
.kai-home #schedule .table_schedule-date .swiper-container::after { right: 0; background: linear-gradient(90deg, rgba(17, 22, 27, 0) 0%, #11161b 100%); }
.kai-home #schedule .ts-navigation { display: contents; }
.kai-home #schedule .ts-navigation .btn {
	position: static;
	display: block;
	flex: 0 0 auto;
	width: calc(var(--kr, 14px) * 1.5);
	height: calc(var(--kr, 14px) * 2.25);
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: #fff;
	font-size: calc(var(--kr, 14px) * 1.5);
	line-height: calc(var(--kr, 14px) * 2.25);
	opacity: .2;
	transform: none;
	transition: opacity .1s;
}
.kai-home #schedule .ts-navigation .btn:hover { opacity: 1; }
.kai-home #schedule .ts-navigation .btn i { display: none; }
.kai-home #schedule .ts-navigation .btn::before { display: inline-block; font: 900 calc(var(--kr, 14px) * 1.5) / 1 "Font Awesome 5 Free"; }
.kai-home #schedule .ts-navigation .tsn-prev { order: 0; }
.kai-home #schedule .ts-navigation .tsn-prev::before { content: "\f137"; }
.kai-home #schedule .ts-navigation .tsn-next { order: 2; }
.kai-home #schedule .ts-navigation .tsn-next::before { content: "\f138"; }
.kai-home #schedule .ts-navigation .swiper-button-disabled { opacity: .2; }

.kai-home #schedule .day-item { display: flex; flex-direction: column; align-items: center; width: 20% !important; height: auto; cursor: pointer; user-select: none; }
.kai-home #schedule .tsd-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
	width: auto;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: #fff;
	font-size: var(--kr, 14px);
	line-height: 1.5;
	text-transform: none;
}
.kai-home #schedule .tsd-item:hover, .kai-home #schedule .tsd-item.active { border: 0; background: none; }
.kai-home #schedule .tsd-item span { display: block; color: #fff; font-size: var(--kr, 14px); font-weight: 400; line-height: 1.5; text-transform: uppercase; opacity: .7; transition: opacity .2s; }
.kai-home #schedule .tsd-item .date {
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(var(--kr, 14px) * 2.8);
	height: calc(var(--kr, 14px) * 2);
	min-width: 0;
	padding: 0;
	border-radius: calc(var(--kr, 14px) * .6);
	background: rgba(255, 255, 255, .3);
	color: #fff;
	font-size: var(--kr, 14px);
	font-weight: 600;
	line-height: 1.5;
	transition: background-color .2s;
}
.kai-home #schedule .tsd-item:hover span, .kai-home #schedule .tsd-item.active span { opacity: 1; }
.kai-home #schedule .tsd-item:hover .date { background: rgba(255, 255, 255, .2); }
.kai-home #schedule .tsd-item.active .date { background: var(--kai-primary); }

.kai-home #schedule .table_schedule-list { grid-column: 1 / -1; grid-row: 2; margin: 0; padding: calc(var(--kr, 14px) * .8) 0; list-style: none; background: #181d22; }
.kai-home #schedule .table_schedule-list:empty { display: none; }
.kai-home #schedule .table_schedule-list li { padding: calc(var(--kr, 14px) * .5) calc(var(--kr, 14px) * 1.5); border: 0; background: none; color: rgba(255, 255, 255, .5); font-size: calc(var(--kr, 14px) * .9); line-height: 1.5; }
.kai-home #schedule .table_schedule-list li a { display: flex; color: #fff; font-size: calc(var(--kr, 14px) * 1.05); }
.kai-home #schedule .table_schedule-list li strong { font-weight: 400; color: inherit; }

.kai-home #schedule .block_area-header { grid-column: 1; grid-row: 3; display: flex; align-items: center; margin: 0; padding: var(--kr, 14px) 0 var(--kr, 14px) calc(var(--kr, 14px) * 1.5); gap: 0; }
.kai-home #schedule .bah-time, .kai-home #schedule .bah-time .current-time, .kai-home #schedule .bah-time span { color: rgba(255, 255, 255, .5); font-size: calc(var(--kr, 14px) * .9); font-weight: 300; line-height: 1.5; }
.kai-home #schedule #scl-more {
	grid-column: 2;
	grid-row: 3;
	display: inline-flex !important;
	align-items: center;
	align-self: center;
	width: auto;
	margin: 0;
	padding: var(--kr, 14px) calc(var(--kr, 14px) * 1.5) var(--kr, 14px) 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: rgba(255, 255, 255, .5) !important;
	font-size: var(--kr, 14px);
	font-weight: 300;
	line-height: 1.5;
}
.kai-home #schedule #scl-more::before { content: "More"; }
.kai-home #schedule #scl-more::after { content: "\f078"; display: inline-block; font: 900 var(--kr, 14px) / 1.5 "Font Awesome 5 Free"; transition: transform .2s; }
.kai-home #schedule #scl-more.active::before { content: "Less"; }
.kai-home #schedule #scl-more.active::after { transform: rotate(180deg); }
.kai-home #schedule #scl-more:hover { color: var(--kai-green); }
@media (max-width: 1299.98px) { .kai-home #schedule .day-item { width: 20% !important; } }
@media (max-width: 1059.98px) { .kai-home #schedule .day-item { width: 25% !important; } }
@media (max-width: 991.98px) { .kai-home #schedule .day-item { width: 33.3333% !important; } }
@media (max-width: 842px) { .kai-home #schedule .day-item { width: 12.5% !important; } }
@media (max-width: 700px) { .kai-home #schedule .day-item { width: 16.6667% !important; } }
@media (max-width: 575.98px) { .kai-home #schedule .day-item { width: 20% !important; } }
@media (max-width: 470px) { .kai-home #schedule .day-item { width: 25% !important; } }
@media (min-width: 1300px) { .kai-home #schedule .day-item { width: 33.3333% !important; } }
.kai-home #schedule .clearfix { display: none; }
.kai-home #schedule #scl-more:hover { color: var(--kai-green) !important; }