mirror your GitHub repos to tangled.org automatically
1*, *::before, *::after { box-sizing: border-box; }
2
3html, body {
4 overflow-x: clip;
5}
6
7html {
8 background: var(--color-paper);
9 color: var(--color-ink);
10 font-family: var(--font-body);
11 font-size: 100%;
12 line-height: 1.6;
13 -webkit-font-smoothing: antialiased;
14 text-rendering: optimizeLegibility;
15}
16
17body {
18 margin: 0;
19 font-weight: 400;
20}
21
22h1, h2, h3, h4 {
23 font-family: var(--font-display);
24 font-weight: 700;
25 line-height: 1.1;
26 letter-spacing: -0.02em;
27 margin: 0;
28}
29
30a {
31 color: var(--color-accent);
32 text-decoration-thickness: 1px;
33 text-underline-offset: 2px;
34}
35
36a:hover {
37 color: var(--color-ink);
38}
39
40code, pre, kbd {
41 font-family: var(--font-mono);
42 font-variant-ligatures: none;
43}
44
45:focus-visible {
46 outline: 2px solid var(--color-focus);
47 outline-offset: 2px;
48}
49
50.skip-link {
51 position: absolute;
52 left: var(--space-md);
53 top: var(--space-md);
54 z-index: var(--z-toast);
55 padding: 0.5rem 0.9rem;
56 background: var(--color-paper-3);
57 border: var(--rule-hair) solid var(--color-accent);
58 border-radius: var(--radius-sm);
59 color: var(--color-ink);
60 font-family: var(--font-mono);
61 font-size: var(--text-sm);
62 text-decoration: none;
63 transform: translateY(-150%);
64}
65
66.skip-link:focus {
67 transform: none;
68}
69
70button {
71 font: inherit;
72}
73
74::selection {
75 background: var(--color-accent);
76 color: var(--color-paper);
77}
78
79.reveal {
80 opacity: 0;
81 transform: translateY(8px);
82 animation: reveal var(--dur-long) var(--ease-out) forwards;
83 animation-delay: calc(var(--i, 0) * 60ms);
84}
85
86@keyframes reveal {
87 to { opacity: 1; transform: none; }
88}
89
90@media (prefers-reduced-motion: reduce) {
91 *, *::before, *::after {
92 animation-duration: 150ms !important;
93 animation-iteration-count: 1 !important;
94 transition-duration: 150ms !important;
95 }
96 .reveal {
97 animation: reveal-reduced 150ms linear forwards;
98 }
99 @keyframes reveal-reduced {
100 to { opacity: 1; transform: none; }
101 }
102}