/* Reversible Command detail tabs. The legacy detail layout remains untouched. */
.dashboard-app .dashboard-tabs-header .card-view-top {
	position: relative;
	min-width: 0;
}

.dashboard-app .dashboard-detail-tabs {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	min-width: 0;
	height: calc(var(--detail-header-content-height) + 1px);
}

.dashboard-app .dashboard-tabs-header .dashboard-detail-tabs {
	position: absolute;
	top: 0;
	left: 50%;
	width: min(480px, calc(100% - 260px));
	transform: translateX(-50%);
	z-index: 2;
}

.dashboard-app .dashboard-detail-tab {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	box-sizing: border-box;
	min-width: 0;
	height: calc(var(--detail-header-content-height) + 1px);
	margin: 0;
	padding: 0 8px;
	border: 0;
	border-bottom: 1px solid #262626;
	background: transparent;
	color: var(--command-grey, #727578);
	font: inherit;
	font-size: var(--font-xs);
	line-height: 1.2;
	cursor: pointer;
	touch-action: manipulation;
}

.dashboard-app .dashboard-detail-tab > i {
	flex: 0 0 auto;
	font-size: 20px;
	line-height: 1;
}

.dashboard-app .dashboard-detail-tab > span:not(.filter-notification) {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.dashboard-app .dashboard-detail-tab[aria-selected="true"] {
	color: #ededed;
	border-bottom-color: #5acc77;
}

.dashboard-app .dashboard-detail-tab:focus-visible {
	outline: 1px solid #ededed;
	outline-offset: -4px;
}

.dashboard-app .dashboard-detail-tab .filter-notification {
	top: 6px;
	left: calc(50% + 7px);
	right: auto;
}

.dashboard-app .dashboard-detail-tab .fa-solar-system {
	--fa: "\e02f";
	font-family: "Dashboard Font Awesome Light";
	font-weight: 300;
}

.dashboard-app .dashboard-detail-tab .fa-gem {
	--fa: "\f3a5";
	font-family: "Dashboard Font Awesome Light";
	font-weight: 300;
}

.dashboard-app .dashboard-detail-tab .fa-satellite-dish {
	--fa: "\f7c0";
	font-family: "Dashboard Font Awesome Sharp Light";
	font-weight: 300;
}

.dashboard-app .dashboard-tabs-header .dashboard-header-identity {
	max-width: calc((100% - min(480px, calc(100% - 260px))) / 2 - 30px);
}

.dashboard-app .dashboard-tabs-header .dashboard-detail-tools,
.dashboard-app .dashboard-tabs-header .expand-content {
	margin-left: auto;
}

.dashboard-app .dashboard-card-overlay.dashboard-tabs-enabled .dashboard-tabs-header .card-view-top > .expand-content {
	margin-left: auto;
}

.dashboard-app .dashboard-tabs-footer {
	display: none;
}

.dashboard-app .dashboard-detail-tabbed .dashboard-tab-content {
	min-width: 0;
	width: 100%;
}

.dashboard-app .dashboard-detail-tabbed .dashboard-tab-content.hidden {
	display: none;
}

.dashboard-app :is(.card-view, .single-card).dashboard-detail-tabbed > :is(.card-content, .single-content) > .dashboard-tabs-project {
	padding: 0;
}

.dashboard-app .dashboard-detail-tabbed .dashboard-detail-columns {
	box-sizing: border-box;
	float: none;
	width: 100%;
}

.dashboard-app .dashboard-detail-tabbed .orbit-map-owner-filter {
	margin: 0;
	padding-top: 10px;
}

.dashboard-app .dashboard-detail-tabbed .orbit-map-owner-filter .active-filter-tag {
	background: #000;
}

/* The navigation underline spans the complete clickable tab, not only its text. */
.dashboard-app.dashboard-detail-tabs-enabled > header .collection-menu-item {
	box-sizing: border-box;
	margin: 0;
	padding: 0 10px;
	border-bottom: 1px solid #262626;
}

.dashboard-app.dashboard-detail-tabs-enabled > header .collection-menu-item-content {
	border-bottom: 0;
}

.dashboard-app.dashboard-detail-tabs-enabled > header .collection-menu-item-active {
	border-bottom-color: #5acc77;
}

@media (hover: hover) and (pointer: fine) {
	.dashboard-app .dashboard-detail-tab:hover { color: #ededed; }
}

@media (min-width: 801px) {
	/* Smaller desktop has square artwork on the left and the ordered stacks on
	   the right. Its four 100px tabs remain centered in the entire header. */
	.dashboard-app .dashboard-tabs-header:not(.dashboard-tabs-landscape) .dashboard-detail-tabs {
		width: 400px;
		grid-template-columns: repeat(4, 100px);
	}
	.dashboard-app .dashboard-tabs-header:not(.dashboard-tabs-landscape) .dashboard-header-identity {
		max-width: calc((100% - 400px) / 2 - 30px);
	}
	.dashboard-app .dashboard-card-overlay .card-view-content:has(.dashboard-detail-tabbed:not(.dashboard-detail-landscape)) {
		width: calc(100% - 40px);
		max-width: 1200px;
	}
	.dashboard-app :is(.card-view, .single-card).dashboard-detail-tabbed:not(.dashboard-detail-landscape) {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
		isolation: isolate;
	}
	.dashboard-app .dashboard-detail-tabbed:not(.dashboard-detail-landscape) > .project-image {
		grid-area: 1 / 1;
		align-self: start;
		width: calc(50% - 10px);
		max-width: none;
		aspect-ratio: 1 / 1;
		min-height: 0;
		max-height: none;
		z-index: 0;
	}
	.dashboard-app .dashboard-detail-tabbed:not(.dashboard-detail-landscape):not(.single-card) > .project-image::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		width: 150px;
		height: auto;
		-webkit-mask: none;
		mask: none;
		background: linear-gradient(to right, transparent, #000);
		pointer-events: none;
		z-index: 2;
	}
	.dashboard-app .dashboard-detail-tabbed:not(.dashboard-detail-landscape) > :is(.card-content, .single-content) {
		grid-area: 1 / 1;
		align-self: start;
		width: 100%;
		min-width: 0;
		margin: 0;
		pointer-events: none;
		z-index: 2;
	}
	.dashboard-app .dashboard-detail-tabbed:not(.dashboard-detail-landscape)::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		width: 50%;
		pointer-events: auto;
		touch-action: pan-y;
		z-index: 1;
	}
	.dashboard-app .dashboard-detail-tabbed:not(.dashboard-detail-landscape) .dashboard-detail-columns {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
		padding: 20px 20px 20px calc(50% + 10px);
		align-items: start;
	}
	.dashboard-app .dashboard-detail-tabbed .dashboard-detail-traits {
		margin-bottom: 20px;
	}
	.dashboard-app .dashboard-detail-tabbed .dashboard-detail-column > .card-box:not(:last-child) {
		margin-bottom: 20px;
	}
	.dashboard-app .single-card.dashboard-detail-tabbed:not(.dashboard-detail-landscape) .dashboard-detail-columns {
		padding-right: 0;
	}
	.dashboard-app .dashboard-detail-tabbed:not(.dashboard-detail-landscape) .dashboard-detail-column {
		grid-column: 1;
		max-width: 460px;
		justify-self: end;
	}
	.dashboard-app .dashboard-detail-tabbed:not(.dashboard-detail-landscape) > .dashboard-planet-identity {
		left: 20px;
		right: calc(50% + 10px);
		width: auto;
	}
	.dashboard-app .dashboard-detail-tabbed:not(.dashboard-detail-landscape) > .project-image > .planet-status-bars {
		left: 20px;
		right: 20px;
		width: auto;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .orbit-map-frame {
		aspect-ratio: 1 / 1;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .orbit-map-frame::before {
		display: none;
	}
	.dashboard-app .dashboard-detail-tabbed .dashboard-detail-column:empty {
		display: none;
	}

	/* Fade the single page's artwork into its black surroundings. Keep this in
	   the artwork layer so floating groups and status bars stay above the fades. */
	.dashboard-app .single-card.dashboard-planet-detail > .project-image::before {
		inset: 0;
		height: auto;
		background:
			linear-gradient(to right, #000, transparent) left / 150px 100% no-repeat,
			linear-gradient(to left, #000, transparent) right / 150px 100% no-repeat,
			linear-gradient(to bottom, transparent, #000) bottom / 100% 150px no-repeat;
		pointer-events: none;
		z-index: 2;
	}
}

@media (max-width: 800px) {
	.dashboard-app .dashboard-tabs-header .dashboard-detail-tabs { display: none; }
	.dashboard-app .dashboard-tabs-header .dashboard-header-identity { max-width: none; }
	.dashboard-app .dashboard-tabs-header .expand-content { margin-left: 0; }

	.dashboard-app .dashboard-tabs-enabled {
		--detail-tabs-mobile-header: var(--detail-header-height);
		--detail-tabs-footer-height: var(--detail-footer-height);
	}
	.dashboard-app .dashboard-card-overlay.dashboard-tabs-enabled {
		--detail-tabs-mobile-header: calc(11px + var(--detail-header-height));
	}
	.dashboard-app .dashboard-single-surface.dashboard-tabs-enabled {
		--detail-tabs-mobile-header: calc(var(--command-header-height) + var(--command-secondary-height));
	}
	.dashboard-app :is(.card-view, .single-card).dashboard-detail-tabbed {
		padding-bottom: var(--detail-tabs-footer-height);
	}
	/* The detail owns footer clearance; do not add the page's legacy bottom space. */
	.dashboard-app.dashboard-detail-tabs-enabled .site.single-active .main {
		padding-bottom: 0;
	}
	.dashboard-app .dashboard-tabs-enabled .card-view.dashboard-detail-tabbed {
		margin-bottom: 0;
		padding-bottom: 0;
	}
	.dashboard-app .dashboard-tabs-footer {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		display: block;
		box-sizing: border-box;
		height: var(--detail-tabs-footer-height);
		background: #000;
		z-index: 9998;
	}
	.dashboard-app .dashboard-card-overlay .dashboard-tabs-footer {
		left: 11px;
		right: 11px;
		bottom: 11px;
	}
	.dashboard-app .dashboard-card-overlay .pm-mobile-compose > .pm-compose-launch {
		right: 21px;
		bottom: calc(21px + var(--detail-footer-height));
	}
	.dashboard-app .dashboard-tabs-footer :is(.dashboard-detail-tabs, .dashboard-detail-tab) { height: var(--detail-footer-height); }
	.dashboard-app .dashboard-tabs-footer .dashboard-detail-tab {
		border-top: 1px solid #262626;
		border-bottom: 0;
	}
	.dashboard-app .dashboard-tabs-footer .dashboard-detail-tab[aria-selected="true"] {
		border-top-color: #5acc77;
	}
	.dashboard-app :is(.card-view, .single-card).dashboard-detail-tabbed > .project-image {
		aspect-ratio: 1 / 1;
	}
	.dashboard-app .dashboard-detail-tabbed .dashboard-detail-columns {
		display: flex;
		flex-direction: column;
		gap: 20px;
		padding: 20px;
	}
	/* Bars end 10px inside the artwork, leaving another 10px before Traits. */
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="planet"] .dashboard-detail-columns {
		padding-top: 10px;
	}
	.dashboard-app .dashboard-detail-tabbed .dashboard-detail-column {
		max-width: none;
	}
	.dashboard-app .dashboard-detail-tabbed .dashboard-detail-left:empty { display: none; }
	.dashboard-app :is(.card-view, .single-card).dashboard-detail-tabbed > :is(.card-content, .single-content) {
		margin: 0;
	}
	.dashboard-app .dashboard-detail-tabbed :is([data-tab-section="planet"], [data-tab-section="resources"], [data-tab-section="forces"]) :is(.dashboard-detail-left, .dashboard-detail-right) {
		display: contents;
	}
	.dashboard-app .dashboard-detail-tabbed :is([data-tab-section="planet"], [data-tab-section="resources"], [data-tab-section="forces"]) :is(.dashboard-detail-traits, .card-box) {
		margin: 0;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="planet"] .dashboard-detail-traits {
		order: 1;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="planet"] [data-box="aliens"] {
		order: 2;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="planet"] [data-box="details"] {
		order: 3;
	}

	/* Only Planet retains its mobile artwork; the other tabs show their own content. */
	.dashboard-app .dashboard-detail-tabbed:is([data-detail-tab="resources"], [data-detail-tab="forces"], [data-detail-tab="messages"]) > :is(.project-image, .dashboard-planet-identity) {
		display: none;
	}
	.dashboard-app .dashboard-detail-tabbed:is([data-detail-tab="resources"], [data-detail-tab="forces"], [data-detail-tab="messages"]) > :is(.card-content, .single-content) {
		width: 100%;
		margin: 0;
		padding: 0;
	}
	.dashboard-app :is(.card-view, .single-card).dashboard-detail-tabbed:is([data-detail-tab="resources"], [data-detail-tab="forces"]) {
		box-sizing: border-box;
		min-height: calc(100vh - var(--detail-tabs-mobile-header, 60px));
		min-height: calc(100svh - var(--detail-tabs-mobile-header, 60px));
		background: #000;
	}
	.dashboard-app .dashboard-card-overlay .card-view.dashboard-detail-tabbed:is([data-detail-tab="resources"], [data-detail-tab="forces"]) {
		min-height: calc(100svh - var(--detail-tabs-mobile-header) - var(--detail-footer-height) - 11px);
	}
	/* Comms combines a steady map above the independently scrolling message feed. */
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .dashboard-detail-columns {
		gap: 0;
		padding: 0;
		overflow: hidden;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .card-box {
		border: 0;
		margin: 0;
		background: #000;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .card-box > .card-box-header {
		display: none;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .card-box > .card-box-content {
		padding: 0;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .dashboard-detail-left {
		display: block;
		flex: 0 0 auto;
		min-height: 0;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] [data-box="map"] {
		border-bottom: 1px solid #262626;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .orbit-map-frame {
		aspect-ratio: 4 / 3;
		/* Preserve 120px for messages plus the map divider on short viewports. */
		max-height: max(0px, calc(100vh - var(--detail-tabs-mobile-header, 60px) - var(--detail-tabs-footer-height, 60px) - 121px));
		max-height: max(0px, calc(100svh - var(--detail-tabs-mobile-header, 60px) - var(--detail-tabs-footer-height, 60px) - 121px));
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .orbit-map-frame::before {
		content: "";
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 100px;
		padding: 0;
		background: linear-gradient(to bottom, #000, transparent);
		pointer-events: none;
		z-index: 1;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .orbit-map-frame::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		height: 100px;
		background: linear-gradient(to bottom, transparent, #000);
		pointer-events: none;
		z-index: 1;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .orbit-map-tooltip-stack {
		bottom: 10px;
		z-index: 2;
	}

	/* The viewport, not message count, determines the feed and composer height. */
	.dashboard-app .dashboard-detail-tabbed[data-detail-tab="messages"] .dashboard-tab-content[data-tab-section="messages"]:not(.hidden) {
		position: fixed;
		top: var(--detail-tabs-mobile-header, 60px);
		left: 0;
		right: 0;
		bottom: var(--detail-tabs-footer-height, 60px);
		display: flex;
		flex-direction: column;
		min-height: 0;
		background: #000;
		z-index: 6;
	}
	.dashboard-app .dashboard-card-overlay .dashboard-detail-tabbed[data-detail-tab="messages"] .dashboard-tab-content[data-tab-section="messages"]:not(.hidden) {
		left: 11px;
		right: 11px;
		bottom: calc(11px + var(--detail-footer-height));
		width: auto;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .dashboard-detail-columns,
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .dashboard-detail-right,
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] [data-box="messages"],
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] [data-box="messages"] > .card-box-content,
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] [data-message-planet] {
		display: flex;
		flex: 1 1 auto;
		flex-direction: column;
		min-height: 0;
		width: 100%;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .pm-history {
		display: flex;
		flex: 1 1 auto;
		flex-direction: column;
		min-height: 0;
		padding: 10px;
		overflow: hidden;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .pm-feed {
		flex: 1 1 auto;
		min-height: 0;
		max-height: none;
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
	}
	.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .pm-entry { border-top: 0; }
}

/* Planet mini map and the separate Locate dialog. */
body.dashboard-app .dashboard-planet-minimap {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 4;
	box-sizing: border-box;
	width: 60px;
	height: 60px;
	padding: 0;
	border: 1px solid var(--command-border, #252729);
	border-radius: 0;
	background: #000;
	color: var(--command-grey, #727578);
	cursor: pointer;
	overflow: hidden;
}
body.dashboard-app .dashboard-planet-minimap > .orbit-map,
body.dashboard-app .dashboard-planet-minimap .orbit-map-frame { width: 100%; height: 100%; }
body.dashboard-app .dashboard-planet-minimap .orbit-map-frame::before { display: none; }
body.dashboard-app .dashboard-planet-minimap > .orbit-map { display: block; pointer-events: none; }
body.dashboard-app .dashboard-minimap-expand {
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 20px;
	height: 20px;
	border-top: 1px solid var(--command-border, #252729);
	border-left: 1px solid var(--command-border, #252729);
	background: #000;
	font-size: 12px;
}
body.dashboard-app .dashboard-planet-minimap:focus-visible { outline: 1px solid #fff; outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
	body.dashboard-app .dashboard-planet-minimap:hover .dashboard-minimap-expand { color: #fff; }
}
@media (min-width: 801px) {
	body.dashboard-app .dashboard-detail-landscape > .dashboard-planet-minimap { right: var(--detail-control-inset); }
	body.dashboard-app .dashboard-detail-tabbed:not(.dashboard-detail-landscape) > .dashboard-planet-minimap { right: calc(50% + 30px); }
}
@media (max-width: 800px) {
	body.dashboard-app .dashboard-detail-tabbed:not([data-detail-tab="planet"]) > .dashboard-planet-minimap { display: none; }
}
body.dashboard-app .command-locate-overlay .popup-scroll {
	box-sizing: border-box;
	padding: 10px;
}
body.dashboard-app .popup-overlay.command-locate-overlay .popup-content {
	display: flex;
	flex-direction: column;
	width: min(600px, 100%);
	max-width: 100%;
	height: 100%;
	max-height: 100%;
	min-height: 0;
	margin-bottom: 0;
}
body.dashboard-app .command-locate-overlay .popup-top { display: flex; align-items: center; gap: 10px; padding: 10px; }
body.dashboard-app .command-locate-overlay .popup-header { flex-basis: auto; height: auto; }
body.dashboard-app .command-locate-overlay .popup-top { height: auto; min-height: var(--detail-header-height); }
body.dashboard-app .command-locate-search { flex: 1; min-width: 0; }
body.dashboard-app .command-locate-search .orbit-map-search { position: static; display: block; }
body.dashboard-app .command-locate-search .search-menu { width: 100%; max-width: none; margin: 0; }
body.dashboard-app .command-locate-overlay .orbit-map-owner-filter {
	position: absolute;
	top: 10px;
	left: 10px;
	right: 10px;
	margin: 0;
	z-index: 4;
	pointer-events: none;
}
body.dashboard-app .command-locate-overlay .orbit-map-owner-filter .active-filter-tag {
	background: #000;
	pointer-events: auto;
}
body.dashboard-app .command-locate-search [hidden] { display: none !important; }
body.dashboard-app .command-locate-overlay .popup-close { flex: 0 0 40px; align-self: flex-start; margin: 0; }
body.dashboard-app .popup-overlay.command-locate-overlay .popup-card {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	float: none;
	box-sizing: border-box;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
}
body.dashboard-app .command-locate-overlay .command-locate-content {
	display: flex;
	flex: 1 0 auto;
	flex-direction: column;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	min-height: 600px;
}
body.dashboard-app .command-locate-overlay .command-locate-content > .orbit-map {
	flex: 1 1 0;
	min-height: 0;
}
body.dashboard-app .command-locate-overlay .orbit-map-frame {
	height: 100%;
	aspect-ratio: auto;
	background: #000;
}
body.dashboard-app .command-locate-overlay .orbit-map-frame > .dashboard-scroll-gutters {
	display: block;
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
}
body.dashboard-app .command-locate-overlay .orbit-map-frame > .dashboard-scroll-gutters::before,
body.dashboard-app .command-locate-overlay .orbit-map-frame > .dashboard-scroll-gutters::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 40px;
	pointer-events: auto;
	touch-action: pan-y;
}
body.dashboard-app .command-locate-overlay .orbit-map-frame > .dashboard-scroll-gutters::before { left: 0; }
body.dashboard-app .command-locate-overlay .orbit-map-frame > .dashboard-scroll-gutters::after { right: 0; }
body.dashboard-app .command-locate-overlay .orbit-map-frame::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	height: 80px;
	padding: 0;
	z-index: 1;
	pointer-events: none;
}
body.dashboard-app .command-locate-overlay .orbit-map-frame::before { display: none; }
body.dashboard-app .command-locate-overlay .orbit-map-frame::after { bottom: 0; background: linear-gradient(transparent, #000); }

/* The arrival radar stays in the Locate popup's scrolling content. */
body.dashboard-app .command-locate-overlay .planet-radar-strip {
	box-sizing: border-box;
	flex: none;
	width: 100%;
	padding: 20px;
	background: #000;
}
body.dashboard-app .command-locate-overlay .planet-radar-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	aspect-ratio: 2 / 1;
	max-width: 100%;
	min-width: 0;
}
body.dashboard-app .command-locate-overlay .planet-radar-canvas {
	display: block;
	width: 100%;
	height: 100%;
	min-width: 0;
}
body.dashboard-app .command-locate-overlay .planet-radar-arrivals {
	display: grid;
	grid-template-rows: minmax(0, 1.6fr) repeat(2, minmax(0, 1fr));
	gap: 5px;
	box-sizing: border-box;
	container-type: size;
	min-width: 0;
	min-height: 0;
	padding-left: 20px;
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	min-width: 0;
	min-height: 0;
	padding: 0 10px 0 9px;
	overflow: hidden;
	border: 1px solid var(--command-border, #252729);
	border-radius: 0;
	background: #000;
	font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-variant-numeric: tabular-nums;
	transition: border-color .3s;
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival.is-orange { border-color: #5b260b; }
body.dashboard-app .command-locate-overlay .planet-radar-arrival.is-red {
	border-color: #5e0001;
	animation: planet-radar-red-border-breathe 2.4s ease-in-out infinite;
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival.is-visitor { border-color: #653945; }
@keyframes planet-radar-red-border-breathe {
	0%, 100% { border-color: #5e0001; }
	50% { border-color: #dd0002; }
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival-thumb {
	display: block;
	flex: none;
	aspect-ratio: 1;
	object-fit: contain;
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival-name,
body.dashboard-app .command-locate-overlay .planet-radar-arrival-countdown,
body.dashboard-app .command-locate-overlay .planet-radar-arrival-speed {
	min-width: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-weight: 400;
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival-name { color: var(--command-grey, #727578); line-height: 1.2; }
body.dashboard-app .command-locate-overlay .planet-radar-arrival-countdown { color: #ededed; line-height: 1.05; }
body.dashboard-app .command-locate-overlay .planet-radar-arrival-speed { color: var(--command-grey, #727578); line-height: 1.2; }
body.dashboard-app .command-locate-overlay .planet-radar-arrival-speed :is(i, .planet-radar-arrival-unit) { color: var(--command-grey, #727578); font-style: normal; }
body.dashboard-app .command-locate-overlay .planet-radar-arrival.is-orange :is(.planet-radar-arrival-name, .planet-radar-arrival-countdown, .planet-radar-arrival-speed, .planet-radar-arrival-unit) { color: #f76019; }
body.dashboard-app .command-locate-overlay .planet-radar-arrival.is-red :is(.planet-radar-arrival-name, .planet-radar-arrival-countdown, .planet-radar-arrival-speed, .planet-radar-arrival-unit) { color: #dd0002; }
body.dashboard-app .command-locate-overlay .planet-radar-arrival.is-visitor :is(.planet-radar-arrival-name, .planet-radar-arrival-countdown, .planet-radar-arrival-speed, .planet-radar-arrival-unit) { color: #f793ab; }
body.dashboard-app .command-locate-overlay .planet-radar-arrival:first-child {
	justify-content: flex-start;
	gap: 10px;
	padding-block: 10px;
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival:first-child .planet-radar-arrival-thumb { height: min(100%, 22cqh); }
body.dashboard-app .command-locate-overlay .planet-radar-arrival:first-child .planet-radar-arrival-details {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival:first-child .planet-radar-arrival-name,
body.dashboard-app .command-locate-overlay .planet-radar-arrival:first-child .planet-radar-arrival-speed { font-size: max(10px, min(6.5cqw, 6.5cqh)); }
body.dashboard-app .command-locate-overlay .planet-radar-arrival:first-child .planet-radar-arrival-countdown {
	margin-block: 1px;
	font-size: min(12cqw, 11.5cqh);
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival:not(:first-child) { gap: 8px; }
body.dashboard-app .command-locate-overlay .planet-radar-arrival:not(:first-child) .planet-radar-arrival-thumb { height: min(60%, 12.5cqh); }
body.dashboard-app .command-locate-overlay .planet-radar-arrival:not(:first-child) .planet-radar-arrival-name {
	flex: 1;
	font-size: max(10px, min(6.5cqw, 7cqh));
}
body.dashboard-app .command-locate-overlay .planet-radar-arrival:not(:first-child) .planet-radar-arrival-countdown { font-size: max(11px, min(8.5cqw, 9cqh)); }
@media (min-width: 801px) {
	body.dashboard-app .command-locate-overlay .orbit-map-owner-filter {
		top: 20px;
		left: 20px;
		right: 20px;
	}
	body.dashboard-app .command-locate-overlay .orbit-map-tooltip-stack.orbit-map-selected-card {
		bottom: 20px;
		left: 20px;
	}
	body.dashboard-app .popup-overlay.command-locate-overlay .popup-content {
		width: min(1120px, 100%, calc(200dvh - 166px));
		height: auto;
	}
	body.dashboard-app .popup-overlay.command-locate-overlay .popup-card { flex: none; }
	body.dashboard-app .command-locate-overlay .command-locate-content {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		flex: none;
		aspect-ratio: 2 / 1;
		height: auto;
		min-height: 0;
	}
	body.dashboard-app .command-locate-overlay .command-locate-content > .orbit-map {
		width: 100%;
		height: 100%;
		min-width: 0;
	}
	body.dashboard-app .command-locate-overlay .orbit-map-frame::after {
		inset: 0;
		height: auto;
		background: linear-gradient(to left, #000, transparent 80px);
	}
	body.dashboard-app .command-locate-overlay .planet-radar-strip {
		width: 100%;
		height: 100%;
		padding: 20px;
	}
	body.dashboard-app .command-locate-overlay .planet-radar-inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 40px;
		/* Let the square radar set the row height. The gap reduces each
		   column's width, so the base 2:1 ratio would stretch the boxes. */
		aspect-ratio: auto;
	}
	body.dashboard-app .command-locate-overlay .planet-radar-canvas {
		aspect-ratio: 1;
		height: auto;
		align-self: start;
	}
	/* The outer 4,000 km ring is inset 4px from each canvas edge. */
	body.dashboard-app .command-locate-overlay .planet-radar-arrivals {
		height: calc(100% - 8px);
		align-self: center;
		padding-left: 0;
	}
	body.dashboard-app .command-locate-overlay .planet-radar-arrival:first-child :is(.planet-radar-arrival-name, .planet-radar-arrival-speed) { font-size: 12px; }
	body.dashboard-app .command-locate-overlay .planet-radar-arrival:first-child .planet-radar-arrival-countdown { font-size: 22px; }
	body.dashboard-app .command-locate-overlay .planet-radar-arrival:not(:first-child) .planet-radar-arrival-name { font-size: 11px; }
	body.dashboard-app .command-locate-overlay .planet-radar-arrival:not(:first-child) .planet-radar-arrival-countdown { font-size: 15px; }
}
@media (max-width: 800px) {
	/* Keep the map at least square; on tall screens it fills the space above
	   the radar. Short screens scroll through the existing map-side gutters. */
	body.dashboard-app .popup-overlay.command-locate-overlay {
		height: 100dvh;
	}
	body.dashboard-app .command-locate-overlay .command-locate-content {
		flex: none;
		height: auto;
		min-height: 0;
	}
	body.dashboard-app .command-locate-overlay .command-locate-content > .orbit-map {
		flex: none;
		min-height: 0;
		height: max(min(calc(100vw - 22px), 598px), calc(100vh - min(50vw, 310px) - 94px));
		height: max(min(calc(100vw - 22px), 598px), calc(100dvh - min(50vw, 310px) - 94px));
	}
	body.dashboard-app .command-locate-overlay .planet-radar-arrival:not(:first-child) .planet-radar-arrival-name {
		display: flex;
		flex-direction: column;
		justify-content: center;
		white-space: normal;
		line-height: 1.15;
	}
}
/* Comms retains its desktop group next to the Planet. Its feed owns padding. */
body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .dashboard-detail-left { display: none; }
body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] :is([data-box="messages"] > .card-box-content, [data-message-planet], .pm-history) {
 box-sizing: border-box;
 min-width: 0;
 min-height: 0;
 margin: 0;
 padding: 0;
 overflow: hidden;
}
body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] [data-message-planet] { position: relative; }
@media (min-width: 801px) {
 /* Artwork has a 20px bottom bar inset; groups begin 20px below its top. */
 body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] [data-box="messages"] {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  height: max(0px, calc(var(--detail-canvas-height, 500px) - 40px));
  min-height: 0;
  margin-bottom: 0;
 }
 body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] [data-box="messages"] > .card-box-header { flex: none; }
 body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] :is([data-box="messages"] > .card-box-content, [data-message-planet], .pm-history) {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
 }
 body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .pm-feed { max-height: none; flex: 1 1 auto; min-height: 0; }
 body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .pm-transmission-mode.pm-transmitting { min-height: 0; }
}
@media (max-width: 800px) {
 body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] :is(.dashboard-detail-columns, .dashboard-detail-right, [data-box="messages"], [data-box="messages"] > .card-box-content, [data-message-planet], .pm-history) {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
 }
 body.dashboard-app .dashboard-detail-tabbed [data-tab-section="messages"] .pm-feed { max-height: none; flex: 1 1 auto; min-height: 0; }
}
