			.sticky-legend {
			position: fixed; 
			top: 150px; 
			right: 80px;
			z-index: 9999; 
			background-color: #821550; 
			color: #ffffff; 
			cursor: pointer;
			box-shadow: 0 8px 24px rgba(0,0,0,0.25);
			display: flex;
			align-items: center;
			justify-content: center;
			transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1);
			overflow: hidden;
			border: 1px solid rgba(255,255,255,0.1);
			}

			.sticky-legend:not(.expanded) {
			width: 160px;
			height: 45px;
			border-radius: 25px;
			}

			.label-text {
			font-weight: 600;
			font-size: 14px;
			white-space: nowrap;
			}

			@media (max-width: 767px) {
			.sticky-legend:not(.expanded) {
			top: 150px;
			right: 0px; 
			width: 30px;  
			height: 120px; 
			border-radius: 8px 0 0 8px; 
			}

			.label-text {
			font-size: 11px;
			writing-mode: vertical-rl; 
			transform: rotate(180deg);
			letter-spacing: 1px;
			}
			}

			@media (max-width: 1024px) {
			.sticky-legend.expanded {
			width: 70vw !important; 
			max-width: 320px !important;
			height: 70vw !important; 
			max-height: 320px !important;
			right: 15vw !important;   
			top: 150px !important;   
			writing-mode: horizontal-tb;
			transform: rotate(0deg);
			border-radius: 12px;
			}

			.sticky-legend.expanded .svg-content img {
			max-height: 180px !important; 
			width: 90% !important;
			margin-bottom: 5px !important;
			}
			}

			.sticky-legend.expanded {
			width: 400px;
			height: 450px;
			background-color: #ffffff;
			color: #333333;
			cursor: default;
			border-radius: 12px;
			top: 150px;
			border: 2px solid #821550;
			flex-direction: column;
			}

			.svg-content {
			display: none;
			width: 100%;
			height: 100%;
			padding: 20px;
			box-sizing: border-box;
			text-align: center;
			flex-direction: column;
			justify-content: center; 
			align-items: center;
			}

			.sticky-legend.expanded .label-text { display: none; }
			.sticky-legend.expanded .svg-content { display: flex; }

			.svg-content h3 {
			margin: 0 0 10px 0;
			color: #821550;
			}

			.svg-content img {
			width: 100%; 
			height: auto;
			max-height: 250px; 
			object-fit: contain;
			margin-bottom: 8px;
			}

			.close-btn {
			font-size: 11px;
			font-weight: bold;
			color: #821550;
			cursor: pointer;
			text-decoration: underline;
			}