/* ═══════════════════════════════════════════════════════════════
   Intelligence Verdict — Design Tokens
   ═══════════════════════════════════════════════════════════════ */

.wsscd-verdict-row {
	--wsscd-verdict-gap: var(--wsscd-spacing-xl);
	--wsscd-verdict-radius: var(--wsscd-radius-xl);
	--wsscd-verdict-space-sm: var(--wsscd-spacing-sm-large);
	--wsscd-verdict-space-md: var(--wsscd-padding-medium);
	--wsscd-verdict-space-lg: var(--wsscd-padding-lg);
	--wsscd-verdict-surface: var(--wsscd-color-white);
	--wsscd-verdict-surface-soft: #f8fafc;
	--wsscd-verdict-border: var(--wsscd-color-border-light);
	--wsscd-verdict-border-soft: var(--wsscd-color-border-lighter);
	--wsscd-verdict-text: var(--wsscd-color-text);
	--wsscd-verdict-text-muted: var(--wsscd-color-text-muted);
	--wsscd-verdict-accent: var(--wsscd-color-primary);
	--wsscd-verdict-success: var(--wsscd-color-success-dark);
	--wsscd-verdict-warning: var(--wsscd-color-warning-dark);
	--wsscd-verdict-danger: var(--wsscd-color-danger-dark);
}

.wsscd-verdict-row .wsscd-card {
	border-radius: var(--wsscd-verdict-radius);
	border-color: var(--wsscd-verdict-border);
	background: var(--wsscd-verdict-surface);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.035);
}


.wsscd-verdict-row {
	--wsscd-card-header-border-color: var(--wsscd-border, var(--wsscd-verdict-border));
	--wsscd-card-header-title-size: var(--wsscd-font-size-large);
	--wsscd-card-header-description-margin-top: 1px;
}

.wsscd-verdict-row .wsscd-card__body {
	display: flex;
	flex-direction: column;
	gap: 0;
	padding: 0;
}

.wsscd-verdict-heading__badges {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: var(--wsscd-space-2);
}

/* ─── Chips (scoped) ────────────────────────────────────────── */

/* Chip base + tones now in _components.css. Dashboard overrides scoped variables only. */

.wsscd-verdict-row .wsscd-chip--neutral {
	background: var(--wsscd-verdict-surface-soft);
	border-color: var(--wsscd-verdict-border);
	color: var(--wsscd-verdict-text-muted);
}

.wsscd-verdict-row .wsscd-chip--down {
	background: var(--wsscd-color-danger-lighter);
	border-color: var(--wsscd-color-danger-border);
	color: var(--wsscd-color-danger-text);
}

/* ═══════════════════════════════════════════════════════════════
   Hero — Unified split panel (Status | Action)
   ═══════════════════════════════════════════════════════════════ */

.wsscd-is-hero {
	display: grid;
	grid-template-columns: auto 1fr auto;
	border: 1px solid var(--wsscd-verdict-border-soft);
	border-radius: var(--wsscd-verdict-radius);
	overflow: hidden;
	background: linear-gradient(180deg, rgba(248, 250, 252, 0.72) 0%, rgba(255, 255, 255, 0.96) 100%);
	margin: var(--wsscd-verdict-space-lg) var(--wsscd-verdict-space-lg) 0;
}

/* Gauge column */

.wsscd-is-hero__gauge {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--wsscd-spacing-xs);
	padding: var(--wsscd-space-5) var(--wsscd-space-6);
	border-right: 1px solid var(--wsscd-verdict-border-soft);
}

/* Categorical health indicator: a colored circle with a status icon.
   Modifier classes mirror the canonical decision state names (good /
   caution / risk / blocked) so HTML inspection reflects the actual state
   without translation. The textual status is rendered by the chip and
   hero h3 — the gauge itself is purely visual. */
.wsscd-is-gauge {
	position: relative;
	width: 84px;
	height: 84px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wsscd-is-gauge--good {
	background: var(--wsscd-verdict-success-bg, rgba(46, 125, 50, 0.10));
}

.wsscd-is-gauge--caution {
	background: var(--wsscd-verdict-warning-bg, rgba(201, 137, 20, 0.10));
}

.wsscd-is-gauge--risk,
.wsscd-is-gauge--blocked {
	background: var(--wsscd-verdict-danger-bg, rgba(196, 60, 60, 0.10));
}

.wsscd-is-gauge__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.wsscd-is-gauge__icon svg {
	width: 40px;
	height: 40px;
	display: block;
}

.wsscd-is-gauge__icon--good {
	color: var(--wsscd-verdict-success);
}

.wsscd-is-gauge__icon--caution {
	color: var(--wsscd-verdict-warning);
}

.wsscd-is-gauge__icon--risk,
.wsscd-is-gauge__icon--blocked {
	color: var(--wsscd-verdict-danger);
}

.wsscd-is-gauge__icon svg path {
	fill: currentColor;
}

.wsscd-is-gauge__label {
	font-size: 10px;
	font-weight: var(--wsscd-font-weight-bold);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wsscd-verdict-text-muted);
}

/* Status and action zones — layout inherited from .wsscd-is-metric-group;
   hero only adds padding, centering, and background. */

.wsscd-is-hero__status,
.wsscd-is-hero__action {
	padding: var(--wsscd-spacing-lg) var(--wsscd-spacing-xl);
	justify-content: center;
}

/* Action zone — flex column (no .wsscd-is-metric-group on this element),
   white surface, severity accent on left divider. */

.wsscd-is-hero__action {
	display: flex;
	flex-direction: column;
	gap: var(--wsscd-spacing-sm);
	background: var(--wsscd-verdict-surface);
	border-left: 2px solid var(--wsscd-verdict-accent);
	max-width: 280px;
}

