/* The layout of every page, on top of Bootstrap's style sheet and the components' own. */
/*
 * The site's colours are the chosen Antilia theme's (--antilia-theme-*, see Theme), set on <body> by ThemeBehavior:
 * the properties below are defined on the themed element, since a custom property reading another resolves where
 * it is defined.
 */
.antilia-theme {
	--yrc-accent: var(--antilia-theme-primary);
	--yrc-accent-2: var(--antilia-theme-accent);
	/* the accent of text and icons: dark themes have a dim primary colour, made for surfaces under light text */
	--yrc-accent-text: var(--antilia-theme-primary);
	--yrc-accent-soft: color-mix(in srgb, var(--antilia-theme-primary) 12%, var(--antilia-theme-surface));
	--yrc-on-accent: var(--antilia-theme-on-primary);
	--yrc-surface: var(--antilia-theme-surface);
	--yrc-surface-2: color-mix(in srgb, var(--antilia-theme-toolbar) 70%, var(--antilia-theme-surface));
	--yrc-hero-from: color-mix(in srgb, var(--antilia-theme-primary) 10%, var(--antilia-theme-surface));
	--yrc-hero-to: color-mix(in srgb, var(--antilia-theme-accent) 6%, var(--antilia-theme-surface));
	--yrc-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 4px 16px rgba(16, 24, 40, .06);
}

.antilia-theme[data-bs-theme="dark"] {
	--yrc-accent-text: var(--antilia-theme-accent);
	--yrc-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 4px 16px rgba(0, 0, 0, .3);
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	margin: 0;
	background: var(--yrc-surface-2);
	color: var(--bs-body-color);
	overflow-x: hidden;
}

/* wide screens are used: the gutter grows with the screen, up to a width where lines would get too long to scan */
.yrc-container {
	width: 100%;
	max-width: 1800px;
	margin: 0 auto;
	padding: 0 clamp(16px, 3vw, 48px);
}

.yrc-skip:focus {
	position: absolute;
	z-index: 2000;
	top: .5rem;
	left: .5rem;
	padding: .5rem 1rem;
	background: var(--yrc-surface);
}

/* header */
.yrc-topbar {
	position: sticky;
	top: 0;
	z-index: 1020;
	border-bottom: 1px solid var(--bs-border-color);
	background: color-mix(in srgb, var(--yrc-surface) 88%, transparent);
	backdrop-filter: saturate(1.4) blur(8px);
}

.yrc-topbar-inner {
	display: flex;
	align-items: center;
	gap: 1rem;
	min-height: 3.75rem;
}

.yrc-brand {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	color: var(--bs-body-color);
	font-weight: 700;
	font-size: 1.1rem;
	letter-spacing: -.01em;
	text-decoration: none;
	white-space: nowrap;
}

.yrc-brand:hover {
	color: var(--yrc-accent-text);
}

.yrc-logo svg {
	display: block;
}

/* the logo: a developer between the brackets of their code, in the colours of the theme */
.yrc-logo-tile {
	fill: var(--yrc-accent);
}

.yrc-logo-person {
	fill: var(--yrc-on-accent);
}

.yrc-logo-code {
	fill: none;
	stroke: color-mix(in srgb, var(--yrc-on-accent) 75%, var(--yrc-accent));
	stroke-width: 2.2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.yrc-site-menu {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	justify-content: flex-end;
}

.yrc-theme-menu {
	flex: 0 0 auto;
}

@media (max-width: 700px) {
	.yrc-topbar-inner {
		flex-wrap: wrap;
		gap: .25rem .5rem;
		padding-top: .4rem;
		padding-bottom: .4rem;
	}

	.yrc-brand-name {
		font-size: 1rem;
	}

	.yrc-site-menu {
		order: 3;
		flex-basis: 100%;
		justify-content: flex-start;
		overflow-x: auto;
	}

	.yrc-theme-menu {
		margin-left: auto;
	}
}

/* local mode, set by the application */
.yrc-local-mode {
	padding: .35rem 0;
	background: #fff3cd;
	color: #664d03;
	border-bottom: 1px solid #ffe69c;
	font-size: .875rem;
	text-align: center;
}

/* content */
.yrc-main {
	flex: 1 0 auto;
	padding: 2rem 0 3rem;
}

.yrc-page-header {
	margin-bottom: 1.5rem;
}

.yrc-page-header h1 {
	margin: 0 0 .35rem;
	font-size: clamp(1.5rem, 2.5vw, 2rem);
	font-weight: 700;
	letter-spacing: -.02em;
}

.yrc-page-header p {
	max-width: 60rem;
	margin: 0;
	color: var(--bs-secondary-color);
}

.yrc-card {
	min-width: 0;
	margin-bottom: 1.25rem;
	padding: 1.25rem;
	border: 1px solid var(--bs-border-color);
	border-radius: .9rem;
	background: var(--yrc-surface);
	box-shadow: var(--yrc-shadow);
}

.yrc-card > h2,
.yrc-card-title {
	margin: 0 0 1rem;
	font-size: 1.1rem;
	font-weight: 650;
}

.yrc-card-title {
	display: flex;
	align-items: center;
	gap: .5rem;
}

.yrc-hint {
	color: var(--bs-secondary-color);
	font-size: .9rem;
}

.yrc-grid {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
}

.yrc-grid > .yrc-card {
	margin-bottom: 0;
}

.yrc-stack > * + * {
	margin-top: 1.25rem;
}

.yrc-stats {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr));
	margin-bottom: 1.25rem;
}

