/* Panorama nieba — okno, nie dekoracja. Styl zgodny z resztą Taroscope:
   granat, subtelny fiolet, przygaszone złoto, ciepła biel gwiazd. */

#niebo-hero .dome { position: relative; }

.sky3d-canvas {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
	cursor: grab;
	touch-action: pan-y;
}
.sky3d-canvas.ciagnie { cursor: grabbing; }

/* czytelność nawigacji nad niebem — delikatna zasłona, nie pasek SaaS */
#niebo-hero .dome::before {
	content: '';
	position: absolute;
	inset: 0 0 auto 0;
	height: 130px;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient( 180deg, rgba(6,5,16,.72), rgba(6,5,16,0) );
}
#niebo-hero .top { position: relative; z-index: 3; }

/* pasek lokalizacji — element planetarium, nie karta */
.sky-pasek {
	position: absolute;
	left: clamp(18px, 4vw, 56px);
	bottom: 18px;
	z-index: 4;
	display: flex;
	align-items: center;
	gap: 14px;
	font-family: Jost, system-ui, sans-serif;
}
.sky-miejsce {
	display: flex;
	align-items: baseline;
	gap: 9px;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	cursor: pointer;
	text-align: left;
}
.sky-pin { color: #f0ce7e; font-size: .95rem; transform: translateY(1px); }
.sky-nazwa {
	font-size: .82rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: #ede7ff;
	border-bottom: 1px solid transparent;
	transition: border-color .25s ease, color .25s ease;
}
.sky-miejsce:hover .sky-nazwa { color: #f0ce7e; border-bottom-color: rgba(240,206,126,.5); }
.sky-kiedy { font-size: .74rem; letter-spacing: .1em; color: #9a93c4; }
.sky-miejsce:focus-visible { outline: 2px solid #f0ce7e; outline-offset: 4px; border-radius: 4px; }

.sky-teraz {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: .62rem;
	letter-spacing: .26em;
	text-transform: uppercase;
	color: #7d77a6;
}
.sky-teraz i {
	width: 5px; height: 5px; border-radius: 50%;
	background: #f0ce7e;
	box-shadow: 0 0 10px rgba(240,206,126,.9);
	animation: skyPuls 3.2s ease-in-out infinite;
}
@keyframes skyPuls { 0%,100% { opacity: .45 } 50% { opacity: 1 } }

/* popover wyboru miejsca — mały, nie modal */
#sky-popover {
	position: absolute;
	left: clamp(18px, 4vw, 56px);
	bottom: 54px;
	z-index: 20;
	width: min(300px, calc(100vw - 40px));
	padding: 16px;
	border-radius: 16px;
	border: 1px solid rgba(240,206,126,.28);
	background: linear-gradient( 180deg, rgba(22,16,52,.97), rgba(11,10,26,.98) );
	box-shadow: 0 26px 60px rgba(0,0,0,.6), 0 0 40px rgba(74,58,140,.35);
	animation: skyWjazd .22s ease-out both;
}
@keyframes skyWjazd { from { opacity: 0; transform: translateY(6px) } to { opacity: 1; transform: none } }

.sp-tytul {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.1rem;
	color: #f0ce7e;
	margin-bottom: 10px;
}
.sp-szukaj {
	width: 100%;
	box-sizing: border-box;
	padding: .6rem .8rem;
	border-radius: 10px;
	border: 1px solid rgba(167,139,250,.3);
	background: rgba(11,10,26,.7);
	color: #ede7ff;
	font: inherit;
	font-size: .88rem;
}
.sp-szukaj:focus { outline: none; border-color: rgba(240,206,126,.6); }
.sp-wyniki { margin: 8px 0 10px; max-height: 190px; overflow-y: auto; }
.sp-miasto {
	display: block;
	width: 100%;
	text-align: left;
	padding: .45rem .6rem;
	border: 0;
	border-radius: 8px;
	background: none;
	color: #d8d4ec;
	font: inherit;
	font-size: .86rem;
	cursor: pointer;
}
.sp-miasto:hover,
.sp-miasto.jest { background: rgba(74,58,140,.35); color: #fff; }
.sp-miasto.jest { box-shadow: inset 2px 0 0 rgba(240,206,126,.75); }
/* nazwa i opis w jednym wierszu: miasto czyta się od razu, kraj dopowiada */
.sp-m-nazwa { display: inline; }
.sp-m-opis {
	display: inline;
	margin-left: .5em;
	font-size: .76rem;
	color: #8b84b4;
}
.sp-miasto:hover .sp-m-opis,
.sp-miasto.jest .sp-m-opis { color: #a9a2ce; }
.sp-pusto { padding: .5rem .6rem; font-size: .8rem; color: #7d77a6; }
.sp-zrodlo {
	margin-top: .6rem;
	font-size: .66rem;
	letter-spacing: .08em;
	color: #5d5883;
	text-align: right;
}
.sp-gps {
	width: 100%;
	padding: .55rem;
	border-radius: 9999px;
	border: 1px solid rgba(240,206,126,.3);
	background: none;
	color: #9a93c4;
	font: inherit;
	font-size: .74rem;
	letter-spacing: .1em;
	cursor: pointer;
	transition: color .2s ease, border-color .2s ease;
}
.sp-gps:hover { color: #f0ce7e; border-color: rgba(240,206,126,.6); }

@media (max-width: 640px) {
	.sky-pasek { bottom: 12px; gap: 10px; }
	.sky-kiedy { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.sky-teraz i { animation: none; }
	#sky-popover { animation: none; }
}

/* Okienko wyboru miasta otwarte spod panoramy — wisi przy swoim przycisku. */
#sky-popover.sp-plywajacy {
	position: fixed;
	z-index: 9999;
	width: 300px;
}