/* Charte commune Joris : navigation, données et surfaces partagées. */
html {
	background: var(--color-bg);
	scrollbar-color: var(--color-border-strong) var(--color-bg);
}
body,
.site-app {
	background: var(--color-bg);
	color: var(--color-text);
}
/* Deux nappes fixes au viewport, sous le contenu et sans interception. */
body {
	isolation: isolate;
}
body::before,
body::after {
	content: "";
	position: fixed;
	inset: var(--hub-ambient-overscan);
	z-index: -1;
	pointer-events: none;
	background-repeat: no-repeat;
	transition: translate var(--hub-light-response) ease-out;
}
body::before {
	background-image: var(--hub-ambient-blue);
	translate: calc(var(--hub-pointer-x, 0) * var(--hub-light-parallax)) calc(var(--hub-pointer-y, 0) * var(--hub-light-parallax));
	animation: hub-ambient-drift var(--hub-ambient-duration) ease-in-out infinite alternate;
}
body::after {
	background-image: var(--hub-ambient-warm);
	translate: calc(var(--hub-pointer-x, 0) * var(--hub-light-parallax) * -1) calc(var(--hub-pointer-y, 0) * var(--hub-light-parallax) * -1);
	animation: hub-ambient-drift var(--hub-ambient-duration-secondary) ease-in-out infinite alternate-reverse;
}
@keyframes hub-ambient-drift {
	from { transform: translate(0, 0); }
	to { transform: translate(var(--hub-ambient-drift-x), var(--hub-ambient-drift-y)); }
}
::selection {
	background: var(--color-accent-glow);
	color: var(--color-text);
}
:focus-visible {
	outline: var(--focus-ring-width) solid var(--color-cyan);
	outline-offset: var(--focus-ring-offset);
}
input,
select,
textarea {
	color-scheme: dark;
	caret-color: var(--color-cyan);
}
input::placeholder,
textarea::placeholder {
	color: var(--color-text-soft);
	opacity: 1;
}
option {
	color: var(--color-text);
	background: var(--color-surface);
}
[hidden] {
	display: none !important;
}
/* Même repère extérieur sur toutes les rubriques, y compris le dashboard. */
.hub-shell,
.dashboard-page .hub-shell {
	max-width: none;
	margin-inline: 0;
	padding: var(--hub-shell-inset);
	gap: var(--hub-shell-gap);
}
.hub-workspace,
.dashboard-page .hub-workspace {
	width: 100%;
	max-width: none;
	margin-inline: 0;
	padding-inline: 0;
}
.hub-sidebar {
	top: var(--hub-shell-inset);
	height: calc(100dvh - var(--hub-shell-inset) * 2);
}
.hub-sidebar--v42 {
	background: var(--color-bg-subtle);
	border: 1px solid var(--color-border);
	box-shadow: none;
}
.hub-sidebar--v42 .hub-brand {
	gap: var(--space-3);
	padding: var(--space-2);
	margin-bottom: var(--space-5);
}
.hub-sidebar--v42 .hub-brand img {
	width: var(--hub-logo-size);
	height: var(--hub-logo-size);
	border-radius: var(--radius-full);
}
.hub-brand strong {
	color: var(--color-text);
}
.hub-brand small {
	display: block;
	font-size: var(--text-xs);
	font-weight: var(--weight-regular);
	letter-spacing: normal;
	color: var(--color-text-muted);
	margin-top: var(--space-1);
}
.hub-site-card {
	background: var(--hub-card-gradient);
	box-shadow: none;
	border-color: var(--color-border);
}
.hub-site-card::before {
	background: var(--hub-chart-gradient);
	height: var(--focus-ring-width);
}
.hub-site-card__controls {
	background: var(--color-bg-subtle);
}
.hub-site-card__copy strong {
	color: var(--color-text);
}
.hub-site-card__home {
	background: var(--color-info-soft);
	color: var(--color-cyan);
}
.hub-site-card__actions .hub-site-action--sync {
	color: var(--color-text-inverse);
	background: var(--color-action-gradient);
	border-color: transparent;
}
.hub-sidebar--v42 .hub-nav--v42 > a[aria-current="page"],
.hub-sidebar--v42 .hub-tools--v42 > a[aria-current="page"] {
	background: var(--hub-active-gradient);
	color: var(--color-cyan);
}
.hub-sidebar--v42 .hub-tools--v42 > summary:hover,
.hub-sidebar--v42 .hub-nav--v42 > a:hover {
	background: var(--color-accent-subtle);
}
.hub-sidebar--v42 .hub-footer-brand {
	color: var(--color-text-muted);
}
.hub-topbar {
	background: var(--color-bg-subtle);
	border: 1px solid var(--color-border);
	box-shadow: none;
}
.hub-workspace {
	padding-top: var(--space-4);
}
.hub-workspace--unified {
	background: transparent;
}
.hub-workspace h1 {
	font-size: var(--text-3xl);
	letter-spacing: -0.03em;
	text-wrap: balance;
}
.hub-workspace h2 {
	letter-spacing: -0.015em;
	text-wrap: balance;
}
.hub-workspace h3 {
	letter-spacing: -0.01em;
}
.card,
.stat,
.v4-panel,
.v4-metric,
.dash-card,
.dash-metric,
.dash-summary-tile,
.ar-board-page .ar-card,
.hub-sites .hub-site-card {
	background: var(--hub-card-gradient);
	border: 1px solid var(--color-border);
	box-shadow: none;
}
/* La lumière du fond traverse les panneaux, jamais le texte ni les contrôles. */
.dashboard-page .dash-panel,
.hub-product .ed-header,
.hub-product .ed-planning,
.hub-product .ed-published {
	background: var(--hub-card-gradient);
}
.hub-product .ed-table-head,
.hub-product .ed-online-head,
.hub-product .ed-online-head-v2 {
	background: transparent;
}
.card:hover,
.ar-board-page .ar-card:hover {
	border-color: var(--color-border-strong);
}
.stat__value,
.v4-metric strong,
.dash-metric-value {
	font-variant-numeric: tabular-nums;
	letter-spacing: -0.03em;
}
.stat::before,
.stat::after {
	display: none;
}
.stat {
	padding: var(--space-5);
}
.stat__label {
	color: var(--color-text-muted);
	text-transform: none;
	letter-spacing: normal;
}
.btn--primary,
.v4-button {
	color: var(--color-text-inverse);
	background: var(--color-action-gradient);
	border-color: transparent;
	box-shadow: none;
}
.btn--primary:hover,
.v4-button:hover {
	color: var(--color-text-inverse);
	background: var(--hub-button-hover);
}
button:disabled,
.btn[disabled] {
	transform: none;
}
.ar-board-page button.ar-type[aria-pressed="true"] {
	color: var(--color-cyan);
	background: var(--hub-active-gradient);
	border-color: var(--color-border-strong);
}
.ar-workbench .aw-stages a[aria-selected="true"] {
	color: var(--color-cyan);
	background: var(--hub-active-gradient);
	border-color: var(--color-border-strong);
}
.ar-workbench .aw-query dd {
	color: var(--color-text);
}
.ar-workbench .aw-number,
.ar-workbench .aw-query-stat strong {
	color: var(--color-cyan);
}
.hub-product .ar-workbench .ar-card {
	border-radius: var(--radius-lg);
}
.ar-workbench .aw-card-top {
	margin-bottom: var(--space-4);
}
.ar-workbench .aw-primary {
	background: var(--color-action-gradient);
	color: var(--color-text-inverse);
}
.ar-workbench .aw-sheet,
dialog {
	background: var(--color-surface);
	color: var(--color-text);
	border-color: var(--color-border);
}
.ar-workbench .aw-sheet::backdrop,
dialog::backdrop {
	background: var(--hub-shadow-color);
}
table {
	font-variant-numeric: tabular-nums;
}
table.data thead th,
.v4-table thead th {
	background: var(--color-bg-subtle);
	color: var(--color-text-muted);
}
table.data tbody tr:hover {
	background: var(--hub-tint);
}
.table-wrap,
.v4-table {
	scrollbar-color: var(--color-border-strong) var(--color-bg-subtle);
}
pre,
code {
	color: var(--color-text-muted);
}
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
select {
	min-height: var(--hub-input-height);
}
.chart__line,
.gsc-chart__line,
.ai-chart__line,
.v4-clicks,
.v4-impressions {
	stroke-width: var(--hub-line-width);
	filter: drop-shadow(var(--hub-chart-glow));
}
.chart__grid,
.gsc-chart__grid,
.ai-chart__grid {
	opacity: 0.65;
}
.chart__area {
	fill-opacity: 0.12;
}
.phone-dock {
	background: var(--hub-glass);
	border-color: var(--color-border);
}
.phone-dock a[aria-current="page"],
.phone-dock button[aria-expanded="true"] {
	color: var(--color-cyan);
	background: var(--color-accent-subtle);
}
/* IA : lecture graphique, détails et preuves à portée de main. */
.ia-board {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: var(--space-4);
}
.ia-card {
	min-width: 0;
	padding: var(--space-5);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	background: var(--hub-card-gradient);
}
.ia-wide {
	grid-column: span 8;
}
.ia-narrow {
	grid-column: span 4;
}
.ia-half {
	grid-column: span 6;
}
.ia-full {
	grid-column: 1 / -1;
}
.ia-card h2 {
	font-size: var(--text-lg);
	margin: 0;
}
.ia-card h3 {
	font-size: var(--text-base);
}
.ia-card p,
.ia-card ul {
	margin-top: var(--space-3);
	color: var(--color-text-muted);
}
.ia-card header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--space-3);
}
.ia-value {
	display: flex;
	align-items: baseline;
	gap: var(--space-3);
	margin-top: var(--space-4);
}
.ia-value strong {
	font-size: var(--aw-title-size);
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums;
	line-height: var(--leading-tight);
}
.ia-value span {
	color: var(--color-text-muted);
}
.ia-state {
	border-radius: var(--radius-full);
	padding: var(--space-1) var(--space-3);
	font-size: var(--text-xs);
	color: var(--color-warning);
	background: var(--color-warning-soft);
}
.ia-state.is-fresh {
	color: var(--color-positive);
	background: var(--color-positive-soft);
}
.ia-coverage {
	display: flex;
	gap: var(--space-4);
	align-items: center;
	margin-block: var(--space-5);
}
.ia-ring {
	width: var(--hub-ring-size);
	flex: none;
	position: relative;
	aspect-ratio: 1;
}
.ia-ring svg {
	width: 100%;
	height: 100%;
	transform: rotate(-90deg);
}
.ia-ring circle {
	fill: none;
	stroke: var(--color-border);
	stroke-width: var(--space-2);
}
.ia-ring .ia-ring-value {
	stroke: var(--color-cyan);
	stroke-linecap: round;
}
.ia-ring strong {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	font-size: var(--text-xl);
	font-variant-numeric: tabular-nums;
}
.ia-caption {
	font-size: var(--text-xs);
	color: var(--color-text-muted);
}
.ia-tabs {
	display: flex;
	gap: var(--space-2);
	margin-block: var(--space-5);
	border-bottom: 1px solid var(--color-border);
	padding-bottom: var(--space-3);
	overflow-x: auto;
}
.ia-tabs a {
	flex: none;
	border-radius: var(--radius-md);
	padding: var(--space-2) var(--space-4);
	color: var(--color-text-muted);
	text-decoration: none;
}
.ia-tabs a[aria-current="page"] {
	background: var(--hub-active-gradient);
	color: var(--color-cyan);
}
.ia-chart {
	height: var(--hub-chart-height);
	margin-top: var(--space-4);
	position: relative;
}
.ia-chart svg {
	display: block;
	height: 100%;
	width: 100%;
	overflow: visible;
}
.ia-chart line {
	stroke: var(--color-border);
}
.ia-chart polyline {
	fill: none;
	stroke: url(#ia-line-gradient);
	stroke-width: var(--hub-line-width);
	vector-effect: non-scaling-stroke;
	filter: drop-shadow(var(--hub-chart-glow));
}
.ia-chart circle {
	fill: var(--color-cyan);
}
.ia-chart text {
	fill: var(--color-text-muted);
	font-size: var(--text-xs);
}
.ia-chart output {
	position: absolute;
	right: var(--space-3);
	top: var(--space-2);
	background: var(--color-bg-subtle);
	padding: var(--space-2) var(--space-3);
	border-radius: var(--radius-md);
	color: var(--color-text);
	font-size: var(--text-xs);
}
.ia-chart-empty {
	display: grid;
	place-items: center;
	min-height: var(--hub-chart-height);
	color: var(--color-text-muted);
	text-align: center;
	border-bottom: 1px solid var(--color-border);
}
.ia-step {
	display: flex;
	align-items: center;
	gap: var(--space-4);
	padding-block: var(--space-4);
	border-top: 1px solid var(--color-border);
}
.ia-step svg {
	width: var(--space-5);
	height: var(--space-5);
	flex: none;
	color: var(--color-cyan);
}
.ia-step div {
	flex: 1;
}
.ia-step p {
	margin-top: var(--space-1);
	font-size: var(--text-sm);
}
.ia-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	margin-top: var(--space-5);
}
.ia-card .v4-table {
	margin-top: var(--space-4);
}
.ia-card .v4-table th,
.ia-card .v4-table td {
	padding: var(--space-3);
	border-bottom: 1px solid var(--color-border);
}
.ia-method {
	margin-top: var(--space-5);
}
.ia-method summary {
	cursor: pointer;
	color: var(--color-accent);
}
@media (min-width: 761px) {
	.hub-shell {
		grid-template-columns: var(--hub-nav-width) minmax(0, 1fr);
	}
}
@media (max-width: 1100px) {
	.ia-wide,
	.ia-narrow {
		grid-column: span 6;
	}
}
@media (max-width: 760px) {
	.hub-shell,
	.dashboard-page .hub-shell {
		gap: var(--space-3);
		padding: var(--space-3);
	}
	.hub-workspace {
		padding-inline: 0;
		padding-bottom: var(--hub-mobile-safe);
	}
	.hub-workspace h1 {
		font-size: var(--text-2xl);
	}
	.ia-board {
		grid-template-columns: minmax(0, 1fr);
	}
	.ia-board > * {
		grid-column: 1;
	}
	.ia-card {
		padding: var(--space-4);
	}
	.ia-tabs a {
		padding-inline: var(--space-3);
	}
	.stat {
		padding: var(--space-4);
	}
}
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0s !important;
		animation: none !important;
	}
}
@media print {
	body::before,
	body::after {
		display: none;
	}
	body {
		background: var(--color-bg);
	}
	.hub-sidebar,
	.phone-dock {
		display: none;
	}
	.hub-shell {
		display: block;
	}
	.card,
	.ia-card {
		break-inside: avoid;
	}
}

