/**
 * Owlypia Student Dashboard — [student-dashboard]
 */

.osd-dash-hero,
.osd {
	--osd-ink: #0b1f4d;
	--osd-body: #667085;
	--osd-orange: #ff8a3d;
	--osd-navy: #0b1f4d;
	--osd-line: #e5eaf0;
	width: 100%;
	box-sizing: border-box;
	color: var(--osd-ink);
	font-family: "Segoe UI", Segoe, sans-serif;
	line-height: 1.55;
}

.osd {
	--osd-ink: #1b2a4a;
	--osd-body: #5e6b78;
	max-width: none;
	margin: 0;
	padding: 0;
}

body.osd-shell:has(.osd-dash-hero) .osd-shell-main {
	background: #f6f1ea;
}

.osd-dash-band {
	margin: 0;
	padding: 3rem 1.25rem;
	background: #f7f9fc;
}

.osd-dash-band:nth-child(odd) {
	background: #f6f1ea;
}

.osd-dash-band-inner {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

.osd-dash-hero *,
.osd-dash-hero *::before,
.osd-dash-hero *::after,
.osd *,
.osd *::before,
.osd *::after {
	box-sizing: border-box;
}

.osd h2 {
	font-family: inherit;
	letter-spacing: -0.02em;
}

.osd p {
	margin: 0;
}

body:has(.osd) .content-area {
	margin-top: 0;
}

body:has(.osd) .content-bg {
	background: transparent !important;
}

body:has(.osd) .entry-content-wrap {
	padding-top: 0;
}

body:has(.osd) .entry-content > p:empty,
body:has(.osd) .entry-content > .wp-block-kadence-advancedheading:empty {
	display: none;
	margin: 0;
}

.osd-dash-hero {
	background:
		radial-gradient(circle at 84% 18%, rgba(255, 138, 61, 0.1), transparent 24%),
		linear-gradient(180deg, #f0f8fc 0%, #f7f9fc 100%);
	border-bottom: 1px solid #edf1f5;
}

.osd-dash-hero-inner {
	display: grid;
	grid-template-columns: minmax(0, 1.02fr) minmax(220px, 0.98fr);
	gap: 1.25rem;
	align-items: center;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: var(--osd-hero-inner-top, calc((1.6rem + 1.15rem + 34px) * 0.64)) 1.25rem 2rem;
}

body.osd-shell .osd-dash-hero .osd-dash-eyebrow,
.osd-dash-eyebrow {
	margin: 0 0 0.45rem;
	color: var(--osd-orange);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.11em;
	line-height: 18px;
	text-transform: uppercase;
}

.osd-dash-intro h2 {
	margin: 0 0 0.7rem;
	color: var(--osd-navy);
	font-size: 50px;
	font-weight: 800;
	line-height: 50px;
	letter-spacing: -0.035em;
}

.osd-dash-intro p {
	max-width: 38rem;
	margin: 0;
	color: var(--osd-body);
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
}

.osd-dash-intro p + p {
	margin-top: 0.85rem;
}

.osd-dash-mascot {
	display: block;
	width: min(100%, 280px);
	height: auto;
	margin: 0 auto;
	justify-self: center;
	object-fit: contain;
	object-position: center;
}

html body.osd-shell .osd-dash-hero-inner > .osd-dash-mascot {
	margin: 0 auto;
	justify-self: center;
}

.osd-dash-leaderboard .osd-j-board-grid {
	grid-template-columns: 1.2fr 0.8fr;
	align-items: stretch;
}

.osd-dash-leaderboard .osd-j-board {
	height: 100%;
}

.osd-dash-leaderboard .osd-j-board-grid > .osd-dash-side,
.osd-dash-leaderboard .osd-j-board-grid > .osd-dash-level {
	align-self: stretch;
	height: 100%;
}

.osd-dash-side {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	min-width: 0;
}

.osd-dash-leaderboard .osd-dash-badges {
	flex: 1 1 auto;
}

.osd-dash-level {
	padding: 1.1rem 1.15rem 1rem;
	background: #e7f4fb;
	border: 1px solid #d3e6f2;
	border-radius: 20px;
	box-shadow: none;
	text-align: center;
}

.osd-dash-level-kicker {
	margin: 0 0 0.45rem;
	color: #7b8495;
	font-size: 26px;
	font-weight: 600;
	letter-spacing: normal;
	line-height: 1.25;
	text-transform: none;
}

.osd-dash-level-logo {
	display: block;
	width: 108px;
	height: 108px;
	margin: 0 auto 0.4rem;
	object-fit: contain;
}

body.osd-shell .osd-dash-level h3 {
	margin: 0;
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: uppercase;
}

.osd-dash-level-track {
	height: 8px;
	margin-top: 0.75rem;
	background: #d5e6f0;
	border-radius: 99px;
	overflow: hidden;
}

.osd-dash-level-track span {
	display: block;
	height: 100%;
	border-radius: inherit;
}

.osd-dash-level-note {
	margin: 0.4rem 0 0;
	color: #7b8495;
	font-size: 18px;
	line-height: 30px;
}

.osd-dash-badges {
	padding: 1.1rem 0.95rem 1rem;
	background: #fff;
	border: 1px solid #e5eaf0;
	border-radius: 20px;
	text-align: center;
}

.osd-j .osd-dash-badges h3,
.osd-dash-badges h3 {
	margin: 0;
	padding-bottom: 1.25rem;
	color: #0b1f4d;
	font-size: 26px;
	font-weight: 600;
	line-height: 1.25;
	text-transform: none;
}

.osd-dash-badges-empty {
	margin: 0;
	color: #7b8495;
	font-size: 18px;
	line-height: 30px;
}

.osd-dash-badges-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.55rem;
}

.osd-dash-badge {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	width: 5.5rem;
	padding: 0.65rem 0.35rem 0.55rem;
	background: #f8fafc;
	border: 1px solid #e5eaf0;
	border-radius: 12px;
	color: #334155;
	font-size: 0.68rem;
	font-weight: 700;
	line-height: 1.25;
}

.osd-dash-badge img,
.osd-dash-badge-fallback {
	width: 48px;
	height: 48px;
	object-fit: contain;
}

.osd-dash-badge-fallback {
	display: grid;
	place-items: center;
	font-size: 1.4rem;
}

.osd-dash-progress-top {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	align-items: flex-start;
}

.osd-dash-progress h3 {
	margin: 0 0 0.2rem;
	color: var(--osd-navy);
	font-size: 1rem;
	font-weight: 800;
}

.osd-dash-progress p {
	margin: 0;
	color: var(--osd-body);
	font-size: 0.82rem;
	line-height: 1.45;
}

.osd-dash-progress-value {
	color: var(--osd-navy);
	font-size: 2rem;
	font-weight: 800;
	line-height: 1;
}

.osd-dash-track {
	height: 10px;
	margin-top: 1.15rem;
	background: #ecf0f4;
	border-radius: 99px;
	overflow: hidden;
}

.osd-dash-track span {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, var(--osd-orange), #ffa062);
}

.osd-dash-progress-meta {
	display: flex;
	justify-content: space-between;
	gap: 0.75rem;
	margin-top: 0.55rem;
	color: #7b8495;
	font-size: 0.75rem;
}

.osd-dash-continue {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 1.6rem;
	align-items: center;
	margin: 0 0 1.4rem;
	padding: 1.7rem 1.75rem;
	background: linear-gradient(125deg, #0b1f4d 0%, #123a73 100%);
	border-radius: 22px;
	color: #fff;
	box-shadow: 0 18px 42px rgba(11, 31, 77, 0.13);
}

.osd-dash-kicker {
	margin: 0 0 0.4rem;
	color: #a9c8ff;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: 0.09em;
	line-height: 1.3;
	text-transform: uppercase;
}

.osd-dash-continue .osd-dash-kicker {
	color: #a9c8ff;
	font-size: 20px;
	line-height: 1.3;
}

.osd-dash-continue p {
	margin: 0;
	color: rgba(255, 255, 255, 0.73);
	font-size: 18px;
	line-height: 30px;
}

.osd-dash-continue-bar {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	margin-top: 1rem;
}

.osd-dash-continue-track {
	flex: 1;
	height: 16px;
	overflow: hidden;
	background: transparent;
	border: 2px solid #ff8a3d;
	border-radius: 99px;
}

.osd-dash-continue-track span {
	display: block;
	height: 100%;
	background: #ff8a3d;
	border-radius: inherit;
}

.osd-dash-continue-percent {
	flex: 0 0 auto;
	color: rgba(255, 255, 255, 0.9);
	font-size: 0.85rem;
	font-weight: 800;
}

.osd-dash-mini {
	min-width: 9.5rem;
	padding: 1rem 1.15rem;
	background: #1d4fa3;
	border-radius: 14px;
	text-align: center;
}

.osd-dash-mini strong {
	display: block;
	margin-bottom: 0.2rem;
	font-size: 1.6rem;
	line-height: 1;
}

.osd-dash-mini span {
	color: rgba(255, 255, 255, 0.68);
	font-size: 16px;
}

.osd-dash-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 1.1rem;
	border-radius: 11px;
	background: var(--osd-orange);
	color: #fff;
	font-size: 0.9rem;
	font-weight: 800;
	text-decoration: none;
	white-space: nowrap;
}

.osd-dash-btn:hover,
.osd-dash-btn:focus-visible {
	color: #fff;
	text-decoration: none;
	filter: brightness(0.98);
}

.osd-dash-activity-progress {
	margin-top: 1.35rem;
}

.osd .osd-dash-continue {
	margin-bottom: 3.6rem;
}

.osd-progress-board {
	padding: 1.35rem 1.4rem 1.2rem;
	background:
		radial-gradient(circle at 100% 0%, rgba(255, 138, 61, 0.08), transparent 28%),
		#fff;
	border: 1px solid var(--osd-line);
	border-radius: 20px;
	box-shadow: 0 14px 40px rgba(16, 24, 40, 0.04);
}

.osd-progress-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	margin-bottom: 1.15rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--osd-line);
}

