kepr.css

41.1 KB · raw

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	--accent-tint-04: rgba(200, 154, 90, 0.04);18	--accent-tint-12: rgba(200, 154, 90, 0.12);19	--sage: #7a9a68;20	--sans: "Quicksand", system-ui, sans-serif;21	--mono: "Martian Mono", ui-monospace, monospace;22}2324* {25	box-sizing: border-box;26	scrollbar-width: thin;27	scrollbar-color: var(--border) transparent;28}2930html,31body {32	margin: 0;33	padding: 0;34	background: var(--bg);35	color: var(--text);36	font-family: var(--sans);37	font-size: 16px;38	line-height: 1.6;39	overflow-x: hidden;40}4142a {43	color: inherit;44	text-decoration: none;45}46a:hover {47	text-decoration: underline;48	text-decoration-color: var(--accent);49	text-decoration-thickness: 1px;50	text-underline-offset: 4px;51}5253/* ----- top bar ------------------------------------------------------------ */5455body > nav {56	display: flex;57	align-items: center;58	padding: 24px 48px;59	font-size: 0.6875rem;60	letter-spacing: 0.04em;61}62.wordmark {63	display: flex;64	color: var(--accent);65}66.wordmark:hover {67	text-decoration: none;68}69.wordmark-icon {70	display: block;71	width: 32px;72	height: 32px;73	color: var(--accent);74}75.wordmark-icon polygon {76	fill: none;77	stroke: currentColor;78	stroke-linejoin: round;79}80.tri-outer polygon {81	stroke-width: 2;82}83.tri-inner polygon {84	stroke-width: 1.5;85}86.tri-outer,87.tri-inner {88	transform-origin: 16px 16px;89}90.tri-outer {91	animation:92		tri-ccw 12s linear infinite,93		accent-flash 9s ease-in-out infinite;94}95.tri-inner {96	animation:97		tri-cw 8s linear infinite,98		accent-flash 6.7s 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 accent-flash {111	0%,112	84%,113	100% {114		color: var(--accent);115	}116	92% {117		color: var(--accent-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.repo-steal-btn {283	display: block;284	width: fit-content;285	max-width: 100%;286	font-family: var(--mono);287	font-size: 0.75rem;288	color: var(--text-muted);289	background: var(--bg-surface);290	border: 1px solid var(--border);291	border-radius: 3px;292	padding: 5px 11px;293	cursor: pointer;294	letter-spacing: 0.03em;295	white-space: nowrap;296	overflow: hidden;297	text-overflow: ellipsis;298	transition:299		color 120ms,300		border-color 120ms;301}302.repo-steal-btn:hover,303.repo-steal-btn.copied {304	color: var(--accent);305	border-color: var(--accent-dim);306}307.install-lines {308	display: flex;309	flex-direction: column;310	align-items: flex-end;311	gap: 6px;312	max-width: 100%;313	margin-left: auto;314	animation: fadeUp 280ms 120ms ease both;315}316.install-line {317	display: flex;318	align-items: center;319	gap: 12px;320	max-width: 100%;321	font-family: var(--mono);322	font-size: 0.75rem;323	color: var(--text-muted);324	background: var(--bg-surface);325	border: 1px solid var(--border);326	border-radius: 3px;327	padding: 5px 11px;328}329.install-line code {330	white-space: pre;331	overflow-x: auto;332	font-family: inherit;333}334.copy-btn {335	background: none;336	border: 0;337	padding: 0;338	cursor: pointer;339	font: inherit;340	font-size: 0.625rem;341	color: var(--text-faint);342	letter-spacing: 0.04em;343}344.copy-btn:hover,345.copy-btn.copied {346	color: var(--accent);347}348349/* ----- sections ----------------------------------------------------------- */350351.repo-section {352	margin: 36px 0 0;353	animation: fadeIn 320ms 80ms ease both;354}355.repo-section-toggle > summary,356.repo-details-toggle > summary {357	list-style: none;358	cursor: pointer;359	user-select: none;360}361.repo-section-toggle > summary::-webkit-details-marker,362.repo-details-toggle > summary::-webkit-details-marker {363	display: none;364}365.section-head {366	display: flex;367	align-items: baseline;368	gap: 12px;369	padding-bottom: 8px;370	border-bottom: 1px solid var(--border);371	margin-bottom: 4px;372}373.section-head::after,374.repo-details-head::after {375	content: "▸";376	font-size: 0.5625rem;377	opacity: 0.4;378	transition: transform 120ms;379}380.section-head::after {381	margin-left: auto;382}383details[open] > .section-head::after,384details[open] > .repo-details-head::after {385	transform: rotate(90deg);386}387.section-label {388	font-size: 0.6875rem;389	letter-spacing: 0.12em;390	color: var(--text-secondary);391	text-transform: uppercase;392}393.section-count {394	font-family: var(--mono);395	font-size: 0.6875rem;396	color: var(--accent);397}398399/* ----- timeline ----------------------------------------------------------- */400401.timeline {402	display: block;403	margin: 18px 0 4px;404	overflow: visible;405}406.timeline-line {407	stroke: var(--text-faint);408	stroke-width: 1;409	stroke-dasharray: 4 4;410}411.timeline .dot circle {412	fill: var(--accent);413	transition:414		fill-opacity 120ms,415		r 120ms;416}417.timeline .d0 circle {418	fill: var(--accent-dim);419	fill-opacity: 0.45;420}421.timeline .d1 circle {422	fill-opacity: 0.55;423}424.timeline .d2 circle {425	fill-opacity: 0.8;426}427.timeline .d3 circle {428	fill: var(--accent-bright);429	fill-opacity: 1;430}431.timeline .dot:hover circle,432.timeline .dot:focus circle {433	fill: var(--accent-bright);434	fill-opacity: 1;435}436.timeline-canvas {437	display: block;438	margin: 18px 0 4px;439	cursor: grab;440	touch-action: pan-y;441}442.timeline-legend {443	margin: 0 0 14px;444	font-size: 0.625rem;445	color: var(--text-faint);446}447.timeline-tip {448	position: fixed;449	z-index: 200;450	max-width: 340px;451	padding: 0.45rem 0.7rem;452	background: #0f0c08;453	border: 1px solid var(--border);454	border-radius: 4px;455	pointer-events: none;456	line-height: 1.5;457}458.timeline-tip .tip-id {459	font-family: var(--mono);460	font-size: 12px;461	color: var(--accent);462}463.timeline-tip .tip-msg {464	margin-top: 3px;465	font-style: italic;466	font-size: 15px;467	color: var(--text-heading);468}469.timeline-tip .tip-meta {470	margin-top: 4px;471	font-family: var(--mono);472	font-size: 10px;473	color: var(--text-muted);474}475476/* ----- history ------------------------------------------------------------ */477478.history-row {479	position: relative;480	display: grid;481	grid-template-columns: 110px 1fr auto;482	align-items: baseline;483	gap: 0 10px;484	padding: 9px 8px;485	border-bottom: 1px solid var(--border);486	transition: background 100ms;487}488.history-row::before {489	content: "";490	position: absolute;491	left: 0;492	top: 0;493	bottom: 0;494	width: 2px;495	background: var(--accent);496	transform: scaleY(0);497	transition: transform 120ms ease;498}499.history-row:hover {500	background: var(--accent-tint-04);501	text-decoration: none;502}503.history-row:hover::before {504	transform: scaleY(1);505}506.history-id {507	font-family: var(--mono);508	font-size: 0.75rem;509	color: var(--text-secondary);510}511.history-msg {512	min-width: 0;513	line-height: 1.7;514	overflow: hidden;515	text-overflow: ellipsis;516	white-space: nowrap;517	transition: color 100ms;518}519.history-row:hover .history-msg {520	color: var(--accent);521}522.history-when {523	font-family: var(--mono);524	font-size: 0.6875rem;525	color: var(--text-muted);526	white-space: nowrap;527}528/* Kepr 2's history: four rows at a time, the rest a scroll away. */529.save-list {530	max-height: 180px;531	overflow-y: auto;532	scrollbar-width: thin;533	scrollbar-color: var(--border) transparent;534}535.pager {536	display: flex;537	justify-content: space-between;538	margin: 14px 0 0;539	font-size: 0.6875rem;540}541.pager a:last-child {542	margin-left: auto;543}544.pager a:hover {545	color: var(--accent);546}547548/* ----- atlas -------------------------------------------------------------- */549550.atlas-bar {551	display: flex;552	align-items: center;553	flex-wrap: wrap;554	gap: 8px 14px;555	margin: 10px 0 8px;556	font-size: 0.625rem;557}558.atlas-picker {559	position: relative;560}561.atlas-picker [hidden] {562	display: none;563}564.atlas-ref-tab {565	list-style: none;566	cursor: pointer;567	padding: 4px 8px;568	background: var(--bg);569	border: 1px solid rgba(200, 154, 90, 0.45);570	border-radius: 2px;571	font-size: 0.625rem;572	color: var(--accent);573}574.atlas-ref-tab::-webkit-details-marker {575	display: none;576}577.atlas-ref-tab:hover {578	color: var(--accent-dim);579}580.atlas-picker-popover {581	position: absolute;582	top: calc(100% + 6px);583	left: 0;584	z-index: 50;585	display: flex;586	flex-direction: column;587	width: min(420px, 90vw);588	max-height: 480px;589	background: var(--bg);590	border: 1px solid var(--text-faint);591	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.48);592}593.atlas-picker-tabs {594	display: flex;595	border-bottom: 1px solid var(--bg-elevated);596}597.atlas-picker-tabs button {598	flex: 1;599	padding: 7px 10px;600	background: transparent;601	border: 0;602	border-right: 1px solid var(--bg-elevated);603	font: inherit;604	font-size: 0.625rem;605	color: var(--text-faint);606	cursor: pointer;607}608.atlas-picker-tabs button:last-child {609	border-right: 0;610}611.atlas-picker-tabs button:hover {612	color: var(--text-muted);613}614.atlas-picker-tabs button.active {615	color: var(--accent);616	background: rgba(200, 154, 90, 0.06);617}618.atlas-picker-filter {619	padding: 8px 10px;620	background: var(--bg);621	border: 0;622	border-bottom: 1px solid var(--bg-elevated);623	outline: none;624	font-size: 0.6875rem;625	color: var(--text-heading);626}627.atlas-picker-filter::placeholder {628	color: var(--text-faint);629}630.atlas-picker-list {631	flex: 1 1 auto;632	min-height: 0;633	overflow: auto;634	scrollbar-width: thin;635	scrollbar-color: var(--border) transparent;636}637.atlas-picker-row {638	display: grid;639	grid-template-columns: 80px 1fr auto;640	align-items: center;641	gap: 8px;642	padding: 6px 10px;643	border-bottom: 1px solid rgba(42, 32, 24, 0.4);644	color: var(--text-muted);645}646.atlas-picker-row:hover {647	background: rgba(200, 154, 90, 0.06);648	text-decoration: none;649}650.atlas-picker-row.active {651	background: rgba(200, 154, 90, 0.1);652}653.atlas-picker-row:hover *,654.atlas-picker-row.active * {655	color: var(--accent);656}657.atlas-picker-id,658.atlas-picker-age {659	font-family: var(--mono);660	font-size: 0.5625rem;661	color: var(--text-faint);662	white-space: nowrap;663	overflow: hidden;664	text-overflow: ellipsis;665}666.atlas-picker-msg {667	font-size: 0.6875rem;668	white-space: nowrap;669	overflow: hidden;670	text-overflow: ellipsis;671}672.atlas-head-link {673	color: var(--accent);674}675.atlas-search-btn {676	margin-left: auto;677	padding: 4px 8px;678	background: transparent;679	border: 1px solid var(--border);680	border-radius: 2px;681	font: inherit;682	font-size: 0.625rem;683	color: var(--text-faint);684	cursor: pointer;685}686.atlas-search-btn:hover {687	color: var(--accent);688	border-color: var(--accent-dim);689}690.atlas-search-btn[hidden],691.atlas-filter[hidden] {692	display: none;693}694.atlas-filter {695	width: 220px;696	max-width: 100%;697	margin-left: auto;698	padding: 5px 10px;699	background: transparent;700	border: 1px solid var(--border);701	border-radius: 3px;702	color: var(--text);703	font-size: 0.6875rem;704}705.atlas-filter:focus {706	outline: none;707	border-color: var(--accent-dim);708}709.atlas-filter::placeholder {710	color: var(--text-faint);711}712.atlas {713	display: grid;714	grid-template-columns: minmax(0, 1fr);715	gap: 0 20px;716}717.atlas:has(> .atlas-panel:not([hidden])) {718	grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);719}720.atlas [hidden] {721	display: none;722}723.atlas-folder > summary {724	list-style: none;725}726.atlas-folder > summary::-webkit-details-marker {727	display: none;728}729.atlas-children {730	padding-left: 14px;731	border-left: 1px solid var(--border);732	margin-left: 6px;733}734.atlas-row {735	position: relative;736	display: grid;737	grid-template-columns: minmax(90px, auto) 1fr auto;738	align-items: baseline;739	gap: 0 12px;740	padding: 6px 8px;741	border-bottom: 1px solid rgba(42, 32, 24, 0.62);742	cursor: pointer;743	transition: background 100ms;744}745.atlas-row:hover,746.atlas-row:focus-visible,747.atlas-row.selected {748	outline: none;749	background: var(--accent-tint-04);750	text-decoration: none;751}752.atlas-row.selected {753	box-shadow: inset 2px 0 0 var(--accent);754}755.atlas-name {756	color: var(--text-heading);757	font-size: 0.875rem;758	white-space: nowrap;759}760.atlas-folder > summary .atlas-name {761	color: var(--accent);762}763.atlas-desc {764	min-width: 0;765	color: var(--text-muted);766	font-size: 0.8125rem;767	overflow: hidden;768	text-overflow: ellipsis;769	white-space: nowrap;770}771.atlas-meta {772	font-size: 0.625rem;773	color: var(--text-faint);774	white-space: nowrap;775}776.atlas-panel {777	position: sticky;778	top: 16px;779	align-self: start;780	max-height: calc(100vh - 32px);781	overflow-y: auto;782	padding: 4px 0 12px 16px;783	border-left: 1px solid var(--border);784}785.atlas-hint {786	margin: 0;787	font-size: 0.625rem;788	color: var(--text-faint);789}790.atlas-info-name {791	margin: 0;792	font-weight: 400;793	font-size: 1.375rem;794	color: var(--text-heading);795	overflow-wrap: anywhere;796}797.atlas-info-path {798	margin: 0 0 12px;799	font-size: 0.625rem;800	color: var(--text-faint);801	overflow-wrap: anywhere;802}803.atlas-facts {804	display: grid;805	grid-template-columns: auto 1fr;806	gap: 3px 12px;807	margin: 0 0 12px;808	font-size: 0.625rem;809}810.atlas-facts dt {811	color: var(--text-faint);812}813.atlas-facts dd {814	margin: 0;815	color: var(--text);816}817.atlas-facts a {818	color: var(--accent);819}820.atlas-info-desc {821	font-size: 0.8125rem;822	color: var(--text-muted);823}824/* ----- README and rendered Markdown --------------------------------------- */825826.repo-details {827	margin: 36px 0 0;828	animation: fadeIn 320ms 80ms ease both;829}830.repo-details-toggle {831	border-bottom: 1px solid var(--border);832	padding-bottom: 24px;833}834.repo-details-head {835	display: flex;836	align-items: center;837	gap: 6px;838	padding: 8px 0;839	font-family: var(--mono);840	font-size: 0.6875rem;841	letter-spacing: 0.12em;842	color: var(--text-secondary);843	text-transform: uppercase;844}845.markdown {846	font-size: 1.05rem;847	line-height: 1.7;848	overflow-wrap: break-word;849}850.markdown h1,851.markdown h2,852.markdown h3,853.markdown h4 {854	font-weight: 400;855	margin: 1.4em 0 0.4em;856	color: var(--text-heading);857}858.markdown h1 {859	font-size: 1.5rem;860}861.markdown h2 {862	font-size: 1.3rem;863}864.markdown h3 {865	font-size: 1.15rem;866}867.markdown p {868	margin: 0.8em 0;869}870.markdown ul,871.markdown ol {872	margin: 0.8em 0 0.8em 1.5em;873	padding: 0;874}875.markdown a {876	color: var(--accent);877}878.markdown code {879	font-family: var(--mono);880	font-size: 0.82em;881	color: var(--accent);882	background: var(--bg-surface);883	padding: 0.15em 0.35em;884	border-radius: 3px;885}886.markdown pre {887	background: var(--bg-surface);888	border-radius: 4px;889	padding: 1em 1.2em;890	overflow-x: auto;891	margin: 1em 0;892}893.markdown pre code {894	background: none;895	padding: 0;896	color: var(--text);897	font-size: 0.85em;898}899.markdown blockquote {900	border-left: 3px solid var(--border);901	margin: 1em 0;902	padding: 0.1em 1em;903	color: var(--text-secondary);904}905.markdown hr {906	border: none;907	border-top: 1px solid var(--border);908	margin: 1.5em 0;909}910.markdown img {911	max-width: 100%;912}913.markdown table {914	border-collapse: collapse;915	display: block;916	overflow-x: auto;917}918.markdown th,919.markdown td {920	border: 1px solid var(--border);921	padding: 4px 10px;922}923924/* ----- file viewer -------------------------------------------------------- */925926.breadcrumb {927	margin: 0 0 4px;928	font-size: 0.75rem;929	overflow-wrap: anywhere;930}931.breadcrumb a:hover {932	color: var(--accent);933}934.file-page-title {935	font-size: 1.75rem;936	font-weight: 400;937	margin: 4px 0 12px;938	overflow-wrap: anywhere;939}940.file-meta,941.file-toggle {942	margin: 0 0 12px;943	font-size: 0.6875rem;944}945.file-meta a,946.file-toggle a.active {947	color: var(--accent);948}949.file-image img {950	max-width: 100%;951	background: var(--bg-surface);952	border: 1px solid var(--border);953}954.file-view {955	border: 1px solid var(--border);956	background: var(--bg-surface);957	overflow-x: auto;958}959.code {960	margin: 0;961	padding: 16px 0;962	font-family: var(--mono);963	font-size: 0.8125rem;964	line-height: 1.65;965	tab-size: 4;966}967/* A grid, so tab stops count from the start of the code rather than the line number. */968.code .line {969	display: grid;970	grid-template-columns: 6em 1fr;971	padding-right: 24px;972	scroll-margin-top: 40vh;973}974.code .line:target,975.code .line.hl {976	background: var(--accent-tint-12);977}978.code .lc {979	white-space: pre;980}981.code .ln {982	padding-right: 1.5em;983	text-align: right;984	color: var(--text-faint);985	user-select: none;986}987.code .ln:hover {988	color: var(--accent);989	text-decoration: none;990}991992/* Shiki's CSS-variables theme roles, in Kepr 2's highlight.js colours. */993.tk-comment {994	color: var(--text-muted);995	font-style: italic;996}997.tk-keyword {998	color: var(--accent);999}1000.tk-string,1001.tk-string-expression {1002	color: var(--sage);1003}1004.tk-constant {1005	color: var(--accent-bright);1006}1007.tk-function {1008	color: var(--accent);1009}1010.tk-parameter {1011	color: var(--text);1012}1013.tk-punctuation {1014	color: var(--text-secondary);1015}1016.tk-link {1017	color: var(--accent);1018	text-decoration: underline;1019}1020.tk-inserted {1021	color: var(--sage);1022}1023.tk-deleted {1024	color: #c45c5c;1025}1026.tk-i {1027	font-style: italic;1028}10291030/* ----- save page ---------------------------------------------------------- */10311032.save-id {1033	margin: 12px 0 0;1034	font-size: 0.75rem;1035	color: var(--text-secondary);1036}1037.save-flag {1038	margin: 12px 0 0;1039	padding: 8px 12px;1040	border: 1px solid #6a3a2a;1041	border-left: 2px solid #c45c5c;1042	background: rgba(196, 92, 92, 0.08);1043	color: var(--text-heading);1044}1045.save-flag-label {1046	margin-right: 8px;1047	font-size: 0.625rem;1048	letter-spacing: 0.12em;1049	text-transform: uppercase;1050	color: #c45c5c;1051}1052.save-message-head {1053	font-size: 2.25rem;1054	font-weight: 400;1055	line-height: 1.3;1056	margin: 12px 0 8px;1057	color: var(--text-heading);1058	overflow-wrap: anywhere;1059	animation: fadeUp 280ms ease both;1060}1061.save-message-body {1062	margin: 0 0 12px;1063	white-space: pre-wrap;1064	color: var(--text-secondary);1065}1066.save-facts {1067	display: grid;1068	grid-template-columns: max-content 1fr;1069	gap: 2px 16px;1070	margin: 16px 0;1071	font-size: 0.75rem;1072}1073.save-facts dt {1074	color: var(--text-faint);1075}1076.save-facts dd {1077	margin: 0;1078	overflow-wrap: anywhere;1079}1080.save-facts a,1081.save-links a,1082.diff-view a {1083	color: var(--accent);1084}1085.save-links {1086	display: flex;1087	flex-wrap: wrap;1088	gap: 8px 20px;1089	margin: 0;1090	font-size: 0.75rem;1091}1092.save-empty {1093	font-size: 0.75rem;1094}1095.change-row,1096.diff-head {1097	display: grid;1098	grid-template-columns: 1fr auto;1099	gap: 12px;1100	padding: 7px 8px;1101	border-bottom: 1px solid var(--border);1102	font-family: var(--mono);1103	font-size: 0.8125rem;1104}1105.change-row:hover {1106	background: var(--accent-tint-04);1107	text-decoration: none;1108}1109.change-path {1110	min-width: 0;1111	overflow-wrap: anywhere;1112}1113.change-added .change-path {1114	color: var(--sage);1115}1116.change-removed .change-path {1117	color: var(--text-muted);1118	text-decoration: line-through;1119}1120.change-modified .change-path {1121	color: var(--accent-bright);1122}1123.change-stat {1124	font-size: 0.75rem;1125	white-space: nowrap;1126}1127.diff-add {1128	color: var(--sage);1129}1130.diff-del {1131	color: #c45c5c;1132}1133.diff-note {1134	color: var(--text-faint);1135	font-size: 0.6875rem;1136}1137.diff-file {1138	margin: 0 0 20px;1139}1140.diff-head {1141	cursor: pointer;1142	list-style: none;1143	border: 1px solid var(--border);1144	background: var(--bg-surface);1145}1146.diff-head::-webkit-details-marker {1147	display: none;1148}1149.diff-file > .file-view {1150	border-top: 0;1151}1152.diff-file > .diff-note,1153.diff-view {1154	margin: 8px 0 0;1155	font-size: 0.6875rem;1156}1157.code.diff {1158	padding: 4px 0;1159}1160.diff .dl {1161	display: grid;1162	grid-template-columns: 3.5em 3.5em 1.5em 1fr;1163	padding-right: 24px;1164}1165.diff .dh {1166	display: block;1167	padding: 4px 1em;1168	color: var(--text-faint);1169	background: var(--bg-elevated);1170}1171.diff .ln {1172	padding-right: 0.75em;1173	text-align: right;1174	color: var(--text-faint);1175	user-select: none;1176}1177.diff .ds {1178	text-align: center;1179	color: var(--text-faint);1180	user-select: none;1181}1182.diff .dl-add {1183	background: rgba(122, 154, 104, 0.1);1184}1185.diff .dl-add .ds {1186	color: var(--sage);1187}1188.diff .dl-del {1189	background: rgba(196, 92, 92, 0.08);1190}1191.diff .dl-del .ds {1192	color: #c45c5c;1193}11941195/* ----- archives ----------------------------------------------------------- */11961197.archive-row {1198	padding: 12px 8px;1199	border-bottom: 1px solid var(--border);1200}1201.archive-save {1202	display: flex;1203	flex-wrap: wrap;1204	align-items: baseline;1205	gap: 0 10px;1206	margin: 0;1207}1208.archive-save .history-id {1209	flex: 0 0 110px;1210}1211.archive-msg {1212	flex: 1;1213}1214.archive-head {1215	font-size: 0.625rem;1216	letter-spacing: 0.08em;1217	color: var(--accent);1218	border: 1px solid var(--accent-dim);1219	border-radius: 2px;1220	padding: 0 6px;1221}1222.archive-save .history-id:hover {1223	color: var(--accent);1224}1225.archive-links {1226	margin: 6px 0;1227	font-size: 0.75rem;1228}1229.archive-links a {1230	color: var(--accent);1231}1232.archive-row .install-line {1233	justify-content: space-between;1234}12351236/* ----- phone -------------------------------------------------------------- */12371238@media (max-width: 768px) {1239	body > nav {1240		padding: 20px 16px;1241	}1242	.nav-links {1243		gap: 18px;1244	}1245	main {1246		padding: 16px 16px 80px;1247	}1248	.repo-name {1249		font-size: 2.75rem;1250	}1251	.install-lines {1252		align-items: stretch;1253		margin-left: 0;1254		width: 100%;1255	}1256	.history-row {1257		grid-template-columns: 1fr auto;1258	}1259	.history-id {1260		grid-column: 1 / -1;1261	}1262	.atlas-row {1263		grid-template-columns: 1fr auto;1264	}1265	.atlas-desc {1266		grid-column: 1 / -1;1267		grid-row: 2;1268	}1269	.atlas:has(> .atlas-panel:not([hidden])) {1270		grid-template-columns: minmax(0, 1fr);1271	}1272	.atlas-panel {1273		display: none;1274	}1275	.code .line {1276		grid-template-columns: 4.5em 1fr;1277	}1278	.save-message-head {1279		font-size: 1.625rem;1280	}1281	.archive-msg {1282		flex-basis: 100%;1283		order: 1;1284	}1285	.diff .dl {1286		grid-template-columns: 2.75em 2.75em 1.25em 1fr;1287	}1288	.code .ln {1289		padding-right: 1em;1290	}1291}12921293/* ----- builds ------------------------------------------------------------- */12941295.release {1296	padding: 20px 8px 24px;1297	border-bottom: 1px solid var(--border);1298}1299.release-head {1300	display: flex;1301	flex-wrap: wrap;1302	align-items: baseline;1303	gap: 0 14px;1304	margin: 0 0 8px;1305}1306.release-version {1307	font-family: "Martian Mono", monospace;1308	font-size: 1rem;1309	color: var(--accent);1310}1311.release-head .history-id:hover {1312	color: var(--accent);1313}1314.release-notes {1315	margin-bottom: 14px;1316}1317.release-file {1318	padding: 10px 0;1319	border-top: 1px dashed var(--border);1320}1321.release-file-head {1322	display: flex;1323	flex-wrap: wrap;1324	align-items: baseline;1325	gap: 4px 14px;1326	margin: 0;1327}1328.release-platform {1329	flex: 0 0 180px;1330}1331.release-download {1332	flex: 1;1333	font-size: 0.75rem;1334	color: var(--accent);1335	overflow-wrap: anywhere;1336}1337.release-meta,1338.release-sha {1339	font-size: 0.6875rem;1340	color: var(--text-muted);1341}1342.release-sha {1343	margin: 4px 0 0;1344	overflow-wrap: anywhere;1345}1346.release-hint {1347	margin: 4px 0 0;1348	font-size: 0.8125rem;1349}13501351/* ----- issues ------------------------------------------------------------- */13521353.issues-bar {1354	display: flex;1355	flex-wrap: wrap;1356	align-items: center;1357	gap: 8px 12px;1358	font-size: 0.75rem;1359	padding-bottom: 14px;1360	border-bottom: 1px solid var(--bg-elevated);1361}1362.issues-tab {1363	color: var(--text-faint);1364	border: 1px solid transparent;1365	border-radius: 999px;1366	padding: 4px 10px;1367}1368button.issues-tab {1369	font: inherit;1370	background: none;1371	cursor: pointer;1372}1373.issues-tab.active {1374	color: var(--accent);1375	border-color: var(--accent-tint-12);1376}1377.issues-new {1378	margin-left: auto;1379	color: var(--text-muted);1380}1381.issue-row {1382	display: flex;1383	flex-wrap: wrap;1384	align-items: baseline;1385	gap: 2px 10px;1386	padding: 10px 8px;1387	border-bottom: 1px solid var(--border);1388}1389.issue-row:hover {1390	text-decoration: none;1391	background: var(--accent-tint-04);1392}1393.issue-title {1394	flex: 1;1395	color: var(--text-heading);1396}1397.issues-new:hover,1398.issue-row:hover .issue-title {1399	color: var(--accent);1400}1401.issue-meta,1402.issue-post-head {1403	font-size: 0.6875rem;1404	color: var(--text-muted);1405}1406.issue-symbol--open {1407	color: var(--accent);1408}1409.issue-symbol--closed {1410	color: var(--text-faint);1411}1412.issue-post {1413	margin: 18px 0;1414	padding: 14px 18px;1415	border: 1px solid var(--border);1416	border-radius: 6px;1417	background: var(--bg-surface);1418}1419.issue-post--operator {1420	border-color: var(--accent-dim);1421}1422.issue-post-head {1423	display: flex;1424	flex-wrap: wrap;1425	gap: 4px 12px;1426	margin: 0 0 8px;1427}1428.issue-author {1429	color: var(--text);1430}1431.issue-badge {1432	color: var(--accent);1433	text-transform: uppercase;1434	letter-spacing: 0.08em;1435}1436.issue-text {1437	white-space: pre-wrap;1438	overflow-wrap: anywhere;1439}1440.issue-link {1441	font-size: 0.75rem;1442	overflow-wrap: anywhere;1443	color: var(--accent);1444}1445.issues-form {1446	display: flex;1447	flex-direction: column;1448	gap: 6px;1449	max-width: 640px;1450	margin-top: 18px;1451}1452.issues-label {1453	font-family: var(--mono);1454	font-size: 0.6875rem;1455	margin-top: 6px;1456	opacity: 0.8;1457}1458.issues-input,1459.issues-textarea {1460	font-family: var(--mono);1461	font-size: 0.75rem;1462	width: 100%;1463	padding: 6px 8px;1464	color: var(--text);1465	background: var(--bg);1466	border: 1px solid var(--border);1467	border-radius: 4px;1468	resize: vertical;1469}1470.issues-input:focus,1471.issues-textarea:focus {1472	outline: none;1473	border-color: var(--accent);1474}1475.issues-submit {1476	align-self: flex-start;1477	margin-top: 10px;1478	padding: 6px 14px;1479	font-family: var(--mono);1480	font-size: 0.75rem;1481	color: var(--bg);1482	background: var(--accent);1483	border: none;1484	border-radius: 4px;1485	cursor: pointer;1486}1487.issues-submit:hover {1488	opacity: 0.85;1489}1490.issues-error {1491	font-size: 0.75rem;1492	color: #c86a5a;1493}1494/* The honeypot: off-screen for people, still in the form for bots. */1495.issues-hp {1496	position: absolute;1497	left: -9999px;1498	height: 0;1499	overflow: hidden;1500	opacity: 0;1501}15021503/* ----- front page --------------------------------------------------------- */15041505/* Kepr 2's hero band, full width, reaching up behind the nav (32px mark + 48px padding). */1506body > nav {1507	position: relative;1508	z-index: 1;1509}1510.ticker {1511	position: relative;1512	height: 304px;1513	margin: -104px calc(50% - 50vw) 0;1514	padding: 96px 0 20px;1515	display: flex;1516	flex-direction: column;1517	justify-content: space-evenly;1518	overflow: hidden;1519	pointer-events: none;1520	user-select: none;1521	border-bottom: 1px solid var(--border);1522	font-family: var(--mono);1523	color: var(--text-secondary);1524	mask-image: linear-gradient(1525		to right,1526		transparent,1527		#000 48px,1528		#000 calc(100% - 48px),1529		transparent1530	);1531}1532.ticker-row {1533	white-space: nowrap;1534	line-height: 1.2;1535	opacity: var(--o);1536	animation: ticker-glow 83s var(--glow-at) ease-in-out infinite;1537}1538/* The drift's duration is set by kepr.js from the track's width, so every row keeps Kepr 2's1539   pace in px/s (--speed) however long its messages are; this is the no-JavaScript fallback. */1540.ticker-track {1541	display: inline-flex;1542	gap: 64px;1543	padding-right: 64px;1544	animation: ticker-drift 1500s linear infinite;1545}1546/* Kepr 2's depth bands: nearer rows are larger, brighter and faster. Each row takes its turn at1547   the glow, a few seconds out of every 83, spaced so one or two glow at a time. */1548.ticker-row:nth-child(1) {1549	font-size: 9px;1550	--o: 0.05;1551	--speed: 12;1552	--glow-at: -5s;1553}1554.ticker-row:nth-child(2) {1555	font-size: 18px;1556	--o: 0.1;1557	--speed: 23;1558	--glow-at: -41s;1559}1560.ticker-row:nth-child(3) {1561	font-size: 7px;1562	--o: 0.04;1563	--speed: 9;1564	--glow-at: -77s;1565}1566.ticker-row:nth-child(4) {1567	font-size: 13px;1568	--o: 0.07;1569	--speed: 17;1570	--glow-at: -29s;1571}1572.ticker-row:nth-child(5) {1573	font-size: 22px;1574	--o: 0.12;1575	--speed: 29;1576	--glow-at: -65s;1577}1578.ticker-row:nth-child(6) {1579	font-size: 8px;1580	--o: 0.045;1581	--speed: 10;1582	--glow-at: -17s;1583}1584.ticker-row:nth-child(7) {1585	font-size: 15px;1586	--o: 0.08;1587	--speed: 20;1588	--glow-at: -53s;1589}1590@keyframes ticker-drift {1591	to {1592		transform: translateX(-50%);1593	}1594}1595@keyframes ticker-glow {1596	0%,1597	10%,1598	100% {1599		color: var(--text-secondary);1600		opacity: var(--o);1601		text-shadow: none;1602	}1603	5% {1604		color: var(--accent);1605		opacity: calc(var(--o) * 3.5);1606		text-shadow: 0 0 3px var(--accent-tint-12);1607	}1608}16091610.headline {1611	display: grid;1612	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);1613	gap: 48px;1614	align-items: center;1615	padding: 56px 0 40px;1616}1617.headline h1 {1618	font-size: clamp(2rem, 5vw, 3.5rem);1619	font-weight: 400;1620	line-height: 1.15;1621	color: var(--text-heading);1622	margin: 0 0 20px;1623	animation: fadeUp 480ms ease both;1624}1625.headline-tagline {1626	margin: 0;1627	font-size: 0.9375rem;1628	line-height: 1.7;1629	color: var(--text-secondary);1630	animation: fadeUp 480ms 80ms ease both;1631}1632.headline-cloud {1633	display: flex;1634	flex-wrap: wrap;1635	justify-content: center;1636	align-items: center;1637	gap: 10px 22px;1638	padding: 20px;1639	animation: fadeIn 600ms 160ms ease both;1640}1641.tc-tag {1642	font-family: var(--mono);1643	letter-spacing: 0.03em;1644	white-space: nowrap;1645	color: var(--accent-dim);1646	transition:1647		color 0.2s,1648		opacity 0.2s,1649		text-shadow 0.2s;1650}1651.tc-tag:hover {1652	color: var(--accent);1653	opacity: 1;1654	text-shadow: 0 0 14px var(--accent-tint-12);1655}1656.tc-1 {1657	font-size: 10px;1658	opacity: 0.42;1659}1660.tc-2 {1661	font-size: 12px;1662	opacity: 0.56;1663}1664.tc-3 {1665	font-size: 15px;1666	opacity: 0.7;1667}1668.tc-4 {1669	font-size: 18px;1670	opacity: 0.85;1671	font-weight: 500;1672}1673.tc-5 {1674	font-size: 23px;1675	opacity: 1;1676	font-weight: 500;1677}16781679.featured-label {1680	font-size: 0.6875rem;1681	font-weight: 400;1682	letter-spacing: 0.08em;1683	text-transform: uppercase;1684	color: var(--text-secondary);1685	margin: 0 0 12px;1686}1687.landing-self-host {1688	margin: 32px 0 0;1689	font-size: 0.75rem;1690}1691.landing-self-host a {1692	color: var(--text-secondary);1693}16941695/* ----- repo cards (front page, browse, profile) --------------------------- */16961697.card-grid {1698	display: grid;1699	grid-template-columns: repeat(2, minmax(0, 1fr));1700	gap: 16px;1701}1702.repo-card {1703	display: flex;1704	flex-direction: column;1705	padding: 20px 22px 16px;1706	border: 1px solid var(--bg-elevated);1707	border-radius: 4px;1708	background: var(--bg);1709	transition:1710		border-color 120ms,1711		background 120ms;1712	animation: fadeUp 350ms ease both;1713}1714.repo-card:hover {1715	text-decoration: none;1716	border-color: var(--text-faint);1717	background: var(--accent-tint-04);1718}1719.repo-card-head {1720	display: flex;1721	align-items: baseline;1722	justify-content: space-between;1723	gap: 12px;1724}1725.repo-card-name {1726	font-size: 1.375rem;1727	line-height: 1.1;1728	color: var(--accent);1729	overflow: hidden;1730	text-overflow: ellipsis;1731	white-space: nowrap;1732}1733.repo-card-saves {1734	font-size: 0.6875rem;1735	white-space: nowrap;1736}1737.repo-card-desc {1738	margin: 8px 0 0;1739	font-size: 0.8125rem;1740	line-height: 1.5;1741	color: var(--text-secondary);1742	display: -webkit-box;1743	-webkit-line-clamp: 2;1744	-webkit-box-orient: vertical;1745	overflow: hidden;1746}1747.repo-card-cat {1748	margin: 10px 0 0;1749	font-size: 0.9375rem;1750	color: var(--text);1751}17521753/* ----- profile ------------------------------------------------------------ */17541755/* The cover runs the full width of the window while the page keeps its column. */1756.profile-cover {1757	position: relative;1758	height: 380px;1759	margin: -24px calc(50% - 50vw) 0;1760	overflow: hidden;1761	border-bottom: 1px solid var(--bg-surface);1762}1763.hex-backdrop {1764	position: absolute;1765	inset: 0;1766	display: flex;1767	flex-direction: row-reverse;1768	justify-content: center;1769	align-items: center;1770	gap: 13px;1771	pointer-events: none;1772	user-select: none;1773	font-family: var(--mono);1774	font-size: 13px;1775	line-height: 16px;1776	color: var(--accent-dim);1777}1778/* Characters top to bottom, columns right to left, each breathing on its own clock. */1779.hex-col {1780	writing-mode: vertical-rl;1781	text-orientation: upright;1782	letter-spacing: 3px;1783	opacity: 0.05;1784	animation: hex-breathe 17s ease-in-out infinite;1785	transition:1786		color 1.6s ease,1787		text-shadow 1.6s ease;1788}1789.hex-col:nth-child(3n) {1790	color: var(--accent);1791	animation-duration: 23s;1792	animation-delay: -7s;1793}1794.hex-col:nth-child(4n + 1) {1795	animation-duration: 29s;1796	animation-delay: -13s;1797}1798.hex-col:nth-child(5n + 2) {1799	animation-duration: 19s;1800	animation-delay: -3s;1801}1802.hex-col:nth-child(7n) {1803	animation-delay: -21s;1804}1805.hex-col.glow {1806	color: var(--accent-bright);1807	text-shadow: 0 0 6px var(--accent-tint-12);1808}1809@keyframes hex-breathe {1810	0%,1811	100% {1812		opacity: 0.05;1813	}1814	50% {1815		opacity: 0.22;1816	}1817}1818.profile-cover-fade {1819	position: absolute;1820	left: 0;1821	right: 0;1822	bottom: 0;1823	height: 55%;1824	background: linear-gradient(to bottom, transparent, var(--bg));1825	pointer-events: none;1826}1827.profile-identity {1828	position: absolute;1829	bottom: 40px;1830	left: 0;1831	right: 0;1832	max-width: 980px;1833	margin: 0 auto;1834	padding: 0 48px;1835}1836.profile-username {1837	margin: 0 0 8px;1838	font-family: "Sacramento", cursive;1839	font-weight: 400;1840	font-size: 3.625rem;1841	line-height: 1;1842	letter-spacing: -0.02em;1843	text-transform: lowercase;1844	color: var(--text-heading);1845	user-select: none;1846	animation: fadeUp 500ms ease both;1847}1848.profile-signature {1849	display: block;1850	max-height: 96px;1851	max-width: min(360px, 100%);1852}1853.profile-tagline {1854	margin: 0 0 6px;1855	font-family: var(--mono);1856	font-size: 0.75rem;1857	letter-spacing: 0.15em;1858	color: var(--text-faint);1859}1860.profile-op-badge {1861	display: block;1862	font-size: 0.6875rem;1863	letter-spacing: 0.18em;1864	color: var(--accent);1865}18661867.profile-portrait-section {1868	display: grid;1869	grid-template-columns: 320px minmax(0, 1fr);1870	gap: 40px;1871	align-items: start;1872	padding-top: 40px;1873}1874.profile-left {1875	display: flex;1876	flex-direction: column;1877	gap: 16px;1878}1879.profile-identity-card,1880.profile-languages-bar {1881	padding: 20px 24px;1882	border: 1px solid var(--bg-elevated);1883	border-radius: 4px;1884}1885.profile-identity-bio {1886	margin: 0;1887	font-size: 0.875rem;1888	line-height: 1.5;1889	color: var(--text-muted);1890}1891.profile-identity-location {1892	margin: 6px 0 0;1893	font-family: var(--mono);1894	font-size: 0.8125rem;1895	color: var(--text-muted);1896}1897.profile-website-pill {1898	display: inline-block;1899	max-width: 100%;1900	margin-top: 10px;1901	padding: 3px 8px;1902	overflow: hidden;1903	text-overflow: ellipsis;1904	white-space: nowrap;1905	border: 1px solid var(--text-faint);1906	border-radius: 3px;1907	background: var(--bg-surface);1908	font-family: var(--mono);1909	font-size: 0.6875rem;1910	color: var(--accent);1911}1912.profile-website-pill:hover {1913	border-color: var(--accent);1914	text-decoration: none;1915}1916.profile-stats-grid {1917	display: grid;1918	grid-template-columns: 1fr 1fr;1919	border: 1px solid var(--bg-elevated);1920	border-radius: 4px;1921	overflow: hidden;1922}1923.profile-stat-tile {1924	padding: 16px;1925	border-right: 1px solid var(--bg-elevated);1926	border-bottom: 1px solid var(--bg-elevated);1927}1928.profile-stat-tile:nth-child(2n) {1929	border-right: none;1930}1931.profile-stat-tile:nth-last-child(-n + 2) {1932	border-bottom: none;1933}1934.profile-stat-number {1935	margin-bottom: 4px;1936	font-weight: 600;1937	font-size: 1.75rem;1938	line-height: 1;1939	color: var(--accent);1940}1941.profile-stat-label,1942.profile-section-label {1943	font-family: var(--mono);1944	font-size: 0.625rem;1945	text-transform: uppercase;1946	letter-spacing: 0.08em;1947	color: var(--text-faint);1948}1949.profile-lang-bar {1950	display: block;1951	width: 100%;1952	height: 6px;1953	margin-bottom: 8px;1954	border-radius: 3px;1955	background: var(--bg-surface);1956}1957.profile-lang-bar rect {1958	fill: var(--accent);1959	opacity: 0.6;1960}1961.profile-lang-bar rect:nth-child(2) {1962	fill: var(--sage);1963}1964.profile-lang-bar rect:nth-child(3) {1965	fill: var(--accent-flash);1966	opacity: 0.45;1967}1968.profile-lang-bar rect:nth-child(4) {1969	fill: var(--accent-dim);1970}1971.profile-lang-labels {1972	display: flex;1973	flex-wrap: wrap;1974	gap: 10px;1975	font-family: var(--mono);1976	font-size: 0.625rem;1977	color: var(--text-muted);1978}1979.profile-section-label {1980	margin-bottom: 16px;1981	letter-spacing: 0.2em;1982}1983.profile-event {1984	display: grid;1985	grid-template-columns: 96px 12px minmax(0, 1fr) auto;1986	gap: 10px;1987	align-items: baseline;1988	padding: 7px 0;1989	border-bottom: 1px solid var(--bg-surface);1990	font-family: var(--mono);1991	font-size: 0.6875rem;1992	animation: fadeUp 300ms ease both;1993}1994.profile-event-repo,1995.profile-event-message {1996	overflow: hidden;1997	text-overflow: ellipsis;1998	white-space: nowrap;1999}2000.profile-event-repo,2001.profile-event-glyph {2002	color: var(--accent);2003}2004.profile-event-glyph {2005	font-size: 0.625rem;2006}2007.profile-event-message {2008	color: var(--text-muted);2009}2010.profile-event-message:hover {2011	color: var(--text-heading);2012}2013.profile-event-time {2014	font-size: 0.625rem;2015	white-space: nowrap;2016	color: var(--text-faint);2017}2018.profile-empty-state {2019	font-style: italic;2020	font-size: 0.8125rem;2021	color: var(--text-faint);2022}2023.profile-repos-section {2024	margin-top: 40px;2025	padding-top: 40px;2026	border-top: 1px solid var(--bg-surface);2027}20282029/* ----- docs and support --------------------------------------------------- */20302031.site-doc {2032	max-width: 72ch;2033	margin-top: 16px;2034}2035.site-doc h1 {2036	font-size: clamp(2rem, 5vw, 3rem);2037	font-weight: 400;2038	color: var(--text-heading);2039}2040.site-doc h2 {2041	margin-top: 2.4em;2042}20432044@media (max-width: 860px) {2045	.headline,2046	.profile-portrait-section {2047		grid-template-columns: minmax(0, 1fr);2048	}2049	.headline {2050		gap: 8px;2051		padding-top: 48px;2052	}2053	.card-grid {2054		grid-template-columns: minmax(0, 1fr);2055	}2056}2057@media (max-width: 768px) {2058	.fv-header {2059		flex-wrap: wrap;2060		height: auto;2061		padding: 8px 12px;2062		gap: 8px 12px;2063	}2064	.fv-body {2065		grid-template-columns: minmax(0, 1fr);2066	}2067	.fv-detail {2068		display: none;2069	}2070	.ticker {2071		height: 226px;2072		margin-top: -88px;2073		padding-top: 80px;2074	}2075	.profile-cover {2076		height: 280px;2077		margin-top: -16px;2078	}2079	.profile-identity {2080		bottom: 24px;2081		padding: 0 16px;2082	}2083	.profile-username {2084		font-size: 2.5rem;2085	}2086	.profile-event {2087		grid-template-columns: 72px 12px minmax(0, 1fr);2088	}2089	.profile-event-time {2090		display: none;2091	}2092}20932094/* ----- file viewer (Kepr 2's Atlas modal) -------------------------------- */20952096body:has(> .fv-overlay) {2097	overflow: hidden;2098}2099.fv-overlay {2100	position: fixed;2101	inset: 0;2102	z-index: 2000;2103	display: flex;2104	flex-direction: column;2105	background: rgba(8, 7, 5, 0.97);2106	outline: none;2107	animation: fv-in 200ms ease both;2108}2109@keyframes fv-in {2110	from {2111		opacity: 0;2112		transform: translateY(6px) scale(0.97);2113	}2114}2115.fv-header {2116	display: flex;2117	align-items: center;2118	gap: 16px;2119	flex-shrink: 0;2120	height: 48px;2121	padding: 0 20px;2122	background: var(--bg);2123	border-bottom: 1px solid var(--bg-elevated);2124}2125.fv-close {2126	background: none;2127	border: 0;2128	padding: 0 4px;2129	font-size: 1.375rem;2130	line-height: 1;2131	color: var(--text-faint);2132	cursor: pointer;2133}2134.fv-close:hover {2135	color: var(--accent);2136}2137.fv-title {2138	display: flex;2139	align-items: baseline;2140	gap: 8px;2141	flex: 1;2142	min-width: 0;2143}2144.fv-name {2145	font-size: 1.25rem;2146	color: var(--text-heading);2147	white-space: nowrap;2148}2149.fv-path {2150	font-size: 0.625rem;2151	color: var(--text-faint);2152	white-space: nowrap;2153	overflow: hidden;2154	text-overflow: ellipsis;2155}2156.fv-controls,2157.fv-nav {2158	display: flex;2159	align-items: center;2160	gap: 4px;2161	flex-shrink: 0;2162}2163.fv-ctrl-btn {2164	background: transparent;2165	border: 1px solid rgba(200, 154, 90, 0.2);2166	border-radius: 2px;2167	padding: 3px 7px;2168	font: inherit;2169	font-size: 0.625rem;2170	color: var(--text-faint);2171	cursor: pointer;2172	transition:2173		color 100ms,2174		border-color 100ms;2175}2176.fv-ctrl-btn:hover:not(:disabled),2177.fv-ctrl-btn.active {2178	color: var(--accent);2179	border-color: rgba(200, 154, 90, 0.5);2180	text-decoration: none;2181}2182.fv-ctrl-btn:disabled {2183	opacity: 0.3;2184	cursor: default;2185}2186.fv-pos {2187	min-width: 48px;2188	text-align: center;2189	font-size: 0.625rem;2190	color: var(--text-faint);2191}2192.fv-body {2193	flex: 1;2194	min-height: 0;2195	display: grid;2196	grid-template-columns: minmax(0, 1fr) 280px;2197}2198.fv-source {2199	min-height: 0;2200	overflow: auto;2201	padding: 16px 28px 32px;2202	font-family: var(--mono);2203	font-size: 0.6875rem;2204	color: var(--text-faint);2205}2206.fv-source .file-view {2207	margin: -16px -28px 0;2208	border: 0;2209	background: none;2210	overflow: visible;2211}2212.fv-source .code {2213	font-size: var(--fv-size);2214	color: var(--text);2215}2216.fv-wrap .fv-source .lc {2217	white-space: pre-wrap;2218	overflow-wrap: anywhere;2219}2220.fv-source .file-markdown {2221	font-family: var(--sans);2222	font-size: calc(var(--fv-size) + 2px);2223	color: var(--text);2224}2225.fv-detail .atlas-info-desc {2226	font-size: 0.8125rem;2227}2228.fv-detail {2229	overflow-y: auto;2230	padding: 18px 20px 24px;2231	background: var(--bg);2232	border-left: 1px solid var(--bg-elevated);2233}22342235/* Last in the file, after every animation it stops, so it wins without !important. */2236@media (prefers-reduced-motion: reduce) {2237	.tri-outer,2238	.tri-inner,2239	.repo-name,2240	.repo-contributor,2241	.repo-desc,2242	.repo-homepage,2243	.repo-meta,2244	.repo-tabs,2245	.install-lines,2246	.repo-section,2247	.repo-details,2248	.save-message-head,2249	.ticker-row,2250	.ticker-track,2251	.hex-col,2252	.headline h1,2253	.headline-tagline,2254	.headline-cloud,2255	.repo-card,2256	.profile-username,2257	.profile-event,2258	.fv-overlay,2259	.repo-panel {2260		animation: none;2261	}2262	.hex-col {2263		opacity: 0.12;2264	}2265}