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-search-btn {659	margin-left: auto;660	padding: 4px 8px;661	background: transparent;662	border: 1px solid var(--border);663	border-radius: 2px;664	font: inherit;665	font-size: 0.625rem;666	color: var(--text-faint);667	cursor: pointer;668}669.atlas-search-btn:hover {670	color: var(--accent);671	border-color: var(--accent-dim);672}673.atlas-search-btn[hidden],674.atlas-filter[hidden] {675	display: none;676}677.atlas-filter {678	width: 220px;679	max-width: 100%;680	margin-left: auto;681	padding: 5px 10px;682	background: transparent;683	border: 1px solid var(--border);684	border-radius: 3px;685	color: var(--text);686	font-size: 0.6875rem;687}688.atlas-filter:focus {689	outline: none;690	border-color: var(--accent-dim);691}692.atlas-filter::placeholder {693	color: var(--text-faint);694}695/* kepr.js fixes the height at the closed tree's, at most Kepr 2's 520px, and the tree and panel696   scroll inside it; without it, the whole box scrolls. */697.atlas {698	display: grid;699	grid-template-columns: minmax(0, 1fr);700	grid-template-rows: minmax(0, 1fr);701	gap: 0 20px;702	max-height: 520px;703	overflow-y: auto;704	border-top: 1px solid var(--bg-elevated);705	border-bottom: 1px solid var(--bg-elevated);706}707.atlas-tree,708.atlas-panel {709	min-height: 0;710	overflow-y: auto;711	scrollbar-width: thin;712	scrollbar-color: var(--border) transparent;713}714.atlas:has(> .atlas-panel:not([hidden])) {715	grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);716}717.atlas [hidden] {718	display: none;719}720.atlas-folder > summary {721	list-style: none;722}723.atlas-folder > summary::-webkit-details-marker {724	display: none;725}726.atlas-children {727	padding-left: 14px;728	border-left: 1px solid var(--border);729	margin-left: 6px;730}731.atlas-row {732	position: relative;733	display: grid;734	grid-template-columns: minmax(90px, auto) 1fr auto;735	align-items: baseline;736	gap: 0 12px;737	padding: 6px 8px;738	border-bottom: 1px solid rgba(42, 32, 24, 0.62);739	cursor: pointer;740	transition: background 100ms;741}742.atlas-row:hover,743.atlas-row:focus-visible,744.atlas-row.selected {745	outline: none;746	background: var(--accent-tint-04);747	text-decoration: none;748}749.atlas-row.selected {750	box-shadow: inset 2px 0 0 var(--accent);751}752.atlas-name {753	color: var(--text-heading);754	font-size: 0.875rem;755	white-space: nowrap;756}757.atlas-folder > summary .atlas-name {758	color: var(--accent);759}760.atlas-desc {761	min-width: 0;762	color: var(--text-muted);763	font-size: 0.8125rem;764	overflow: hidden;765	text-overflow: ellipsis;766	white-space: nowrap;767}768.atlas-meta {769	font-size: 0.625rem;770	color: var(--text-faint);771	white-space: nowrap;772}773.atlas-panel {774	padding: 12px 0 12px 16px;775	border-left: 1px solid var(--border);776}777.atlas-hint {778	margin: 0;779	font-size: 0.625rem;780	color: var(--text-faint);781}782.atlas-info-name {783	margin: 0;784	font-weight: 400;785	font-size: 1.375rem;786	color: var(--text-heading);787	overflow-wrap: anywhere;788}789.atlas-info-path {790	margin: 0 0 12px;791	font-size: 0.625rem;792	color: var(--text-faint);793	overflow-wrap: anywhere;794}795.atlas-facts {796	display: grid;797	grid-template-columns: auto 1fr;798	gap: 3px 12px;799	margin: 0 0 12px;800	font-size: 0.625rem;801}802.atlas-facts dt {803	color: var(--text-faint);804}805.atlas-facts dd {806	margin: 0;807	color: var(--text);808}809.atlas-facts a {810	color: var(--accent);811}812.atlas-info-desc {813	font-size: 0.8125rem;814	color: var(--text-muted);815}816/* ----- README and rendered Markdown --------------------------------------- */817818.repo-details {819	margin: 36px 0 0;820	animation: fadeIn 320ms 80ms ease both;821}822.repo-details-toggle {823	border-bottom: 1px solid var(--border);824	padding-bottom: 24px;825}826.repo-details-head {827	display: flex;828	align-items: center;829	gap: 6px;830	padding: 8px 0;831	font-family: var(--mono);832	font-size: 0.6875rem;833	letter-spacing: 0.12em;834	color: var(--text-secondary);835	text-transform: uppercase;836}837.markdown {838	font-size: 1.05rem;839	line-height: 1.7;840	overflow-wrap: break-word;841}842.markdown h1,843.markdown h2,844.markdown h3,845.markdown h4 {846	font-weight: 400;847	margin: 1.4em 0 0.4em;848	color: var(--text-heading);849}850.markdown h1 {851	font-size: 1.5rem;852}853.markdown h2 {854	font-size: 1.3rem;855}856.markdown h3 {857	font-size: 1.15rem;858}859.markdown p {860	margin: 0.8em 0;861}862.markdown ul,863.markdown ol {864	margin: 0.8em 0 0.8em 1.5em;865	padding: 0;866}867.markdown a {868	color: var(--accent);869}870.markdown code {871	font-family: var(--mono);872	font-size: 0.82em;873	color: var(--accent);874	background: var(--bg-surface);875	padding: 0.15em 0.35em;876	border-radius: 3px;877}878.markdown pre {879	background: var(--bg-surface);880	border-radius: 4px;881	padding: 1em 1.2em;882	overflow-x: auto;883	margin: 1em 0;884}885.markdown pre code {886	background: none;887	padding: 0;888	color: var(--text);889	font-size: 0.85em;890}891.markdown blockquote {892	border-left: 3px solid var(--border);893	margin: 1em 0;894	padding: 0.1em 1em;895	color: var(--text-secondary);896}897.markdown hr {898	border: none;899	border-top: 1px solid var(--border);900	margin: 1.5em 0;901}902.markdown img {903	max-width: 100%;904}905.markdown table {906	border-collapse: collapse;907	display: block;908	overflow-x: auto;909}910.markdown th,911.markdown td {912	border: 1px solid var(--border);913	padding: 4px 10px;914}915916/* ----- file viewer -------------------------------------------------------- */917918.breadcrumb {919	margin: 0 0 4px;920	font-size: 0.75rem;921	overflow-wrap: anywhere;922}923.breadcrumb a:hover {924	color: var(--accent);925}926.file-page-title {927	font-size: 1.75rem;928	font-weight: 400;929	margin: 4px 0 12px;930	overflow-wrap: anywhere;931}932.file-meta,933.file-toggle {934	margin: 0 0 12px;935	font-size: 0.6875rem;936}937.file-meta a,938.file-toggle a.active {939	color: var(--accent);940}941.file-image img {942	max-width: 100%;943	background: var(--bg-surface);944	border: 1px solid var(--border);945}946.file-view {947	border: 1px solid var(--border);948	background: var(--bg-surface);949	overflow-x: auto;950}951.code {952	margin: 0;953	padding: 16px 0;954	font-family: var(--mono);955	font-size: 0.8125rem;956	line-height: 1.65;957	tab-size: 4;958}959/* A grid, so tab stops count from the start of the code rather than the line number. */960.code .line {961	display: grid;962	grid-template-columns: 6em 1fr;963	padding-right: 24px;964	scroll-margin-top: 40vh;965}966.code .line:target,967.code .line.hl {968	background: var(--accent-tint-12);969}970.code .lc {971	white-space: pre;972}973.code .ln {974	padding-right: 1.5em;975	text-align: right;976	color: var(--text-faint);977	user-select: none;978}979.code .ln:hover {980	color: var(--accent);981	text-decoration: none;982}983984/* Shiki's CSS-variables theme roles, in Kepr 2's highlight.js colours. */985.tk-comment {986	color: var(--text-muted);987	font-style: italic;988}989.tk-keyword {990	color: var(--accent);991}992.tk-string,993.tk-string-expression {994	color: var(--sage);995}996.tk-constant {997	color: var(--accent-bright);998}999.tk-function {1000	color: var(--accent);1001}1002.tk-parameter {1003	color: var(--text);1004}1005.tk-punctuation {1006	color: var(--text-secondary);1007}1008.tk-link {1009	color: var(--accent);1010	text-decoration: underline;1011}1012.tk-inserted {1013	color: var(--sage);1014}1015.tk-deleted {1016	color: #c45c5c;1017}1018.tk-i {1019	font-style: italic;1020}10211022/* ----- save page ---------------------------------------------------------- */10231024.save-id {1025	margin: 12px 0 0;1026	font-size: 0.75rem;1027	color: var(--text-secondary);1028}1029.save-flag {1030	margin: 12px 0 0;1031	padding: 8px 12px;1032	border: 1px solid #6a3a2a;1033	border-left: 2px solid #c45c5c;1034	background: rgba(196, 92, 92, 0.08);1035	color: var(--text-heading);1036}1037.save-flag-label {1038	margin-right: 8px;1039	font-size: 0.625rem;1040	letter-spacing: 0.12em;1041	text-transform: uppercase;1042	color: #c45c5c;1043}1044.save-message-head {1045	font-size: 2.25rem;1046	font-weight: 400;1047	line-height: 1.3;1048	margin: 12px 0 8px;1049	color: var(--text-heading);1050	overflow-wrap: anywhere;1051	animation: fadeUp 280ms ease both;1052}1053.save-message-body {1054	margin: 0 0 12px;1055	white-space: pre-wrap;1056	color: var(--text-secondary);1057}1058.save-facts {1059	display: grid;1060	grid-template-columns: max-content 1fr;1061	gap: 2px 16px;1062	margin: 16px 0;1063	font-size: 0.75rem;1064}1065.save-facts dt {1066	color: var(--text-faint);1067}1068.save-facts dd {1069	margin: 0;1070	overflow-wrap: anywhere;1071}1072.save-facts a,1073.save-links a,1074.diff-view a {1075	color: var(--accent);1076}1077.save-links {1078	display: flex;1079	flex-wrap: wrap;1080	gap: 8px 20px;1081	margin: 0;1082	font-size: 0.75rem;1083}1084.save-empty {1085	font-size: 0.75rem;1086}1087.change-row,1088.diff-head {1089	display: grid;1090	grid-template-columns: 1fr auto;1091	gap: 12px;1092	padding: 7px 8px;1093	border-bottom: 1px solid var(--border);1094	font-family: var(--mono);1095	font-size: 0.8125rem;1096}1097.change-row:hover {1098	background: var(--accent-tint-04);1099	text-decoration: none;1100}1101.change-path {1102	min-width: 0;1103	overflow-wrap: anywhere;1104}1105.change-added .change-path {1106	color: var(--sage);1107}1108.change-removed .change-path {1109	color: var(--text-muted);1110	text-decoration: line-through;1111}1112.change-modified .change-path {1113	color: var(--accent-bright);1114}1115.change-stat {1116	font-size: 0.75rem;1117	white-space: nowrap;1118}1119.diff-add {1120	color: var(--sage);1121}1122.diff-del {1123	color: #c45c5c;1124}1125.diff-note {1126	color: var(--text-faint);1127	font-size: 0.6875rem;1128}1129.diff-file {1130	margin: 0 0 20px;1131}1132.diff-head {1133	cursor: pointer;1134	list-style: none;1135	border: 1px solid var(--border);1136	background: var(--bg-surface);1137}1138.diff-head::-webkit-details-marker {1139	display: none;1140}1141.diff-file > .file-view {1142	border-top: 0;1143}1144.diff-file > .diff-note,1145.diff-view {1146	margin: 8px 0 0;1147	font-size: 0.6875rem;1148}1149.code.diff {1150	padding: 4px 0;1151}1152.diff .dl {1153	display: grid;1154	grid-template-columns: 3.5em 3.5em 1.5em 1fr;1155	padding-right: 24px;1156}1157.diff .dh {1158	display: block;1159	padding: 4px 1em;1160	color: var(--text-faint);1161	background: var(--bg-elevated);1162}1163.diff .ln {1164	padding-right: 0.75em;1165	text-align: right;1166	color: var(--text-faint);1167	user-select: none;1168}1169.diff .ds {1170	text-align: center;1171	color: var(--text-faint);1172	user-select: none;1173}1174.diff .dl-add {1175	background: rgba(122, 154, 104, 0.1);1176}1177.diff .dl-add .ds {1178	color: var(--sage);1179}1180.diff .dl-del {1181	background: rgba(196, 92, 92, 0.08);1182}1183.diff .dl-del .ds {1184	color: #c45c5c;1185}11861187/* ----- archives ----------------------------------------------------------- */11881189.archive-row {1190	padding: 12px 8px;1191	border-bottom: 1px solid var(--border);1192}1193.archive-save {1194	display: flex;1195	flex-wrap: wrap;1196	align-items: baseline;1197	gap: 0 10px;1198	margin: 0;1199}1200.archive-save .history-id {1201	flex: 0 0 110px;1202}1203.archive-msg {1204	flex: 1;1205}1206.archive-head {1207	font-size: 0.625rem;1208	letter-spacing: 0.08em;1209	color: var(--accent);1210	border: 1px solid var(--accent-dim);1211	border-radius: 2px;1212	padding: 0 6px;1213}1214.archive-save .history-id:hover {1215	color: var(--accent);1216}1217.archive-links {1218	margin: 6px 0;1219	font-size: 0.75rem;1220}1221.archive-links a {1222	color: var(--accent);1223}1224.archive-row .install-line {1225	justify-content: space-between;1226}12271228/* ----- phone -------------------------------------------------------------- */12291230@media (max-width: 768px) {1231	body > nav {1232		padding: 20px 16px;1233	}1234	.nav-links {1235		gap: 18px;1236	}1237	main {1238		padding: 16px 16px 80px;1239	}1240	.repo-name {1241		font-size: 2.75rem;1242	}1243	.install-lines {1244		align-items: stretch;1245		margin-left: 0;1246		width: 100%;1247	}1248	.history-row {1249		grid-template-columns: 1fr auto;1250	}1251	.history-id {1252		grid-column: 1 / -1;1253	}1254	.atlas-row {1255		grid-template-columns: 1fr auto;1256	}1257	.atlas-desc {1258		grid-column: 1 / -1;1259		grid-row: 2;1260	}1261	.atlas:has(> .atlas-panel:not([hidden])) {1262		grid-template-columns: minmax(0, 1fr);1263	}1264	.atlas-panel {1265		display: none;1266	}1267	.code .line {1268		grid-template-columns: 4.5em 1fr;1269	}1270	.save-message-head {1271		font-size: 1.625rem;1272	}1273	.archive-msg {1274		flex-basis: 100%;1275		order: 1;1276	}1277	.diff .dl {1278		grid-template-columns: 2.75em 2.75em 1.25em 1fr;1279	}1280	.code .ln {1281		padding-right: 1em;1282	}1283}12841285/* ----- builds ------------------------------------------------------------- */12861287.release {1288	padding: 20px 8px 24px;1289	border-bottom: 1px solid var(--border);1290}1291.release-head {1292	display: flex;1293	flex-wrap: wrap;1294	align-items: baseline;1295	gap: 0 14px;1296	margin: 0 0 8px;1297}1298.release-version {1299	font-family: "Martian Mono", monospace;1300	font-size: 1rem;1301	color: var(--accent);1302}1303.release-head .history-id:hover {1304	color: var(--accent);1305}1306.release-notes {1307	margin-bottom: 14px;1308}1309.release-file {1310	padding: 10px 0;1311	border-top: 1px dashed var(--border);1312}1313.release-file-head {1314	display: flex;1315	flex-wrap: wrap;1316	align-items: baseline;1317	gap: 4px 14px;1318	margin: 0;1319}1320.release-platform {1321	flex: 0 0 180px;1322}1323.release-download {1324	flex: 1;1325	font-size: 0.75rem;1326	color: var(--accent);1327	overflow-wrap: anywhere;1328}1329.release-meta,1330.release-sha {1331	font-size: 0.6875rem;1332	color: var(--text-muted);1333}1334.release-sha {1335	margin: 4px 0 0;1336	overflow-wrap: anywhere;1337}1338.release-hint {1339	margin: 4px 0 0;1340	font-size: 0.8125rem;1341}13421343/* ----- issues ------------------------------------------------------------- */13441345.issues-bar {1346	display: flex;1347	flex-wrap: wrap;1348	align-items: center;1349	gap: 8px 12px;1350	font-size: 0.75rem;1351	padding-bottom: 14px;1352	border-bottom: 1px solid var(--bg-elevated);1353}1354.issues-tab {1355	color: var(--text-faint);1356	border: 1px solid transparent;1357	border-radius: 999px;1358	padding: 4px 10px;1359}1360button.issues-tab {1361	font: inherit;1362	background: none;1363	cursor: pointer;1364}1365.issues-tab.active {1366	color: var(--accent);1367	border-color: var(--accent-tint-12);1368}1369.issues-new {1370	margin-left: auto;1371	color: var(--text-muted);1372}1373.issue-row {1374	display: flex;1375	flex-wrap: wrap;1376	align-items: baseline;1377	gap: 2px 10px;1378	padding: 10px 8px;1379	border-bottom: 1px solid var(--border);1380}1381.issue-row:hover {1382	text-decoration: none;1383	background: var(--accent-tint-04);1384}1385.issue-title {1386	flex: 1;1387	color: var(--text-heading);1388}1389.issues-new:hover,1390.issue-row:hover .issue-title {1391	color: var(--accent);1392}1393.issue-meta,1394.issue-post-head {1395	font-size: 0.6875rem;1396	color: var(--text-muted);1397}1398.issue-symbol--open {1399	color: var(--accent);1400}1401.issue-symbol--closed {1402	color: var(--text-faint);1403}1404.issue-post {1405	margin: 18px 0;1406	padding: 14px 18px;1407	border: 1px solid var(--border);1408	border-radius: 6px;1409	background: var(--bg-surface);1410}1411.issue-post--operator {1412	border-color: var(--accent-dim);1413}1414.issue-post-head {1415	display: flex;1416	flex-wrap: wrap;1417	gap: 4px 12px;1418	margin: 0 0 8px;1419}1420.issue-author {1421	color: var(--text);1422}1423.issue-badge {1424	color: var(--accent);1425	text-transform: uppercase;1426	letter-spacing: 0.08em;1427}1428.issue-text {1429	white-space: pre-wrap;1430	overflow-wrap: anywhere;1431}1432.issue-link {1433	font-size: 0.75rem;1434	overflow-wrap: anywhere;1435	color: var(--accent);1436}1437.issues-form {1438	display: flex;1439	flex-direction: column;1440	gap: 6px;1441	max-width: 640px;1442	margin-top: 18px;1443}1444.issues-label {1445	font-family: var(--mono);1446	font-size: 0.6875rem;1447	margin-top: 6px;1448	opacity: 0.8;1449}1450.issues-input,1451.issues-textarea {1452	font-family: var(--mono);1453	font-size: 0.75rem;1454	width: 100%;1455	padding: 6px 8px;1456	color: var(--text);1457	background: var(--bg);1458	border: 1px solid var(--border);1459	border-radius: 4px;1460	resize: vertical;1461}1462.issues-input:focus,1463.issues-textarea:focus {1464	outline: none;1465	border-color: var(--accent);1466}1467.issues-submit {1468	align-self: flex-start;1469	margin-top: 10px;1470	padding: 6px 14px;1471	font-family: var(--mono);1472	font-size: 0.75rem;1473	color: var(--bg);1474	background: var(--accent);1475	border: none;1476	border-radius: 4px;1477	cursor: pointer;1478}1479.issues-submit:hover {1480	opacity: 0.85;1481}1482.issues-actions {1483	display: flex;1484	align-items: baseline;1485	gap: 16px;1486	margin: 0;1487}1488.issues-cancel {1489	font-size: 0.75rem;1490	color: var(--text-muted);1491}1492.issues-cancel:hover {1493	color: var(--accent);1494}1495.issues-error {1496	font-size: 0.75rem;1497	color: #c86a5a;1498}1499/* The honeypot: off-screen for people, still in the form for bots. */1500.issues-hp {1501	position: absolute;1502	left: -9999px;1503	height: 0;1504	overflow: hidden;1505	opacity: 0;1506}15071508/* ----- front page --------------------------------------------------------- */15091510/* Kepr 2's hero band, full width, reaching up behind the nav (32px mark + 48px padding). */1511body > nav {1512	position: relative;1513	z-index: 1;1514}1515.ticker {1516	position: relative;1517	height: 304px;1518	margin: -104px calc(50% - 50vw) 0;1519	padding: 96px 0 20px;1520	display: flex;1521	flex-direction: column;1522	justify-content: space-evenly;1523	overflow: hidden;1524	pointer-events: none;1525	user-select: none;1526	border-bottom: 1px solid var(--border);1527	font-family: var(--mono);1528	color: var(--text-secondary);1529	mask-image: linear-gradient(1530		to right,1531		transparent,1532		#000 48px,1533		#000 calc(100% - 48px),1534		transparent1535	);1536}1537.ticker-row {1538	white-space: nowrap;1539	line-height: 1.2;1540	opacity: var(--o);1541	animation: ticker-glow 83s var(--glow-at) ease-in-out infinite;1542}1543/* The drift's duration is set by kepr.js from the track's width, so every row keeps Kepr 2's1544   pace in px/s (--speed) however long its messages are; this is the no-JavaScript fallback. */1545.ticker-track {1546	display: inline-flex;1547	gap: 64px;1548	padding-right: 64px;1549	animation: ticker-drift 1500s linear infinite;1550}1551/* Kepr 2's depth bands: nearer rows are larger, brighter and faster. Each row takes its turn at1552   the glow, a few seconds out of every 83, spaced so one or two glow at a time. */1553.ticker-row:nth-child(1) {1554	font-size: 9px;1555	--o: 0.05;1556	--speed: 12;1557	--glow-at: -5s;1558}1559.ticker-row:nth-child(2) {1560	font-size: 18px;1561	--o: 0.1;1562	--speed: 23;1563	--glow-at: -41s;1564}1565.ticker-row:nth-child(3) {1566	font-size: 7px;1567	--o: 0.04;1568	--speed: 9;1569	--glow-at: -77s;1570}1571.ticker-row:nth-child(4) {1572	font-size: 13px;1573	--o: 0.07;1574	--speed: 17;1575	--glow-at: -29s;1576}1577.ticker-row:nth-child(5) {1578	font-size: 22px;1579	--o: 0.12;1580	--speed: 29;1581	--glow-at: -65s;1582}1583.ticker-row:nth-child(6) {1584	font-size: 8px;1585	--o: 0.045;1586	--speed: 10;1587	--glow-at: -17s;1588}1589.ticker-row:nth-child(7) {1590	font-size: 15px;1591	--o: 0.08;1592	--speed: 20;1593	--glow-at: -53s;1594}1595@keyframes ticker-drift {1596	to {1597		transform: translateX(-50%);1598	}1599}1600@keyframes ticker-glow {1601	0%,1602	10%,1603	100% {1604		color: var(--text-secondary);1605		opacity: var(--o);1606		text-shadow: none;1607	}1608	5% {1609		color: var(--accent);1610		opacity: calc(var(--o) * 3.5);1611		text-shadow: 0 0 3px var(--accent-tint-12);1612	}1613}16141615.headline {1616	display: grid;1617	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);1618	gap: 48px;1619	align-items: center;1620	padding: 56px 0 40px;1621}1622.headline h1 {1623	font-size: clamp(2rem, 5vw, 3.5rem);1624	font-weight: 400;1625	line-height: 1.15;1626	color: var(--text-heading);1627	margin: 0 0 20px;1628	animation: fadeUp 480ms ease both;1629}1630.headline-tagline {1631	margin: 0;1632	font-size: 0.9375rem;1633	line-height: 1.7;1634	color: var(--text-secondary);1635	animation: fadeUp 480ms 80ms ease both;1636}1637.headline-cloud {1638	display: flex;1639	flex-wrap: wrap;1640	justify-content: center;1641	align-items: center;1642	gap: 10px 22px;1643	padding: 20px;1644	animation: fadeIn 600ms 160ms ease both;1645}1646.tc-tag {1647	font-family: var(--mono);1648	letter-spacing: 0.03em;1649	white-space: nowrap;1650	color: var(--accent-dim);1651	transition:1652		color 0.2s,1653		opacity 0.2s,1654		text-shadow 0.2s;1655}1656.tc-tag:hover {1657	color: var(--accent);1658	opacity: 1;1659	text-shadow: 0 0 14px var(--accent-tint-12);1660}1661.tc-1 {1662	font-size: 10px;1663	opacity: 0.42;1664}1665.tc-2 {1666	font-size: 12px;1667	opacity: 0.56;1668}1669.tc-3 {1670	font-size: 15px;1671	opacity: 0.7;1672}1673.tc-4 {1674	font-size: 18px;1675	opacity: 0.85;1676	font-weight: 500;1677}1678.tc-5 {1679	font-size: 23px;1680	opacity: 1;1681	font-weight: 500;1682}16831684.featured-label {1685	font-size: 0.6875rem;1686	font-weight: 400;1687	letter-spacing: 0.08em;1688	text-transform: uppercase;1689	color: var(--text-secondary);1690	margin: 0 0 12px;1691}1692.landing-self-host {1693	margin: 32px 0 0;1694	font-size: 0.75rem;1695}1696.landing-self-host a {1697	color: var(--text-secondary);1698}16991700/* ----- repo cards (front page, browse, profile) --------------------------- */17011702.card-grid {1703	display: grid;1704	grid-template-columns: repeat(2, minmax(0, 1fr));1705	gap: 16px;1706}1707.repo-card {1708	display: flex;1709	flex-direction: column;1710	padding: 20px 22px 16px;1711	border: 1px solid var(--bg-elevated);1712	border-radius: 4px;1713	background: var(--bg);1714	transition:1715		border-color 120ms,1716		background 120ms;1717	animation: fadeUp 350ms ease both;1718}1719.repo-card:hover {1720	text-decoration: none;1721	border-color: var(--text-faint);1722	background: var(--accent-tint-04);1723}1724.repo-card-head {1725	display: flex;1726	align-items: baseline;1727	justify-content: space-between;1728	gap: 12px;1729}1730.repo-card-name {1731	font-size: 1.375rem;1732	line-height: 1.1;1733	color: var(--accent);1734	overflow: hidden;1735	text-overflow: ellipsis;1736	white-space: nowrap;1737}1738.repo-card-saves {1739	font-size: 0.6875rem;1740	white-space: nowrap;1741}1742.repo-card-desc {1743	margin: 8px 0 0;1744	font-size: 0.8125rem;1745	line-height: 1.5;1746	color: var(--text-secondary);1747	display: -webkit-box;1748	-webkit-line-clamp: 2;1749	-webkit-box-orient: vertical;1750	overflow: hidden;1751}1752.repo-card-cat {1753	margin: 10px 0 0;1754	font-size: 0.9375rem;1755	color: var(--text);1756}17571758/* ----- profile ------------------------------------------------------------ */17591760/* The cover runs the full width of the window while the page keeps its column. */1761.profile-cover {1762	position: relative;1763	height: 380px;1764	margin: -24px calc(50% - 50vw) 0;1765	overflow: hidden;1766	border-bottom: 1px solid var(--bg-surface);1767}1768.hex-backdrop {1769	position: absolute;1770	inset: 0;1771	display: flex;1772	flex-direction: row-reverse;1773	justify-content: center;1774	align-items: center;1775	gap: 13px;1776	pointer-events: none;1777	user-select: none;1778	font-family: var(--mono);1779	font-size: 13px;1780	line-height: 16px;1781	color: var(--accent-dim);1782}1783/* Characters top to bottom, columns right to left, each breathing on its own clock. */1784.hex-col {1785	writing-mode: vertical-rl;1786	text-orientation: upright;1787	letter-spacing: 3px;1788	opacity: 0.05;1789	animation: hex-breathe 17s ease-in-out infinite;1790	transition:1791		color 1.6s ease,1792		text-shadow 1.6s ease;1793}1794.hex-col:nth-child(3n) {1795	color: var(--accent);1796	animation-duration: 23s;1797	animation-delay: -7s;1798}1799.hex-col:nth-child(4n + 1) {1800	animation-duration: 29s;1801	animation-delay: -13s;1802}1803.hex-col:nth-child(5n + 2) {1804	animation-duration: 19s;1805	animation-delay: -3s;1806}1807.hex-col:nth-child(7n) {1808	animation-delay: -21s;1809}1810.hex-col.glow {1811	color: var(--accent-bright);1812	text-shadow: 0 0 6px var(--accent-tint-12);1813}1814@keyframes hex-breathe {1815	0%,1816	100% {1817		opacity: 0.05;1818	}1819	50% {1820		opacity: 0.22;1821	}1822}1823.profile-cover-fade {1824	position: absolute;1825	left: 0;1826	right: 0;1827	bottom: 0;1828	height: 55%;1829	background: linear-gradient(to bottom, transparent, var(--bg));1830	pointer-events: none;1831}1832.profile-identity {1833	position: absolute;1834	bottom: 40px;1835	left: 0;1836	right: 0;1837	max-width: 980px;1838	margin: 0 auto;1839	padding: 0 48px;1840}1841.profile-username {1842	margin: 0 0 8px;1843	font-family: "Sacramento", cursive;1844	font-weight: 400;1845	font-size: 3.625rem;1846	line-height: 1;1847	letter-spacing: -0.02em;1848	text-transform: lowercase;1849	color: var(--text-heading);1850	user-select: none;1851	animation: fadeUp 500ms ease both;1852}1853.profile-signature {1854	display: block;1855	max-height: 96px;1856	max-width: min(360px, 100%);1857}1858.profile-tagline {1859	margin: 0 0 6px;1860	font-family: var(--mono);1861	font-size: 0.75rem;1862	letter-spacing: 0.15em;1863	color: var(--text-faint);1864}1865.profile-op-badge {1866	display: block;1867	font-size: 0.6875rem;1868	letter-spacing: 0.18em;1869	color: var(--accent);1870}18711872.profile-portrait-section {1873	display: grid;1874	grid-template-columns: 320px minmax(0, 1fr);1875	gap: 40px;1876	align-items: start;1877	padding-top: 40px;1878}1879.profile-left {1880	display: flex;1881	flex-direction: column;1882	gap: 16px;1883}1884.profile-identity-card,1885.profile-languages-bar {1886	padding: 20px 24px;1887	border: 1px solid var(--bg-elevated);1888	border-radius: 4px;1889}1890.profile-identity-bio {1891	margin: 0;1892	font-size: 0.875rem;1893	line-height: 1.5;1894	color: var(--text-muted);1895}1896.profile-identity-location {1897	margin: 6px 0 0;1898	font-family: var(--mono);1899	font-size: 0.8125rem;1900	color: var(--text-muted);1901}1902.profile-website-pill {1903	display: inline-block;1904	max-width: 100%;1905	margin-top: 10px;1906	padding: 3px 8px;1907	overflow: hidden;1908	text-overflow: ellipsis;1909	white-space: nowrap;1910	border: 1px solid var(--text-faint);1911	border-radius: 3px;1912	background: var(--bg-surface);1913	font-family: var(--mono);1914	font-size: 0.6875rem;1915	color: var(--accent);1916}1917.profile-website-pill:hover {1918	border-color: var(--accent);1919	text-decoration: none;1920}1921.profile-stats-grid {1922	display: grid;1923	grid-template-columns: 1fr 1fr;1924	border: 1px solid var(--bg-elevated);1925	border-radius: 4px;1926	overflow: hidden;1927}1928.profile-stat-tile {1929	padding: 16px;1930	border-right: 1px solid var(--bg-elevated);1931	border-bottom: 1px solid var(--bg-elevated);1932}1933.profile-stat-tile:nth-child(2n) {1934	border-right: none;1935}1936.profile-stat-tile:nth-last-child(-n + 2) {1937	border-bottom: none;1938}1939.profile-stat-number {1940	margin-bottom: 4px;1941	font-weight: 600;1942	font-size: 1.75rem;1943	line-height: 1;1944	color: var(--accent);1945}1946.profile-stat-label,1947.profile-section-label {1948	font-family: var(--mono);1949	font-size: 0.625rem;1950	text-transform: uppercase;1951	letter-spacing: 0.08em;1952	color: var(--text-faint);1953}1954.profile-lang-bar {1955	display: block;1956	width: 100%;1957	height: 6px;1958	margin-bottom: 8px;1959	border-radius: 3px;1960	background: var(--bg-surface);1961}1962.profile-lang-bar rect {1963	fill: var(--accent);1964	opacity: 0.6;1965}1966.profile-lang-bar rect:nth-child(2) {1967	fill: var(--sage);1968}1969.profile-lang-bar rect:nth-child(3) {1970	fill: var(--accent-flash);1971	opacity: 0.45;1972}1973.profile-lang-bar rect:nth-child(4) {1974	fill: var(--accent-dim);1975}1976.profile-lang-labels {1977	display: flex;1978	flex-wrap: wrap;1979	gap: 10px;1980	font-family: var(--mono);1981	font-size: 0.625rem;1982	color: var(--text-muted);1983}1984.profile-section-label {1985	margin-bottom: 16px;1986	letter-spacing: 0.2em;1987}1988.profile-event {1989	display: grid;1990	grid-template-columns: 96px 12px minmax(0, 1fr) auto;1991	gap: 10px;1992	align-items: baseline;1993	padding: 7px 0;1994	border-bottom: 1px solid var(--bg-surface);1995	font-family: var(--mono);1996	font-size: 0.6875rem;1997	animation: fadeUp 300ms ease both;1998}1999.profile-event-repo,2000.profile-event-message {2001	overflow: hidden;2002	text-overflow: ellipsis;2003	white-space: nowrap;2004}2005.profile-event-repo,2006.profile-event-glyph {2007	color: var(--accent);2008}2009.profile-event-glyph {2010	font-size: 0.625rem;2011}2012.profile-event-message {2013	color: var(--text-muted);2014}2015.profile-event-message:hover {2016	color: var(--text-heading);2017}2018.profile-event-time {2019	font-size: 0.625rem;2020	white-space: nowrap;2021	color: var(--text-faint);2022}2023.profile-empty-state {2024	font-style: italic;2025	font-size: 0.8125rem;2026	color: var(--text-faint);2027}2028.profile-repos-section {2029	margin-top: 40px;2030	padding-top: 40px;2031	border-top: 1px solid var(--bg-surface);2032}20332034/* ----- docs and support --------------------------------------------------- */20352036.site-doc {2037	max-width: 72ch;2038	margin-top: 16px;2039}2040.site-doc h1 {2041	font-size: clamp(2rem, 5vw, 3rem);2042	font-weight: 400;2043	color: var(--text-heading);2044}2045.site-doc h2 {2046	margin-top: 2.4em;2047}20482049@media (max-width: 860px) {2050	.headline,2051	.profile-portrait-section {2052		grid-template-columns: minmax(0, 1fr);2053	}2054	.headline {2055		gap: 8px;2056		padding-top: 48px;2057	}2058	.card-grid {2059		grid-template-columns: minmax(0, 1fr);2060	}2061}2062@media (max-width: 768px) {2063	.editor-panes {2064		grid-template-columns: minmax(0, 1fr);2065	}2066	.fv-header {2067		flex-wrap: wrap;2068		height: auto;2069		padding: 8px 12px;2070		gap: 8px 12px;2071	}2072	.fv-body {2073		grid-template-columns: minmax(0, 1fr);2074	}2075	.fv-detail {2076		display: none;2077	}2078	.ticker {2079		height: 226px;2080		margin-top: -88px;2081		padding-top: 80px;2082	}2083	.profile-cover {2084		height: 280px;2085		margin-top: -16px;2086	}2087	.profile-identity {2088		bottom: 24px;2089		padding: 0 16px;2090	}2091	.profile-username {2092		font-size: 2.5rem;2093	}2094	.profile-event {2095		grid-template-columns: 72px 12px minmax(0, 1fr);2096	}2097	.profile-event-time {2098		display: none;2099	}2100}21012102/* ----- media in Markdown and the signed-in editor ------------------------- */21032104/* Sizes and places from an image's options (markdown.ts); classes, as the policy allows no inline2105   style. */2106.markdown .media {2107	display: block;2108	max-width: 100%;2109	height: auto;2110	margin: 12px auto;2111	border-radius: 3px;2112}2113.markdown .media-left {2114	margin-left: 0;2115}2116.markdown .media-right {2117	margin-right: 0;2118}2119.markdown .media-w25 {2120	width: 25%;2121}2122.markdown .media-w33 {2123	width: 33%;2124}2125.markdown .media-w50 {2126	width: 50%;2127}2128.markdown .media-w66 {2129	width: 66%;2130}2131.markdown .media-w75 {2132	width: 75%;2133}2134.markdown .media-w100 {2135	width: 100%;2136}2137.edit-btn {2138	margin-left: 12px;2139	padding: 1px 7px;2140	background: transparent;2141	border: 1px solid rgba(200, 154, 90, 0.2);2142	border-radius: 2px;2143	font-size: 0.625rem;2144	color: var(--text-faint);2145	cursor: pointer;2146	vertical-align: middle;2147}2148.edit-btn:hover {2149	color: var(--accent);2150	border-color: var(--accent-dim);2151}2152.editor {2153	display: grid;2154	gap: 8px;2155	margin: 8px 0 16px;2156}2157.editor-toolbar,2158.editor-media,2159.editor-actions {2160	display: flex;2161	flex-wrap: wrap;2162	align-items: center;2163	gap: 4px;2164}2165.editor-media[hidden] {2166	display: none;2167}2168.editor-label,2169.editor-status {2170	margin: 0 6px;2171	font-size: 0.625rem;2172	color: var(--text-faint);2173}2174.editor-panes {2175	display: grid;2176	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);2177	gap: 12px;2178}2179.editor-input {2180	width: 100%;2181	min-height: 4lh;2182	max-height: 70vh;2183	field-sizing: content;2184	resize: vertical;2185	padding: 10px 12px;2186	background: var(--bg-surface);2187	border: 1px solid var(--border);2188	border-radius: 3px;2189	color: var(--text);2190	font-size: 0.75rem;2191	line-height: 1.6;2192}2193.editor-input:focus {2194	outline: none;2195	border-color: var(--accent-dim);2196}2197.editor-preview {2198	min-width: 0;2199	max-height: 70vh;2200	overflow-y: auto;2201	padding: 0 4px;2202}2203.editor-preview:empty::before {2204	content: attr(data-empty);2205	font-family: var(--mono);2206	font-size: 0.625rem;2207	color: var(--text-faint);2208}22092210/* ----- file viewer (Kepr 2's Atlas modal) -------------------------------- */22112212body:has(> .fv-overlay) {2213	overflow: hidden;2214}2215.fv-overlay {2216	position: fixed;2217	inset: 0;2218	z-index: 2000;2219	display: flex;2220	flex-direction: column;2221	background: rgba(8, 7, 5, 0.97);2222	outline: none;2223	animation: fv-in 200ms ease both;2224}2225@keyframes fv-in {2226	from {2227		opacity: 0;2228		transform: translateY(6px) scale(0.97);2229	}2230}2231.fv-header {2232	display: flex;2233	align-items: center;2234	gap: 16px;2235	flex-shrink: 0;2236	height: 48px;2237	padding: 0 20px;2238	background: var(--bg);2239	border-bottom: 1px solid var(--bg-elevated);2240}2241.fv-close {2242	background: none;2243	border: 0;2244	padding: 0 4px;2245	font-size: 1.375rem;2246	line-height: 1;2247	color: var(--text-faint);2248	cursor: pointer;2249}2250.fv-close:hover {2251	color: var(--accent);2252}2253.fv-title {2254	display: flex;2255	align-items: baseline;2256	gap: 8px;2257	flex: 1;2258	min-width: 0;2259}2260.fv-name {2261	font-size: 1.25rem;2262	color: var(--text-heading);2263	white-space: nowrap;2264}2265.fv-path {2266	font-size: 0.625rem;2267	color: var(--text-faint);2268	white-space: nowrap;2269	overflow: hidden;2270	text-overflow: ellipsis;2271}2272.fv-controls,2273.fv-nav {2274	display: flex;2275	align-items: center;2276	gap: 4px;2277	flex-shrink: 0;2278}2279.fv-ctrl-btn {2280	background: transparent;2281	border: 1px solid rgba(200, 154, 90, 0.2);2282	border-radius: 2px;2283	padding: 3px 7px;2284	font: inherit;2285	font-size: 0.625rem;2286	color: var(--text-faint);2287	cursor: pointer;2288	transition:2289		color 100ms,2290		border-color 100ms;2291}2292.fv-ctrl-btn:hover:not(:disabled),2293.fv-ctrl-btn.active {2294	color: var(--accent);2295	border-color: rgba(200, 154, 90, 0.5);2296	text-decoration: none;2297}2298.fv-ctrl-btn:disabled {2299	opacity: 0.3;2300	cursor: default;2301}2302.fv-pos {2303	min-width: 48px;2304	text-align: center;2305	font-size: 0.625rem;2306	color: var(--text-faint);2307}2308.fv-body {2309	flex: 1;2310	min-height: 0;2311	display: grid;2312	grid-template-columns: minmax(0, 1fr) 280px;2313}2314.fv-source {2315	min-height: 0;2316	overflow: auto;2317	padding: 16px 28px 32px;2318	font-family: var(--mono);2319	font-size: 0.6875rem;2320	color: var(--text-faint);2321}2322.fv-source .file-view {2323	margin: -16px -28px 0;2324	border: 0;2325	background: none;2326	overflow: visible;2327}2328.fv-source .code {2329	font-size: var(--fv-size);2330	color: var(--text);2331}2332.fv-wrap .fv-source .lc {2333	white-space: pre-wrap;2334	overflow-wrap: anywhere;2335}2336.fv-source .file-markdown {2337	font-family: var(--sans);2338	font-size: calc(var(--fv-size) + 2px);2339	color: var(--text);2340}2341.fv-detail .atlas-info-desc {2342	font-size: 0.8125rem;2343}2344.fv-detail {2345	overflow-y: auto;2346	padding: 18px 20px 24px;2347	background: var(--bg);2348	border-left: 1px solid var(--bg-elevated);2349}23502351/* Last in the file, after every animation it stops, so it wins without !important. */2352@media (prefers-reduced-motion: reduce) {2353	.tri-outer,2354	.tri-inner,2355	.repo-name,2356	.repo-contributor,2357	.repo-desc,2358	.repo-homepage,2359	.repo-meta,2360	.repo-tabs,2361	.install-lines,2362	.repo-section,2363	.repo-details,2364	.save-message-head,2365	.ticker-row,2366	.ticker-track,2367	.hex-col,2368	.headline h1,2369	.headline-tagline,2370	.headline-cloud,2371	.repo-card,2372	.profile-username,2373	.profile-event,2374	.fv-overlay,2375	.repo-panel {2376		animation: none;2377	}2378	.hex-col {2379		opacity: 0.12;2380	}2381}