.local-stories-wrapper {
								width: 100%;
								margin: 15px 0 25px 0;
								overflow-x: auto;
								scrollbar-width: none;
								-ms-overflow-style: none;
								-webkit-overflow-scrolling: touch;
							}

							.local-stories-wrapper::-webkit-scrollbar {
								display: none;
							}

							.local-stories-grid {
								display: grid;
								grid-template-columns: repeat(7, 1fr);
								gap: 16px;
								min-width: 960px;
								padding: 10px 5px;
							}

							@media (max-width: 990px) {
								.local-stories-grid {
									grid-template-columns: repeat(7, 155px);
									gap: 12px;
								}
							}

							.story-card {
								position: relative;
								height: 270px;
								border-radius: 16px;
								overflow: hidden;
								cursor: pointer;
								box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14);
								transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.3s ease;
								background: #010c27;
							}

							.story-card:hover {
								transform: translateY(-6px) scale(1.02);
								box-shadow: 0 14px 30px rgba(0, 0, 0, 0.25);
							}

							.story-card img {
								width: 100%;
								height: 100%;
								object-fit: cover;
								display: block;
								transition: transform 0.5s ease;
							}

							.story-card:hover img {
								transform: scale(1.08);
							}

							.story-card::after {
								content: '';
								position: absolute;
								inset: 0;
								background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.05) 100%);
								pointer-events: none;
							}

							.story-play-icon {
								position: absolute;
								top: 50%;
								left: 50%;
								transform: translate(-50%, -50%);
								width: 48px;
								height: 48px;
								background: rgba(255, 255, 255, 0.35);
								backdrop-filter: blur(8px);
								border-radius: 50%;
								display: flex;
								align-items: center;
								justify-content: center;
								color: #ffffff;
								z-index: 2;
								transition: all 0.3s ease;
							}

							.story-play-icon svg {
								width: 24px;
								height: 24px;
								margin-left: 3px;
							}

							.story-card:hover .story-play-icon {
								background: #ffffff;
								color: #010c27;
								transform: translate(-50%, -50%) scale(1.15);
							}

							.story-title {
								position: absolute;
								bottom: 14px;
								left: 14px;
								right: 14px;
								color: #ffffff;
								font-weight: 700;
								font-size: 0.95rem;
								z-index: 2;
								text-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);
								line-height: 1.25;
							}

							/* Story Modal Player */
							#local-story-modal {
								position: fixed;
								inset: 0;
								z-index: 99999999;
								display: flex;
								align-items: center;
								justify-content: center;
								opacity: 1;
								transition: opacity 0.3s ease;
							}

							#local-story-modal.story-modal-hidden {
								display: none !important;
								opacity: 0;
								pointer-events: none;
							}

							.story-modal-backdrop {
								position: absolute;
								inset: 0;
								background: rgba(0, 0, 0, 0.9);
								backdrop-filter: blur(12px);
								z-index: 1;
							}

							.story-modal-content {
								position: relative;
								width: 90vw;
								max-width: 420px;
								height: 85vh;
								max-height: 780px;
								background: #000000;
								border-radius: 20px;
								overflow: hidden;
								box-shadow: 0 25px 60px rgba(0, 0, 0, 0.8), 0 0 0 1px rgba(255, 255, 255, 0.15);
								display: flex;
								flex-direction: column;
								z-index: 2;
							}

							.story-progress-bar {
								position: absolute;
								top: 12px;
								left: 12px;
								right: 12px;
								display: flex;
								gap: 4px;
								z-index: 10;
							}

							.story-progress-segment {
								flex: 1;
								height: 3px;
								background: rgba(255, 255, 255, 0.35);
								border-radius: 3px;
								overflow: hidden;
							}

							.story-progress-fill {
								height: 100%;
								width: 0%;
								background: #ffffff;
								transition: width 0.1s linear;
							}

							.story-header-info {
								position: absolute;
								top: 24px;
								left: 16px;
								right: 16px;
								display: flex;
								align-items: center;
								justify-content: space-between;
								z-index: 10;
								color: #ffffff;
							}

							#story-modal-title {
								font-weight: 800;
								font-size: 1rem;
								text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
							}

							#story-modal-close {
								background: rgba(0, 0, 0, 0.5);
								border: 1px solid rgba(255, 255, 255, 0.2);
								color: #ffffff;
								font-size: 24px;
								line-height: 1;
								width: 36px;
								height: 36px;
								border-radius: 50%;
								cursor: pointer;
								display: flex;
								align-items: center;
								justify-content: center;
								backdrop-filter: blur(4px);
								transition: background 0.2s;
							}

							#story-modal-close:hover {
								background: rgba(255, 255, 255, 0.3);
							}

							.story-nav-btn {
								position: absolute;
								top: 50%;
								transform: translateY(-50%);
								background: rgba(255, 255, 255, 0.25);
								color: #ffffff;
								border: none;
								width: 44px;
								height: 44px;
								border-radius: 50%;
								font-size: 24px;
								cursor: pointer;
								z-index: 10;
								display: flex;
								align-items: center;
								justify-content: center;
								backdrop-filter: blur(4px);
								transition: background 0.2s, transform 0.2s;
							}

							.story-nav-btn:hover {
								background: rgba(255, 255, 255, 0.5);
								transform: translateY(-50%) scale(1.1);
							}

							.story-prev-btn {
								left: 10px;
							}

							.story-next-btn {
								right: 10px;
							}

							#story-video-player {
								width: 100%;
								height: 100%;
								object-fit: contain;
								background: #000;
							}