.yrc-stat {
	padding: 1rem 1.1rem;
	border: 1px solid var(--bs-border-color);
	border-radius: .9rem;
	background: var(--yrc-surface);
	box-shadow: var(--yrc-shadow);
}

.yrc-stat-value {
	display: block;
	font-size: 1.6rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	line-height: 1.2;
}

.yrc-stat-label {
	color: var(--bs-secondary-color);
	font-size: .85rem;
}

.yrc-form {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: .75rem;
}

.yrc-form .yrc-field {
	display: flex;
	flex-direction: column;
	gap: .25rem;
	min-width: 0;
	flex: 1 1 12rem;
}

.yrc-form .yrc-field-narrow {
	flex: 0 1 8rem;
}

.yrc-form .yrc-field-wide {
	flex-basis: 100%;
}

/* a company's open jobs */
.yrc-job-list {
	display: grid;
	gap: .6rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.yrc-job-list a {
	font-weight: 600;
	margin-right: .5rem;
}

/* text people wrote, such as a company's description: their line breaks are kept */
.yrc-text {
	white-space: pre-line;
	overflow-wrap: anywhere;
}

.yrc-form .yrc-field > span {
	color: var(--bs-secondary-color);
	font-size: .8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.yrc-check {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
}

.yrc-dl {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: .4rem 1.25rem;
	margin: 0;
}

.yrc-dl dt {
	color: var(--bs-secondary-color);
	font-weight: 500;
}

.yrc-dl dd {
	margin: 0;
	min-width: 0;
	overflow-wrap: anywhere;
}

.yrc-badge {
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	padding: .2rem .6rem;
	border-radius: 999px;
	background: var(--yrc-accent-soft);
	color: var(--yrc-accent-text);
	font-size: .8rem;
	font-weight: 600;
	white-space: nowrap;
}

a.yrc-badge {
	text-decoration: none;
}

.yrc-badge-success {
	background: color-mix(in srgb, var(--bs-success) 15%, transparent);
	color: var(--bs-success-text-emphasis);
}

.yrc-badge-muted {
	background: var(--bs-secondary-bg);
	color: var(--bs-secondary-color);
}

.yrc-badge svg,
.yrc-icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
	vertical-align: -.125em;
}

.yrc-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.yrc-empty {
	padding: 1.5rem;
	border: 1px dashed var(--bs-border-color);
	border-radius: .9rem;
	color: var(--bs-secondary-color);
	text-align: center;
}

.yrc-mono {
	font-family: var(--bs-font-monospace);
	font-size: .85em;
	overflow-wrap: anywhere;
}

pre.yrc-log {
	max-height: 20rem;
	margin: 0;
	padding: .75rem;
	border-radius: .5rem;
	background: var(--yrc-surface-2);
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}

/* tables of the JSON table component stay inside their card */
.yrc-table-wrap {
	min-width: 0;
	overflow-x: auto;
}

.yrc-number {
	text-align: right;
	font-variant-numeric: tabular-nums;
}

/* footer */
.yrc-footer {
	padding: 1.5rem 0;
	border-top: 1px solid var(--bs-border-color);
	background: var(--yrc-surface);
	color: var(--bs-secondary-color);
	font-size: .85rem;
}

.yrc-footer-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: .5rem 2rem;
}