.wsscd-verdict-row[data-status="caution"] .wsscd-is-hero__action {
	border-left-color: var(--wsscd-verdict-warning);
}

.wsscd-verdict-row[data-status="risk"] .wsscd-is-hero__action,
.wsscd-verdict-row[data-status="blocked"] .wsscd-is-hero__action {
	border-left-color: var(--wsscd-verdict-danger);
}

/* Eyebrow label */

.wsscd-verdict-row .wsscd-is-hero__eyebrow {
	color: var(--wsscd-verdict-text-muted);
}

/* Status title with indicator dot */

.wsscd-is-hero__title {
	display: flex;
	align-items: center;
	gap: var(--wsscd-verdict-space-sm);
	margin: 0;
	font-size: var(--wsscd-font-size-large);
	font-weight: var(--wsscd-font-weight-bold);
	line-height: var(--wsscd-line-height-tight);
	color: var(--wsscd-verdict-text);
}

.wsscd-is-hero__title::before {
	content: '';
	display: block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex-shrink: 0;
	background: var(--wsscd-verdict-success);
	box-shadow: 0 0 0 3px rgba(var(--wsscd-shadow-color-success), 0.12);
	animation: wsscd-status-pulse 2s ease-in-out infinite;
}

.wsscd-is-hero__status[data-status="caution"] .wsscd-is-hero__title::before {
	background: var(--wsscd-verdict-warning);
	box-shadow: 0 0 0 3px rgba(var(--wsscd-shadow-color-warning), 0.12);
}

.wsscd-is-hero__status[data-status="risk"] .wsscd-is-hero__title::before,
.wsscd-is-hero__status[data-status="blocked"] .wsscd-is-hero__title::before {
	background: var(--wsscd-verdict-danger);
	box-shadow: 0 0 0 3px rgba(var(--wsscd-shadow-color-danger), 0.12);
}

.wsscd-is-hero__summary {
	margin: 0;
	font-size: var(--wsscd-font-size-medium);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text);
	max-width: 48ch;
}

/* Health score bar */

.wsscd-is-hero__signal {
	margin: 0;
	font-size: var(--wsscd-font-size-base);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text-muted);
}

/* Action side */

.wsscd-is-hero__action-title {
	margin: 0;
	font-size: var(--wsscd-font-size-medium-large);
	line-height: var(--wsscd-line-height-tight);
	color: var(--wsscd-verdict-text);
}

.wsscd-is-hero__action-reason {
	margin: 0;
	font-size: var(--wsscd-font-size-base);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text);
	max-width: 44ch;
}

.wsscd-is-hero__action-meta {
	margin: 0;
	font-size: var(--wsscd-font-size-base);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text-muted);
}

.wsscd-is-hero__action-meta--success {
	color: var(--wsscd-verdict-success);
}

.wsscd-is-hero__action-cta {
	margin-top: var(--wsscd-spacing-xs);
	padding-top: var(--wsscd-verdict-space-sm);
}

.wsscd-is-hero__action-cta .wsscd-button {
	min-height: 36px;
	padding-inline: var(--wsscd-verdict-space-md);
	font-size: var(--wsscd-font-size-base);
	font-weight: var(--wsscd-font-weight-semibold);
}

.wsscd-is-hero__action--warn .wsscd-is-hero__action-cta .wsscd-button {
	min-height: 40px;
	font-size: var(--wsscd-font-size-base);
	font-weight: var(--wsscd-font-weight-bold);
}

.wsscd-is-hero__action--critical .wsscd-is-hero__action-cta .wsscd-button {
	min-height: 44px;
	padding-inline: var(--wsscd-verdict-space-lg);
	font-size: var(--wsscd-font-size-base);
	font-weight: var(--wsscd-font-weight-bold);
}

/* Severity-tinted CTA — colour follows the canonical data-status on
   the parent section so the CTA, action zone border, and status-side
   indicators always share the same colour. */

