/* ============================================================
   Tier B - "At a glance" box  (feature: featGlance)
   Styles the box injected by js/glance.js. The box only appears
   when content exists (companion-plugin data or an abstract
   convention); otherwise nothing renders and the page is unchanged.
   Neutral palette by default; the accent line uses a CSS variable so
   a journal accent can be set later without editing this file.
   ============================================================ */

:root { --synth-accent: #0a4d45; } /* override per-journal if/when desired */

.synth-glance {
	margin: 0 0 1.8rem;
	padding: 1.1rem 1.25rem 1.25rem;
	border: 1px solid rgba(0, 0, 0, 0.14);
	border-top: 3px solid var(--synth-accent);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 6px 22px -14px rgba(0, 0, 0, 0.35);
}
.synth-glance__h {
	font-size: 0.76rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin: 0 0 0.9rem;
	color: var(--synth-accent);
}
.synth-glance__row {
	display: grid;
	grid-template-columns: 6.5rem 1fr;
	gap: 0.9rem;
	margin: 0.55rem 0;
	line-height: 1.5;
}
.synth-glance__k {
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	opacity: 0.6;
	padding-top: 0.15rem;
}
.synth-glance__v { font-size: 1rem; }

@media (max-width: 560px) {
	.synth-glance__row { grid-template-columns: 1fr; gap: 0.15rem; }
}