/* landing page */
.yrc-landing .yrc-main,
.yrc-main:has(.yrc-hero) {
	padding-top: 0;
}

.yrc-hero {
	padding: clamp(3rem, 8vw, 6rem) 0 clamp(2.5rem, 6vw, 4.5rem);
	background: radial-gradient(1200px 400px at 10% -10%, var(--yrc-hero-from), transparent),
		radial-gradient(900px 400px at 100% 0%, var(--yrc-hero-to), transparent);
}

.yrc-hero-inner {
	display: grid;
	gap: 2.5rem;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
	align-items: center;
}

@media (max-width: 900px) {
	.yrc-hero-inner {
		grid-template-columns: minmax(0, 1fr);
	}
}

.yrc-eyebrow {
	display: inline-block;
	margin-bottom: 1rem;
	padding: .3rem .75rem;
	border-radius: 999px;
	background: var(--yrc-accent-soft);
	color: var(--yrc-accent-text);
	font-size: .85rem;
	font-weight: 600;
}

.yrc-hero h1 {
	margin: 0 0 1rem;
	font-size: clamp(2.1rem, 5vw, 3.4rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -.03em;
}

.yrc-hero h1 em {
	font-style: normal;
	background: linear-gradient(90deg, var(--yrc-accent), var(--yrc-accent-2));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.yrc-lead {
	max-width: 38rem;
	margin: 0 0 1.75rem;
	color: var(--bs-secondary-color);
	font-size: 1.15rem;
}

.yrc-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
}

.yrc-cta {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .75rem 1.25rem;
	border: 1px solid transparent;
	border-radius: .65rem;
	font-weight: 600;
	text-decoration: none;
}

.yrc-cta svg {
	width: 1.05rem;
	height: 1.05rem;
	fill: currentColor;
}

.yrc-cta-primary {
	background: var(--yrc-accent);
	color: var(--yrc-on-accent);
}

.yrc-cta-primary:hover {
	background: var(--antilia-theme-primary-dark);
	color: var(--yrc-on-accent);
}

.yrc-cta-secondary {
	border-color: var(--bs-border-color);
	background: var(--yrc-surface);
	color: var(--bs-body-color);
}

.yrc-cta-secondary:hover {
	border-color: var(--yrc-accent-text);
	color: var(--yrc-accent-text);
}

/* the preview card of the hero */
.yrc-preview {
	padding: 1.25rem;
	border: 1px solid var(--bs-border-color);
	border-radius: 1.1rem;
	background: var(--yrc-surface);
	box-shadow: 0 10px 40px color-mix(in srgb, var(--yrc-accent) 18%, transparent);
}

.yrc-preview-head {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-bottom: 1rem;
}

.yrc-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--yrc-accent), var(--yrc-accent-2));
	color: var(--yrc-on-accent);
	font-weight: 700;
	font-size: 1.1rem;
	text-transform: uppercase;
}

.yrc-avatar-lg {
	width: 4.5rem;
	height: 4.5rem;
	font-size: 1.6rem;
}

.yrc-preview-bars {
	display: grid;
	gap: .6rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.yrc-preview-bars li {
	display: grid;
	grid-template-columns: 6.5rem 1fr 2.5rem;
	align-items: center;
	gap: .6rem;
	font-size: .9rem;
}

.yrc-section {
	padding: clamp(2.5rem, 6vw, 4rem) 0;
}

.yrc-section-alt {
	background: var(--yrc-surface);
	border-top: 1px solid var(--bs-border-color);
	border-bottom: 1px solid var(--bs-border-color);
}

.yrc-section h2 {
	margin: 0 0 .5rem;
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 750;
	letter-spacing: -.02em;
}

.yrc-section-intro {
	max-width: 44rem;
	margin: 0 0 2rem;
	color: var(--bs-secondary-color);
	font-size: 1.05rem;
}

.yrc-steps {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
	counter-reset: step;
	margin: 0;
	padding: 0;
	list-style: none;
}

.yrc-step {
	position: relative;
	padding: 1.5rem;
	border: 1px solid var(--bs-border-color);
	border-radius: .9rem;
	background: var(--yrc-surface);
}

.yrc-step::before {
	counter-increment: step;
	content: counter(step);
	position: absolute;
	top: 1.25rem;
	right: 1.25rem;
	color: var(--bs-border-color);
	font-size: 2.2rem;
	font-weight: 800;
	line-height: 1;
}

.yrc-step h3,
.yrc-feature h3 {
	margin: .75rem 0 .4rem;
	font-size: 1.05rem;
	font-weight: 650;
}

.yrc-step p,
.yrc-feature p {
	margin: 0;
	color: var(--bs-secondary-color);
}

.yrc-feature-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.6rem;
	height: 2.6rem;
	border-radius: .7rem;
	background: var(--yrc-accent-soft);
	color: var(--yrc-accent-text);
}