.wsscd-verdict-row[data-status="caution"] .wsscd-is-hero__action-cta .wsscd-button--primary {
	background: var(--wsscd-verdict-warning);
	border-color: var(--wsscd-verdict-warning);
	color: var(--wsscd-color-white, #fff);
}

.wsscd-verdict-row[data-status="caution"] .wsscd-is-hero__action-cta .wsscd-button--primary:hover {
	background: var(--wsscd-color-warning-darker, #8a7210);
}

.wsscd-verdict-row[data-status="caution"] .wsscd-is-hero__action-cta .wsscd-button--primary:focus-visible {
	outline-color: var(--wsscd-verdict-warning);
}

.wsscd-verdict-row[data-status="risk"] .wsscd-is-hero__action-cta .wsscd-button--primary,
.wsscd-verdict-row[data-status="blocked"] .wsscd-is-hero__action-cta .wsscd-button--primary {
	background: var(--wsscd-verdict-danger);
	border-color: var(--wsscd-verdict-danger);
	color: var(--wsscd-color-white, #fff);
}

.wsscd-verdict-row[data-status="risk"] .wsscd-is-hero__action-cta .wsscd-button--primary:hover,
.wsscd-verdict-row[data-status="blocked"] .wsscd-is-hero__action-cta .wsscd-button--primary:hover {
	background: var(--wsscd-color-danger-darker, #8b1a1a);
}

.wsscd-verdict-row[data-status="risk"] .wsscd-is-hero__action-cta .wsscd-button--primary:focus-visible,
.wsscd-verdict-row[data-status="blocked"] .wsscd-is-hero__action-cta .wsscd-button--primary:focus-visible {
	outline-color: var(--wsscd-verdict-danger);
}

/* Severity-tinted alt-CTAs (multi-target resolution links) */

.wsscd-verdict-row[data-status="caution"] .wsscd-is-hero__action-alt-cta {
	color: var(--wsscd-verdict-warning);
	border-color: var(--wsscd-verdict-warning);
}

.wsscd-verdict-row[data-status="caution"] .wsscd-is-hero__action-alt-cta:hover {
	background: var(--wsscd-verdict-warning);
	border-color: var(--wsscd-verdict-warning);
	color: var(--wsscd-color-white, #fff);
}

.wsscd-verdict-row[data-status="caution"] .wsscd-is-hero__action-alt-cta:focus-visible {
	outline-color: var(--wsscd-verdict-warning);
}

.wsscd-verdict-row[data-status="risk"] .wsscd-is-hero__action-alt-cta,
.wsscd-verdict-row[data-status="blocked"] .wsscd-is-hero__action-alt-cta {
	color: var(--wsscd-verdict-danger);
	border-color: var(--wsscd-verdict-danger);
}

.wsscd-verdict-row[data-status="risk"] .wsscd-is-hero__action-alt-cta:hover,
.wsscd-verdict-row[data-status="blocked"] .wsscd-is-hero__action-alt-cta:hover {
	background: var(--wsscd-verdict-danger);
	border-color: var(--wsscd-verdict-danger);
	color: var(--wsscd-color-white, #fff);
}

.wsscd-verdict-row[data-status="risk"] .wsscd-is-hero__action-alt-cta:focus-visible,
.wsscd-verdict-row[data-status="blocked"] .wsscd-is-hero__action-alt-cta:focus-visible {
	outline-color: var(--wsscd-verdict-danger);
}

/* Multi-target resolution options */

.wsscd-is-hero__action-cta--multi {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wsscd-gap-tight, 6px);
}

/* "Try instead:" heading for alternative-fix CTAs — break to its own line above the buttons. */
.wsscd-is-hero__action-cta--multi > .wsscd-is-hero__eyebrow {
	flex-basis: 100%;
	margin-top: var(--wsscd-verdict-space-sm);
}

.wsscd-is-hero__action-alt-cta {
	gap: var(--wsscd-gap-tight, 4px);
	min-height: var(--wsscd-button-height-small, 28px);
	padding: var(--wsscd-spacing-xs) var(--wsscd-verdict-space-sm);
	line-height: var(--wsscd-line-height-tight);
	color: var(--wsscd-verdict-accent);
	background: transparent;
	border: 1px solid var(--wsscd-verdict-accent);
	border-radius: var(--wsscd-radius-sm);
	transition: background-color var(--wsscd-transition-fast, 0.15s) ease,
		border-color var(--wsscd-transition-fast, 0.15s) ease,
		color var(--wsscd-transition-fast, 0.15s) ease;
}

.wsscd-is-hero__action-alt-cta:hover {
	background: var(--wsscd-verdict-accent);
	border-color: var(--wsscd-verdict-accent);
	color: var(--wsscd-color-white, #fff);
}

.wsscd-is-hero__action-alt-cta:focus-visible {
	outline: 2px solid var(--wsscd-verdict-accent);
	outline-offset: 2px;
}

.wsscd-is-hero__action-alt-cta:active {
	transform: translateY(1px);
}

.wsscd-is-hero__action-alt-cta--static {
	cursor: default;
	color: var(--wsscd-verdict-text-muted);
	background: transparent;
	border-color: var(--wsscd-verdict-border-soft);
}

.wsscd-is-hero__action-alt-cta--static:hover {
	background: transparent;
	border-color: var(--wsscd-verdict-border-soft);
	color: var(--wsscd-verdict-text-muted);
	transform: none;
}


/* ═══════════════════════════════════════════════════════════════
   Metrics Sections
   ═══════════════════════════════════════════════════════════════ */

/* Signals strip — full-width with own padding and border-top. */

.wsscd-verdict-row .wsscd-is-metrics {
	border-top: 1px solid var(--wsscd-verdict-border-soft);
	padding: var(--wsscd-space-4) var(--wsscd-space-5);
}

.wsscd-verdict-row .wsscd-is-metrics__title {
	color: var(--wsscd-verdict-text-muted);
}

.wsscd-verdict-row .wsscd-is-metrics__title::before {
	background: var(--wsscd-verdict-accent);
}

.wsscd-is-metrics__note {
	margin: 0;
	font-size: var(--wsscd-font-size-base);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text-muted);
	max-width: 54ch;
}

.wsscd-is-metrics__note--standalone {
	padding: var(--wsscd-verdict-space-sm) var(--wsscd-space-5) 0;
}

.wsscd-is-metrics__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--wsscd-gap-normal);
	align-items: start;
}

/* Strategic metrics inherits padding/border from .wsscd-verdict-row .wsscd-is-metrics. */

/* Premium badge */

.wsscd-is-metrics__badge {
	display: inline-flex;
	align-items: center;
	padding: 3px 7px;
	margin-left: var(--wsscd-spacing-sm);
	font-size: 9px;
	font-weight: var(--wsscd-font-weight-bold);
	line-height: 1;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wsscd-color-white, #fff);
	background: var(--wsscd-color-pro, #7c3aed);
	border: none;
	border-radius: 3px;
}

/* ─── Metric Card — Dashboard Overrides ────────────────────────
   Base card chrome + severity lives in _components.css.
   Dashboard upgrades the left accent from a border to a ::before
   stripe (inset from top/bottom) and adds padding-left so text
   clears the accent bar.
   ──────────────────────────────────────────────────────────────── */

.wsscd-verdict-row .wsscd-is-metric {
	position: relative;
	overflow: hidden;
	padding: var(--wsscd-space-3) var(--wsscd-verdict-space-md);
	background: var(--wsscd-verdict-surface-soft);
	border: 1px solid var(--wsscd-verdict-border);
	border-radius: var(--wsscd-radius-sm, 8px);
}

/* Severity-coloured values — align with dashboard accent stripe tones. */

.wsscd-verdict-row .wsscd-is-metric--ok .wsscd-is-metric-value {
	color: var(--wsscd-verdict-success);
}

.wsscd-verdict-row .wsscd-is-metric--warn .wsscd-is-metric-value {
	color: var(--wsscd-verdict-warning);
}

.wsscd-verdict-row .wsscd-is-metric--alert .wsscd-is-metric-value {
	color: var(--wsscd-verdict-danger);
}

.wsscd-verdict-row .wsscd-is-metric::before {
	content: '';
	position: absolute;
	left: 0;
	top: 10px;
	bottom: 10px;
	width: 3px;
	border-radius: 0 2px 2px 0;
	background: var(--wsscd-verdict-border-soft);
}

.wsscd-verdict-row .wsscd-is-metric--ok::before {
	background: var(--wsscd-verdict-success);
}

.wsscd-verdict-row .wsscd-is-metric--warn::before {
	background: var(--wsscd-verdict-warning);
}

.wsscd-verdict-row .wsscd-is-metric--alert::before {
	background: var(--wsscd-verdict-danger);
}

.wsscd-verdict-row .wsscd-is-metric--pending::before {
	background: var(--wsscd-verdict-border-soft);
}

/* Text inset — clears the accent stripe */

.wsscd-verdict-row .wsscd-is-metric .wsscd-is-metric-label,
.wsscd-verdict-row .wsscd-is-metric .wsscd-is-metric-value,
.wsscd-verdict-row .wsscd-is-metric .wsscd-is-metric-note {
	padding-left: var(--wsscd-verdict-space-sm);
}

.wsscd-verdict-row .wsscd-is-metric .wsscd-is-metric-label {
	font-size: var(--wsscd-font-size-small);
	font-weight: var(--wsscd-font-weight-semibold);
}

.wsscd-verdict-row .wsscd-is-metric .wsscd-is-metric-value {
	font-size: var(--wsscd-font-size-large);
	font-weight: var(--wsscd-font-weight-bold);
}

.wsscd-verdict-row .wsscd-is-metric .wsscd-is-metric-note {
	font-size: var(--wsscd-font-size-base);
	margin-top: 2px;
}

.wsscd-verdict-row .wsscd-is-metric:focus-visible {
	outline-color: var(--wsscd-verdict-accent);
}

/* Suppress base hover transform for dashboard metrics */

.wsscd-verdict-row .wsscd-is-metric--ok:hover,
.wsscd-verdict-row .wsscd-is-metric--ok:focus,
.wsscd-verdict-row .wsscd-is-metric--warn:hover,
.wsscd-verdict-row .wsscd-is-metric--warn:focus,
.wsscd-verdict-row .wsscd-is-metric--alert:hover,
.wsscd-verdict-row .wsscd-is-metric--alert:focus {
	transform: none;
}

.wsscd-is-hero .wsscd-is-status-chip {
	align-self: flex-start;
}

/* Pulse the status chip dot to convey live data */

.wsscd-verdict-row .wsscd-is-status-chip .wsscd-chip__dot {
	animation: wsscd-status-pulse 2s ease-in-out infinite;
}

.wsscd-is-hero .wsscd-is-next-action {
	flex: 1;
}

/* ═══════════════════════════════════════════════════════════════
   Details & Diagnostics — Progressive Disclosure
   ═══════════════════════════════════════════════════════════════ */

/* Details toggle — full-width bar matching the mockup. Uses native
   <details>/<summary> for accessibility; styled as a flat bar. */

.wsscd-is-details {
	border-top: 1px solid var(--wsscd-verdict-border-soft);
	overflow: hidden;
}

/* ─── Summary Toggle (full-width bar) ─────────────────────── */

.wsscd-is-details > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: var(--wsscd-space-3) var(--wsscd-space-5);
	background: none;
	border: none;
	cursor: pointer;
	font-size: var(--wsscd-font-size-small);
	font-weight: var(--wsscd-font-weight-semibold);
	color: var(--wsscd-verdict-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	list-style: none;
	transition: background 0.15s ease;
}

.wsscd-is-details > summary::-webkit-details-marker {
	display: none;
}

.wsscd-is-details > summary::marker {
	display: none;
	content: '';
}

.wsscd-is-details > summary::after {
	content: '';
	display: block;
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpolyline points='6 9 12 15 18 9' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpolyline points='6 9 12 15 18 9' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 0.25s ease;
}

.wsscd-is-details[open] > summary::after {
	transform: rotate(180deg);
}

.wsscd-is-details > summary:hover {
	background: var(--wsscd-verdict-surface-soft);
}

.wsscd-is-details > summary:focus-visible {
	outline: 2px solid var(--wsscd-verdict-accent);
	outline-offset: -2px;
}

/* ─── Details Body ─────────────────────────────────────────── */

.wsscd-is-details__body {
	display: flex;
	flex-direction: column;
	padding: 0 var(--wsscd-space-5) var(--wsscd-space-5);
	border-top: 1px solid var(--wsscd-verdict-border-soft);
	background: var(--wsscd-verdict-surface-soft);
	animation: wsscd-fade-in 0.2s ease;
}

/* ─── Sections ─────────────────────────────────────────────── */

.wsscd-is-details__section {
	padding: var(--wsscd-space-4) 0;
}

.wsscd-is-details__section:first-child {
	padding-top: var(--wsscd-space-4);
}

.wsscd-is-details__section:last-child {
	padding-bottom: 0;
}

.wsscd-is-details__section + .wsscd-is-details__section {
	border-top: 1px solid var(--wsscd-verdict-border-soft);
}

.wsscd-is-details__heading {
	display: flex;
	align-items: center;
	gap: var(--wsscd-space-2);
	margin: 0 0 var(--wsscd-verdict-space-sm);
	font-size: var(--wsscd-font-size-small);
	font-weight: var(--wsscd-font-weight-bold);
	line-height: var(--wsscd-line-height-tight);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wsscd-verdict-text-muted);
}


.wsscd-is-details__note {
	margin: 0 0 var(--wsscd-space-2);
	font-size: var(--wsscd-font-size-base);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text-muted);
}

/* ─── Trigger Tags ─────────────────────────────────────────── */

.wsscd-is-details__trigger-tag {
	display: inline-flex;
	align-items: center;
	gap: var(--wsscd-spacing-xs);
	padding: var(--wsscd-spacing-xxs) var(--wsscd-verdict-space-sm);
	font-size: var(--wsscd-font-size-small);
	font-weight: var(--wsscd-font-weight-medium);
	line-height: var(--wsscd-line-height-tight);
	color: var(--wsscd-verdict-text);
	background: var(--wsscd-verdict-surface);
	border: 1px solid var(--wsscd-verdict-border-soft);
	border-radius: 6px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wsscd-is-details__trigger-tag:hover {
	border-color: var(--wsscd-verdict-border);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.wsscd-is-details__trigger-tag::before {
	content: '';
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--wsscd-verdict-accent);
	flex-shrink: 0;
	opacity: 0.45;
}

/* ─── Callout (Penalty Context) ────────────────────────────── */

.wsscd-is-callout {
	display: flex;
	gap: var(--wsscd-space-3);
	padding: var(--wsscd-space-3) var(--wsscd-space-4);
	border-radius: var(--wsscd-radius-sm);
	border: 1px solid var(--wsscd-verdict-border-soft);
	border-left: 3px solid transparent;
	background: var(--wsscd-verdict-surface);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.wsscd-is-callout--warn {
	border-left-color: var(--wsscd-verdict-warning);
	background: linear-gradient(135deg, var(--wsscd-verdict-surface) 60%, rgba(var(--wsscd-shadow-color-warning), 0.03) 100%);
}

.wsscd-is-callout__icon {
	font-size: var(--wsscd-font-size-large);
	width: 16px;
	height: 16px;
	color: var(--wsscd-verdict-warning);
	flex-shrink: 0;
	margin-top: 1px;
}

.wsscd-is-callout__body {
	display: flex;
	flex-direction: column;
	gap: var(--wsscd-spacing-xs);
	min-width: 0;
}

.wsscd-is-callout__text {
	margin: 0;
	font-size: var(--wsscd-font-size-base);
	font-weight: var(--wsscd-font-weight-medium);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text);
}

.wsscd-is-callout__text--muted {
	font-weight: var(--wsscd-font-weight-normal);
	color: var(--wsscd-verdict-text-muted);
}

/* ─── Diagnostics Row (flat inline) ────────────────────────── */

.wsscd-is-diagnostics-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wsscd-space-4);
	padding: var(--wsscd-verdict-space-sm) var(--wsscd-space-5);
	border-top: 1px solid var(--wsscd-verdict-border-soft);
	font-size: var(--wsscd-font-size-small);
	color: var(--wsscd-verdict-text-muted);
}

.wsscd-is-diagnostics-row__item {
	display: inline-flex;
	align-items: center;
	gap: var(--wsscd-spacing-xs);
	white-space: nowrap;
}

.wsscd-is-diagnostics-row__item--end {
	margin-left: auto;
}

.wsscd-is-diagnostics-row__dot {
	width: 6px;
	height: 6px;
}

.wsscd-is-diagnostics-row__dot--ok {
	background: var(--wsscd-verdict-success);
}

.wsscd-is-diagnostics-row__dot--warn {
	background: var(--wsscd-verdict-warning);
}

.wsscd-is-diagnostics-row__dot--neutral {
	background: var(--wsscd-verdict-border);
}

/* ─── Empty State (Timeline placeholder) ───────────────────── */

.wsscd-is-empty-state {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--wsscd-space-2);
	padding: var(--wsscd-space-5) var(--wsscd-space-4);
	text-align: center;
}

