/* Visibility Dash critical UI guard. A stylesheet of its own, versioned on its own mtime, so a cached admin.css cannot degrade card layout. */
.ai-o-optimiser-wrap .ai-o-optimiser-visibility-tabs {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	margin: 18px 0 14px !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-visibility-tabs a {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 9px 14px !important;
	border: 1px solid #dbe3ef !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: #334155 !important;
	font-weight: 750 !important;
	text-decoration: none !important;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-visibility-tabs a.is-active,
.ai-o-optimiser-wrap .ai-o-optimiser-visibility-tabs a:hover {
	background: #111827 !important;
	border-color: #111827 !important;
	color: #fff !important;
}

/* ---- 1. Single Row Grid for Overview Cards ---- */
.ai-o-optimiser-wrap #ai-o-optimiser-visibility-overview.ai-o-optimiser-visibility-summary-grid {
	display: grid !important;
	grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
	gap: 12px !important;
	width: 100% !important;
	margin: 16px 0 22px !important;
	box-sizing: border-box !important;
}
.ai-o-optimiser-wrap #ai-o-optimiser-visibility-overview.ai-o-optimiser-visibility-summary-grid > .ai-o-optimiser-card {
	display: flex !important;
	flex-direction: column !important;
	justify-content: space-between !important;
	margin: 0 !important;
	padding: 14px !important;
	min-height: 110px !important;
	box-sizing: border-box !important;
}