.yrc-feature-icon svg {
	width: 1.2rem;
	height: 1.2rem;
	fill: currentColor;
}

.yrc-features {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
}

.yrc-feature {
	padding: 1.5rem;
	border: 1px solid var(--bs-border-color);
	border-radius: .9rem;
	background: var(--yrc-surface-2);
}

.yrc-faq {
	display: grid;
	gap: .75rem;
	max-width: 52rem;
}

/* admin */
/*
 * The administration's tables need the room: its pages, header and footer included so that their edges line up, take
 * the window's whole width, with a narrower gutter (#152). The public pages keep their centred column.
 */
.yrc-wide .yrc-container {
	max-width: none;
	padding: 0 clamp(12px, 1.5vw, 24px);
}

.yrc-admin {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: 13rem minmax(0, 1fr);
	align-items: start;
}

.yrc-admin-nav {
	position: sticky;
	top: 5rem;
	padding: .75rem;
	border: 1px solid var(--bs-border-color);
	border-radius: .9rem;
	background: var(--yrc-surface);
	box-shadow: var(--yrc-shadow);
}

.yrc-admin-nav-title {
	margin: .25rem .5rem .5rem;
	color: var(--bs-secondary-color);
	font-size: .75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
}

@media (max-width: 900px) {
	.yrc-admin {
		grid-template-columns: minmax(0, 1fr);
	}

	.yrc-admin-nav {
		position: static;
	}
}

/* the CV */
.yrc-cv-header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.25rem;
}

.yrc-cv-header h1 {
	margin: 0;
	font-size: clamp(1.6rem, 3.5vw, 2.4rem);
	font-weight: 800;
	letter-spacing: -.02em;
}

.yrc-cv-header .yrc-cv-login {
	color: var(--bs-secondary-color);
}

.yrc-cv-badges {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	margin-top: .5rem;
}

.yrc-cv-actions {
	margin-left: auto;
	display: flex;
	gap: .5rem;
}

.yrc-skill {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: .2rem 1rem;
	padding: .75rem 0;
	border-bottom: 1px solid var(--bs-border-color);
}

.yrc-skill:last-child {
	border-bottom: 0;
}

.yrc-skill-name {
	font-weight: 650;
}