.wsscd-is-empty-state__icon {
	font-size: var(--wsscd-font-size-xxxl);
	width: 24px;
	height: 24px;
	color: var(--wsscd-verdict-border);
}

.wsscd-is-empty-state__text {
	margin: 0;
	font-size: var(--wsscd-font-size-base);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text-muted);
}

/* ═══════════════════════════════════════════════════════════════
   Timeline — Sparkline Table
   ═══════════════════════════════════════════════════════════════ */

.wsscd-timeline {
	--wsscd-tl-accent: var(--wsscd-verdict-accent);
	--wsscd-tl-warn: var(--wsscd-verdict-warning);
	--wsscd-tl-danger: var(--wsscd-verdict-danger);
	--wsscd-tl-cols: 7;
	display: grid;
	grid-template-columns: auto repeat(var(--wsscd-tl-cols), minmax(0, 1fr));
	margin-top: var(--wsscd-verdict-space-sm);
	border: 1px solid var(--wsscd-verdict-border-soft);
	border-radius: var(--wsscd-radius-sm);
	overflow: hidden;
}

/* ─── Day header row ───────────────────────────────────────── */

.wsscd-timeline__header {
	display: contents;
}

.wsscd-timeline__corner,
.wsscd-timeline__header .wsscd-timeline__day-label {
	background: var(--wsscd-verdict-surface-soft);
	border-bottom: 1px solid var(--wsscd-verdict-border-soft);
}

