A simple, clean, fast browser for the AtmosphereConf(2026) VODs
1@tailwind base;
2@tailwind components;
3@tailwind utilities;
4
5:root {
6 color-scheme: dark;
7 font-family: 'JetBrains Mono', monospace;
8 font-synthesis: none;
9 text-rendering: optimizeLegibility;
10 -webkit-font-smoothing: antialiased;
11 -moz-osx-font-smoothing: grayscale;
12 --bg: 0 0 0;
13 --surface: 0.12 0 0;
14 --line: 0.34 0 0;
15 --text: 0.95 0 0;
16 --muted: 0.72 0 0;
17 --accent: 0.75 0.11 190;
18}
19
20:root[data-theme='light'] {
21 color-scheme: light;
22 --bg: 0.98 0 0;
23 --surface: 0.95 0 0;
24 --line: 0.78 0 0;
25 --text: 0.2 0 0;
26 --muted: 0.45 0 0;
27 --accent: 0.62 0.1 190;
28}
29
30@media (prefers-color-scheme: light) {
31 :root:not([data-theme]) {
32 color-scheme: light;
33 --bg: 0.98 0 0;
34 --surface: 0.95 0 0;
35 --line: 0.78 0 0;
36 --text: 0.2 0 0;
37 --muted: 0.45 0 0;
38 --accent: 0.62 0.1 190;
39 }
40}
41
42* {
43 box-sizing: border-box;
44}
45
46body {
47 margin: 0;
48 min-height: 100svh;
49 color: oklch(var(--text));
50 background: oklch(var(--bg));
51}
52
53a {
54 color: inherit;
55 text-decoration: none;
56}
57
58#root {
59 min-height: 100svh;
60}
61
62.line-clamp-2 {
63 display: -webkit-box;
64 -webkit-line-clamp: 2;
65 -webkit-box-orient: vertical;
66 overflow: hidden;
67}
68
69.eyebrow-label {
70 font-size: 0.875rem;
71 line-height: 1.25rem;
72 font-weight: 500;
73}
74
75@supports (content-visibility: auto) {
76 .perf-content-auto {
77 content-visibility: auto;
78 contain-intrinsic-size: 320px;
79 }
80}
81
82@media (prefers-reduced-motion: reduce) {
83 *,
84 *::before,
85 *::after {
86 animation-duration: 1ms !important;
87 animation-iteration-count: 1 !important;
88 transition-duration: 1ms !important;
89 scroll-behavior: auto !important;
90 }
91}