.yrc-skill-score {
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.yrc-skill-meta {
	grid-column: 1 / -1;
	color: var(--bs-secondary-color);
	font-size: .85rem;
}

.yrc-skill .antilia-progress-bar,
.yrc-skill progress {
	grid-column: 1 / -1;
}

.yrc-draft-ribbon {
	margin-bottom: 1rem;
	padding: .6rem 1rem;
	border-radius: .6rem;
	background: #fff3cd;
	color: #664d03;
	font-weight: 600;
}

.yrc-share {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem;
}

.yrc-share input {
	flex: 1 1 18rem;
	min-width: 0;
}

@media print {
	.yrc-topbar,
	.yrc-footer,
	.yrc-cv-actions,
	.yrc-local-mode,
	.antilia-notifications,
	.yrc-no-print {
		display: none !important;
	}

	body,
	.yrc-main {
		background: #fff;
		padding: 0;
	}

	.yrc-card {
		box-shadow: none;
		break-inside: avoid;
	}
}

/* the full and one-page views of a CV */
.yrc-segmented {
	display: inline-flex;
	padding: .2rem;
	border: 1px solid var(--bs-border-color);
	border-radius: .65rem;
	background: var(--yrc-surface-2);
}

.yrc-segmented a {
	padding: .45rem .9rem;
	border-radius: .5rem;
	color: var(--bs-secondary-color);
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.yrc-segmented a[aria-current="page"] {
	background: var(--yrc-surface);
	color: var(--yrc-accent-text);
	box-shadow: var(--yrc-shadow);
}

.yrc-cv-actions {
	flex-wrap: wrap;
	align-items: center;
}

/* scores as native meters, which need no inline style */
meter {
	width: 100%;
	height: .6rem;
}

.yrc-score {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	min-width: 8rem;
}

.yrc-score meter {
	width: 5rem;
}

.yrc-table-filters {
	display: inline-flex;
	flex-wrap: wrap;
	gap: .4rem;
	margin-right: .5rem;
}

.yrc-table-filters input {
	width: 14rem;
	max-width: 100%;
}

.yrc-table-filters select {
	width: auto;
}

.yrc-sign-in {
	max-width: 32rem;
}

.yrc-admin-content {
	min-width: 0;
}

.yrc-cv {
	max-width: 80rem;
	margin: 0 auto;
}

@media print {
	.yrc-cv {
		max-width: none;
	}

	.yrc-segmented,
	[data-yrc-print] {
		display: none !important;
	}
}

/* what developers say about themselves on their CV, as plain text: line breaks kept, no markup */
.yrc-cv-headline {
	margin: .35rem 0 0;
	font-size: 1.15rem;
	font-weight: 600;
}

.yrc-cv-text {
	margin: 0 0 .75rem;
	white-space: pre-line;
	overflow-wrap: anywhere;
}

.yrc-cv-text:last-child {
	margin-bottom: 0;
}

.yrc-cv-entry {
	padding: 1rem 0;
	border-bottom: 1px solid var(--bs-border-color);
	break-inside: avoid;
}

h2 + .yrc-cv-entry {
	padding-top: 0;
}

.yrc-cv-entry:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.yrc-cv-entry-head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .2rem 1rem;
}

.yrc-cv-entry h3 {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 650;
	overflow-wrap: anywhere;
}

.yrc-cv-entry-when {
	color: var(--bs-secondary-color);
	font-size: .9rem;
	font-variant-numeric: tabular-nums;
}

.yrc-cv-entry-where {
	color: var(--yrc-accent-text);
	font-weight: 600;
	overflow-wrap: anywhere;
}

.yrc-cv-entry .yrc-cv-text {
	margin-top: .5rem;
}

.yrc-cv-languages {
	margin: 0;
	padding: 0;
	list-style: none;
}

.yrc-cv-languages li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .4rem 0;
	border-bottom: 1px solid var(--bs-border-color);
}

.yrc-cv-languages li:last-child {
	border-bottom: 0;
}

.yrc-tags .yrc-badge {
	white-space: normal;
	overflow-wrap: anywhere;
}

@media print {
	/* a long list of jobs goes on over pages; each job stays on one */
	.yrc-cv-entries.yrc-card {
		break-inside: auto;
	}
}

/* what of an imported CV could not be placed, and how to write the file */
.yrc-unplaced {
	margin: 0;
	padding-left: 1.25rem;
	max-height: 20rem;
	overflow-y: auto;
}

.yrc-unplaced li {
	white-space: pre-line;
	overflow-wrap: anywhere;
}

.yrc-example {
	margin: .5rem 0 0;
	padding: .75rem 1rem;
	border-radius: .6rem;
	background: var(--bs-secondary-bg);
	font-size: .85rem;
	white-space: pre-wrap;
}

/* the CV editor */
.yrc-cv-editor {
	max-width: 64rem;
}

/*
  What of an imported file could not be placed, to review: beside the form, in view while the form scrolls. It comes
  before the form in the page, so that on a narrow screen it is above it.
*/
.yrc-cv-editor:has(.yrc-review) {
	max-width: 88rem;
}

.yrc-editor-layout {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-start;
	gap: 1.25rem;
}

.yrc-editor-layout > form {
	flex: 1 1 0;
	min-width: 0;
}

.yrc-review {
	position: sticky;
	top: 5rem;
	flex: 0 0 22rem;
	max-height: calc(100vh - 6rem);
	margin-bottom: 0;
	overflow-y: auto;
}

.yrc-review .yrc-unplaced {
	max-height: none;
}

.yrc-review .yrc-unplaced li + li {
	margin-top: .5rem;
}

@media (max-width: 900px) {
	.yrc-editor-layout {
		flex-direction: column;
		align-items: stretch;
	}

	.yrc-editor-layout > form {
		flex: none;
	}

	.yrc-review {
		position: static;
		flex: none;
		max-height: 20rem;
	}
}

.yrc-form .yrc-field-wide {
	flex-basis: 100%;
}

.yrc-field-block {
	display: flex;
	flex-direction: column;
	gap: .25rem;
}