.osd .osd-progress-kicker,
.osd-activity .osd-progress-kicker {
	margin: 0 0 0.2rem;
	color: var(--osd-orange);
	font-size: 0.68rem;
	font-weight: 800;
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

.osd-progress-head h2 {
	margin: 0;
	color: var(--osd-navy);
	font-size: 1.35rem;
	line-height: 1.2;
}

.osd .osd-progress-head h2 {
	font-size: 28px;
	line-height: 34px;
}

.osd-progress-head p {
	max-width: 36rem;
	color: var(--osd-body);
	font-size: 0.84rem;
}

.osd-progress-overall {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex: 0 0 auto;
}

.osd-progress-overall .osd-ring {
	width: 64px;
}

.osd-progress-overall strong {
	display: block;
	color: var(--osd-navy);
	font-size: 1.05rem;
	line-height: 1.1;
}

.osd-progress-overall span {
	color: var(--osd-body);
	font-size: 0.72rem;
}

.osd-progress-meters {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 0.7rem;
}

@media (max-width: 1200px) {
	.osd-progress-meters {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.osd-meter {
	position: relative;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	min-width: 0;
	padding: 1.1rem 0.9rem 0.95rem;
	overflow: hidden;
	background: #f8fafc;
	background: color-mix(in srgb, var(--osd-ring, #2a6edb) 12%, #fff);
	border: 1px solid #eef2f6;
	border-color: color-mix(in srgb, var(--osd-ring, #2a6edb) 24%, #fff);
	border-radius: 16px;
}

.osd-meter::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 4px;
	background: var(--osd-ring, #2a6edb);
}

.osd-meter-head {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	min-width: 0;
}

.osd-meter-body {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 0.7rem;
	min-width: 0;
	text-align: left;
}

.osd-meter-score {
	display: grid;
	gap: 0.35rem;
	min-width: 0;
}

.osd-ring {
	position: relative;
	width: 72px;
	flex: 0 0 auto;
}

.osd-ring svg {
	display: block;
	width: 100%;
	height: auto;
}

.osd-ring-track,
.osd-ring-arc {
	fill: none;
	stroke-width: 8;
}

.osd-ring-track {
	stroke: #e7edf3;
}

.osd-ring-arc {
	stroke-linecap: round;
	stroke-dasharray: var(--osd-ring-circ);
	stroke-dashoffset: var(--osd-ring-circ);
	transition: stroke-dashoffset 1s ease-out;
	transition-delay: var(--osd-fill-delay, 0s);
}

.osd-meter.is-animated .osd-ring-arc {
	stroke-dashoffset: var(--osd-ring-offset);
}

.osd-ring strong {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--osd-navy);
	font-size: 0.95rem;
	line-height: 1;
}

.osd-ring strong span {
	margin-left: 1px;
	color: var(--osd-ring, var(--osd-navy));
	font-size: 0.68rem;
}

.osd-meter-name,
.osd .osd-meter-name {
	min-width: 0;
	color: var(--osd-navy);
	font-size: 1rem;
	font-weight: 800;
	line-height: 1.2;
	overflow-wrap: anywhere;
	hyphens: auto;
}

.osd-meter-icon {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: var(--osd-ring, var(--osd-navy));
}

.osd-meter-icon img,
.osd-meter-icon svg {
	display: block;
	width: 36px;
	height: 36px;
	object-fit: contain;
}

.osd-meter-count,
.osd .osd-meter-count,
.osd-activity .osd-meter-count,
.osd-sv .osd-meter-count {
	margin: 0;
	min-width: 0;
	color: var(--osd-navy);
	text-align: left;
	line-height: 1.2;
}

.osd-meter-count strong,
.osd .osd-meter-count strong {
	display: block;
	color: var(--osd-navy);
	font-size: 1.05rem;
	font-weight: 800;
	line-height: 1.15;
}

.osd-meter-count span {
	display: block;
	margin-top: 0.15rem;
	color: #667085;
	font-size: 0.78rem;
	font-weight: 500;
}

.osd-meter-avg-label {
	color: #667085;
	font-size: 0.78rem;
	font-weight: 600;
	line-height: 1.2;
}

.osd-meter-bar {
	display: block;
	width: 100%;
	height: 8px;
	overflow: hidden;
	border-radius: 99px;
	background: #e7edf3;
}

.osd-meter-avg-value {
	color: var(--osd-navy);
	font-size: 0.92rem;
	font-weight: 800;
	line-height: 1.2;
}

.osd-meter.is-score-only .osd-meter-score {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.35rem 0.75rem;
}

.osd-meter-bar span {
	display: block;
	width: 0%;
	height: 100%;
	border-radius: 99px;
	background: var(--osd-ring, var(--osd-navy));
	transition: width 1s ease-out;
	transition-delay: var(--osd-fill-delay, 0s);
}

.osd-meter.is-animated .osd-meter-bar span {
	width: var(--osd-bar, 0%);
}

@media (prefers-reduced-motion: reduce) {
	.osd-ring-arc,
	.osd-meter-bar span {
		transition: none;
	}

	.osd-ring-arc {
		stroke-dashoffset: var(--osd-ring-offset);
	}

	.osd-meter-bar span {
		width: var(--osd-bar, 0%);
	}
}

.osd-meter.is-quiz { --osd-ring: #2a6edb; }
.osd-meter.is-skills { --osd-ring: #0f8ec8; }
.osd-meter.is-essay { --osd-ring: #ff8a3d; }
.osd-meter.is-speaking { --osd-ring: #6b5dd3; }
.osd-meter.is-h5p { --osd-ring: #16875b; }

.osd-dash-grid {
	display: grid;
	grid-template-columns: 1.45fr 0.75fr;
	gap: 1.35rem;
}

.osd-dash-panel {
	padding: 1.4rem 1.45rem 1.15rem;
	background: #fff;
	border: 1px solid var(--osd-line);
	border-radius: 20px;
}

.osd-dash-panel-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.35rem;
}

.osd-dash-panel-title h3 {
	margin: 0;
	color: var(--osd-navy);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.25;
	text-transform: none;
}

.osd-dash-panel-title a,
.osd-dash-task-link {
	color: #2a6edb;
	font-size: 0.82rem;
	font-weight: 800;
	text-decoration: none;
}

.osd-dash-panel-title a:hover,
.osd-dash-task-link:hover,
.osd-dash-panel-title a:focus-visible,
.osd-dash-task-link:focus-visible {
	color: #1d4ed8;
	text-decoration: none;
}

.osd-dash-task {
	display: grid;
	grid-template-columns: 42px 1fr auto;
	gap: 0.85rem;
	align-items: center;
	padding: 1rem 0;
	border-top: 1px solid var(--osd-line);
}

.osd-dash-task:first-of-type {
	border-top: 0;
	padding-top: 0.7rem;
}

.osd-dash-task-icon {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 12px;
	background: #eef6fb;
	color: #2a6edb;
	font-weight: 800;
}

.osd-dash-task:nth-child(3) .osd-dash-task-icon {
	background: #fff3ea;
	color: var(--osd-orange);
}

.osd-dash-task:nth-child(4) .osd-dash-task-icon {
	background: #eef9f4;
	color: #16875b;
}

.osd-dash-task-copy strong {
	display: block;
	margin-bottom: 0.2rem;
	color: var(--osd-navy);
	font-size: 0.9rem;
}

.osd-dash-task-copy span {
	color: var(--osd-body);
	font-size: 0.75rem;
}

.osd-dash-stats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.75rem;
}

.osd-dash-stat {
	padding: 1.05rem 1rem;
	border-radius: 13px;
	background: #f7f9fc;
}

.osd-dash-stat strong {
	display: block;
	margin-bottom: 0.4rem;
	color: var(--osd-navy);
	font-size: 1.7rem;
	line-height: 1;
}

.osd-dash-stat span {
	color: var(--osd-body);
	font-size: 0.75rem;
}

.osd-dash-lower {
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	gap: 1.35rem;
	margin-top: 2rem;
}

.osd-dash-activity-list {
	display: grid;
}

.osd-dash-activity {
	display: grid;
	grid-template-columns: 30px 1fr auto;
	gap: 0.75rem;
	align-items: start;
	padding: 0.9rem 0;
	border-top: 1px solid var(--osd-line);
}

.osd-dash-activity:first-child {
	border-top: 0;
	padding-top: 0.35rem;
}

.osd-dash-activity-mark {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 9px;
	background: #f2f4f7;
	color: var(--osd-navy);
	font-size: 0.75rem;
	font-weight: 800;
}

.osd-dash-activity-copy strong {
	display: block;
	margin-bottom: 0.15rem;
	color: var(--osd-navy);
	font-size: 16px;
}

.osd-dash-activity-copy span {
	color: var(--osd-body);
	font-size: 16px;
}

.osd-dash-activity-time {
	color: #98a2b3;
	font-size: 16px;
	white-space: nowrap;
}

.osd-dash-activity-empty {
	margin: 0.35rem 0 0;
	color: var(--osd-body);
	font-size: 16px;
}

.osd-dash-growth {
	padding: 1.55rem;
	border: 1px solid #f2dec2;
	border-radius: 20px;
	background: linear-gradient(180deg, #fff9f0, #fff4e4);
}

.osd-dash-growth-head {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	margin-bottom: 0.85rem;
}

.osd-dash-growth-icon {
	display: grid;
	place-items: center;
	flex: 0 0 54px;
	width: 54px;
	height: 54px;
	border-radius: 16px;
	background: #fff;
	font-size: 1.5rem;
	box-shadow: 0 8px 20px rgba(120, 85, 0, 0.08);
}

.osd-dash-growth-icon img {
	display: block;
	width: 42px;
	height: 42px;
	object-fit: contain;
}

.osd-dash-growth-kicker {
	margin: 0;
	color: #0b1f4d;
	font-size: 26px;
	font-weight: 600;
	letter-spacing: normal;
	line-height: 1.25;
	text-transform: none;
}

.osd-dash-growth h3 {
	margin: 0.4rem 0 0.5rem;
	color: var(--osd-navy);
	font-size: 22px;
	font-weight: 500;
	line-height: 1.3;
}

.osd-dash-growth > p {
	margin: 0 0 1.1rem;
	color: var(--osd-body);
	font-size: 18px;
	line-height: 30px;
}

.osd-dash-growth-links {
	display: grid;
	gap: 0.65rem;
}

.osd-dash-growth-links a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.85rem;
	padding: 0.75rem 0.8rem;
	border: 1px solid rgba(219, 190, 143, 0.45);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.7);
	color: var(--osd-navy);
	font-size: 0.82rem;
	font-weight: 800;
	text-decoration: none;
}

.osd-dash-growth-links a span:first-child {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}

.osd-dash-growth-links a svg,
.osd-dash-growth-links a img {
	display: block;
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	object-fit: contain;
}

.osd-dash-growth-links a span:last-child {
	color: #b47c00;
}

.osd-dash-growth-links a:hover,
.osd-dash-growth-links a:focus-visible {
	background: #fff;
	text-decoration: none;
}

.osd .osd-journey {
	width: auto;
	max-width: none;
	margin: 0 0 2rem;
	padding-right: 0;
	padding-left: 0;
}

.osd-dash-band .osd-dash-leaderboard,
.osd-dash-band-inner > .osd-collage-section {
	margin-top: 0;
}

.osd .osd-dash-leaderboard {
	margin-top: 2.75rem;
}

.osd .osd-dash-band .osd-dash-leaderboard {
	margin-top: 0;
}

.osd .osd-dash-leaderboard .osd-leaderboard {
	margin-top: 0;
}

.osd .osd-dash-leaderboard .osd-j-head {
	margin-bottom: 1.75rem;
}

.osd .osd-dash-leaderboard .osd-j-head h2 {
	margin: 0 0 0.4rem;
	color: #0b1f4d;
	font-family: "Segoe UI", Segoe, sans-serif;
	font-size: 30px;
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 35px;
	text-align: left;
}

.osd .osd-dash-leaderboard .osd-j-head p:not(.osd-section-kicker) {
	margin: 0;
	color: #667085;
	font-family: "Segoe UI", Segoe, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	text-align: left;
}

.osd .osd-journey-intro {
	max-width: 42rem;
	margin: 0 0 1.75rem;
	font-family: "Segoe UI", Segoe, sans-serif;
	text-align: left;
}

.osd .osd-section-kicker {
	margin: 0 0 0.35rem;
	color: var(--osd-orange);
	font-family: "Segoe UI", Segoe, sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.09em;
	line-height: 16px;
	text-align: left;
	text-transform: uppercase;
}

.osd .osd-journey-intro .osd-section-kicker {
	padding-top: 0;
}

.osd .osd-journey-intro h2 {
	margin: 0 0 0.4rem;
	padding-top: 0;
	color: #0b1f4d;
	font-family: "Segoe UI", Segoe, sans-serif;
	font-size: 30px;
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 35px;
	text-align: left;
}

.osd .osd-journey-intro p:not(.osd-section-kicker) {
	margin: 0;
	color: #667085;
	font-family: "Segoe UI", Segoe, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
}

.osd .osd-journey-intro strong {
	color: #0b1f4d;
}

.osd-cards {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 0.75rem;
}

.osd-cards > .osd-card {
	grid-column: span 2;
}

.osd-cards > .osd-card:nth-child(4) {
	grid-column: 2 / 4;
}

.osd-cards > .osd-card:nth-child(5) {
	grid-column: 4 / 6;
}

.osd-card {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-height: 0;
	padding: 1.1rem 1.05rem 0.95rem;
	overflow: hidden;
	background: #fff;
	border: 1px solid #e5eaf0;
	border-radius: 18px;
	color: inherit;
	text-decoration: none;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.osd-card.is-image {
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}

.osd-card.is-image::before {
	content: none;
	display: none;
}

.osd-card.is-image img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 18px;
	transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.osd-card.is-image:hover,
.osd-card.is-image:focus-visible {
	transform: none;
	box-shadow: none;
}

.osd-card.is-image:hover img,
.osd-card.is-image:focus-visible img {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(15, 43, 96, 0.12);
	filter: brightness(1.02);
}

.osd-card::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 4px;
	background: #2a6edb;
}

.osd-card:hover,
.osd-card:focus-visible {
	color: inherit;
	text-decoration: none;
	outline: none;
	transform: translateY(-3px);
	box-shadow: 0 14px 40px rgba(16, 24, 40, 0.07);
}

.osd-card-head {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.85rem;
}

.osd-card-titles {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.osd-icon {
	display: grid;
	place-items: center;
	flex: 0 0 58px;
	width: 58px;
	height: 58px;
	border-radius: 14px;
	background: transparent;
	font-size: 1.3rem;
	line-height: 1;
}

.osd-icon img {
	display: block;
	width: 58px;
	height: 58px;
	object-fit: contain;
}

.osd-name {
	color: #0b1f4d;
	font-size: 20px;
	font-weight: 800;
	line-height: 1.25;
}

.osd-role {
	display: block;
	margin-top: 0.15rem;
	color: #2a6edb;
	font-size: 14px;
	font-weight: 800;
}

.osd-blurb {
	flex: 1 1 auto;
	margin: 0;
	color: #667085;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.55;
}

.osd-card-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	align-self: flex-end;
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	margin-top: 0.85rem;
	padding: 0;
	border-radius: 50%;
	background: #f3f6fa;
	color: #0b1f4d;
	line-height: 0;
	transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.osd-card-arrow svg {
	display: block;
	width: 18px;
	height: 18px;
}

.osd-card:hover .osd-card-arrow,
.osd-card:focus-visible .osd-card-arrow {
	background: #2a6edb;
	color: #fff;
	transform: translateX(3px);
}

.osd-card.is-practise::before { background: #ff8a3d; }
.osd-card.is-practise .osd-icon { background: transparent; }
.osd-card.is-practise .osd-role { color: #ff8a3d; }
.osd-card.is-practise:hover .osd-card-arrow,
.osd-card.is-practise:focus-visible .osd-card-arrow { background: #ff8a3d; }

.osd-card.is-create::before { background: #16875b; }
.osd-card.is-create .osd-icon { background: transparent; }
.osd-card.is-create .osd-role { color: #16875b; }
.osd-card.is-create:hover .osd-card-arrow,
.osd-card.is-create:focus-visible .osd-card-arrow { background: #16875b; }

.osd-card.is-track::before { background: #6b5dd3; }
.osd-card.is-track .osd-icon { background: transparent; }
.osd-card.is-track .osd-role { color: #6b5dd3; }
.osd-card.is-track:hover .osd-card-arrow,
.osd-card.is-track:focus-visible .osd-card-arrow { background: #6b5dd3; }

.osd-card.is-grow::before { background: #e6a700; }
.osd-card.is-grow .osd-icon { background: transparent; }
.osd-card.is-grow .osd-role { color: #c58c00; }
.osd-card.is-grow:hover .osd-card-arrow,
.osd-card.is-grow:focus-visible .osd-card-arrow { background: #e6a700; color: #fff; }

.osd-collage-section {
	margin-top: 3rem;
}

.osd-collage-header {
	margin-bottom: 1.1rem;
}

.osd-collage-label {
	margin: 0 0 0.35rem;
	color: var(--osd-orange);
	font-family: "Segoe UI", Segoe, sans-serif;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.09em;
	line-height: 20px;
	text-transform: uppercase;
}

.osd-collage-header h2 {
	margin: 0 0 0.35rem;
	color: var(--osd-navy);
	font-family: "Segoe UI", Segoe, sans-serif;
	font-size: 30px;
	font-weight: 600;
	line-height: 35px;
}

.osd-collage-header p:last-child {
	max-width: 42rem;
	color: var(--osd-body);
	font-family: "Segoe UI", Segoe, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
}

.osd-collage {
	display: grid;
	grid-template-columns: 1.3fr 0.85fr 0.85fr;
	grid-template-rows: 1fr 1fr;
	gap: 10px;
	height: 410px;
}

.osd-collage figure {
	position: relative;
	margin: 0;
	overflow: hidden;
	border-radius: 20px;
	background: #eaf0f5;
	min-height: 0;
}

.osd-collage figure:first-child {
	grid-row: 1 / 3;
}

.osd-collage figure:nth-child(2) {
	grid-column: 2 / 4;
}

.osd-collage img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	pointer-events: none;
	user-select: none;
	-webkit-user-drag: none;
	-webkit-touch-callout: none;
	transition: transform 0.35s ease;
}

.osd-collage-shield {
	position: absolute;
	inset: 0;
	z-index: 2;
	background: transparent;
	-webkit-touch-callout: none;
	user-select: none;
}

.osd-collage figure:hover img {
	transform: scale(1.025);
}

@media (max-width: 1100px) {
	.osd-cards {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
}

@media (max-width: 980px) {
	.osd-dash-hero-inner,
	.osd-dash-grid,
	.osd-dash-lower {
		grid-template-columns: 1fr;
	}

	html body.osd-shell .osd-dash-hero-inner > .osd-dash-mascot,
	.osd-dash-mascot {
		margin: 0 auto;
		justify-self: center;
	}

	.osd-collage {
		height: 520px;
		grid-template-columns: 1fr 1fr;
	}

	.osd-collage figure:first-child {
		grid-column: 1 / 3;
		grid-row: auto;
	}

	.osd-collage figure:nth-child(2) {
		grid-column: auto;
	}

	.osd-progress-meters {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.osd-dash-continue {
		grid-template-columns: 1fr auto;
	}
}

@media (max-width: 760px) {
	.osd-cards {
		grid-template-columns: 1fr 1fr;
	}

	.osd-cards > .osd-card,
	.osd-cards > .osd-card:nth-child(4),
	.osd-cards > .osd-card:nth-child(5) {
		grid-column: auto;
	}
}

@media (max-width: 640px) {
	.osd-progress-head,
	.osd-dash-continue {
		grid-template-columns: 1fr;
	}

	.osd-progress-head {
		display: grid;
		align-items: start;
	}

	.osd-dash-continue {
		grid-template-columns: 1fr;
	}

	.osd-dash-task {
		grid-template-columns: 42px 1fr;
	}

	.osd-dash-task-link {
		grid-column: 2;
	}

	.osd-dash-activity {
		grid-template-columns: 30px 1fr;
	}

	.osd-dash-activity-time {
		grid-column: 2;
	}

	.osd-collage {
		height: auto;
		grid-template-columns: 1fr;
	}

	.osd-collage figure,
	.osd-collage figure:first-child,
	.osd-collage figure:nth-child(2) {
		grid-column: auto;
		grid-row: auto;
		height: 210px;
	}
}

@media (max-width: 560px) {
	.osd-cards,
	.osd-progress-meters {
		grid-template-columns: 1fr;
	}

	.osd-cards > .osd-card,
	.osd-cards > .osd-card:nth-child(4),
	.osd-cards > .osd-card:nth-child(5) {
		grid-column: auto;
	}
}