.wsscd-timeline__corner {
	padding: 6px 10px;
}

.wsscd-timeline__day-label {
	padding: var(--wsscd-spacing-sm) var(--wsscd-spacing-xs);
	text-align: center;
	font-size: var(--wsscd-font-size-small);
	font-weight: var(--wsscd-font-weight-semibold);
	line-height: var(--wsscd-line-height-tight);
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--wsscd-verdict-text-muted);
}

.wsscd-timeline__day-label--today {
	font-weight: var(--wsscd-font-weight-bold);
	color: var(--wsscd-verdict-accent);
	background: color-mix(in srgb, var(--wsscd-verdict-accent) 4%, transparent);
}

/* ─── Series row ───────────────────────────────────────────── */

.wsscd-timeline__row {
	--wsscd-tl-series: var(--wsscd-tl-accent);
	display: contents;
}

.wsscd-timeline__row[data-series="discount_load"] {
	--wsscd-tl-series: var(--wsscd-tl-accent);
}

.wsscd-timeline__row[data-series="conflict_pressure"] {
	--wsscd-tl-series: var(--wsscd-tl-warn);
}

.wsscd-timeline__row[data-series="override_intensity"] {
	--wsscd-tl-series: var(--wsscd-tl-danger);
}

/* Row label — dot + text */