.yrc-field-block > span {
	color: var(--bs-secondary-color);
	font-size: .8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.yrc-entry {
	margin: 0 0 1rem;
	padding: .75rem 1rem 1rem;
	border: 1px solid var(--bs-border-color);
	border-radius: .75rem;
	background: var(--yrc-surface-2);
}

.yrc-entry .yrc-form + .yrc-form {
	margin-top: .75rem;
}

.yrc-entry legend {
	margin-bottom: .5rem;
	font-size: 1rem;
	font-weight: 650;
}

.yrc-entry-summary {
	color: var(--bs-secondary-color);
	font-weight: 500;
}

.yrc-entry-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	margin-top: .75rem;
}

.yrc-subtitle {
	margin: 1rem 0 .25rem;
	font-size: 1rem;
	font-weight: 650;
}

/* Save stays in reach on a long CV */
.yrc-editor-bar {
	position: sticky;
	bottom: 0;
	z-index: 2;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem;
}

/* the questions of the landing page */
.yrc-faq-item {
	border: 1px solid var(--bs-border-color);
	border-radius: .75rem;
	background: var(--yrc-surface);
}

.yrc-faq-item summary {
	padding: .9rem 1.1rem;
	font-weight: 600;
	cursor: pointer;
}

.yrc-faq-item summary:hover {
	color: var(--yrc-accent-text);
}

.yrc-faq-item p {
	margin: 0;
	padding: 0 1.1rem 1rem;
	color: var(--bs-secondary-color);
}

.yrc-section .yrc-card-title,
.yrc-card h2 {
	font-size: 1.1rem;
	font-weight: 650;
	letter-spacing: 0;
}

meter::-webkit-meter-bar {
	border: 0;
	border-radius: 999px;
	background: var(--bs-secondary-bg);
}

meter::-webkit-meter-optimum-value,
meter::-webkit-meter-suboptimum-value,
meter::-webkit-meter-even-less-good-value {
	border-radius: 999px;
	background: linear-gradient(90deg, var(--yrc-accent), var(--yrc-accent-2));
}

meter::-moz-meter-bar {
	border-radius: 999px;
	background: linear-gradient(90deg, var(--yrc-accent), var(--yrc-accent-2));
}

.yrc-grid {
	margin-bottom: 1.25rem;
}

/* <wicket:icon>: a Font Awesome icon in the colour of its text, or the theme's in headings */
.yrc-icon {
	display: inline-flex;
	align-items: center;
}

.yrc-icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

h2 > .yrc-icon,
.yrc-card-title > .yrc-icon {
	margin-right: .35em;
	color: var(--yrc-accent-text);
	font-size: .85em;
	vertical-align: .05em;
}

.yrc-stat-label > .yrc-icon {
	margin-right: .3em;
	color: var(--yrc-accent-text);
	vertical-align: -.1em;
}

