diff --git a/sites/eclipse/page.css b/sites/eclipse/page.css
index 5447b3171a1..8dbbd050692 100644
--- a/sites/eclipse/page.css
+++ b/sites/eclipse/page.css
@@ -1,35 +1,217 @@
 @import "https://eclipse.dev/eclipse.org-common/themes/solstice/public/stylesheets/astro.min.css";
-@import "https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap";
 
 :root {
 	interpolate-size: allow-keywords;
-	--marker-error: red;
-	--marker-warning: orange;
-	--marker-info: dodgerblue;
-	--marker-task: dodgerblue;
+
+	/* Brand / accent palette */
+	--color-accent: #2c5aa0;
+	--color-accent-hover: #1f4478;
+	--color-accent-soft: #eaf1fb;
+
+	/* Neutrals */
+	--color-text: #1f2933;
+	--color-text-muted: #52606d;
+	--color-surface: #ffffff;
+	--color-surface-alt: #f7f9fc;
+	--color-surface-hover: #eef2f7;
+	--color-border: #e1e6ec;
+	--color-border-strong: #c4ccd6;
+
+	/* Status */
+	--marker-error: #d64545;
+	--marker-warning: #e58e26;
+	--marker-info: #2c7be5;
+	--marker-task: #2c7be5;
+	--color-success: #2f855a;
+	--color-success-soft: #e6f4ec;
+	--color-error-soft: #fdecec;
+	--color-warning-soft: #fdf3e2;
+
+	/* Shape & motion */
+	--radius-sm: 4px;
+	--radius-md: 6px;
+	--radius-lg: 10px;
+	--shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 1px rgba(15, 23, 42, 0.03);
+	--shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.18);
+	--ease: cubic-bezier(0.2, 0.8, 0.2, 1);
+}
+
+@media (prefers-color-scheme: dark) {
+	:root {
+		--color-accent: #6aa1e0;
+		--color-accent-hover: #95bef0;
+		--color-accent-soft: #1c2b40;
+
+		--color-text: #e6ebf2;
+		--color-text-muted: #9aa5b4;
+		--color-surface: #161a21;
+		--color-surface-alt: #1d222b;
+		--color-surface-hover: #242b36;
+		--color-border: #2a313c;
+		--color-border-strong: #3a4250;
+
+		--color-success-soft: #1d3327;
+		--color-error-soft: #3a1f22;
+		--color-warning-soft: #3a2c17;
+
+		--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
+		--shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.6);
+	}
+
+	body,
+	.solstice-content,
+	#novaContent,
+	.novaContent,
+	#midcolumn,
+	main#content {
+		background-color: var(--color-surface) !important;
+		color: var(--color-text);
+	}
+
+	a {
+		color: var(--color-accent);
+	}
+	a:hover {
+		color: var(--color-accent-hover);
+	}
+
+	/* Solstice TOC sidebar */
+	#toc-container,
+	#toc-container aside,
+	.ul-left-nav,
+	.ul-left-nav .sideitem,
+	#toc-target,
+	#table-of-contents {
+		background-color: var(--color-surface-alt) !important;
+		color: var(--color-text) !important;
+		border-color: var(--color-border) !important;
+	}
+
+	.ul-left-nav .sideitem {
+		border: 1px solid var(--color-border);
+		border-radius: var(--radius-md);
+	}
+
+	.ul-left-nav strong,
+	.ul-left-nav .sideitem strong {
+		color: var(--color-text) !important;
+	}
+
+	#table-of-contents a,
+	.ul-left-nav a {
+		color: var(--color-text) !important;
+	}
+
+	#table-of-contents a:hover,
+	.ul-left-nav a:hover {
+		color: var(--color-accent) !important;
+	}
+
+	/* Solstice footer */
+	footer#footer,
+	#footer,
+	#footer .container,
+	#footer .footer-sections,
+	#footer .footer-section {
+		background-color: var(--color-surface-alt) !important;
+		color: var(--color-text) !important;
+		border-top: 1px solid var(--color-border);
+	}
+
+	#footer .menu-heading {
+		color: var(--color-text) !important;
+	}
+
+	#footer a,
+	#footer .nav a,
+	#footer #copyright-text {
+		color: var(--color-text-muted) !important;
+	}
+
+	#footer a:hover {
+		color: var(--color-accent) !important;
+	}
+
+	/* Breadcrumb */
+	.breadcrumb,
+	.breadcrumbs-default-margin {
+		background-color: transparent !important;
+		color: var(--color-text-muted);
+	}
+}
+
+/* ---------- Base ---------- */
+
+body {
+	color: var(--color-text);
+	font-size: 15px;
+	line-height: 1.6;
+}
+
+main {
+	max-width: 1180px;
+	margin: 0 auto;
+	padding: 0 1rem 3rem;
+}
+
+a {
+	color: var(--color-accent);
+	text-decoration: none;
+}
+
+a:hover {
+	color: var(--color-accent-hover);
+	text-decoration: underline;
 }
 
 .breadcrumbs-default-margin {
 	margin-bottom: 5px;
 }
 