.wsscd-timeline__row-label {
	display: flex;
	align-items: center;
	gap: var(--wsscd-spacing-sm);
	padding: var(--wsscd-spacing-sm) var(--wsscd-verdict-space-sm);
	border-top: 1px solid var(--wsscd-verdict-border-soft);
	font-size: var(--wsscd-font-size-small);
	font-weight: var(--wsscd-font-weight-semibold);
	line-height: var(--wsscd-line-height-tight);
	color: var(--wsscd-verdict-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.wsscd-timeline__row-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--wsscd-tl-series);
	flex-shrink: 0;
}

/* ─── Value cell ───────────────────────────────────────────── */

.wsscd-timeline__cell {
	padding: var(--wsscd-spacing-sm) var(--wsscd-spacing-xs);
	text-align: center;
	font-size: var(--wsscd-font-size-small);
	font-weight: var(--wsscd-font-weight-medium);
	line-height: var(--wsscd-line-height-tight);
	color: var(--wsscd-verdict-text-muted);
	border-top: 1px solid var(--wsscd-verdict-border-soft);
	border-left: 1px solid var(--wsscd-verdict-border-soft);
}

.wsscd-timeline__cell--today {
	background: color-mix(in srgb, var(--wsscd-verdict-accent) 3%, transparent);
	font-weight: var(--wsscd-font-weight-bold);
	color: var(--wsscd-verdict-text);
}

.wsscd-timeline__cell--mid {
	color: var(--wsscd-tl-series);
	font-weight: var(--wsscd-font-weight-semibold);
}

.wsscd-timeline__cell--high {
	color: var(--wsscd-verdict-surface);
	font-weight: var(--wsscd-font-weight-bold);
	background: var(--wsscd-tl-series);
}

.wsscd-timeline__cell--high.wsscd-timeline__cell--today {
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}

/* ─── Inline Narratives (preview outside details) ─────────── */

.wsscd-is-inline-narratives {
	margin: 0;
	padding: var(--wsscd-verdict-space-sm) var(--wsscd-space-3);
	border-top: 1px solid var(--wsscd-verdict-border-soft);
	list-style: none;
	background: var(--wsscd-verdict-surface-soft);
	border-radius: 0 0 var(--wsscd-radius-sm) var(--wsscd-radius-sm);
}

.wsscd-is-inline-narratives li {
	position: relative;
	padding-left: var(--wsscd-verdict-space-md);
	margin-bottom: var(--wsscd-spacing-xxs);
	font-size: var(--wsscd-font-size-base);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text-muted);
}

.wsscd-is-inline-narratives li:last-child {
	margin-bottom: 0;
}

.wsscd-is-inline-narratives li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 7px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--wsscd-verdict-accent);
	opacity: 0.35;
}

/* ─── Diagnostics Bar (extracted from details) ────────────── */

/* ─── Upgrade Prompt (compact free-user CTA) ─────────────── */

/* Locked economic signals — ghost preview with upgrade overlay */

.wsscd-is-metrics--locked {
	border-top-color: var(--wsscd-color-pro-alpha-25, rgba(124, 58, 237, 0.25));
}

.wsscd-is-metrics--locked__preview {
	position: relative;
	min-height: 96px;
}

.wsscd-is-metrics--locked__ghost {
	filter: blur(1px);
	opacity: 0.45;
	pointer-events: none;
	user-select: none;
}

.wsscd-is-metric--ghost .wsscd-is-metric-value {
	color: var(--wsscd-verdict-text-muted);
}

.wsscd-is-metrics--locked__overlay {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--wsscd-space-3);
	text-align: center;
	padding: var(--wsscd-space-4);
	background: radial-gradient(
		ellipse at center,
		var(--wsscd-color-pro-alpha-8, rgba(124, 58, 237, 0.08)) 0%,
		transparent 70%
	);
	border-radius: var(--wsscd-verdict-radius);
}