.gsc-chart__weekend {
	fill: var(--hub-tint);
}
.gsc-chart__week-start {
	stroke: var(--color-border-strong);
}
.ar-workbench .ar-main-link {
	background: var(--color-action-gradient);
}
.ar-workbench .aw-stages a {
	border-radius: var(--radius-md) var(--radius-md) 0 0;
}
.hub-product .ar-workbench .ar-card {
	border-radius: var(--radius-lg);
	background: var(--hub-card-gradient);
}

.hub-mobile-brand {
	display: none;
}
body .cw button.is-active {
	color: var(--color-text-inverse);
}
@media (max-width: 760px) {
	.hub-mobile-brand {
		display: flex;
		align-items: center;
		gap: var(--space-3);
		padding: var(--space-4);
		color: var(--color-text);
		text-decoration: none;
		border-bottom: 1px solid var(--color-border);
		background: var(--color-bg-subtle);
	}
	.hub-mobile-brand img {
		width: var(--space-6);
		height: var(--space-6);
		border-radius: var(--radius-full);
	}
	.hub-mobile-brand small {
		display: block;
		color: var(--color-text-muted);
		font-size: var(--text-xs);
	}
}

@media (min-width:761px) and (max-width:1100px) {
 .ia-wide, .ia-narrow, .ia-half { grid-column: 1 / -1; }
}