+/* ---------- Tables ---------- */
+
 table {
 	table-layout: fixed;
 	width: 100%;
-	border-collapse: collapse;
+	border-collapse: separate;
+	border-spacing: 0;
+	background: var(--color-surface);
+	border: 1px solid var(--color-border);
+	border-radius: var(--radius-md);
+	overflow: hidden;
+	box-shadow: var(--shadow-sm);
+	margin: 0.75rem 0 1.25rem;
+}
+
+thead th {
+	background-color: var(--color-surface-alt);
+	color: var(--color-text);
+	font-weight: 700;
+	font-size: 1.4rem !important;
+	padding-top: 0.8rem;
+	padding-bottom: 0.8rem;
+	border-bottom: 2px solid var(--color-border-strong);
+}
+
+th,
+td {
+	text-align: start;
+	padding: 0.65rem 0.85rem;
+	vertical-align: middle;
+	overflow-wrap: break-word;
 }
 
-tr {
-	border-top: 1px solid lightgray;
-	border-bottom: 1px solid lightgray;
+tbody tr {
+	border-top: 1px solid var(--color-border);
 }
 
-tr:nth-child(even) {
-	background-color: whitesmoke;
+tbody tr:first-child {
+	border-top: none;
 }
 
+tbody tr:nth-child(even),
 tr:nth-child(even of .collapsible-table-main-row) {
-	background-color: whitesmoke;
+	background-color: var(--color-surface-alt);
 }
 
 tr.no-zebra-striping {
@@ -38,140 +220,156 @@ tr.no-zebra-striping {
 }
 
 tr.collapsible-table-main-row:hover,
-tr:hover {
-	background-color: gainsboro;
+tbody tr:hover {
+	background-color: var(--color-accent-soft);
+	transition: background-color 0.12s var(--ease);
 }
 
-th {
-	background-color: lightsteelblue;
-}
-
-th,
-td {
-	text-align: start;
-	padding: 5px;
-}
+/* ---------- Lists ---------- */
 
 ul {
-	list-style-type: square;
+	list-style-type: disc;
+	padding-left: 1.4rem;
 }
 
+/* ---------- Code ---------- */
+
 code {
-	background-color: lavender;
-	color: darkslategray;
-	border-radius: 2px;
+	background-color: var(--color-surface-alt);
+	color: var(--color-text);
+	border: 1px solid var(--color-border);
+	border-radius: var(--radius-sm);
+	padding: 0.05em 0.35em;
 }
 
-/* table of content */
+/* ---------- Table of contents ---------- */
 
 li.toc-item {
-	padding: 3px;
+	padding: 4px 8px;
 	list-style-type: none;
+	border-radius: var(--radius-sm);
 }
 
 li.toc-item:hover {
-	background-color: gainsboro;
+	background-color: var(--color-surface-hover);
 }
 
 li.toc-item a {
-	/*Supress styling of links in TOC items*/
 	color: inherit;
 	text-decoration: none;
 }
 
-/* Pop-up dialog*/
+/* ---------- Pop-up dialog ---------- */
 
 .details-icon {
-	/*darker steelblue*/
-	color: rgb(48, 89, 122);
-	background: none;
 	display: inline-flex;
 	align-items: center;
 	justify-content: center;
-
-	/* Circle as border*/
-	border: 2.5px solid currentColor;
+	border: none;
+	background: none;
+	padding: 0 0.15em;
+	font-size: 0.95em;
+	line-height: 1;
+	margin-left: 0.4em;
+	vertical-align: middle;
+	cursor: pointer;
 	border-radius: 50%;
-	width: 1em;
-	height: 1em;
-	font-size: 0.9em;
-
-	margin-left: 0.3em;
 }
 
 dialog.details-popup {
-	border: none;
-	border-radius: 2px;
-	padding: 2em;
+	border: 1px solid var(--color-border);
+	border-radius: var(--radius-lg);
+	padding: 2rem;
 	position: fixed;
+	background: var(--color-surface);
+	color: var(--color-text);
+	box-shadow: var(--shadow-lg);
+	max-width: min(640px, 92vw);
 }
 
 dialog.details-popup::backdrop {
-	background: rgba(0, 0, 0, 0.5);
-	backdrop-filter: blur(3px);
+	background: rgba(15, 23, 42, 0.55);
+	backdrop-filter: blur(4px);
 }
 
 dialog.details-popup button.close-btn {
 	position: absolute;
-	top: 0.25em;
-	right: 0.25em;
+	top: 0.65rem;
+	right: 0.75rem;
+	width: 2rem;
+	height: 2rem;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
 	line-height: 1;
-	font-size: 2.5em;
+	font-size: 1.4rem;
 	padding: 0;
 	border: none;
 	background: none;
-	color: dimgray;
+	color: var(--color-text-muted);
+	cursor: pointer;
+	border-radius: 50%;
 }
 
 dialog.details-popup button.close-btn:hover {
-	color: black;
+	color: var(--color-text);
+	background-color: var(--color-surface-hover);
 }
 
-/* Details sections */
+/* ---------- Details / accordions ---------- */
 
 details {
-	background-color: whitesmoke;
+	background-color: var(--color-surface);
+	border: 1px solid var(--color-border);
+	border-radius: var(--radius-md);
+	margin: 0.5rem 0;
+	box-shadow: var(--shadow-sm);
+	overflow: hidden;
 }
 
 details summary {
-	font-weight: bold;
-	background-color: lightsteelblue;
-	padding: 5px;
+	font-weight: 600;
+	background-color: var(--color-surface-alt);
+	color: var(--color-text);
+	padding: 0.65rem 0.9rem;
 	cursor: pointer;
-	/* Ensure state triangle in closed state */
 	display: list-item;
 	list-style-type: disclosure-closed;
+	transition: background-color 0.12s var(--ease), color 0.12s var(--ease);
 }
 
 details[open] summary {
-	/* Ensure state triangle in open state */
 	list-style-type: disclosure-open;
+	border-bottom: 1px solid var(--color-border);
 }
 
 details summary:hover {
-	color: white;
-	background-color: #4B78B4;
+	color: var(--color-accent-hover);
+	background-color: var(--color-accent-soft);
 }
 
-/* Slide down/up animation when opening/closing details */
 details::details-content {
-	transition: height 0.5s ease, opacity 0.5s ease;
+	transition: height 0.4s var(--ease), opacity 0.4s var(--ease);
 	height: 0;
 	opacity: 0;
 	overflow: hidden;
+	padding: 0 0.9rem;
 }
 
 details[open]::details-content {
 	height: auto;
 	opacity: 1;
+	padding: 0.9rem;
 }
 
-/* Miscellaneous */
+/* ---------- Miscellaneous ---------- */
 
 .error-message-box {
-	background-color: #ffdddd;
-	border-left: 6px solid crimson;
-	padding: 5px;
+	background-color: var(--color-error-soft);
+	border-left: 4px solid var(--marker-error);
+	border-radius: var(--radius-sm);
+	padding: 0.6rem 0.85rem;
+	color: var(--color-text);
 }
 
 .single-line-truncate {
@@ -181,49 +379,51 @@ details[open]::details-content {
 }
 
 .file-hash-value {
-	/* A brighter lavender: */
-	background-color: #f2f2fc;
+	background-color: var(--color-surface-alt);
+	color: var(--color-text-muted);
+	border: 1px solid var(--color-border);
+	border-radius: var(--radius-sm);
 	min-width: 3em;
 	flex: 1 1 5em;
-	padding: 1px;
-	padding-left: 4px;
+	padding: 2px 6px;
+	font-size: 0.82em;
 }
 
-/* Collapsibles/accordion tables */
+/* ---------- Collapsible / accordion tables ---------- */
+
 .collapsible-table-main-row {
 	cursor: pointer;
 }
 
 .collapsible-table-details-row td {
-	/*remove padding from details row's cells so it can collapse fully.*/
 	padding: 0;
 }
 
 .collapsible-table-animation-wrapper {
 	display: grid;
 	grid-template-rows: 0fr;
-	transition: grid-template-rows 0.5s ease-out;
+	transition: grid-template-rows 0.4s var(--ease);
 }
 
-/*Use a grid wrapper to transition from 0fr (closed) to 1fr (open).*/
-
 .collapsible-table-animation-wrapper.open {
 	grid-template-rows: 1fr;
 }
 
 .collapsible-table-details-content {
-	padding: 15px;
-	border-left: 4px solid lightsteelblue;
-	background-color: white;
+	padding: 1rem 1.2rem;
+	border-left: 3px solid var(--color-accent);
+	background-color: var(--color-surface-alt);
 }
 
+/* ---------- Spinner ---------- */
+
 .data-loader-spinner {
 	width: 20px;
 	height: 20px;
-	border: 3px solid #DDD;
-	border-top: 3px solid lightsteelblue;
+	border: 3px solid var(--color-border);
+	border-top: 3px solid var(--color-accent);
 	border-radius: 50%;
-	animation: spinner-spin 1.5s linear infinite;
+	animation: spinner-spin 1.1s linear infinite;
 }
 
 @keyframes spinner-spin {
@@ -232,36 +432,47 @@ details[open]::details-content {
 	}
 }
 
+/* ---------- Copy / icon buttons ---------- */
+
 .copy-icon {
 	border: none;
 	background: none;
 	cursor: pointer;
+	padding: 2px 4px;
+	border-radius: var(--radius-sm);
+	color: var(--color-text-muted);
+	transition: transform 0.12s var(--ease), color 0.12s var(--ease), background-color 0.12s var(--ease);
 }
 
 .copy-icon:hover {
-	transform: scale(1.2);
+	color: var(--color-accent);
+	background-color: var(--color-accent-soft);
+	transform: scale(1.15);
 }
 
-/*Code editor*/
+/* ---------- Code editor block ---------- */
+
 .code-editor-box {
 	display: flex;
-	align-items: center;
-	background-color: white;
-	border: 1px solid lightgray;
-	font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
+	align-items: stretch;
+	background-color: var(--color-surface);
+	border: 1px solid var(--color-border);
+	border-radius: var(--radius-md);
+	overflow: hidden;
 }
 
 .code-editor-line {
-	background-color: whitesmoke;
-	color: gray;
-	padding: 8px 3px;
-	border-right: 1px solid lightgray;
+	background-color: var(--color-surface-alt);
+	color: var(--color-text-muted);
+	padding: 8px 6px;
+	border-right: 1px solid var(--color-border);
 	text-align: right;
-	min-width: 30px;
+	min-width: 32px;
+	user-select: none;
 }
 
 .code-editor-content {
-	padding: 8px 7px;
+	padding: 8px 12px;
 	overflow-x: auto;
 	white-space: nowrap;
 }
@@ -270,4 +481,4 @@ details[open]::details-content {
 	text-decoration: underline;
 	text-decoration-style: wavy;
 	text-decoration-thickness: 1.1px;
-}
\ No newline at end of file
+}