.wsscd-is-metrics--locked__icon-ring {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: linear-gradient(
		135deg,
		var(--wsscd-color-pro-alpha-15, rgba(124, 58, 237, 0.15)),
		var(--wsscd-color-pro-alpha-8, rgba(124, 58, 237, 0.08))
	);
	color: var(--wsscd-color-pro, #7c3aed);
	flex-shrink: 0;
}

.wsscd-is-metrics--locked__icon-ring .wsscd-icon {
	width: 20px;
	height: 20px;
}

.wsscd-is-metrics--locked__text {
	margin: 0;
	font-size: var(--wsscd-font-size-base);
	font-weight: var(--wsscd-font-weight-medium);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text);
	max-width: 300px;
}

.wsscd-is-metrics--locked__cta {
	gap: var(--wsscd-spacing-sm);
	text-decoration: none;
	box-shadow: 0 2px 6px rgba(124, 58, 237, 0.18);
}

.wsscd-is-metrics--locked__cta:hover {
	box-shadow: 0 4px 12px rgba(124, 58, 237, 0.25);
}

.wsscd-is-metrics--locked__cta .wsscd-icon {
	width: 14px;
	height: 14px;
}

/* ═══════════════════════════════════════════════════════════════
   Economic Signals — Gradient Cards with Micro-bars
   ═══════════════════════════════════════════════════════════════ */

.wsscd-is-metrics--strategic .wsscd-is-metrics__grid {
	gap: var(--wsscd-space-3);
}

.wsscd-is-metrics--strategic .wsscd-is-metric {
	position: relative;
	padding: var(--wsscd-space-3) var(--wsscd-space-4);
	border-radius: var(--wsscd-verdict-space-sm);
	border: 1px solid var(--wsscd-verdict-border-soft);
	overflow: hidden;
	transition: transform var(--wsscd-transition-fast, 0.15s) ease,
		box-shadow var(--wsscd-transition-fast, 0.15s) ease;
}

.wsscd-is-metrics--strategic .wsscd-is-metric:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

/* Gradient tints per severity */

.wsscd-is-metrics--strategic .wsscd-is-metric--ok {
	background: linear-gradient(135deg, rgba(var(--wsscd-shadow-color-success), 0.04) 0%, rgba(var(--wsscd-shadow-color-success), 0.01) 100%);
}

.wsscd-is-metrics--strategic .wsscd-is-metric--warn {
	background: linear-gradient(135deg, rgba(var(--wsscd-shadow-color-warning), 0.05) 0%, rgba(var(--wsscd-shadow-color-warning), 0.01) 100%);
}

.wsscd-is-metrics--strategic .wsscd-is-metric--alert {
	background: linear-gradient(135deg, rgba(var(--wsscd-shadow-color-danger), 0.05) 0%, rgba(var(--wsscd-shadow-color-danger), 0.01) 100%);
}

/* Suppress the left accent stripe on gradient cards — the gradient tint
   and micro-bar provide enough visual severity signaling. */

.wsscd-is-metrics--strategic .wsscd-is-metric::before {
	display: none;
}

.wsscd-is-metrics--strategic .wsscd-is-metric .wsscd-is-metric-label,
.wsscd-is-metrics--strategic .wsscd-is-metric .wsscd-is-metric-value,
.wsscd-is-metrics--strategic .wsscd-is-metric .wsscd-is-metric-note {
	padding-left: 0;
}

/* Larger value typography for gradient cards */

.wsscd-is-metrics--strategic .wsscd-is-metric .wsscd-is-metric-value {
	font-size: var(--wsscd-font-size-xxl);
	font-weight: 800;
	letter-spacing: -0.5px;
	margin-top: var(--wsscd-spacing-xs);
}

/* Micro-bar — progress indicator showing metric magnitude */

.wsscd-is-metric-bar {
	height: 4px;
	border-radius: var(--wsscd-radius-xs);
	margin-top: var(--wsscd-spacing-sm);
	background: rgba(0, 0, 0, 0.04);
	overflow: hidden;
}

.wsscd-is-metric-bar__fill {
	height: 100%;
	border-radius: var(--wsscd-radius-xs);
	transition: width 0.8s ease;
}

.wsscd-is-metric-bar__fill--ok {
	background: linear-gradient(90deg, var(--wsscd-verdict-success), rgba(var(--wsscd-shadow-color-success), 0.3));
}

.wsscd-is-metric-bar__fill--warn {
	background: linear-gradient(90deg, var(--wsscd-verdict-warning), rgba(var(--wsscd-shadow-color-warning), 0.3));
}

.wsscd-is-metric-bar__fill--alert {
	background: linear-gradient(90deg, var(--wsscd-verdict-danger), rgba(var(--wsscd-shadow-color-danger), 0.3));
}

/* ═══════════════════════════════════════════════════════════════
   Lists & Utilities
   ═══════════════════════════════════════════════════════════════ */

.wsscd-is-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.wsscd-is-list li {
	display: flex;
	align-items: flex-start;
	gap: var(--wsscd-verdict-space-sm);
	padding: var(--wsscd-space-2) 0;
	font-size: var(--wsscd-font-size-base);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text);
	border-bottom: 1px solid var(--wsscd-verdict-border-soft);
}

.wsscd-is-list li:last-child {
	border-bottom: none;
}

.wsscd-is-list li::before {
	content: '';
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--wsscd-verdict-text-muted);
	flex-shrink: 0;
	margin-top: 6px;
}

.wsscd-is-list--compact li {
	font-size: var(--wsscd-font-size-base);
	color: var(--wsscd-verdict-text-muted);
}

/* ─── Onboarding / Fallback (no intelligence data) ─────────── */

