kepr.css

1/* Kepr 3: Kepr 2's look (kepr.uk, gold theme), ported only as far as the pages that exist use it. */23:root {4	--bg: #090706;5	--bg-surface: #0e0c09;6	--bg-elevated: #1b1710;7	--border: #2a2018;8	--text: #c8b898;9	--text-secondary: #7a6a50;10	--text-muted: #7a6a50;11	--text-faint: #4a3a28;12	--text-heading: #e8d8b8;13	--accent: #c89a5a;14	--accent-bright: #d9b88c;15	--accent-dim: #85663c;16	--accent-flash: #5a88c8;17	--red-flash: #c8483a;18	--accent-tint-04: rgba(200, 154, 90, 0.04);19	--accent-tint-12: rgba(200, 154, 90, 0.12);20	--sage: #7a9a68;21	--sans: "Quicksand", system-ui, sans-serif;22	--mono: "Martian Mono", ui-monospace, monospace;23}2425* {26	box-sizing: border-box;27	scrollbar-width: thin;28	scrollbar-color: var(--border) transparent;29}3031html,32body {33	margin: 0;34	padding: 0;35	background: var(--bg);36	color: var(--text);37	font-family: var(--sans);38	font-size: 16px;39	line-height: 1.6;40	overflow-x: hidden;41}4243a {44	color: inherit;45	text-decoration: none;46}47a:hover {48	text-decoration: underline;49	text-decoration-color: var(--accent);50	text-decoration-thickness: 1px;51	text-underline-offset: 4px;52}5354/* ----- top bar ------------------------------------------------------------ */5556body > nav {57	display: flex;58	align-items: center;59	padding: 24px 48px;60	font-size: 0.6875rem;61	letter-spacing: 0.04em;62}63.wordmark {64	display: flex;65	color: var(--accent);66}67.wordmark:hover {68	text-decoration: none;69}70.wordmark-icon {71	display: block;72	width: 32px;73	height: 32px;74	color: var(--accent);75}76.wordmark-icon polygon {77	fill: none;78	stroke: currentColor;79	stroke-linejoin: round;80}81.tri-outer polygon {82	stroke-width: 2;83}84.tri-inner polygon {85	stroke-width: 1.5;86}87.tri-outer,88.tri-inner {89	transform-origin: 16px 16px;90}91/* The outer triangle stays gold; the inner one flashes red now and then. */92.tri-outer {93	animation: tri-ccw 12s linear infinite;94}95.tri-inner {96	animation:97		tri-cw 8s linear infinite,98		red-flash 11s ease-in-out infinite;99}100@keyframes tri-ccw {101	to {102		transform: rotate(-360deg);103	}104}105@keyframes tri-cw {106	to {107		transform: rotate(360deg);108	}109}110@keyframes red-flash {111	0%,112	90%,113	100% {114		color: var(--accent);115	}116	95% {117		color: var(--red-flash);118	}119}120.wordmark-by {121	margin-left: 10px;122	font-size: 0.625rem;123	color: var(--text-faint);124	letter-spacing: 0.03em;125}126.nav-links {127	margin-left: auto;128	display: inline-flex;129	gap: 28px;130	font-family: var(--mono);131}132.nav-links a {133	color: var(--text-secondary);134}135136main {137	max-width: 980px;138	margin: 0 auto;139	padding: 24px 48px 120px;140}141142footer {143	text-align: center;144	padding: 80px 24px 48px;145}146footer .credit {147	font-family: var(--mono);148	font-size: 0.6875rem;149	color: var(--text-muted);150}151152.mono {153	font-family: var(--mono);154	font-size: 0.8125rem;155	color: var(--text-secondary);156}157.muted {158	color: var(--text-muted);159}160161@keyframes fadeUp {162	from {163		opacity: 0;164		transform: translateY(6px);165	}166	to {167		opacity: 1;168		transform: translateY(0);169	}170}171@keyframes fadeIn {172	from {173		opacity: 0;174	}175}176177/* ----- repo header -------------------------------------------------------- */178179.repo-head {180	margin: 20px 0 24px;181}182.repo-name {183	font-family: "Comfortaa", var(--sans);184	font-weight: 700;185	font-size: 4rem;186	line-height: 1.05;187	margin: -0.1em 0 10px;188	color: var(--text);189	overflow-wrap: anywhere;190	animation: fadeUp 280ms ease both;191}192.repo-contributor {193	margin: 4px 0 0;194	font-size: 0.8125rem;195	animation: fadeUp 280ms 40ms ease both;196}197.repo-contributor a:hover {198	color: var(--accent);199}200.repo-desc,201.repo-homepage {202	margin: 0 0 10px;203	font-size: 1.0625rem;204	color: var(--text-secondary);205	line-height: 1.75;206	animation: fadeUp 280ms 30ms ease both;207}208.repo-desc p {209	margin: 12px 0 0;210}211.repo-desc a,212.repo-homepage a {213	color: var(--accent);214}215.repo-desc code {216	font-family: var(--mono);217	font-size: 0.85em;218	color: var(--accent);219}220.lang-badges {221	display: flex;222	flex-wrap: wrap;223	gap: 6px;224	margin: 8px 0 6px;225}226.lang-badge {227	font-family: var(--mono);228	font-size: 0.6875rem;229	color: var(--accent-dim);230	background: var(--bg-surface);231	border: 1px solid var(--border);232	border-radius: 3px;233	padding: 1px 7px;234	letter-spacing: 0.02em;235}236.repo-meta {237	margin: 0;238	font-size: 0.875rem;239	color: var(--text-muted);240	line-height: 1.7;241	animation: fadeUp 280ms 60ms ease both;242}243.repo-tabbar {244	display: flex;245	align-items: center;246	justify-content: space-between;247	flex-wrap: wrap;248	gap: 14px 20px;249	margin-top: 22px;250}251.repo-tabs {252	display: flex;253	gap: 24px;254	flex-wrap: wrap;255	font-family: var(--mono);256	animation: fadeUp 280ms 90ms ease both;257}258.repo-tab {259	font-size: 0.6875rem;260	color: var(--text-muted);261	padding: 0 0 11px;262	border-bottom: 1px solid transparent;263	transition:264		color 140ms,265		border-color 140ms;266}267.repo-tab:hover {268	color: var(--accent);269	text-decoration: none;270}271.repo-tab.active {272	color: var(--accent);273	border-bottom-color: var(--accent);274}275.repo-panel {276	padding: 10px 0 16px;277	animation: fadeIn 220ms ease both;278}279.repo-panel[hidden] {280	display: none;281}282/* Inline, archives and builds show about five entries and scroll; their own pages show all. */283.repo-panel .repo-section:has(> .archive-row, > .release) {284	max-height: 420px;285	overflow-y: auto;286	scrollbar-width: thin;287	scrollbar-color: var(--border) transparent;288}289.repo-steal-btn {290	display: block;291	width: fit-content;292	max-width: 100%;293	font-family: var(--mono);294	font-size: 0.75rem;295	color: var(--text-muted);296	background: var(--bg-surface);297	border: 1px solid var(--border);298	border-radius: 3px;299	padding: 5px 11px;300	cursor: pointer;301	letter-spacing: 0.03em;302	white-space: nowrap;303	overflow: hidden;304	text-overflow: ellipsis;305	transition:306		color 120ms,307		border-color 120ms;308}309.repo-steal-btn:hover,310.repo-steal-btn.copied {311	color: var(--accent);312	border-color: var(--accent-dim);313}314.install-lines {315	display: flex;316	flex-direction: column;317	align-items: flex-end;318	gap: 6px;319	max-width: 100%;320	margin-left: auto;321	animation: fadeUp 280ms 120ms ease both;322}323.install-line {324	display: flex;325	align-items: center;326	gap: 12px;327	max-width: 100%;328	font-family: var(--mono);329	font-size: 0.75rem;330	color: var(--text-muted);331	background: var(--bg-surface);332	border: 1px solid var(--border);333	border-radius: 3px;334	padding: 5px 11px;335}336.install-line code {337	white-space: pre;338	overflow-x: auto;339	font-family: inherit;340}341.copy-btn {342	background: none;343	border: 0;344	padding: 0;345	cursor: pointer;346	font: inherit;347	font-size: 0.625rem;348	color: var(--text-faint);349	letter-spacing: 0.04em;350}351.copy-btn:hover,352.copy-btn.copied {353	color: var(--accent);354}355356/* ----- sections ----------------------------------------------------------- */357358.repo-section {359	margin: 36px 0 0;360	animation: fadeIn 320ms 80ms ease both;361}362.repo-section-toggle > summary,363.repo-details-toggle > summary {364	list-style: none;365	cursor: pointer;366	user-select: none;367}368.repo-section-toggle > summary::-webkit-details-marker,369.repo-details-toggle > summary::-webkit-details-marker {370	display: none;371}372.section-head {373	display: flex;374	align-items: baseline;375	gap: 12px;376	padding-bottom: 8px;377	border-bottom: 1px solid var(--border);378	margin-bottom: 4px;379}380.section-head::after,381.repo-details-head::after {382	content: "▸";383	font-size: 0.5625rem;384	opacity: 0.4;385	transition: transform 120ms;386}387.section-head::after {388	margin-left: auto;389}390details[open] > .section-head::after,391details[open] > .repo-details-head::after {392	transform: rotate(90deg);393}394.section-label {395	font-size: 0.6875rem;396	letter-spacing: 0.12em;397	color: var(--text-secondary);398	text-transform: uppercase;399}400.section-count {401	font-family: var(--mono);402	font-size: 0.6875rem;403	color: var(--accent);404}405406/* ----- timeline ----------------------------------------------------------- */407408.timeline {409	display: block;410	margin: 18px 0 4px;411	overflow: visible;412}413.timeline-line {414	stroke: var(--text-faint);415	stroke-width: 1;416	stroke-dasharray: 4 4;417}418.timeline .dot circle {419	fill: var(--accent);420	transition:421		fill-opacity 120ms,422		r 120ms;423}424.timeline .d0 circle {425	fill: var(--accent-dim);426	fill-opacity: 0.45;427}428.timeline .d1 circle {429	fill-opacity: 0.55;430}431.timeline .d2 circle {432	fill-opacity: 0.8;433}434.timeline .d3 circle {435	fill: var(--accent-bright);436	fill-opacity: 1;437}438.timeline .dot:hover circle,439.timeline .dot:focus circle {440	fill: var(--accent-bright);441	fill-opacity: 1;442}443.timeline-canvas {444	display: block;445	margin: 18px 0 4px;446	cursor: grab;447	touch-action: pan-y;448}449.timeline-tip {450	position: fixed;451	z-index: 200;452	max-width: 340px;453	padding: 0.45rem 0.7rem;454	background: #0f0c08;455	border: 1px solid var(--border);456	border-radius: 4px;457	pointer-events: none;458	line-height: 1.5;459}460.timeline-tip .tip-id {461	font-family: var(--mono);462	font-size: 12px;463	color: var(--accent);464}465.timeline-tip .tip-msg {466	margin-top: 3px;467	font-style: italic;468	font-size: 15px;469	color: var(--text-heading);470}471.timeline-tip .tip-meta {472	margin-top: 4px;473	font-family: var(--mono);474	font-size: 10px;475	color: var(--text-muted);476}477478/* ----- history ------------------------------------------------------------ */479480.history-row {481	position: relative;482	display: grid;483	grid-template-columns: 110px 1fr auto;484	align-items: baseline;485	gap: 0 10px;486	padding: 9px 8px;487	border-bottom: 1px solid var(--border);488	transition: background 100ms;489}490.history-row::before {491	content: "";492	position: absolute;493	left: 0;494	top: 0;495	bottom: 0;496	width: 2px;497	background: var(--accent);498	transform: scaleY(0);499	transition: transform 120ms ease;500}501.history-row:hover {502	background: var(--accent-tint-04);503	text-decoration: none;504}505.history-row:hover::before {506	transform: scaleY(1);507}508.history-id {509	font-family: var(--mono);510	font-size: 0.75rem;511	color: var(--text-secondary);512}513.history-msg {514	min-width: 0;515	line-height: 1.7;516	overflow: hidden;517	text-overflow: ellipsis;518	white-space: nowrap;519	transition: color 100ms;520}521.history-row:hover .history-msg {522	color: var(--accent);523}524.history-when {525	font-family: var(--mono);526	font-size: 0.6875rem;527	color: var(--text-muted);528	white-space: nowrap;529}530/* Kepr 2's history: four rows at a time, the rest a scroll away. */531.save-list {532	max-height: 180px;533	overflow-y: auto;534	scrollbar-width: thin;535	scrollbar-color: var(--border) transparent;536}537.pager {538	display: flex;539	justify-content: space-between;540	margin: 14px 0 0;541	font-size: 0.6875rem;542}543.pager a:last-child {544	margin-left: auto;545}546.pager a:hover {547	color: var(--accent);548}549550/* ----- atlas -------------------------------------------------------------- */551552.atlas-bar {553	display: flex;554	align-items: center;555	flex-wrap: wrap;556	gap: 8px 14px;557	margin: 10px 0 8px;558	font-size: 0.625rem;559}560.atlas-picker {561	position: relative;562}563/* Each section's fade-in makes it a stacking context, so the picker's popover would sit under the564   sections after it; the Atlas's section is lifted above them. */565#atlas {566	position: relative;567	z-index: 2;568}569.atlas-picker [hidden] {570	display: none;571}572.atlas-ref-tab {573	list-style: none;574	cursor: pointer;575	padding: 4px 8px;576	background: var(--bg);577	border: 1px solid rgba(200, 154, 90, 0.45);578	border-radius: 2px;579	font-size: 0.625rem;580	color: var(--accent);581}582.atlas-ref-tab::-webkit-details-marker {583	display: none;584}585.atlas-ref-tab:hover {586	color: var(--accent-dim);587}588.atlas-picker-popover {589	position: absolute;590	top: calc(100% + 6px);591	left: 0;592	z-index: 50;593	display: flex;594	flex-direction: column;595	width: min(420px, 90vw);596	max-height: 480px;597	background: var(--bg);598	border: 1px solid var(--text-faint);599	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.48);600}601.atlas-picker-filter {602	padding: 8px 10px;603	background: var(--bg);604	border: 0;605	border-bottom: 1px solid var(--bg-elevated);606	outline: none;607	font-size: 0.6875rem;608	color: var(--text-heading);609}610.atlas-picker-filter::placeholder {611	color: var(--text-faint);612}613.atlas-picker-list {614	flex: 1 1 auto;615	min-height: 0;616	overflow: auto;617	scrollbar-width: thin;618	scrollbar-color: var(--border) transparent;619}620.atlas-picker-row {621	display: grid;622	grid-template-columns: 80px 1fr auto;623	align-items: center;624	gap: 8px;625	padding: 6px 10px;626	border-bottom: 1px solid rgba(42, 32, 24, 0.4);627	color: var(--text-muted);628}629.atlas-picker-row:hover {630	background: rgba(200, 154, 90, 0.06);631	text-decoration: none;632}633.atlas-picker-row.active {634	background: rgba(200, 154, 90, 0.1);635}636.atlas-picker-row:hover *,637.atlas-picker-row.active * {638	color: var(--accent);639}640.atlas-picker-id,641.atlas-picker-age {642	font-family: var(--mono);643	font-size: 0.5625rem;644	color: var(--text-faint);645	white-space: nowrap;646	overflow: hidden;647	text-overflow: ellipsis;648}649.atlas-picker-msg {650	font-size: 0.6875rem;651	white-space: nowrap;652	overflow: hidden;653	text-overflow: ellipsis;654}655.atlas-head-link {656	color: var(--accent);657}658.atlas-fold-btn {659	margin-left: auto;660}661.atlas-fold-btn,662.atlas-search-btn {663	padding: 4px 8px;664	background: transparent;665	border: 1px solid var(--border);666	border-radius: 2px;667	font: inherit;668	font-size: 0.625rem;669	color: var(--text-faint);670	cursor: pointer;671}672.atlas-fold-btn:hover,673.atlas-search-btn:hover {674	color: var(--accent);675	border-color: var(--accent-dim);676}677.atlas-fold-btn[hidden],678.atlas-search-btn[hidden],679.atlas-filter[hidden] {680	display: none;681}682.atlas-filter {683	width: 220px;684	max-width: 100%;685	padding: 5px 10px;686	background: transparent;687	border: 1px solid var(--border);688	border-radius: 3px;689	color: var(--text);690	font-size: 0.6875rem;691}692.atlas-filter:focus {693	outline: none;694	border-color: var(--accent-dim);695}696.atlas-filter::placeholder {697	color: var(--text-faint);698}699/* kepr.js fixes the height at the closed tree's, at most Kepr 2's 520px, and the tree and panel700   scroll inside it; without it, the whole box scrolls. */701.atlas {702	display: grid;703	grid-template-columns: minmax(0, 1fr);704	grid-template-rows: minmax(0, 1fr);705	gap: 0 20px;706	max-height: 520px;707	overflow-y: auto;708	border-top: 1px solid var(--bg-elevated);709	border-bottom: 1px solid var(--bg-elevated);710}711.atlas-tree,712.atlas-panel {713	min-height: 0;714	overflow-y: auto;715	scrollbar-width: thin;716	scrollbar-color: var(--border) transparent;717}718.atlas:has(> .atlas-panel:not([hidden])) {719	grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);720}721.atlas [hidden] {722	display: none;723}724.atlas-folder > summary {725	list-style: none;726}727.atlas-folder > summary::-webkit-details-marker {728	display: none;729}730.atlas-children {731	padding-left: 14px;732	border-left: 1px solid var(--border);733	margin-left: 6px;734}735.atlas-row {736	position: relative;737	display: grid;738	grid-template-columns: minmax(90px, auto) 1fr auto;739	align-items: baseline;740	gap: 0 12px;741	padding: 6px 8px;742	border-bottom: 1px solid rgba(42, 32, 24, 0.62);743	cursor: pointer;744	transition: background 100ms;745}746.atlas-row:hover,747.atlas-row:focus-visible,748.atlas-row.selected {749	outline: none;750	background: var(--accent-tint-04);751	text-decoration: none;752}753.atlas-row.selected {754	box-shadow: inset 2px 0 0 var(--accent);755}756.atlas-name {757	color: var(--text-heading);758	font-size: 0.875rem;759	white-space: nowrap;760}761.atlas-folder > summary .atlas-name {762	color: var(--accent);763}764.atlas-desc {765	min-width: 0;766	color: var(--text-muted);767	font-size: 0.8125rem;768	overflow: hidden;769	text-overflow: ellipsis;770	white-space: nowrap;771}772.atlas-meta {773	font-size: 0.625rem;774	color: var(--text-faint);775	white-space: nowrap;776}777.atlas-panel {778	padding: 12px 0 12px 16px;779	border-left: 1px solid var(--border);780}781.atlas-hint {782	margin: 0;783	font-size: 0.625rem;784	color: var(--text-faint);785}786.atlas-info-name {787	margin: 0;788	font-weight: 400;789	font-size: 1.375rem;790	color: var(--text-heading);791	overflow-wrap: anywhere;792}793.atlas-info-path {794	margin: 0 0 12px;795	font-size: 0.625rem;796	color: var(--text-faint);797	overflow-wrap: anywhere;798}799.atlas-facts {800	display: grid;801	grid-template-columns: auto 1fr;802	gap: 3px 12px;803	margin: 0 0 12px;804	font-size: 0.625rem;805}806.atlas-facts dt {807	color: var(--text-faint);808}809.atlas-facts dd {810	margin: 0;811	color: var(--text);812}813.atlas-facts a {814	color: var(--accent);815}816.atlas-info-desc {817	font-size: 0.8125rem;818	color: var(--text-muted);819}820/* ----- README and rendered Markdown --------------------------------------- */821822.repo-details {823	margin: 36px 0 0;824	animation: fadeIn 320ms 80ms ease both;825}826.repo-details-toggle {827	border-bottom: 1px solid var(--border);828	padding-bottom: 24px;829}830.repo-details-head {831	display: flex;832	align-items: center;833	gap: 6px;834	padding: 8px 0;835	font-family: var(--mono);836	font-size: 0.6875rem;837	letter-spacing: 0.12em;838	color: var(--text-secondary);839	text-transform: uppercase;840}841.markdown {842	font-size: 1.05rem;843	line-height: 1.7;844	overflow-wrap: break-word;845}846.markdown h1,847.markdown h2,848.markdown h3,849.markdown h4 {850	font-weight: 400;851	margin: 1.4em 0 0.4em;852	color: var(--text-heading);853}854.markdown h1 {855	font-size: 1.5rem;856}857.markdown h2 {858	font-size: 1.3rem;859}860.markdown h3 {861	font-size: 1.15rem;862}863.markdown p {864	margin: 0.8em 0;865}866.markdown ul,867.markdown ol {868	margin: 0.8em 0 0.8em 1.5em;869	padding: 0;870}871.markdown a {872	color: var(--accent);873}874.markdown code {875	font-family: var(--mono);876	font-size: 0.82em;877	color: var(--accent);878	background: var(--bg-surface);879	padding: 0.15em 0.35em;880	border-radius: 3px;881}882.markdown pre {883	background: var(--bg-surface);884	border-radius: 4px;885	padding: 1em 1.2em;886	overflow-x: auto;887	margin: 1em 0;888}889.markdown pre code {890	background: none;891	padding: 0;892	color: var(--text);893	font-size: 0.85em;894}895.markdown blockquote {896	border-left: 3px solid var(--border);897	margin: 1em 0;898	padding: 0.1em 1em;899	color: var(--text-secondary);900}901.markdown hr {902	border: none;903	border-top: 1px solid var(--border);904	margin: 1.5em 0;905}906.markdown img {907	max-width: 100%;908}909.markdown table {910	border-collapse: collapse;911	display: block;912	overflow-x: auto;913}914.markdown th,915.markdown td {916	border: 1px solid var(--border);917	padding: 4px 10px;918}919920/* ----- file viewer -------------------------------------------------------- */921922.breadcrumb {923	margin: 0 0 4px;924	font-size: 0.75rem;925	overflow-wrap: anywhere;926}927.breadcrumb a:hover {928	color: var(--accent);929}930.file-page-title {931	font-size: 1.75rem;932	font-weight: 400;933	margin: 4px 0 12px;934	overflow-wrap: anywhere;935}936.file-meta,937.file-toggle {938	margin: 0 0 12px;939	font-size: 0.6875rem;940}941.file-meta a,942.file-toggle a.active {943	color: var(--accent);944}945.file-image img {946	max-width: 100%;947	background: var(--bg-surface);948	border: 1px solid var(--border);949}950.file-view {951	border: 1px solid var(--border);952	background: var(--bg-surface);953	overflow-x: auto;954}955.code {956	margin: 0;957	padding: 16px 0;958	font-family: var(--mono);959	font-size: 0.8125rem;960	line-height: 1.65;961	tab-size: 4;962}963/* A grid, so tab stops count from the start of the code rather than the line number. */964.code .line {965	display: grid;966	grid-template-columns: 6em 1fr;967	padding-right: 24px;968	scroll-margin-top: 40vh;969}970.code .line:target,971.code .line.hl {972	background: var(--accent-tint-12);973}974.code .lc {975	white-space: pre;976}977.code .ln {978	padding-right: 1.5em;979	text-align: right;980	color: var(--text-faint);981	user-select: none;982}983.code .ln:hover {984	color: var(--accent);985	text-decoration: none;986}987988/* Shiki's CSS-variables theme roles, in Kepr 2's highlight.js colours. */989.tk-comment {990	color: var(--text-muted);991	font-style: italic;992}993.tk-keyword {994	color: var(--accent);995}996.tk-string,997.tk-string-expression {998	color: var(--sage);999}1000.tk-constant {1001	color: var(--accent-bright);1002}1003.tk-function {1004	color: var(--accent);1005}1006.tk-parameter {1007	color: var(--text);1008}1009.tk-punctuation {1010	color: var(--text-secondary);1011}1012.tk-link {1013	color: var(--accent);1014	text-decoration: underline;1015}1016.tk-inserted {1017	color: var(--sage);1018}1019.tk-deleted {1020	color: #c45c5c;1021}1022.tk-i {1023	font-style: italic;1024}10251026/* ----- save page ---------------------------------------------------------- */10271028.save-id {1029	margin: 12px 0 0;1030	font-size: 0.75rem;1031	color: var(--text-secondary);1032}1033.save-flag {1034	margin: 12px 0 0;1035	padding: 8px 12px;1036	border: 1px solid #6a3a2a;1037	border-left: 2px solid #c45c5c;1038	background: rgba(196, 92, 92, 0.08);1039	color: var(--text-heading);1040}1041.save-flag-label {1042	margin-right: 8px;1043	font-size: 0.625rem;1044	letter-spacing: 0.12em;1045	text-transform: uppercase;1046	color: #c45c5c;1047}1048.save-message-head {1049	font-size: 2.25rem;1050	font-weight: 400;1051	line-height: 1.3;1052	margin: 12px 0 8px;1053	color: var(--text-heading);1054	overflow-wrap: anywhere;1055	animation: fadeUp 280ms ease both;1056}1057.save-message-body {1058	margin: 0 0 12px;1059	white-space: pre-wrap;1060	color: var(--text-secondary);1061}1062.save-facts {1063	display: grid;1064	grid-template-columns: max-content 1fr;1065	gap: 2px 16px;1066	margin: 16px 0;1067	font-size: 0.75rem;1068}1069.save-facts dt {1070	color: var(--text-faint);1071}1072.save-facts dd {1073	margin: 0;1074	overflow-wrap: anywhere;1075}1076.save-facts a,1077.save-links a,1078.diff-view a {1079	color: var(--accent);1080}1081.save-links {1082	display: flex;1083	flex-wrap: wrap;1084	gap: 8px 20px;1085	margin: 0;1086	font-size: 0.75rem;1087}1088.save-empty {1089	font-size: 0.75rem;1090}1091.change-row,1092.diff-head {1093	display: grid;1094	grid-template-columns: 1fr auto;1095	gap: 12px;1096	padding: 7px 8px;1097	border-bottom: 1px solid var(--border);1098	font-family: var(--mono);1099	font-size: 0.8125rem;1100}1101.change-row:hover {1102	background: var(--accent-tint-04);1103	text-decoration: none;1104}1105.change-path {1106	min-width: 0;1107	overflow-wrap: anywhere;1108}1109.change-added .change-path {1110	color: var(--sage);1111}1112.change-removed .change-path {1113	color: var(--text-muted);1114	text-decoration: line-through;1115}1116.change-modified .change-path {1117	color: var(--accent-bright);1118}1119.change-stat {1120	font-size: 0.75rem;1121	white-space: nowrap;1122}1123.diff-add {1124	color: var(--sage);1125}1126.diff-del {1127	color: #c45c5c;1128}1129.diff-note {1130	color: var(--text-faint);1131	font-size: 0.6875rem;1132}1133.diff-file {1134	margin: 0 0 20px;1135}1136.diff-head {1137	cursor: pointer;1138	list-style: none;1139	border: 1px solid var(--border);1140	background: var(--bg-surface);1141}1142.diff-head::-webkit-details-marker {1143	display: none;1144}1145.diff-file > .file-view {1146	border-top: 0;1147}1148.diff-file > .diff-note,1149.diff-view {1150	margin: 8px 0 0;1151	font-size: 0.6875rem;1152}1153.code.diff {1154	padding: 4px 0;1155}1156.diff .dl {1157	display: grid;1158	grid-template-columns: 3.5em 3.5em 1.5em 1fr;1159	padding-right: 24px;1160}1161.diff .dh {1162	display: block;1163	padding: 4px 1em;1164	color: var(--text-faint);1165	background: var(--bg-elevated);1166}1167.diff .ln {1168	padding-right: 0.75em;1169	text-align: right;1170	color: var(--text-faint);1171	user-select: none;1172}1173.diff .ds {1174	text-align: center;1175	color: var(--text-faint);1176	user-select: none;1177}1178.diff .dl-add {1179	background: rgba(122, 154, 104, 0.1);1180}1181.diff .dl-add .ds {1182	color: var(--sage);1183}1184.diff .dl-del {1185	background: rgba(196, 92, 92, 0.08);1186}1187.diff .dl-del .ds {1188	color: #c45c5c;1189}11901191/* ----- archives ----------------------------------------------------------- */11921193.archive-row {1194	padding: 12px 8px;1195	border-bottom: 1px solid var(--border);1196}1197.archive-save {1198	display: flex;1199	flex-wrap: wrap;1200	align-items: baseline;1201	gap: 0 10px;1202	margin: 0;1203}1204.archive-save .history-id {1205	flex: 0 0 110px;1206}1207.archive-msg {1208	flex: 1;1209}1210.archive-head {1211	font-size: 0.625rem;1212	letter-spacing: 0.08em;1213	color: var(--accent);1214	border: 1px solid var(--accent-dim);1215	border-radius: 2px;1216	padding: 0 6px;1217}1218.archive-save .history-id:hover {1219	color: var(--accent);1220}1221.archive-links {1222	margin: 6px 0;1223	font-size: 0.75rem;1224}1225.archive-links a {1226	color: var(--accent);1227}1228.archive-row .install-line {1229	justify-content: space-between;1230}12311232/* ----- phone -------------------------------------------------------------- */12331234@media (max-width: 768px) {1235	body > nav {1236		padding: 20px 16px;1237	}1238	.nav-links {1239		gap: 18px;1240	}1241	main {1242		padding: 16px 16px 80px;1243	}1244	.repo-name {1245		font-size: 2.75rem;1246	}1247	.install-lines {1248		align-items: stretch;1249		margin-left: 0;1250		width: 100%;1251	}1252	.history-row {1253		grid-template-columns: 1fr auto;1254	}1255	.history-id {1256		grid-column: 1 / -1;1257	}1258	.atlas-row {1259		grid-template-columns: 1fr auto;1260	}1261	.atlas-desc {1262		grid-column: 1 / -1;1263		grid-row: 2;1264	}1265	.atlas:has(> .atlas-panel:not([hidden])) {1266		grid-template-columns: minmax(0, 1fr);1267	}1268	.atlas-panel {1269		display: none;1270	}1271	.code .line {1272		grid-template-columns: 4.5em 1fr;1273	}1274	.save-message-head {1275		font-size: 1.625rem;1276	}1277	.archive-msg {1278		flex-basis: 100%;1279		order: 1;1280	}1281	.diff .dl {1282		grid-template-columns: 2.75em 2.75em 1.25em 1fr;1283	}1284	.code .ln {1285		padding-right: 1em;1286	}1287}12881289/* ----- builds ------------------------------------------------------------- */12901291.release {1292	padding: 20px 8px 24px;1293	border-bottom: 1px solid var(--border);1294}1295.release-head {1296	display: flex;1297	flex-wrap: wrap;1298	align-items: baseline;1299	gap: 0 14px;1300	margin: 0 0 8px;1301}1302.release-version {1303	font-family: "Martian Mono", monospace;1304	font-size: 1rem;1305	color: var(--accent);1306}1307.release-head .history-id:hover {1308	color: var(--accent);1309}1310.release-notes {1311	margin-bottom: 14px;1312}1313.release-file {1314	padding: 10px 0;1315	border-top: 1px dashed var(--border);1316}1317.release-file-head {1318	display: flex;1319	flex-wrap: wrap;1320	align-items: baseline;1321	gap: 4px 14px;1322	margin: 0;1323}1324.release-platform {1325	flex: 0 0 180px;1326}1327.release-download {1328	flex: 1;1329	font-size: 0.75rem;1330	color: var(--accent);1331	overflow-wrap: anywhere;1332}1333.release-meta,1334.release-sha {1335	font-size: 0.6875rem;1336	color: var(--text-muted);1337}1338.release-sha {1339	margin: 4px 0 0;1340	overflow-wrap: anywhere;1341}1342.release-hint {1343	margin: 4px 0 0;1344	font-size: 0.8125rem;1345}13461347/* ----- issues ------------------------------------------------------------- */13481349.issues-bar {1350	display: flex;1351	flex-wrap: wrap;1352	align-items: center;1353	gap: 8px 12px;1354	font-size: 0.75rem;1355	padding-bottom: 14px;1356	border-bottom: 1px solid var(--bg-elevated);1357}1358.issues-tab {1359	color: var(--text-faint);1360	border: 1px solid transparent;1361	border-radius: 999px;1362	padding: 4px 10px;1363}1364button.issues-tab {1365	font: inherit;1366	background: none;1367	cursor: pointer;1368}1369.issues-tab.active {1370	color: var(--accent);1371	border-color: var(--accent-tint-12);1372}1373.issues-new {1374	margin-left: auto;1375	color: var(--text-muted);1376}1377.issue-row {1378	display: flex;1379	flex-wrap: wrap;1380	align-items: baseline;1381	gap: 2px 10px;1382	padding: 10px 8px;1383	border-bottom: 1px solid var(--border);1384}1385.issue-row:hover {1386	text-decoration: none;1387	background: var(--accent-tint-04);1388}1389.issue-title {1390	flex: 1;1391	color: var(--text-heading);1392}1393.issues-new:hover,1394.issue-row:hover .issue-title {1395	color: var(--accent);1396}1397.issue-meta,1398.issue-post-head {1399	font-size: 0.6875rem;1400	color: var(--text-muted);1401}1402.issue-symbol--open {1403	color: var(--accent);1404}1405.issue-symbol--closed {1406	color: var(--text-faint);1407}1408.issue-post {1409	margin: 18px 0;1410	padding: 14px 18px;1411	border: 1px solid var(--border);1412	border-radius: 6px;1413	background: var(--bg-surface);1414}1415.issue-post--operator {1416	border-color: var(--accent-dim);1417}1418.issue-post-head {1419	display: flex;1420	flex-wrap: wrap;1421	gap: 4px 12px;1422	margin: 0 0 8px;1423}1424.issue-author {1425	color: var(--text);1426}1427.issue-badge {1428	color: var(--accent);1429	text-transform: uppercase;1430	letter-spacing: 0.08em;1431}1432.issue-text {1433	white-space: pre-wrap;1434	overflow-wrap: anywhere;1435}1436.issue-link {1437	font-size: 0.75rem;1438	overflow-wrap: anywhere;1439	color: var(--accent);1440}1441.issues-form {1442	display: flex;1443	flex-direction: column;1444	gap: 6px;1445	max-width: 640px;1446	margin-top: 18px;1447}1448.issues-label {1449	font-family: var(--mono);1450	font-size: 0.6875rem;1451	margin-top: 6px;1452	opacity: 0.8;1453}1454.issues-input,1455.issues-textarea {1456	font-family: var(--mono);1457	font-size: 0.75rem;1458	width: 100%;1459	padding: 6px 8px;1460	color: var(--text);1461	background: var(--bg);1462	border: 1px solid var(--border);1463	border-radius: 4px;1464	resize: vertical;1465}1466.issues-input:focus,1467.issues-textarea:focus {1468	outline: none;1469	border-color: var(--accent);1470}1471.issues-submit {1472	align-self: flex-start;1473	margin-top: 10px;1474	padding: 6px 14px;1475	font-family: var(--mono);1476	font-size: 0.75rem;1477	color: var(--bg);1478	background: var(--accent);1479	border: none;1480	border-radius: 4px;1481	cursor: pointer;1482}1483.issues-submit:hover {1484	opacity: 0.85;1485}1486.issues-actions {1487	display: flex;1488	align-items: baseline;1489	gap: 16px;1490	margin: 0;1491}1492.issues-cancel {1493	font-size: 0.75rem;1494	color: var(--text-muted);1495}1496.issues-cancel:hover {1497	color: var(--accent);1498}1499.issues-error {1500	font-size: 0.75rem;1501	color: #c86a5a;1502}1503/* The honeypot: off-screen for people, still in the form for bots. */1504.issues-hp {1505	position: absolute;1506	left: -9999px;1507	height: 0;1508	overflow: hidden;1509	opacity: 0;1510}15111512/* ----- front page --------------------------------------------------------- */15131514/* Kepr 2's hero band, full width, reaching up behind the nav (32px mark + 48px padding). */1515body > nav {1516	position: relative;1517	z-index: 1;1518}1519.ticker {1520	position: relative;1521	height: 304px;1522	margin: -104px calc(50% - 50vw) 0;1523	padding: 96px 0 20px;1524	display: flex;1525	flex-direction: column;1526	justify-content: space-evenly;1527	overflow: hidden;1528	pointer-events: none;1529	user-select: none;1530	border-bottom: 1px solid var(--border);1531	font-family: var(--mono);1532	color: var(--text-secondary);1533	mask-image: linear-gradient(1534		to right,1535		transparent,1536		#000 48px,1537		#000 calc(100% - 48px),1538		transparent1539	);1540}1541.ticker-row {1542	white-space: nowrap;1543	line-height: 1.2;1544	opacity: var(--o);1545	animation: ticker-glow 83s var(--glow-at) ease-in-out infinite;1546}1547/* The drift's duration is set by kepr.js from the track's width, so every row keeps Kepr 2's1548   pace in px/s (--speed) however long its messages are; this is the no-JavaScript fallback. */1549.ticker-track {1550	display: inline-flex;1551	gap: 64px;1552	padding-right: 64px;1553	animation: ticker-drift 1500s linear infinite;1554}1555/* Kepr 2's depth bands: nearer rows are larger, brighter and faster. Each row takes its turn at1556   the glow, a few seconds out of every 83, spaced so one or two glow at a time. */1557.ticker-row:nth-child(1) {1558	font-size: 9px;1559	--o: 0.05;1560	--speed: 12;1561	--glow-at: -5s;1562}1563.ticker-row:nth-child(2) {1564	font-size: 18px;1565	--o: 0.1;1566	--speed: 23;1567	--glow-at: -41s;1568}1569.ticker-row:nth-child(3) {1570	font-size: 7px;1571	--o: 0.04;1572	--speed: 9;1573	--glow-at: -77s;1574}1575.ticker-row:nth-child(4) {1576	font-size: 13px;1577	--o: 0.07;1578	--speed: 17;1579	--glow-at: -29s;1580}1581.ticker-row:nth-child(5) {1582	font-size: 22px;1583	--o: 0.12;1584	--speed: 29;1585	--glow-at: -65s;1586}1587.ticker-row:nth-child(6) {1588	font-size: 8px;1589	--o: 0.045;1590	--speed: 10;1591	--glow-at: -17s;1592}1593.ticker-row:nth-child(7) {1594	font-size: 15px;1595	--o: 0.08;1596	--speed: 20;1597	--glow-at: -53s;1598}1599@keyframes ticker-drift {1600	to {1601		transform: translateX(-50%);1602	}1603}1604@keyframes ticker-glow {1605	0%,1606	10%,1607	100% {1608		color: var(--text-secondary);1609		opacity: var(--o);1610		text-shadow: none;1611	}1612	5% {1613		color: var(--accent);1614		opacity: calc(var(--o) * 3.5);1615		text-shadow: 0 0 3px var(--accent-tint-12);1616	}1617}16181619.headline {1620	display: grid;1621	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);1622	gap: 48px;1623	align-items: center;1624	padding: 56px 0 40px;1625}1626.headline h1 {1627	font-size: clamp(2rem, 5vw, 3.5rem);1628	font-weight: 400;1629	line-height: 1.15;1630	color: var(--text-heading);1631	margin: 0 0 20px;1632	animation: fadeUp 480ms ease both;1633}1634.headline-tagline {1635	margin: 0;1636	font-size: 0.9375rem;1637	line-height: 1.7;1638	color: var(--text-secondary);1639	animation: fadeUp 480ms 80ms ease both;1640}1641.headline-cloud {1642	display: flex;1643	flex-wrap: wrap;1644	justify-content: center;1645	align-items: center;1646	gap: 10px 22px;1647	padding: 20px;1648	animation: fadeIn 600ms 160ms ease both;1649}1650.tc-tag {1651	font-family: var(--mono);1652	letter-spacing: 0.03em;1653	white-space: nowrap;1654	color: var(--accent-dim);1655	transition:1656		color 0.2s,1657		opacity 0.2s,1658		text-shadow 0.2s;1659}1660.tc-tag:hover {1661	color: var(--accent);1662	opacity: 1;1663	text-shadow: 0 0 14px var(--accent-tint-12);1664}1665.tc-1 {1666	font-size: 10px;1667	opacity: 0.42;1668}1669.tc-2 {1670	font-size: 12px;1671	opacity: 0.56;1672}1673.tc-3 {1674	font-size: 15px;1675	opacity: 0.7;1676}1677.tc-4 {1678	font-size: 18px;1679	opacity: 0.85;1680	font-weight: 500;1681}1682.tc-5 {1683	font-size: 23px;1684	opacity: 1;1685	font-weight: 500;1686}16871688.featured-label {1689	font-size: 0.6875rem;1690	font-weight: 400;1691	letter-spacing: 0.08em;1692	text-transform: uppercase;1693	color: var(--text-secondary);1694	margin: 0 0 12px;1695}1696.landing-self-host {1697	margin: 32px 0 0;1698	font-size: 0.75rem;1699}1700.landing-self-host a {1701	color: var(--text-secondary);1702}17031704/* ----- repo cards (front page, browse, profile) --------------------------- */17051706.card-grid {1707	display: grid;1708	grid-template-columns: repeat(2, minmax(0, 1fr));1709	gap: 16px;1710}1711.repo-card {1712	display: flex;1713	flex-direction: column;1714	padding: 20px 22px 16px;1715	border: 1px solid var(--bg-elevated);1716	border-radius: 4px;1717	background: var(--bg);1718	transition:1719		border-color 120ms,1720		background 120ms;1721	animation: fadeUp 350ms ease both;1722}1723.repo-card:hover {1724	text-decoration: none;1725	border-color: var(--text-faint);1726	background: var(--accent-tint-04);1727}1728.repo-card-head {1729	display: flex;1730	align-items: baseline;1731	justify-content: space-between;1732	gap: 12px;1733}1734.repo-card-name {1735	font-size: 1.375rem;1736	line-height: 1.1;1737	color: var(--accent);1738	overflow: hidden;1739	text-overflow: ellipsis;1740	white-space: nowrap;1741}1742.repo-card-saves {1743	font-size: 0.6875rem;1744	white-space: nowrap;1745}1746.repo-card-desc {1747	margin: 8px 0 0;1748	font-size: 0.8125rem;1749	line-height: 1.5;1750	color: var(--text-secondary);1751	display: -webkit-box;1752	-webkit-line-clamp: 2;1753	-webkit-box-orient: vertical;1754	overflow: hidden;1755}1756.repo-card-cat {1757	margin: 10px 0 0;1758	font-size: 0.9375rem;1759	color: var(--text);1760}17611762/* ----- profile ------------------------------------------------------------ */17631764/* The cover runs the full width of the window while the page keeps its column. */1765.profile-cover {1766	position: relative;1767	height: 380px;1768	margin: -24px calc(50% - 50vw) 0;1769	overflow: hidden;1770	border-bottom: 1px solid var(--bg-surface);1771}1772.hex-backdrop {1773	position: absolute;1774	inset: 0;1775	display: flex;1776	flex-direction: row-reverse;1777	justify-content: center;1778	align-items: center;1779	gap: 13px;1780	pointer-events: none;1781	user-select: none;1782	font-family: var(--mono);1783	font-size: 13px;1784	line-height: 16px;1785	color: var(--accent-dim);1786}1787/* Characters top to bottom, columns right to left, each breathing on its own clock. */1788.hex-col {1789	writing-mode: vertical-rl;1790	text-orientation: upright;1791	letter-spacing: 3px;1792	opacity: 0.05;1793	animation: hex-breathe 17s ease-in-out infinite;1794	transition:1795		color 1.6s ease,1796		text-shadow 1.6s ease;1797}1798.hex-col:nth-child(3n) {1799	color: var(--accent);1800	animation-duration: 23s;1801	animation-delay: -7s;1802}1803.hex-col:nth-child(4n + 1) {1804	animation-duration: 29s;1805	animation-delay: -13s;1806}1807.hex-col:nth-child(5n + 2) {1808	animation-duration: 19s;1809	animation-delay: -3s;1810}1811.hex-col:nth-child(7n) {1812	animation-delay: -21s;1813}1814.hex-col.glow {1815	color: var(--accent-bright);1816	text-shadow: 0 0 6px var(--accent-tint-12);1817}1818@keyframes hex-breathe {1819	0%,1820	100% {1821		opacity: 0.05;1822	}1823	50% {1824		opacity: 0.22;1825	}1826}1827.profile-cover-fade {1828	position: absolute;1829	left: 0;1830	right: 0;1831	bottom: 0;1832	height: 55%;1833	background: linear-gradient(to bottom, transparent, var(--bg));1834	pointer-events: none;1835}1836.profile-identity {1837	position: absolute;1838	bottom: 40px;1839	left: 0;1840	right: 0;1841	max-width: 980px;1842	margin: 0 auto;1843	padding: 0 48px;1844}1845.profile-username {1846	margin: 0 0 8px;1847	font-family: "Sacramento", cursive;1848	font-weight: 400;1849	font-size: 3.625rem;1850	line-height: 1;1851	letter-spacing: -0.02em;1852	text-transform: lowercase;1853	color: var(--text-heading);1854	user-select: none;1855	animation: fadeUp 500ms ease both;1856}1857.profile-signature {1858	display: block;1859	max-height: 96px;1860	max-width: min(360px, 100%);1861}1862.profile-tagline {1863	margin: 0 0 6px;1864	font-family: var(--mono);1865	font-size: 0.75rem;1866	letter-spacing: 0.15em;1867	color: var(--text-faint);1868}1869.profile-op-badge {1870	display: block;1871	font-size: 0.6875rem;1872	letter-spacing: 0.18em;1873	color: var(--accent);1874}18751876.profile-portrait-section {1877	display: grid;1878	grid-template-columns: 320px minmax(0, 1fr);1879	gap: 40px;1880	align-items: start;1881	padding-top: 40px;1882}1883.profile-left {1884	display: flex;1885	flex-direction: column;1886	gap: 16px;1887}1888.profile-identity-card,1889.profile-languages-bar {1890	padding: 20px 24px;1891	border: 1px solid var(--bg-elevated);1892	border-radius: 4px;1893}1894.profile-identity-bio {1895	margin: 0;1896	font-size: 0.875rem;1897	line-height: 1.5;1898	color: var(--text-muted);1899}1900.profile-identity-location {1901	margin: 6px 0 0;1902	font-family: var(--mono);1903	font-size: 0.8125rem;1904	color: var(--text-muted);1905}1906.profile-website-pill {1907	display: inline-block;1908	max-width: 100%;1909	margin-top: 10px;1910	padding: 3px 8px;1911	overflow: hidden;1912	text-overflow: ellipsis;1913	white-space: nowrap;1914	border: 1px solid var(--text-faint);1915	border-radius: 3px;1916	background: var(--bg-surface);1917	font-family: var(--mono);1918	font-size: 0.6875rem;1919	color: var(--accent);1920}1921.profile-website-pill:hover {1922	border-color: var(--accent);1923	text-decoration: none;1924}1925.profile-stats-grid {1926	display: grid;1927	grid-template-columns: 1fr 1fr;1928	border: 1px solid var(--bg-elevated);1929	border-radius: 4px;1930	overflow: hidden;1931}1932.profile-stat-tile {1933	padding: 16px;1934	border-right: 1px solid var(--bg-elevated);1935	border-bottom: 1px solid var(--bg-elevated);1936}1937.profile-stat-tile:nth-child(2n) {1938	border-right: none;1939}1940.profile-stat-tile:nth-last-child(-n + 2) {1941	border-bottom: none;1942}1943.profile-stat-number {1944	margin-bottom: 4px;1945	font-weight: 600;1946	font-size: 1.75rem;1947	line-height: 1;1948	color: var(--accent);1949}1950.profile-stat-label,1951.profile-section-label {1952	font-family: var(--mono);1953	font-size: 0.625rem;1954	text-transform: uppercase;1955	letter-spacing: 0.08em;1956	color: var(--text-faint);1957}1958.profile-lang-bar {1959	display: block;1960	width: 100%;1961	height: 6px;1962	margin-bottom: 8px;1963	border-radius: 3px;1964	background: var(--bg-surface);1965}1966.profile-lang-bar rect {1967	fill: var(--accent);1968	opacity: 0.6;1969}1970.profile-lang-bar rect:nth-child(2) {1971	fill: var(--sage);1972}1973.profile-lang-bar rect:nth-child(3) {1974	fill: var(--accent-flash);1975	opacity: 0.45;1976}1977.profile-lang-bar rect:nth-child(4) {1978	fill: var(--accent-dim);1979}1980.profile-lang-labels {1981	display: flex;1982	flex-wrap: wrap;1983	gap: 10px;1984	font-family: var(--mono);1985	font-size: 0.625rem;1986	color: var(--text-muted);1987}1988.profile-section-label {1989	margin-bottom: 16px;1990	letter-spacing: 0.2em;1991}1992.profile-event {1993	display: grid;1994	grid-template-columns: 96px 12px minmax(0, 1fr) auto;1995	gap: 10px;1996	align-items: baseline;1997	padding: 7px 0;1998	border-bottom: 1px solid var(--bg-surface);1999	font-family: var(--mono);2000	font-size: 0.6875rem;2001	animation: fadeUp 300ms ease both;2002}2003.profile-event-repo,2004.profile-event-message {2005	overflow: hidden;2006	text-overflow: ellipsis;2007	white-space: nowrap;2008}2009.profile-event-repo,2010.profile-event-glyph {2011	color: var(--accent);2012}2013.profile-event-glyph {2014	font-size: 0.625rem;2015}2016.profile-event-message {2017	color: var(--text-muted);2018}2019.profile-event-message:hover {2020	color: var(--text-heading);2021}2022.profile-event-time {2023	font-size: 0.625rem;2024	white-space: nowrap;2025	color: var(--text-faint);2026}2027.profile-empty-state {2028	font-style: italic;2029	font-size: 0.8125rem;2030	color: var(--text-faint);2031}2032.profile-repos-section {2033	margin-top: 40px;2034	padding-top: 40px;2035	border-top: 1px solid var(--bg-surface);2036}20372038/* ----- docs and support --------------------------------------------------- */20392040.site-doc {2041	max-width: 72ch;2042	margin-top: 16px;2043}2044.site-doc h1 {2045	font-size: clamp(2rem, 5vw, 3rem);2046	font-weight: 400;2047	color: var(--text-heading);2048}2049.site-doc h2 {2050	margin-top: 2.4em;2051	scroll-margin-top: 24px;2052}2053.site-doc-layout {2054	display: grid;2055	grid-template-columns: 180px minmax(0, 72ch);2056	gap: 48px;2057}2058.site-doc-nav {2059	position: sticky;2060	top: 24px;2061	align-self: start;2062	display: flex;2063	flex-direction: column;2064	gap: 10px;2065	margin-top: 32px;2066	font-size: 0.8125rem;2067}2068.site-doc-nav a {2069	color: var(--text-secondary);2070	text-decoration: none;2071}2072.site-doc-nav a:hover {2073	color: var(--text-heading);2074}2075@media (max-width: 860px) {2076	.site-doc-layout {2077		grid-template-columns: minmax(0, 1fr);2078		gap: 0;2079	}2080	.site-doc-nav {2081		position: static;2082		flex-flow: row wrap;2083		gap: 8px 16px;2084		margin-top: 24px;2085	}2086}20872088@media (max-width: 860px) {2089	.headline,2090	.profile-portrait-section {2091		grid-template-columns: minmax(0, 1fr);2092	}2093	.headline {2094		gap: 8px;2095		padding-top: 48px;2096	}2097	.card-grid {2098		grid-template-columns: minmax(0, 1fr);2099	}2100}2101@media (max-width: 768px) {2102	.editor-panes {2103		grid-template-columns: minmax(0, 1fr);2104	}2105	.fv-header {2106		flex-wrap: wrap;2107		height: auto;2108		padding: 8px 12px;2109		gap: 8px 12px;2110	}2111	.fv-body {2112		grid-template-columns: minmax(0, 1fr);2113	}2114	.fv-detail {2115		display: none;2116	}2117	.ticker {2118		height: 226px;2119		margin-top: -88px;2120		padding-top: 80px;2121	}2122	.profile-cover {2123		height: 280px;2124		margin-top: -16px;2125	}2126	.profile-identity {2127		bottom: 24px;2128		padding: 0 16px;2129	}2130	.profile-username {2131		font-size: 2.5rem;2132	}2133	.profile-event {2134		grid-template-columns: 72px 12px minmax(0, 1fr);2135	}2136	.profile-event-time {2137		display: none;2138	}2139}21402141/* ----- media in Markdown and the signed-in editor ------------------------- */21422143/* Sizes and places from an image's options (markdown.ts); classes, as the policy allows no inline2144   style. */2145.markdown .media {2146	display: block;2147	max-width: 100%;2148	height: auto;2149	margin: 12px auto;2150	border-radius: 3px;2151}2152.markdown .media-left {2153	margin-left: 0;2154}2155.markdown .media-right {2156	margin-right: 0;2157}2158.markdown .media-w25 {2159	width: 25%;2160}2161.markdown .media-w33 {2162	width: 33%;2163}2164.markdown .media-w50 {2165	width: 50%;2166}2167.markdown .media-w66 {2168	width: 66%;2169}2170.markdown .media-w75 {2171	width: 75%;2172}2173.markdown .media-w100 {2174	width: 100%;2175}2176.edit-btn {2177	margin-left: 12px;2178	padding: 1px 7px;2179	background: transparent;2180	border: 1px solid rgba(200, 154, 90, 0.2);2181	border-radius: 2px;2182	font-size: 0.625rem;2183	color: var(--text-faint);2184	cursor: pointer;2185	vertical-align: middle;2186}2187.edit-btn:hover {2188	color: var(--accent);2189	border-color: var(--accent-dim);2190}2191.editor {2192	display: grid;2193	gap: 8px;2194	margin: 8px 0 16px;2195}2196.editor-toolbar,2197.editor-media,2198.editor-actions {2199	display: flex;2200	flex-wrap: wrap;2201	align-items: center;2202	gap: 4px;2203}2204.editor-media[hidden] {2205	display: none;2206}2207.editor-label,2208.editor-status {2209	margin: 0 6px;2210	font-size: 0.625rem;2211	color: var(--text-faint);2212}2213.editor-panes {2214	display: grid;2215	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);2216	gap: 12px;2217}2218.editor-input {2219	width: 100%;2220	min-height: 4lh;2221	max-height: 70vh;2222	field-sizing: content;2223	resize: vertical;2224	padding: 10px 12px;2225	background: var(--bg-surface);2226	border: 1px solid var(--border);2227	border-radius: 3px;2228	color: var(--text);2229	font-size: 0.75rem;2230	line-height: 1.6;2231}2232.editor-input:focus {2233	outline: none;2234	border-color: var(--accent-dim);2235}2236.editor-preview {2237	min-width: 0;2238	max-height: 70vh;2239	overflow-y: auto;2240	padding: 0 4px;2241}2242.editor-preview:empty::before {2243	content: attr(data-empty);2244	font-family: var(--mono);2245	font-size: 0.625rem;2246	color: var(--text-faint);2247}22482249/* ----- file viewer (Kepr 2's Atlas modal) -------------------------------- */22502251body:has(> .fv-overlay) {2252	overflow: hidden;2253}2254.fv-overlay {2255	position: fixed;2256	inset: 0;2257	z-index: 2000;2258	display: flex;2259	flex-direction: column;2260	background: rgba(8, 7, 5, 0.97);2261	outline: none;2262	animation: fv-in 200ms ease both;2263}2264@keyframes fv-in {2265	from {2266		opacity: 0;2267		transform: translateY(6px) scale(0.97);2268	}2269}2270.fv-header {2271	display: flex;2272	align-items: center;2273	gap: 16px;2274	flex-shrink: 0;2275	height: 48px;2276	padding: 0 20px;2277	background: var(--bg);2278	border-bottom: 1px solid var(--bg-elevated);2279}2280.fv-close {2281	background: none;2282	border: 0;2283	padding: 0 4px;2284	font-size: 1.375rem;2285	line-height: 1;2286	color: var(--text-faint);2287	cursor: pointer;2288}2289.fv-close:hover {2290	color: var(--accent);2291}2292.fv-title {2293	display: flex;2294	align-items: baseline;2295	gap: 8px;2296	flex: 1;2297	min-width: 0;2298}2299.fv-name {2300	font-size: 1.25rem;2301	color: var(--text-heading);2302	white-space: nowrap;2303}2304.fv-path {2305	font-size: 0.625rem;2306	color: var(--text-faint);2307	white-space: nowrap;2308	overflow: hidden;2309	text-overflow: ellipsis;2310}2311.fv-controls,2312.fv-nav {2313	display: flex;2314	align-items: center;2315	gap: 4px;2316	flex-shrink: 0;2317}2318.fv-ctrl-btn {2319	background: transparent;2320	border: 1px solid rgba(200, 154, 90, 0.2);2321	border-radius: 2px;2322	padding: 3px 7px;2323	font: inherit;2324	font-size: 0.625rem;2325	color: var(--text-faint);2326	cursor: pointer;2327	transition:2328		color 100ms,2329		border-color 100ms;2330}2331.fv-ctrl-btn:hover:not(:disabled),2332.fv-ctrl-btn.active {2333	color: var(--accent);2334	border-color: rgba(200, 154, 90, 0.5);2335	text-decoration: none;2336}2337.fv-ctrl-btn:disabled {2338	opacity: 0.3;2339	cursor: default;2340}2341.fv-pos {2342	min-width: 48px;2343	text-align: center;2344	font-size: 0.625rem;2345	color: var(--text-faint);2346}2347.fv-body {2348	flex: 1;2349	min-height: 0;2350	display: grid;2351	grid-template-columns: minmax(0, 1fr) 280px;2352}2353.fv-source {2354	min-height: 0;2355	overflow: auto;2356	padding: 16px 28px 32px;2357	font-family: var(--mono);2358	font-size: 0.6875rem;2359	color: var(--text-faint);2360}2361.fv-source .file-view {2362	margin: -16px -28px 0;2363	border: 0;2364	background: none;2365	overflow: visible;2366}2367.fv-source .code {2368	font-size: var(--fv-size);2369	color: var(--text);2370}2371.fv-wrap .fv-source .lc {2372	white-space: pre-wrap;2373	overflow-wrap: anywhere;2374}2375.fv-source .file-markdown {2376	font-family: var(--sans);2377	font-size: calc(var(--fv-size) + 2px);2378	color: var(--text);2379}2380.fv-detail .atlas-info-desc {2381	font-size: 0.8125rem;2382}2383.fv-detail {2384	overflow-y: auto;2385	padding: 18px 20px 24px;2386	background: var(--bg);2387	border-left: 1px solid var(--bg-elevated);2388}23892390/* Last in the file, after every animation it stops, so it wins without !important. */2391@media (prefers-reduced-motion: reduce) {2392	.tri-outer,2393	.tri-inner,2394	.repo-name,2395	.repo-contributor,2396	.repo-desc,2397	.repo-homepage,2398	.repo-meta,2399	.repo-tabs,2400	.install-lines,2401	.repo-section,2402	.repo-details,2403	.save-message-head,2404	.ticker-row,2405	.ticker-track,2406	.hex-col,2407	.headline h1,2408	.headline-tagline,2409	.headline-cloud,2410	.repo-card,2411	.profile-username,2412	.profile-event,2413	.fv-overlay,2414	.repo-panel {2415		animation: none;2416	}2417	.hex-col {2418		opacity: 0.12;2419	}2420}