/* ---- 2. AI Brands Premium Cards ---- */
.ai-o-optimiser-wrap .ai-o-optimiser-brand-section {
	margin: 24px 0 !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-section-heading-row,
.ai-o-optimiser-wrap .ai-o-optimiser-brand-section > h2 {
	margin-bottom: 12px !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-top-grid {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 18px !important;
	margin-bottom: 24px !important;
	align-items: stretch !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-next-grid {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 14px !important;
	align-items: stretch !important;
}
@media (min-width: 1600px) {
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-next-grid {
		grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
	}
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card {
	display: flex !important;
	flex-direction: column !important;
	gap: 14px !important;
	position: relative !important;
	overflow: hidden !important;
	min-width: 0 !important;
	padding: 20px !important;
	border: 1px solid #dfe7f2 !important;
	border-radius: 22px !important;
	background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
	box-shadow: 0 18px 45px rgba(15, 23, 42, .08), 0 2px 6px rgba(15, 23, 42, .04) !important;
	color: #0f172a !important;
	isolation: isolate !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card::before {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	z-index: -1 !important;
	background: radial-gradient(circle at top right, rgba(56,88,233,.17), transparent 36%), linear-gradient(135deg, rgba(255,255,255,.88), rgba(255,255,255,0)) !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 auto 0 0 !important;
	width: 5px !important;
	background: linear-gradient(180deg, #3858e9, #06b6d4) !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-small {
	padding: 16px !important;
	border-radius: 18px !important;
	gap: 12px !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-head {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 14px !important;
	margin: 0 !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-logo {
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	min-width: 150px !important;
	max-width: 190px !important;
	padding: 7px 10px 7px 7px !important;
	border: 1px solid rgba(15, 23, 42, .08) !important;
	border-radius: 18px !important;
	background: rgba(255,255,255,.82) !important;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 10px 22px rgba(15, 23, 42, .07) !important;
	flex: 0 0 auto !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-small .ai-o-optimiser-brand-logo {
	min-width: 0 !important;
	max-width: 100% !important;
	padding: 5px 8px 5px 5px !important;
	border-radius: 14px !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 46px !important;
	height: 46px !important;
	border-radius: 15px !important;
	background: linear-gradient(135deg, #111827, #3858e9) !important;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.26), 0 11px 22px rgba(56, 88, 233, .22) !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	letter-spacing: -.03em !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-small .ai-o-optimiser-brand-mark {
	width: 36px !important;
	height: 36px !important;
	border-radius: 12px !important;
	font-size: 12px !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-anthropic { background: linear-gradient(135deg, #7c2d12, #f97316) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-openai { background: linear-gradient(135deg, #111827, #10b981) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-perplexity { background: linear-gradient(135deg, #0f766e, #22d3ee) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-google { background: linear-gradient(135deg, #1d4ed8, #f59e0b) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-microsoft { background: linear-gradient(135deg, #2563eb, #7c3aed) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-meta { background: linear-gradient(135deg, #1d4ed8, #06b6d4) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-amazon { background: linear-gradient(135deg, #0f172a, #f59e0b) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-bytedance { background: linear-gradient(135deg, #be123c, #111827) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-commoncrawl { background: linear-gradient(135deg, #4338ca, #0284c7) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-cohere { background: linear-gradient(135deg, #7c3aed, #db2777) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mark-duckduckgo { background: linear-gradient(135deg, #c2410c, #f97316) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-logo-name {
	display: block !important;
	min-width: 0 !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
	color: #111827 !important;
	font-size: 13px !important;
	font-weight: 850 !important;
	letter-spacing: -.02em !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-small .ai-o-optimiser-brand-logo-name { font-size: 12px !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-title-block {
	min-width: 0 !important;
	text-align: right !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-title-block h3 {
	margin: 5px 0 2px !important;
	font-size: 18px !important;
	line-height: 1.15 !important;
	letter-spacing: -.02em !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-small .ai-o-optimiser-brand-title-block h3 {
	font-size: 14px !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-title-block > span:not(.ai-o-optimiser-brand-rank) {
	color: #64748b !important;
	font-size: 11px !important;
	font-weight: 700 !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-rank {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 34px !important;
	height: 22px !important;
	padding: 0 8px !important;
	border-radius: 999px !important;
	background: #eef2ff !important;
	border: 1px solid #c7d2fe !important;
	color: #3730a3 !important;
	font-size: 11px !important;
	font-weight: 900 !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-primary-metric {
	display: flex !important;
	align-items: flex-end !important;
	justify-content: space-between !important;
	gap: 12px !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-primary-metric strong {
	display: block !important;
	font-size: 42px !important;
	line-height: .92 !important;
	letter-spacing: -.055em !important;
	color: #0f172a !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-small .ai-o-optimiser-brand-primary-metric strong { font-size: 28px !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-primary-metric span,
.ai-o-optimiser-wrap .ai-o-optimiser-brand-crawler-share {
	color: #64748b !important;
	font-size: 11px !important;
	font-weight: 750 !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-crawler-share {
	display: inline-flex !important;
	align-items: center !important;
	padding: 6px 8px !important;
	border-radius: 999px !important;
	background: #ecfdf5 !important;
	color: #047857 !important;
	white-space: nowrap !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mini-stats,
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-summary {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: 8px !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-summary { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mini-stats > span,
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-summary > span {
	display: flex !important;
	flex-direction: column !important;
	gap: 2px !important;
	min-width: 0 !important;
	padding: 10px 9px !important;
	border: 1px solid rgba(15, 23, 42, .07) !important;
	border-radius: 13px !important;
	background: rgba(255,255,255,.76) !important;
	color: #64748b !important;
	font-size: 10px !important;
	font-weight: 800 !important;
	text-transform: uppercase !important;
	letter-spacing: .04em !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-mini-stats b,
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-summary strong {
	color: #0f172a !important;
	font-size: 17px !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	letter-spacing: -.02em !important;
	text-transform: none !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-footnote {
	display: grid !important;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, .9fr) !important;
	gap: 10px !important;
	margin-top: auto !important;
	padding-top: 12px !important;
	border-top: 1px solid rgba(15, 23, 42, .08) !important;
	color: #64748b !important;
	font-size: 11px !important;
	line-height: 1.35 !important;
}
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-small .ai-o-optimiser-brand-card-summary { display: none !important; }
.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-small .ai-o-optimiser-brand-footnote {
	grid-template-columns: 1fr !important;
	font-size: 10px !important;
}

/* ---- 3. Responsive Adaptations ---- */
@media (max-width: 1200px) {
	.ai-o-optimiser-wrap #ai-o-optimiser-visibility-overview.ai-o-optimiser-visibility-summary-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-top-grid,
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-next-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 782px) {
	.ai-o-optimiser-wrap #ai-o-optimiser-visibility-overview.ai-o-optimiser-visibility-summary-grid,
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-top-grid,
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-next-grid,
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-mini-stats,
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-summary,
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-footnote {
		grid-template-columns: 1fr !important;
	}
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-card-head,
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-primary-metric {
		align-items: flex-start !important;
		flex-direction: column !important;
	}
	.ai-o-optimiser-wrap .ai-o-optimiser-brand-title-block { text-align: left !important; }
}