.wsscd-is-onboarding {
	display: flex;
	align-items: center;
	gap: var(--wsscd-space-5);
	margin: var(--wsscd-verdict-space-lg);
	padding: var(--wsscd-space-6) var(--wsscd-space-5);
	border-radius: var(--wsscd-radius-sm);
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--wsscd-verdict-accent) 3%, transparent) 0%, transparent 60%),
		var(--wsscd-verdict-surface-soft);
	border: 1px dashed var(--wsscd-verdict-border-soft);
}

.wsscd-is-onboarding__icon-ring {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: linear-gradient(
		135deg,
		color-mix(in srgb, var(--wsscd-verdict-accent) 8%, transparent),
		color-mix(in srgb, var(--wsscd-verdict-accent) 3%, transparent)
	);
	color: var(--wsscd-verdict-accent);
}

.wsscd-is-onboarding__icon-ring .wsscd-icon {
	width: 28px;
	height: 28px;
}

.wsscd-is-onboarding__content {
	flex: 1;
	min-width: 0;
}

.wsscd-is-onboarding__eyebrow {
	display: block;
	margin: 0 0 var(--wsscd-space-1);
	font-size: var(--wsscd-font-size-small);
	font-weight: var(--wsscd-font-weight-semibold);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--wsscd-verdict-text-muted);
}

.wsscd-is-onboarding__text {
	margin: 0;
	font-size: var(--wsscd-font-size-medium);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-verdict-text);
}

.wsscd-is-onboarding__cta {
	flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════
   State Variants
   ═══════════════════════════════════════════════════════════════ */

/* ─── Fallback: muted presentation for pre-intelligence decisions ── */

.wsscd-verdict-row--fallback .wsscd-is-hero {
	background: linear-gradient(180deg, rgba(248, 250, 252, 0.5) 0%, rgba(241, 245, 249, 0.7) 100%);
	border-color: var(--wsscd-verdict-border);
}

.wsscd-verdict-row--fallback .wsscd-is-hero__title::before {
	background: var(--wsscd-severity-neutral, #646970);
	box-shadow: none;
}

.wsscd-verdict-row--fallback .wsscd-is-hero__action {
	border-left-color: var(--wsscd-severity-neutral, #646970);
	opacity: 0.85;
}

.wsscd-verdict-row--fallback .wsscd-chip--success,
.wsscd-verdict-row--fallback .wsscd-chip--warn {
	background: var(--wsscd-verdict-surface-soft);
	border-color: var(--wsscd-verdict-border);
	color: var(--wsscd-verdict-text-muted);
}

/* ═══════════════════════════════════════════════════════════════
   Animations & Focus
   ═══════════════════════════════════════════════════════════════ */


@keyframes wsscd-fade-in {
	from {
		opacity: 0;
		transform: translateY(-4px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes wsscd-gauge-enter {
	from {
		opacity: 0;
		transform: scale(0.6) rotate(-45deg);
	}

	to {
		opacity: 1;
		transform: scale(1) rotate(0deg);
	}
}

@keyframes wsscd-status-pulse {
	0%,
	100% {
		opacity: 1;
	}

	50% {
		opacity: 0.4;
	}
}

.wsscd-main-dashboard .wsscd-button:focus-visible,
.wsscd-main-dashboard a:focus-visible {
	outline: 2px solid var(--wsscd-color-primary);
	outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════════════
   Responsive
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 1100px) {
	.wsscd-is-hero {
		grid-template-columns: 1fr;
	}

	.wsscd-is-hero__gauge {
		border-right: none;
		border-bottom: 1px solid var(--wsscd-verdict-border-soft);
		padding: var(--wsscd-space-4);
	}

	.wsscd-is-hero__action {
		order: -1;
		border-left: 0;
		max-width: none;
		border-bottom: 3px solid var(--wsscd-verdict-accent);
	}

	.wsscd-verdict-row[data-status="caution"] .wsscd-is-hero__action {
		border-bottom-color: var(--wsscd-verdict-warning);
	}

	.wsscd-verdict-row[data-status="risk"] .wsscd-is-hero__action,
	.wsscd-verdict-row[data-status="blocked"] .wsscd-is-hero__action {
		border-bottom-color: var(--wsscd-verdict-danger);
	}

	.wsscd-is-metrics__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.wsscd-is-hero {
		margin: var(--wsscd-verdict-space-md);
	}

	.wsscd-is-hero__status,
	.wsscd-is-hero__action {
		padding: var(--wsscd-verdict-space-md);
	}

	.wsscd-verdict-row .wsscd-is-metrics {
		padding: var(--wsscd-verdict-space-md);
	}

	.wsscd-is-metrics__grid {
		grid-template-columns: 1fr;
	}

	.wsscd-is-details__body {
		padding: 0 var(--wsscd-verdict-space-md) var(--wsscd-verdict-space-md);
	}

	.wsscd-is-details > summary {
		padding: var(--wsscd-verdict-space-sm) var(--wsscd-verdict-space-md);
	}

	.wsscd-is-onboarding {
		flex-direction: column;
		text-align: center;
		gap: var(--wsscd-space-4);
		padding: var(--wsscd-space-5) var(--wsscd-space-4);
	}

	.wsscd-timeline__row-label {
		font-size: var(--wsscd-font-size-small);
		padding: 6px 6px;
	}

	.wsscd-timeline__cell {
		font-size: var(--wsscd-font-size-small);
		padding: 6px 2px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wsscd-is-hero__title::before,
	.wsscd-is-details__body,
	.wsscd-verdict-row .wsscd-is-status-chip .wsscd-chip__dot {
		animation: none;
	}

	.wsscd-is-metric,
	.wsscd-is-metric-bar__fill {
		transition: none;
	}
}