.hub-public-brand { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-5); color: var(--color-text); text-align: left; }
.hub-public-brand img { width: var(--hub-logo-size); height: var(--hub-logo-size); border-radius: var(--radius-full); }
.hub-public-brand small { display: block; font-size: var(--text-xs); font-weight: var(--weight-regular); color: var(--color-text-muted); margin-top: var(--space-1); }

/* Reflet décoratif indépendant des contrôles et des pseudoelements existants. */
.hub-light-reflection {
	position: fixed;
	z-index: var(--hub-light-layer);
	pointer-events: none;
	background: radial-gradient(circle var(--hub-light-radius) at var(--hub-light-x) var(--hub-light-y), var(--hub-light-blue), transparent 72%);
	box-shadow: inset 0 0 0 1px var(--hub-light-blue-edge);
}
.hub-light-reflection--warm {
	background: radial-gradient(circle var(--hub-light-radius) at var(--hub-light-x) var(--hub-light-y), var(--hub-light-warm), transparent 72%);
	box-shadow: inset 0 0 0 1px var(--hub-light-warm-edge);
}
@media (prefers-reduced-motion: reduce), (hover: none), (pointer: coarse), print {
	.hub-light-reflection {
		display: none;
	}
	body::before,
	body::after {
		translate: none;
	}
}
