/* Scientis — public styles (report card, dashboards, forms) */

:root {
	--sci-bg: #f6f7f9;
	--sci-surface: #ffffff;
	--sci-border: #e4e7ec;
	--sci-text: #101828;
	/* Both clear WCAG AA on every surface the report card uses. */
	--sci-muted: #475467;
	--sci-faint: #5a6b7f;
	--sci-brand: #1d4ed8;
	--sci-brand-dark: #1e3a8a;
	--sci-track: #eef1f5;
	--sci-radius: 14px;
	--sci-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .06);
	--sci-shadow-lg: 0 4px 6px -2px rgba(16, 24, 40, .03), 0 12px 16px -4px rgba(16, 24, 40, .08);
}

.scientis-page {
	margin: 0;
	background: var(--sci-bg);
	color: var(--sci-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 15px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}

.scientis-page *,
.scientis-page *::before,
.scientis-page *::after { box-sizing: border-box; }

.scientis-wrap {
	max-width: 1040px;
	margin: 0 auto;
	padding: 0 20px;
}

/* ---------- Password gate ---------- */

.scientis-gate-page {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
	background: linear-gradient(160deg, #eef2ff 0%, #f6f7f9 45%, #f6f7f9 100%);
}

.scientis-gate { width: 100%; max-width: 400px; padding: 24px; }

.scientis-gate-card {
	background: var(--sci-surface);
	border: 1px solid var(--sci-border);
	border-radius: 18px;
	box-shadow: var(--sci-shadow-lg);
	padding: 34px 30px 28px;
	text-align: center;
}

.scientis-gate-mark { color: var(--sci-brand); margin-bottom: 14px; }
.scientis-gate-institute {
	margin: 0 0 4px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--sci-faint);
}
.scientis-gate-name { margin: 0 0 8px; font-size: 24px; font-weight: 700; letter-spacing: -.02em; }
.scientis-gate-sub { margin: 0 0 22px; font-size: 14px; color: var(--sci-muted); }
.scientis-gate-form { text-align: left; }
.scientis-gate-help { margin: 18px 0 0; font-size: 13px; color: var(--sci-muted); }
.scientis-gate-help a { color: var(--sci-brand); font-weight: 600; }
.scientis-gate-footer { margin: 18px 0 0; text-align: center; font-size: 13px; }
.scientis-gate-footer a { color: var(--sci-muted); text-decoration: none; }

/* ---------- Forms ---------- */

.scientis-label {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	font-weight: 600;
	color: var(--sci-text);
}

.scientis-input,
.scientis-select,
.scientis-textarea {
	width: 100%;
	padding: 11px 13px;
	font: inherit;
	font-size: 15px;
	color: var(--sci-text);
	background: #fff;
	border: 1px solid #d0d5dd;
	border-radius: 10px;
	transition: border-color .15s, box-shadow .15s;
}

.scientis-input:focus,
.scientis-select:focus,
.scientis-textarea:focus {
	outline: none;
	border-color: var(--sci-brand);
	box-shadow: 0 0 0 3px rgba(29, 78, 216, .12);
}

.scientis-textarea { min-height: 96px; resize: vertical; }
.scientis-field { margin-bottom: 16px; }
.scientis-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.scientis-hint { margin: 5px 0 0; font-size: 12px; color: var(--sci-faint); }

.scientis-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	padding: 10px 16px;
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	border-radius: 10px;
	border: 1px solid transparent;
	cursor: pointer;
	text-decoration: none;
	transition: background .15s, border-color .15s, transform .05s;
}
.scientis-btn:active { transform: translateY(1px); }
.scientis-btn-primary { background: var(--sci-brand); color: #fff; }
.scientis-btn-primary:hover { background: var(--sci-brand-dark); }
.scientis-btn-block { width: 100%; margin-top: 16px; padding: 12px; }
.scientis-btn-ghost { background: rgba(255, 255, 255, .12); color: #fff; border-color: rgba(255, 255, 255, .3); }
.scientis-btn-ghost:hover { background: rgba(255, 255, 255, .22); }
.scientis-btn-wa { background: #25d366; color: #06301a; }
.scientis-btn-wa:hover { background: #1fbe5b; }

/* ---------- Alerts ---------- */

.scientis-alert {
	padding: 12px 15px;
	border-radius: 10px;
	font-size: 14px;
	margin: 0 0 18px;
	border: 1px solid transparent;
}
.scientis-alert-error { background: #fef3f2; border-color: #fecdca; color: #b42318; }
.scientis-alert-warn { background: #fffaeb; border-color: #fedf89; color: #b54708; }
.scientis-alert-success { background: #ecfdf3; border-color: #a6f4c5; color: #027a48; }
.scientis-alert-info { background: #eff8ff; border-color: #b2ddff; color: #175cd3; }

/* ---------- Report header ---------- */

.scientis-header {
	background: linear-gradient(135deg, #1e3a8a 0%, #1d4ed8 55%, #2563eb 100%);
	color: #fff;
	padding: 26px 0 30px;
}
.scientis-header-inner {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	align-items: center;
	justify-content: space-between;
}
.scientis-id { display: flex; align-items: center; gap: 15px; min-width: 0; }
.scientis-avatar {
	flex: 0 0 auto;
	width: 54px; height: 54px;
	display: grid; place-items: center;
	border-radius: 50%;
	background: rgba(255, 255, 255, .18);
	border: 2px solid rgba(255, 255, 255, .35);
	font-size: 22px; font-weight: 700;
}
.scientis-eyebrow {
	margin: 0 0 2px;
	font-size: 11px; font-weight: 600;
	letter-spacing: .1em; text-transform: uppercase;
	color: rgba(255, 255, 255, .72);
}
.scientis-name { margin: 0; font-size: 26px; font-weight: 700; letter-spacing: -.02em; }
.scientis-meta { margin: 3px 0 0; font-size: 13px; color: rgba(255, 255, 255, .82); }
.scientis-meta span + span::before { content: "·"; margin: 0 7px; opacity: .6; }
.scientis-header-actions { display: flex; gap: 9px; flex-wrap: wrap; }

/* ---------- Stats ---------- */

.scientis-main { padding: 22px 20px 60px; }

.scientis-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	margin: -48px 0 20px;
}
.scientis-stat {
	background: var(--sci-surface);
	border: 1px solid var(--sci-border);
	border-radius: var(--sci-radius);
	box-shadow: var(--sci-shadow);
	padding: 16px 17px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.scientis-stat-label {
	font-size: 12px; font-weight: 600;
	letter-spacing: .04em; text-transform: uppercase;
	color: var(--sci-faint);
}
.scientis-stat-value { font-size: 30px; font-weight: 700; line-height: 1.15; letter-spacing: -.03em; }
.scientis-stat-sub { font-size: 12.5px; color: var(--sci-muted); }

/* ---------- Tabs ---------- */

.scientis-tabs {
	display: flex;
	gap: 4px;
	margin: 22px 0 16px;
	padding: 4px;
	background: #eceff3;
	border-radius: 12px;
	overflow-x: auto;
}
.scientis-tab {
	flex: 1 0 auto;
	padding: 9px 15px;
	font: inherit;
	font-size: 14px; font-weight: 600;
	color: var(--sci-muted);
	background: transparent;
	border: 0; border-radius: 9px;
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s, color .15s;
}
.scientis-tab:hover { color: var(--sci-text); }
.scientis-tab.is-active { background: #fff; color: var(--sci-brand); box-shadow: var(--sci-shadow); }

.scientis-panel { display: none; }
.scientis-panel.is-active { display: block; }

/* ---------- Cards ---------- */

.scientis-card {
	background: var(--sci-surface);
	border: 1px solid var(--sci-border);
	border-radius: var(--sci-radius);
	box-shadow: var(--sci-shadow);
	padding: 20px 22px;
	margin-bottom: 16px;
}
.scientis-card-title { margin: 0 0 4px; font-size: 16px; font-weight: 700; letter-spacing: -.01em; }
.scientis-card-sub { margin: 0 0 16px; font-size: 13.5px; color: var(--sci-muted); }
.scientis-card-note { margin: 10px 0 0; font-size: 12.5px; color: var(--sci-faint); text-align: center; }

.scientis-card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 16px;
	margin-bottom: 16px;
}
.scientis-card-grid .scientis-card { margin-bottom: 0; }
.scientis-card-chart { display: flex; flex-direction: column; align-items: center; text-align: center; }
.scientis-card-chart .scientis-card-title { margin-bottom: 14px; }

/* ---------- Donut ---------- */

.scientis-donut { position: relative; display: inline-block; }
.scientis-donut-center {
	position: absolute; inset: 0;
	display: flex; flex-direction: column;
	align-items: center; justify-content: center;
	pointer-events: none;
}
.scientis-donut-top { font-size: 24px; font-weight: 700; letter-spacing: -.03em; }
.scientis-donut-sub { font-size: 11.5px; color: var(--sci-muted); }

.scientis-legend {
	list-style: none;
	margin: 16px 0 0; padding: 0;
	display: grid; grid-template-columns: 1fr 1fr;
	gap: 5px 14px;
	font-size: 12.5px;
	width: 100%;
}
.scientis-legend li { display: flex; align-items: center; gap: 6px; color: var(--sci-muted); }
.scientis-legend b { margin-left: auto; color: var(--sci-text); }
.scientis-dot { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; }

/* ---------- Bars ---------- */

.scientis-bar {
	display: block;
	height: 8px;
	background: var(--sci-track);
	border-radius: 99px;
	overflow: hidden;
	margin: 6px 0;
}
.scientis-bar-fill { display: block; height: 100%; border-radius: 99px; transition: width .4s ease; }

/* ---------- Missed topics ---------- */

.scientis-missed { list-style: none; margin: 12px 0 0; padding: 0; }
.scientis-missed-item {
	display: flex; align-items: flex-start; gap: 14px;
	padding: 13px 0;
	border-top: 1px solid var(--sci-border);
}
.scientis-missed-item:first-child { border-top: 0; padding-top: 4px; }
.scientis-missed-date {
	flex: 0 0 46px;
	text-align: center;
	background: #fef3f2;
	border: 1px solid #fecdca;
	border-radius: 9px;
	padding: 5px 0;
}
.scientis-missed-day { display: block; font-size: 17px; font-weight: 700; color: #b42318; line-height: 1.1; }
.scientis-missed-mon { display: block; font-size: 10.5px; font-weight: 600; text-transform: uppercase; color: #b42318; }
.scientis-missed-body { flex: 1 1 auto; min-width: 0; }
.scientis-missed-topic { margin: 0; font-weight: 600; font-size: 14.5px; }
.scientis-missed-meta { margin: 2px 0 0; font-size: 12.5px; color: var(--sci-muted); }
.scientis-missed-details { margin: 5px 0 0; font-size: 13px; color: var(--sci-muted); }

/* ---------- Pills ---------- */

.scientis-pill {
	display: inline-block;
	padding: 3px 9px;
	font-size: 11.5px; font-weight: 600;
	border-radius: 99px;
	white-space: nowrap;
	background: #f2f4f7; color: var(--sci-muted);
}
.scientis-pill-present { background: #ecfdf3; color: #027a48; }
.scientis-pill-late { background: #fffaeb; color: #b54708; }
.scientis-pill-absent { background: #fef3f2; color: #b42318; }
.scientis-pill-excused { background: #eff8ff; color: #175cd3; }
.scientis-pill-pinned { background: #f4f3ff; color: #5925dc; margin-left: auto; }

/* ---------- Tables ---------- */

.scientis-table-scroll { overflow-x: auto; margin-top: 12px; }
.scientis-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.scientis-table th {
	text-align: left;
	padding: 9px 10px;
	font-size: 11.5px; font-weight: 600;
	letter-spacing: .05em; text-transform: uppercase;
	color: var(--sci-faint);
	border-bottom: 1px solid var(--sci-border);
	white-space: nowrap;
}
.scientis-table td { padding: 10px; border-bottom: 1px solid #f2f4f7; vertical-align: middle; }
.scientis-table tr:last-child td { border-bottom: 0; }

/* ---------- Upcoming tests ---------- */

.scientis-card-upcoming { border-color: #b2ddff; background: linear-gradient(180deg, #f5faff 0%, #fff 60%); }
.scientis-upcoming { list-style: none; margin: 12px 0 0; padding: 0; }
.scientis-upcoming li {
	display: flex; gap: 14px; align-items: flex-start;
	padding: 13px 0;
	border-top: 1px solid #e0f2fe;
}
.scientis-upcoming li:first-child { border-top: 0; padding-top: 2px; }
.scientis-upcoming-when {
	flex: 0 0 52px; text-align: center;
	background: #eff8ff; border: 1px solid #b2ddff;
	border-radius: 9px; padding: 6px 2px;
}
.scientis-upcoming-count { display: block; font-size: 17px; font-weight: 700; color: #175cd3; line-height: 1.1; }
.scientis-upcoming-unit { display: block; font-size: 10.5px; font-weight: 600; text-transform: uppercase; color: #2e90fa; }
.scientis-upcoming-title { margin: 0; font-weight: 600; font-size: 14.5px; }
.scientis-upcoming-meta { margin: 2px 0 0; font-size: 12.5px; color: var(--sci-muted); }
.scientis-upcoming-syllabus { margin: 6px 0 0; font-size: 13px; color: var(--sci-muted); }

/* ---------- Results ---------- */

.scientis-spark-wrap { margin: 6px 0 20px; }
.scientis-spark-label {
	margin: 0 0 4px;
	font-size: 11.5px; font-weight: 600;
	letter-spacing: .05em; text-transform: uppercase;
	color: var(--sci-faint);
}
.scientis-spark { display: block; max-width: 560px; }

.scientis-results { display: flex; flex-direction: column; gap: 14px; margin-top: 12px; }
.scientis-result {
	border: 1px solid var(--sci-border);
	border-radius: 12px;
	padding: 15px 16px;
	background: #fcfcfd;
}
.scientis-result-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.scientis-result-title { margin: 0; font-size: 15px; font-weight: 700; }
.scientis-result-meta { margin: 2px 0 0; font-size: 12.5px; color: var(--sci-muted); }
.scientis-result-score { text-align: right; flex: 0 0 auto; }
.scientis-score { display: block; font-size: 22px; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; }
.scientis-score small { font-size: 13px; font-weight: 600; color: var(--sci-faint); }
.scientis-score-pct { font-size: 12px; color: var(--sci-muted); }

.scientis-result-compare {
	list-style: none; margin: 8px 0 0; padding: 0;
	display: flex; flex-wrap: wrap; gap: 16px;
	font-size: 12.5px; color: var(--sci-muted);
}
.scientis-result-compare b { color: var(--sci-text); }

.scientis-sections { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--sci-border); }
.scientis-sections-label {
	margin: 0 0 8px;
	font-size: 11.5px; font-weight: 600;
	letter-spacing: .05em; text-transform: uppercase;
	color: var(--sci-faint);
}
.scientis-section-row {
	display: grid;
	grid-template-columns: minmax(90px, 150px) 1fr auto;
	align-items: center; gap: 12px;
	margin-bottom: 6px;
	font-size: 13px;
}
.scientis-section-name { color: var(--sci-text); font-weight: 500; }
.scientis-section-marks { color: var(--sci-muted); font-variant-numeric: tabular-nums; font-size: 12.5px; }
.scientis-result-remark {
	margin: 12px 0 0; padding: 9px 12px;
	background: #f9fafb; border-left: 3px solid var(--sci-brand);
	border-radius: 0 8px 8px 0;
	font-size: 13px; color: var(--sci-muted);
}

/* ---------- Analysis ---------- */

.scientis-analysis { display: flex; flex-direction: column; gap: 16px; }
.scientis-analysis-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.scientis-analysis-name { font-weight: 600; font-size: 14.5px; }
.scientis-analysis-val { font-weight: 700; font-size: 15px; }
.scientis-analysis-meta { margin: 2px 0 0; font-size: 12.5px; color: var(--sci-muted); }

.scientis-callout {
	margin-top: 20px; padding: 14px 16px;
	background: #fffaeb; border: 1px solid #fedf89;
	border-radius: 11px; font-size: 13.5px; color: #93370d;
}
.scientis-link-wa { display: inline-block; margin-left: 6px; color: #0e7c3f; font-weight: 600; }

/* ---------- Feed ---------- */

.scientis-feed { display: flex; flex-direction: column; gap: 14px; }
.scientis-post {
	background: var(--sci-surface);
	border: 1px solid var(--sci-border);
	border-radius: var(--sci-radius);
	box-shadow: var(--sci-shadow);
	padding: 17px 19px;
}
.scientis-post.is-pinned { border-color: #d9d6fe; background: linear-gradient(180deg, #fbfaff 0%, #fff 50%); }
.scientis-post-head { display: flex; align-items: center; gap: 11px; margin-bottom: 11px; }
.scientis-post-avatar {
	flex: 0 0 auto; width: 38px; height: 38px;
	display: grid; place-items: center; border-radius: 50%;
	background: #eef2ff; color: var(--sci-brand);
	font-weight: 700; font-size: 15px;
}
.scientis-post-author { margin: 0; font-weight: 600; font-size: 14px; }
.scientis-post-meta { margin: 0; font-size: 12px; color: var(--sci-faint); }
.scientis-post-title { margin: 0 0 7px; font-size: 15.5px; font-weight: 700; }
.scientis-post-body { font-size: 14.5px; color: #344054; }
.scientis-post-body p { margin: 0 0 9px; }
.scientis-post-body p:last-child { margin-bottom: 0; }

.scientis-embed {
	position: relative;
	padding-top: 56.25%;
	margin-top: 12px;
	border-radius: 11px;
	overflow: hidden;
	background: #101828;
}
.scientis-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.scientis-file {
	display: flex; align-items: center; gap: 12px;
	margin-top: 12px; padding: 11px 13px;
	background: #f9fafb; border: 1px solid var(--sci-border);
	border-radius: 11px; text-decoration: none; color: var(--sci-text);
	transition: background .15s, border-color .15s;
}
.scientis-file:hover { background: #f2f4f7; border-color: #d0d5dd; }
.scientis-file-icon {
	flex: 0 0 auto;
	display: grid; place-items: center;
	width: 40px; height: 40px;
	background: #fef3f2; color: #b42318;
	border-radius: 9px; font-size: 11px; font-weight: 700;
}
.scientis-file-name {
	flex: 1 1 auto; min-width: 0;
	font-size: 14px; font-weight: 500;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.scientis-file-cta { flex: 0 0 auto; font-size: 13px; font-weight: 600; color: var(--sci-brand); }

/* ---------- Misc ---------- */

.scientis-empty {
	margin: 14px 0 6px;
	padding: 22px;
	text-align: center;
	color: var(--sci-faint);
	font-size: 14px;
	background: #fafbfc;
	border: 1px dashed var(--sci-border);
	border-radius: 11px;
}

.scientis-footer {
	padding: 22px 0 34px;
	text-align: center;
	font-size: 12.5px;
	color: var(--sci-faint);
	border-top: 1px solid var(--sci-border);
	background: #fff;
}
.scientis-footer p { margin: 0 0 4px; }
.scientis-footer a { color: var(--sci-brand); text-decoration: none; font-weight: 600; }

/* ---------- Shortcode containers (inside theme pages) ---------- */

.scientis-embed-block {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: var(--sci-text);
	font-size: 15px;
	line-height: 1.55;
}
.scientis-embed-block * { box-sizing: border-box; }
.scientis-form-card {
	max-width: 560px;
	background: var(--sci-surface);
	border: 1px solid var(--sci-border);
	border-radius: var(--sci-radius);
	box-shadow: var(--sci-shadow);
	padding: 26px 26px 22px;
}
.scientis-form-title { margin: 0 0 5px; font-size: 20px; font-weight: 700; letter-spacing: -.02em; }
.scientis-form-sub { margin: 0 0 20px; font-size: 14px; color: var(--sci-muted); }
.scientis-required { color: #d92d20; }

/* ---------- Responsive ---------- */

@media (max-width: 860px) {
	.scientis-stats { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
	.scientis-header-inner { flex-direction: column; align-items: flex-start; }
	.scientis-name { font-size: 22px; }
	.scientis-stats { margin-top: -40px; gap: 10px; }
	.scientis-stat { padding: 13px 14px; }
	.scientis-stat-value { font-size: 25px; }
	.scientis-card { padding: 17px 16px; }
	.scientis-field-row { grid-template-columns: 1fr; }
	.scientis-section-row { grid-template-columns: 1fr; gap: 3px; }
	.scientis-section-marks { text-align: right; }
	.scientis-result-head { flex-direction: column; }
	.scientis-result-score { text-align: left; }
	.scientis-legend { grid-template-columns: 1fr; }

	.scientis-table thead { display: none; }
	.scientis-table tr {
		display: block;
		padding: 10px 0;
		border-bottom: 1px solid var(--sci-border);
	}
	.scientis-table td {
		display: flex;
		justify-content: space-between;
		gap: 14px;
		padding: 3px 0;
		border: 0;
		text-align: right;
	}
	.scientis-table td::before {
		content: attr(data-label);
		font-size: 12px;
		font-weight: 600;
		color: var(--sci-faint);
		text-align: left;
	}
}

@media print {
	.scientis-tabs, .scientis-header-actions, .scientis-footer a { display: none !important; }
	.scientis-panel { display: block !important; page-break-inside: avoid; }
	.scientis-page { background: #fff; }
	.scientis-header { background: #1e3a8a !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.scientis-stats { margin-top: 16px; }
}

/* =========================================================================
   Badges, milestones and homework
   ====================================================================== */

.scientis-muted { color: var(--sci-muted); }

/* ---------- The shelf ---------- */

.scientis-shelf {
	margin: 20px 0 0;
	padding: 20px;
	background: #fff;
	border: 1px solid var(--sci-border);
	border-radius: 16px;
}
.scientis-shelf-head {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 14px;
	margin-bottom: 14px;
}
.scientis-shelf-head .scientis-card-title { margin: 0; }
.scientis-shelf-rank {
	margin: 0;
	font-size: 12.5px; font-weight: 600;
	color: #175cd3; background: #eff8ff;
	border: 1px solid #b2ddff; border-radius: 999px;
	padding: 3px 11px;
}

.scientis-badges {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-wrap: wrap; gap: 8px;
}
.scientis-badge {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 7px 12px 7px 10px;
	border-radius: 999px;
	border: 1px solid transparent;
	font-size: 13px; font-weight: 600;
	line-height: 1.2;
}
.scientis-badge svg { flex: 0 0 auto; }
.scientis-badge-detail {
	font-style: normal; font-weight: 600; font-size: 11.5px;
	opacity: .8;
	padding-left: 7px; margin-left: 1px;
	border-left: 1px solid currentColor;
}

/* Badge tones. Each pairs a wash with text dark enough to clear AA on it. */
.scientis-tone-gold   { background: #fffaeb; border-color: #fedf89; color: #a15c07; }
.scientis-tone-silver { background: #f2f4f7; border-color: #d0d5dd; color: #475467; }
.scientis-tone-green  { background: #ecfdf3; border-color: #a6f4c5; color: #05603a; }
.scientis-tone-blue   { background: #eff8ff; border-color: #b2ddff; color: #175cd3; }
.scientis-tone-orange { background: #fff4ed; border-color: #f9dbaf; color: #b93815; }
.scientis-tone-purple { background: #f4f3ff; border-color: #d9d6fe; color: #5925dc; }

/* ---------- Milestones ---------- */

.scientis-miles {
	list-style: none; margin: 16px 0 0; padding: 0;
	display: grid; gap: 12px;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}
.scientis-mile {
	display: flex; gap: 11px; align-items: flex-start;
	padding: 12px 14px;
	border: 1px solid var(--sci-border);
	border-radius: 13px;
	background: #fcfcfd;
}
.scientis-mile-ico {
	display: inline-flex; align-items: center; justify-content: center;
	width: 30px; height: 30px; flex: 0 0 30px;
	border-radius: 9px;
	background: #fff; border: 1px solid currentColor;
}
.scientis-mile-body { min-width: 0; flex: 1; }
.scientis-mile-top { margin: 0; display: flex; align-items: baseline; gap: 6px; }
.scientis-mile-top strong { font-size: 18px; line-height: 1.1; color: var(--sci-text); }
.scientis-mile-top span { font-size: 12.5px; color: var(--sci-muted); }
.scientis-mile-bar {
	margin: 7px 0 5px;
	height: 6px; border-radius: 999px;
	background: #eaecf0; overflow: hidden;
}
.scientis-mile-bar span { display: block; height: 100%; border-radius: 999px; background: currentColor; }
.scientis-mile-next { margin: 0; font-size: 11.5px; color: var(--sci-muted); }

/* The tone classes colour the icon and bar; the text stays neutral. */
.scientis-mile.scientis-tone-gold,
.scientis-mile.scientis-tone-silver,
.scientis-mile.scientis-tone-green,
.scientis-mile.scientis-tone-blue,
.scientis-mile.scientis-tone-orange,
.scientis-mile.scientis-tone-purple { background: #fff; border-color: var(--sci-border); }

/* ---------- Homework list ---------- */

.scientis-hw { list-style: none; margin: 12px 0 0; padding: 0; }
.scientis-hw-row {
	display: flex; gap: 14px; align-items: flex-start; justify-content: space-between;
	padding: 14px 0;
	border-top: 1px solid var(--sci-border);
}
.scientis-hw-row:first-child { border-top: 0; padding-top: 2px; }
.scientis-hw-main { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.scientis-hw-main strong { font-size: 14.5px; }
.scientis-hw-main span { font-size: 12.5px; color: var(--sci-muted); }
.scientis-hw-detail { line-height: 1.5; }
.scientis-hw-side { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.scientis-hw-marks { font-size: 16px; font-weight: 700; color: var(--sci-text); white-space: nowrap; }
.scientis-hw-marks small { font-size: 11.5px; font-weight: 600; color: var(--sci-faint); }

.scientis-pill-done { background: #ecfdf3; color: #027a48; }
.scientis-pill-missed { background: #fef3f2; color: #b42318; }
.scientis-pill-pending { background: #f2f4f7; color: #475467; }

@media (max-width: 560px) {
	.scientis-hw-row { flex-direction: column; gap: 8px; }
	.scientis-hw-side { width: 100%; }
	.scientis-shelf { padding: 16px; }
}

/* ---------- Extra classes ---------- */

.scientis-card-extra { border-left: 3px solid #f59e0b; }

.scientis-extra { list-style: none; margin: 12px 0 0; padding: 0; }
.scientis-extra-row {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	padding: 13px 0;
	border-top: 1px solid var(--sci-border);
}
.scientis-extra-row:first-child { border-top: 0; padding-top: 2px; }
.scientis-extra-when {
	flex: 0 0 108px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.scientis-extra-when strong { font-size: 14px; white-space: nowrap; }
.scientis-extra-when span { font-size: 12.5px; color: var(--sci-muted); }
.scientis-extra-main { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.scientis-extra-main strong { font-size: 14.5px; }
.scientis-extra-main span { font-size: 12.5px; color: var(--sci-muted); }
.scientis-extra-note { line-height: 1.5; }

@media (max-width: 560px) {
	.scientis-extra-row { flex-direction: column; gap: 4px; }
	.scientis-extra-when { flex: 0 0 auto; flex-direction: row; gap: 7px; align-items: baseline; }
}

/* ---------- Photo notes in the class feed ---------- */

.scientis-shot {
	display: block;
	margin-top: 12px;
	border: 1px solid var(--sci-border);
	border-radius: 12px;
	overflow: hidden;
	background: var(--sci-track);
	line-height: 0;
}
.scientis-shot img { width: 100%; height: auto; display: block; max-height: 620px; object-fit: contain; }
.scientis-shot:hover { border-color: #b2ddff; }