/* the theme menu: each theme's dot in its primary colour */
.yrc-swatch .antilia-menu-icon { color: var(--yrc-swatch); }
.yrc-swatch-default { --yrc-swatch: #c2410c; }
.yrc-swatch-blue { --yrc-swatch: #1565c0; }
.yrc-swatch-red { --yrc-swatch: #b71c1c; }
.yrc-swatch-grey { --yrc-swatch: #4a5258; }
.yrc-swatch-green { --yrc-swatch: #2e7d32; }
.yrc-swatch-navy { --yrc-swatch: #1f3a68; }
.yrc-swatch-light-blue { --yrc-swatch: #4a90c8; }
.yrc-swatch-magenta { --yrc-swatch: #a21caf; }
.yrc-swatch-rose { --yrc-swatch: #be4a6a; }
.yrc-swatch-dark { --yrc-swatch: #1e242c; }
.yrc-swatch-bootstrap { --yrc-swatch: #0d6efd; }
.yrc-swatch-bootstrap-dark { --yrc-swatch: #212529; }

.antilia-theme[data-bs-theme="dark"] .yrc-swatch-dark,
.antilia-theme[data-bs-theme="dark"] .yrc-swatch-bootstrap-dark {
	--yrc-swatch: #7cb7ff;
}

/* the sidebar marks its current item in the theme's primary colour, too dim for text in a dark theme */
.antilia-theme[data-bs-theme="dark"] .antilia-menu-sidebar .antilia-menu-link.antilia-menu-current {
	box-shadow: inset 3px 0 0 var(--yrc-accent-text);
	color: var(--yrc-accent-text);
}

/* the ways to sign in, and those of an account */
.yrc-sign-in-hosts {
	margin-bottom: 1.25rem;
}

.yrc-sign-ins {
	margin: 0;
	padding: 0;
	list-style: none;
}

.yrc-sign-ins li + li {
	margin-top: .5rem;
}

.yrc-link-accounts {
	margin-top: 1rem;
}

/* the developer's pages on other sites, in the CV's header */
.yrc-cv-social {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem 1rem;
	margin: .25rem 0 0;
	padding: 0;
	list-style: none;
}

.yrc-consents {
	margin: .5rem 0 0;
	padding: 0;
	list-style: none;

/* Contribution reports: the scanner's, uploaded, and those of /admin/scan */
.yrc-report-heading {
	display: flex;
	align-items: center;
	gap: .35rem;
	margin: 1rem 0 .5rem;
	font-size: .95rem;
	font-weight: 650;
}

.yrc-report-heading > .yrc-icon {
	color: var(--yrc-accent-text);
}

.yrc-report {
	padding: .75rem 0;
	border-bottom: 1px solid var(--bs-border-color);
}

.yrc-report:last-child {
	border-bottom: 0;
}

.yrc-report h3 {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem;
	margin: 0 0 .25rem;
	font-size: 1rem;
	font-weight: 650;
}

/* Where the evidence of a profile comes from */
.yrc-sources {
	margin: 0 0 1rem;
	padding: 0;
	list-style: none;
}

.yrc-sources > li {
	display: flex;
	gap: .75rem;
	padding: .6rem 0;
	border-bottom: 1px solid var(--bs-border-color);
}

.yrc-sources > li:last-child {
	border-bottom: 0;
}

.yrc-source-icon {
	flex: 0 0 auto;
	color: var(--yrc-accent-text);
}

.yrc-source-icon svg {
	width: 1.1em;
	height: 1.1em;
	fill: currentColor;
	vertical-align: -.2em;
}

.yrc-source-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem;
}

.yrc-source-summary {
	color: var(--bs-secondary-color);
}

.yrc-skill-sources {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	grid-column: 1 / -1;
}

.yrc-skill-sources .yrc-badge {
	font-size: .72rem;
	font-weight: 500;
}

/* The technologies a CV names, by what shows them (#130) */
.yrc-cv-technologies-group + .yrc-cv-technologies-group {
	margin-top: 1.25rem;
}

.yrc-cv-technologies-group h3 {
	margin: 0;
	font-size: 1rem;
	font-weight: 650;
}

.yrc-cv-technologies-group > .yrc-hint {
	margin: .1rem 0 .25rem;
}

.yrc-cv-technologies-declared .yrc-skill-name,
.yrc-cv-technologies-unrecognised .yrc-skill-name {
	font-weight: 500;
}

/* Where each technology the CV names shows (#132) */
.yrc-cv-technologies .yrc-skill > div {
	grid-column: 1 / -1;
}

.yrc-cv-evidence {
	font-size: .85rem;
}

.yrc-cv-evidence > summary {
	cursor: pointer;
	color: var(--yrc-accent-text);
}

.yrc-cv-evidence ul {
	margin: .35rem 0 0;
	padding-left: 1.1rem;
}

.yrc-cv-evidence li {
	margin: .15rem 0;
}

.yrc-cv-evidence-meta {
	color: var(--bs-secondary-color);
}

.yrc-cv-entry[id],
.yrc-report[id] {
	scroll-margin-top: 5rem;
}

.yrc-cv-entry:target,
.yrc-report:target {
	outline: 2px solid var(--yrc-accent-text);
	outline-offset: .35rem;
	border-radius: .25rem;
}

/* How to show in code what the CV only declares, on /me (#131) */
.yrc-cv-prove-repositories {
	margin-top: .75rem;
	padding-top: .75rem;
	border-top: 1px solid var(--bs-border-color);
}

.yrc-cv-prove-repositories h4 {
	margin: 0 0 .25rem;
	font-size: .95rem;
	font-weight: 650;
}

.yrc-cv-prove-repositories ul {
	margin: .35rem 0 .75rem;
	padding-left: 1.1rem;
	font-size: .9rem;
}

.yrc-cv-prove-repositories li {
	margin: .15rem 0;
}

.yrc-cv-prove-repositories .yrc-hint {
	margin: .5rem 0 0;
}

#prove-repositories,
#add-private-work {
	scroll-margin-top: 5rem;
}
