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