/* Command-only palette. Load after the layout styles; the Marketplace copy stays intact. */
.dashboard-app {
	--command-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--command-border: #252729;
	--command-grey: #727578;
	--command-disabled: #414447;
	--command-bg-dark: #171718;
	--command-bg-light: #222324;
	--command-bg-hover: #2c2e30;
}

/* Native UI typography, including controls with their own base font rules. */
body.dashboard-app,
body.dashboard-app :is(input, button, textarea, select) {
	font-family: var(--command-font-family);
}

/* The avatar fills a 25px badge's 23px interior without vertical padding. */
body.dashboard-app .dashboard-owner-badge {
	box-sizing: border-box;
	padding: 0 10px 0 0;
}
body.dashboard-app .dashboard-owner-badge :is(.project-owner-username, .project-owner-address) {
	grid-template-columns: 23px minmax(0, 1fr);
	height: 23px;
}
body.dashboard-app .dashboard-owner-badge :is(.project-owner-username > img, .project-owner-wallet) {
	width: 23px;
	height: 23px;
	object-fit: cover;
}
body.dashboard-app .dashboard-resource-dots { gap: 5px; }

/* Navbar, card and popup titles share one size; subtitles keep their own rules. */
body.dashboard-app :is(.sub .command-home-title, .dashboard-single-header .card-view-name,
	.card-view-overlay .card-view-name, .popup-title, .popup-title-text) {
	font-size: var(--font-xl);
	font-weight: 500;
	line-height: 1.25;
}
/* Planet identity shares the header's 40px control row. */
body.dashboard-app .dashboard-header-identity {
	flex-direction: row;
	align-items: center;
	gap: 10px;
	min-width: 0;
}
body.dashboard-app .dashboard-header-thumbnail {
	display: block;
	box-sizing: border-box;
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	border: 1px solid var(--command-border);
	border-radius: 50%;
	object-fit: cover;
}
body.dashboard-app .dashboard-header-text {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
	height: 40px;
}
body.dashboard-app .dashboard-header-identity .card-view-title-name-row { height: auto; min-height: 18px; }
body.dashboard-app .dashboard-header-text > .dashboard-header-code {
	flex: none;
	max-width: 100%;
	min-width: 0;
	color: var(--command-grey);
	font-size: var(--font-md);
	font-weight: 400;
	line-height: 16px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
@media (max-width: 800px) {
	body.dashboard-app :is(.sub .command-home-title, .dashboard-single-header .card-view-name,
		.card-view-overlay .card-view-name, .popup-title, .popup-title-text) { font-size: var(--font-lg); }
}

/* Explicit UI surfaces, not artwork, resource palettes or green progress tracks.
   Border colors are authoritative; widths and transparent/absent borders stay as-is. */
body.dashboard-app :is(
	header, .sub, .filters-header, .search-menu, .create-offer-search-menu,
	.search-results, .search-results-group, .search-results-info,
	.collection-card, .collections-card, .owner-card-stat, .owner-og-stat, .owner-og-stat-item,
	.card-view, .card-view-scroll, .card-view-top, .popup-top, .popup-card, .popup-footer,
	.card-box, .card-box-header, .trait-box, .trait-boxes-resources,
	.dashboard-single-header, .dashboard-panel-close, .dashboard-tabs-footer, .dashboard-detail-tab,
	.dashboard-owner-badge, .project-owner-address, .project-owner-username, .project-owner-xlink a,
	.command-nav-account, .command-nav-menu, .command-nav-item, .command-nav-address,
	.planet-resource-row, .planet-resource-structure, .planet-resource-settings,
	.planet-civilian-action, .planet-game-slot, .planet-game-more, .planet-game-preview > .planet-game-grid,
	.dashboard-resource-image, .dashboard-resource-dot,
	.orbit-map-tooltip, .pm-planet-thumb,
	.pm-send-section, .pm-entry, .pm-compose-launch,
	.filter-button, .close-filters, .reset-filters, .sort-button, .sort-options, .sort-order, .sort-option,
	.reset-button, .active-filter-tag, .grid-toggle, .share-button, .copylink, .popup-close,
	.collection-menu-item, .collection-menu-item-content,
	.price-filter-input, .collections-price-filter-input, .address-filter,
	.wallet-filter-button, .wallet-filter-option, .fee-rate-button, .fee-rate-option,
	.current-item, .create-offer-selectable-items, .create-offer-selectable-item,
	.create-offer-search-results, .create-offer-search-result-info,
	.create-offer-section, .create-offer-tag, .create-offer-trait-mode-tab, .create-offer-trait-groups,
	.create-offer-duration-button, .create-offer-duration,
	.detail-list, .detail-row, .detail-parent, .detail-child,
	.notification-item, .status-message, .collection-extra-note
) { border-color: var(--command-border) !important; }

/* Header circles use a pseudo-element so their larger hit areas remain unchanged. */
.dashboard-app :is(.dashboard-detail-action, .expand-content, .card-view-close) {
	--detail-action-border: var(--command-border);
}
.dashboard-app .planet-game-count-ring:not([data-full]) { --linked-track: var(--command-border); }
/* Selected map planets receive a semantic green/grey border inline. */
body.dashboard-app .orbit-map-tooltip-thumb { border-color: var(--command-border); }

/* All neutral copy uses one grey; primary white and semantic colored copy are excluded. */
body.dashboard-app :is(
	p, .currency, .title-sub, .connect-menu, .notification-collection, .notification-tx,
	.notification-status, .more-activities, .search-desc, .search-results-wallet,
	.search-results-creator, .search-results-meta, .search-results-empty, .search-results-item-collection,
	.collection-menu-item-value, .filters-title-sub, .sort-order, .sort-option,
	.trait-group-title, .trait-main label, .sub-trait-header, .trait-option label,
	.showing, .item-rarity, .item-collection-name, .item-stat-title, .item-stat-value,
	.overview-header-title, .overview-header-chevron, .overview-header-stat,
	.project-stat-title, .project-stat-sub, .holding-days, .project-owner-activity,
	.project-owner-transfer, .owner-card-rank, .owner-card-stat-title, .owner-card-stat-value, .owner-card-total,
	.owner-og-stat-title, .owner-og-stat-item, .card-box-count, .trait-box-title,
	.popup-title .popup-desc, .fee-row-label, .fee-rate-free, .fee-rate-button-value, .fee-rate-value, .fee-rate-chevron,
	.fee-rate-option, .fee-rate-option-value, .current-item-collection, .current-item-trait-floor,
	.wallet-filter-option, .wallet-filter-option-value, .no-wallet-desc, .wallet-connect-user,
	.maintenance-desc, .partnerships-title, .create-offer-empty, .create-offer-items-loading,
	.create-offer-selectable-item, .create-offer-search-result-creator, .create-offer-trait-card-title-optional,
	.create-offer-user-collection, .create-offer-duration-desc, .create-offer-funds-desc,
	.detail-label, .detail-child-more, .card-view-collection, .collection-description-text,
	.collection-description-full, .no-data, .planet-resource-indicator, .planet-game-empty,
	.planet-picker-assignment, .planet-status-label, .planet-status-icon,
	.command-nav-username, .command-nav-address, .command-nav-avatar, .command-top-avatar,
	.pm-empty, .pm-meta, .pm-direction, .pm-route, .pm-replying, .pm-notice
) { color: var(--command-grey); }
body.dashboard-app :is(input, textarea)::placeholder { color: var(--command-grey); opacity: 1; }

/* Keep interaction colors separate so hover, selection, and disabled states survive. */
body.dashboard-app :is(
	.search-control, .search-close, .create-offer-search-control, .create-offer-search-clear,
	.orbit-map-expand, .planet-resource-settings, .planet-civilian-action.is-edit,
	.popup-close, .dashboard-panel-close, .dashboard-detail-action, .expand-content, .card-view-close,
	.dashboard-detail-tab, .command-nav-disconnect, .pm-x, .pm-link, .pm-planet,
	.onchain-link, .detail-copy, .project-owner-xlink a, .copylink,
	.reset-button, .active-filter-tag, .reset-filters, .open-card-view
) { color: var(--command-grey); }
body.dashboard-app .planet-game-grid .planet-civilian-action.is-edit,
body.dashboard-app .dashboard-card-overlay .card-view-top > :is(.dashboard-detail-action, .expand-content, .card-view-close),
body.dashboard-app .dashboard-detail-tools > .dashboard-detail-action { color: var(--command-grey); }
body.dashboard-app > header .command-top-tabs :is(.command-top-tab, #searchButton),
body.dashboard-app #navOverlay :is(.command-nav-item, .command-nav-social a) { color: var(--command-grey); }
body.dashboard-app > header #navBtn .hamburger-inner,
body.dashboard-app > header #navBtn .hamburger-inner::before,
body.dashboard-app > header #navBtn .hamburger-inner::after { background-color: var(--command-grey); }

/* Dark surfaces and lighter grey buttons are intentionally different. */
body.dashboard-app :is(.search-results-wallet, .search-results-item-image,
	.project-owner-wallet, .wallet-connect-profile-wallet, .create-offer-user-btc-image) { background-color: var(--command-bg-dark); }
body.dashboard-app .pm-bubble { background-color: #2b2d38; }
body.dashboard-app .pm-msg.right .pm-bubble { background-color: #464b5a; }
body.dashboard-app .pm-msg.left .pm-meta { color: #a3a5b3; }
body.dashboard-app .pm-msg.right .pm-meta { color: #a3a5b3; }
body.dashboard-app .pm-meta .pm-x { color: inherit; }
body.dashboard-app .pm-meta .pm-x:hover { color: #fff; }
body.dashboard-app :is(.title-cover-wallet, .owner-card-wallet, .owner-card-icon) { background-color: var(--command-bg-light); }
/* Six rarity tiers, ordered common to rarest so cumulative classes cascade. */
body.dashboard-app :is(.trait-option-count, .create-offer-trait-option-count) { background-color: #464b5a; }
body.dashboard-app .uncommon-trait { background-color: #0068cf; }
body.dashboard-app .rare-trait { background-color: #b00050; }
body.dashboard-app .super-rare-trait { background-color: #f76019; }
body.dashboard-app .ultra-rare-trait { background-color: #b28b47; }
body.dashboard-app .one-one-trait { background-color: #6700ff; }
body.dashboard-app .trait-box-perc { color: #464b5a; }
body.dashboard-app .perc-uncommon-trait { color: #0068cf; }
body.dashboard-app .perc-rare-trait { color: #b00050; }
body.dashboard-app .perc-super-rare-trait { color: #f76019; }
body.dashboard-app .perc-ultra-rare-trait { color: #b28b47; }
body.dashboard-app .perc-one-one-trait { color: #6700ff; }
body.dashboard-app .trait-option-count { border-radius: 999px; }
body.dashboard-app :is(.create-offer-selectable-check, .instant-sell-item-check) i { color: var(--command-bg-light); }
body.dashboard-app :is(.create-offer-selectable-item, .instant-sell-item).selected :is(.create-offer-selectable-check, .instant-sell-item-check) i { color: #5acc77; }
body.dashboard-app .pm-progress { background-color: var(--command-border); }
body.dashboard-app ::-webkit-scrollbar-thumb { background-color: var(--command-bg-light); }

/* Wide controls only: no nav hit areas, icon circles, owner badges, resource
   squares, filter tags, or message delete/planet buttons are resized here. */
body.dashboard-app .action,
body.dashboard-app :is(.download-button, .link-x) > a {
	box-sizing: border-box;
	height: 40px;
	min-height: 40px;
	padding-left: 20px;
	padding-right: 20px;
	--command-action-background: var(--command-bg-light);
	--command-action-hover: var(--command-bg-hover);
	background-color: var(--command-action-background) !important;
}
body.dashboard-app :is(.download-button, .link-x) > a,
body.dashboard-app :is(.download-button, .link-x) > a i { line-height: 40px; }
body.dashboard-app .action:is(.confirm-button, .connect-button, .pm-send, .buy-button,
	.list-button, .change-button, .accept-button, .cart-button, .make-offer-button,
	.create-listing-button, .update-listing-button, .collection-offer-button),
body.dashboard-app .recommended-button > a {
	--command-action-background: #5acc77;
	--command-action-hover: #76df91;
	color: #000;
}

/* Rounded search fields are 40px including their 1px border. The header search
   is borderless and its 60px navbar remains governed by the layout stylesheet. */
body.dashboard-app :is(.search-menu, .create-offer-search-menu) {
	box-sizing: border-box;
	height: 40px;
	min-height: 40px;
}
body.dashboard-app :is(.search-menu, .create-offer-search-menu) :is(
	.search-input, .search-control, .search-close,
	.create-offer-search-input, .create-offer-search-control, .create-offer-search-clear
) { box-sizing: border-box; height: 38px; line-height: 38px; }
body.dashboard-app :is(.search-menu, .create-offer-search-menu) :is(
	.search-control, .search-close, .create-offer-search-control, .create-offer-search-clear
) i { line-height: 38px; }
body.dashboard-app :is(.price-filter-input, .collections-price-filter-input,
	.offer-price-input, .activity-price-input, .fee-custom-value,
	.listing-menu input[type="number"], .batch-listing-menu input[type="number"],
	.create-offer-inputs input[type="number"]
) { box-sizing: border-box; height: 40px; border-color: var(--command-border); }

@media (hover: hover) and (pointer: fine) {
	body.dashboard-app .action:not(:disabled):not([aria-disabled="true"]):hover,
	body.dashboard-app :is(.download-button, .link-x) > a:hover { background-color: var(--command-action-hover) !important; }
	body.dashboard-app :is(.owner-card-icon, .search-results-item-image,
		.create-offer-search-result):hover { background-color: var(--command-bg-hover); }
	body.dashboard-app .command-search-overlay .search-results-row:hover { background-color: var(--command-bg-light); }
	body.dashboard-app :is(.search-close, .create-offer-search-clear, .popup-close,
		.dashboard-panel-close, .dashboard-detail-action, .expand-content, .card-view-close,
		.dashboard-detail-tab, .command-nav-disconnect, .pm-x, .pm-link, .pm-planet,
		.onchain-link, .detail-copy, .project-owner-xlink a, .copylink, .sort-option, .sort-order,
		.reset-button, .active-filter-tag,
		.wallet-filter-option, .fee-rate-option):not(:disabled):hover { color: #fff; }
	body.dashboard-app > header .command-top-tabs :is(.command-top-tab, #searchButton):hover,
	body.dashboard-app #navOverlay :is(.command-nav-item, .command-nav-social a):hover { color: #fff; }
	body.dashboard-app > header #navBtn:hover .hamburger-inner,
	body.dashboard-app > header #navBtn:hover .hamburger-inner::before,
	body.dashboard-app > header #navBtn:hover .hamburger-inner::after { background-color: #fff; }
	body.dashboard-app :is(.filter-button, .close-filters, .sort-button, .popup-close,
		.reset-button, .active-filter-tag, .copylink, .owner-card-stat, .project-owner-xlink a,
		.wallet-filter-button, .fee-rate-button):not(:disabled):hover { border-color: #fff !important; }
	body.dashboard-app :is(.dashboard-detail-action, .expand-content, .card-view-close):hover { --detail-action-border: #fff; }
	body.dashboard-app .orbit-map-tooltip:hover .orbit-map-expand,
	body.dashboard-app .planet-resource-structure:not(:disabled):hover .planet-resource-settings,
	body.dashboard-app .planet-game-grid .planet-civilian-action.is-edit:not(:disabled):hover { color: #fff; }
}
@media (min-width: 801px) and (hover: hover) and (pointer: fine) {
	body.dashboard-app .trait-box:hover { border-color: #fff !important; }
}

/* Semantic active states are never flattened into the neutral palette. */
body.dashboard-app .dashboard-detail-tab[aria-selected="true"] { color: #fff; border-bottom-color: #5acc77 !important; }
body.dashboard-app .dashboard-tabs-footer .dashboard-detail-tab[aria-selected="true"] { border-top-color: #5acc77 !important; }
body.dashboard-app .collection-menu-item-active,
body.dashboard-app .collection-menu-item-active .collection-menu-item-content { border-bottom-color: #5acc77 !important; }
body.dashboard-app .address-filter-active { border-color: #fff !important; }
body.dashboard-app :is(.project-stat-pending, .project-stat-percentage-up, .project-stat-percentage-down,
	.project-buyer .project-owner-transfer, .project-seller .project-owner-transfer) { color: #5acc77; }

/* Disabled buttons use explicit colors, rather than opacity that also dims art. */
body.dashboard-app :is(button:disabled, [role="button"][aria-disabled="true"],
	.action[aria-disabled="true"], .count-disabled) { color: var(--command-disabled) !important; }
body.dashboard-app :is(.action:disabled, .action[aria-disabled="true"], .count-disabled) {
	--command-action-background: var(--command-bg-dark);
	--command-action-hover: var(--command-bg-dark);
	background-color: var(--command-bg-dark) !important;
	color: var(--command-disabled) !important;
	opacity: 1;
}
