teal.fm
1/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */
2@layer properties;
3@layer theme, base, components, utilities;
4@layer theme {
5 :root, :host {
6 --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
7 "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
8 --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
9 "Courier New", monospace;
10 --color-gray-100: oklch(96.7% 0.003 264.542);
11 --color-gray-200: oklch(92.8% 0.006 264.531);
12 --color-gray-300: oklch(87.2% 0.01 258.338);
13 --color-gray-600: oklch(44.6% 0.03 256.802);
14 --color-white: #fff;
15 --spacing: 0.25rem;
16 --text-lg: 1.125rem;
17 --text-lg--line-height: calc(1.75 / 1.125);
18 --text-xl: 1.25rem;
19 --text-xl--line-height: calc(1.75 / 1.25);
20 --font-weight-semibold: 600;
21 --font-weight-bold: 700;
22 --leading-relaxed: 1.625;
23 --radius-lg: 0.5rem;
24 --default-font-family: var(--font-sans);
25 --default-mono-font-family: var(--font-mono);
26 }
27}
28@layer base {
29 *, ::after, ::before, ::backdrop, ::file-selector-button {
30 box-sizing: border-box;
31 margin: 0;
32 padding: 0;
33 border: 0 solid;
34 }
35 html, :host {
36 line-height: 1.5;
37 -webkit-text-size-adjust: 100%;
38 tab-size: 4;
39 font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
40 font-feature-settings: var(--default-font-feature-settings, normal);
41 font-variation-settings: var(--default-font-variation-settings, normal);
42 -webkit-tap-highlight-color: transparent;
43 }
44 hr {
45 height: 0;
46 color: inherit;
47 border-top-width: 1px;
48 }
49 abbr:where([title]) {
50 -webkit-text-decoration: underline dotted;
51 text-decoration: underline dotted;
52 }
53 h1, h2, h3, h4, h5, h6 {
54 font-size: inherit;
55 font-weight: inherit;
56 }
57 a {
58 color: inherit;
59 -webkit-text-decoration: inherit;
60 text-decoration: inherit;
61 }
62 b, strong {
63 font-weight: bolder;
64 }
65 code, kbd, samp, pre {
66 font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
67 font-feature-settings: var(--default-mono-font-feature-settings, normal);
68 font-variation-settings: var(--default-mono-font-variation-settings, normal);
69 font-size: 1em;
70 }
71 small {
72 font-size: 80%;
73 }
74 sub, sup {
75 font-size: 75%;
76 line-height: 0;
77 position: relative;
78 vertical-align: baseline;
79 }
80 sub {
81 bottom: -0.25em;
82 }
83 sup {
84 top: -0.5em;
85 }
86 table {
87 text-indent: 0;
88 border-color: inherit;
89 border-collapse: collapse;
90 }
91 :-moz-focusring {
92 outline: auto;
93 }
94 progress {
95 vertical-align: baseline;
96 }
97 summary {
98 display: list-item;
99 }
100 ol, ul, menu {
101 list-style: none;
102 }
103 img, svg, video, canvas, audio, iframe, embed, object {
104 display: block;
105 vertical-align: middle;
106 }
107 img, video {
108 max-width: 100%;
109 height: auto;
110 }
111 button, input, select, optgroup, textarea, ::file-selector-button {
112 font: inherit;
113 font-feature-settings: inherit;
114 font-variation-settings: inherit;
115 letter-spacing: inherit;
116 color: inherit;
117 border-radius: 0;
118 background-color: transparent;
119 opacity: 1;
120 }
121 :where(select:is([multiple], [size])) optgroup {
122 font-weight: bolder;
123 }
124 :where(select:is([multiple], [size])) optgroup option {
125 padding-inline-start: 20px;
126 }
127 ::file-selector-button {
128 margin-inline-end: 4px;
129 }
130 ::placeholder {
131 opacity: 1;
132 }
133 @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
134 ::placeholder {
135 color: currentcolor;
136 @supports (color: color-mix(in lab, red, red)) {
137 color: color-mix(in oklab, currentcolor 50%, transparent);
138 }
139 }
140 }
141 textarea {
142 resize: vertical;
143 }
144 ::-webkit-search-decoration {
145 -webkit-appearance: none;
146 }
147 ::-webkit-date-and-time-value {
148 min-height: 1lh;
149 text-align: inherit;
150 }
151 ::-webkit-datetime-edit {
152 display: inline-flex;
153 }
154 ::-webkit-datetime-edit-fields-wrapper {
155 padding: 0;
156 }
157 ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
158 padding-block: 0;
159 }
160 ::-webkit-calendar-picker-indicator {
161 line-height: 1;
162 }
163 :-moz-ui-invalid {
164 box-shadow: none;
165 }
166 button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
167 appearance: button;
168 }
169 ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
170 height: auto;
171 }
172 [hidden]:where(:not([hidden="until-found"])) {
173 display: none !important;
174 }
175}
176@layer utilities {
177 .absolute {
178 position: absolute;
179 }
180 .relative {
181 position: relative;
182 }
183 .static {
184 position: static;
185 }
186 .sticky {
187 position: sticky;
188 }
189 .container {
190 width: 100%;
191 @media (width >= 40rem) {
192 max-width: 40rem;
193 }
194 @media (width >= 48rem) {
195 max-width: 48rem;
196 }
197 @media (width >= 64rem) {
198 max-width: 64rem;
199 }
200 @media (width >= 80rem) {
201 max-width: 80rem;
202 }
203 @media (width >= 96rem) {
204 max-width: 96rem;
205 }
206 }
207 .mx-auto {
208 margin-inline: auto;
209 }
210 .my-5 {
211 margin-block: calc(var(--spacing) * 5);
212 }
213 .mt-1 {
214 margin-top: calc(var(--spacing) * 1);
215 }
216 .mt-3 {
217 margin-top: calc(var(--spacing) * 3);
218 }
219 .mb-1 {
220 margin-bottom: calc(var(--spacing) * 1);
221 }
222 .mb-2 {
223 margin-bottom: calc(var(--spacing) * 2);
224 }
225 .mb-3 {
226 margin-bottom: calc(var(--spacing) * 3);
227 }
228 .mb-4 {
229 margin-bottom: calc(var(--spacing) * 4);
230 }
231 .mb-5 {
232 margin-bottom: calc(var(--spacing) * 5);
233 }
234 .block {
235 display: block;
236 }
237 .contents {
238 display: contents;
239 }
240 .flex {
241 display: flex;
242 }
243 .hidden {
244 display: none;
245 }
246 .table {
247 display: table;
248 }
249 .w-\[95\%\] {
250 width: 95%;
251 }
252 .w-full {
253 width: 100%;
254 }
255 .max-w-\[600px\] {
256 max-width: 600px;
257 }
258 .max-w-\[800px\] {
259 max-width: 800px;
260 }
261 .border-collapse {
262 border-collapse: collapse;
263 }
264 .transform {
265 transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
266 }
267 .cursor-pointer {
268 cursor: pointer;
269 }
270 .list-disc {
271 list-style-type: disc;
272 }
273 .flex-wrap {
274 flex-wrap: wrap;
275 }
276 .space-y-2 {
277 :where(& > :not(:last-child)) {
278 --tw-space-y-reverse: 0;
279 margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
280 margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
281 }
282 }
283 .gap-x-4 {
284 column-gap: calc(var(--spacing) * 4);
285 }
286 .gap-y-1 {
287 row-gap: calc(var(--spacing) * 1);
288 }
289 .rounded {
290 border-radius: 0.25rem;
291 }
292 .rounded-lg {
293 border-radius: var(--radius-lg);
294 }
295 .border {
296 border-style: var(--tw-border-style);
297 border-width: 1px;
298 }
299 .border-b {
300 border-bottom-style: var(--tw-border-style);
301 border-bottom-width: 1px;
302 }
303 .border-l-4 {
304 border-left-style: var(--tw-border-style);
305 border-left-width: 4px;
306 }
307 .border-\[\#1DB954\] {
308 border-color: #1DB954;
309 }
310 .border-gray-200 {
311 border-color: var(--color-gray-200);
312 }
313 .border-gray-300 {
314 border-color: var(--color-gray-300);
315 }
316 .bg-\[\#1DB954\] {
317 background-color: #1DB954;
318 }
319 .bg-\[\#d51007\] {
320 background-color: #d51007;
321 }
322 .bg-\[\#dc3545\] {
323 background-color: #dc3545;
324 }
325 .bg-gray-100 {
326 background-color: var(--color-gray-100);
327 }
328 .p-2 {
329 padding: calc(var(--spacing) * 2);
330 }
331 .p-4 {
332 padding: calc(var(--spacing) * 4);
333 }
334 .p-5 {
335 padding: calc(var(--spacing) * 5);
336 }
337 .px-3 {
338 padding-inline: calc(var(--spacing) * 3);
339 }
340 .px-4 {
341 padding-inline: calc(var(--spacing) * 4);
342 }
343 .py-1\.5 {
344 padding-block: calc(var(--spacing) * 1.5);
345 }
346 .py-2 {
347 padding-block: calc(var(--spacing) * 2);
348 }
349 .py-2\.5 {
350 padding-block: calc(var(--spacing) * 2.5);
351 }
352 .pl-5 {
353 padding-left: calc(var(--spacing) * 5);
354 }
355 .text-left {
356 text-align: left;
357 }
358 .font-mono {
359 font-family: var(--font-mono);
360 }
361 .font-sans {
362 font-family: var(--font-sans);
363 }
364 .text-lg {
365 font-size: var(--text-lg);
366 line-height: var(--tw-leading, var(--text-lg--line-height));
367 }
368 .text-xl {
369 font-size: var(--text-xl);
370 line-height: var(--tw-leading, var(--text-xl--line-height));
371 }
372 .leading-relaxed {
373 --tw-leading: var(--leading-relaxed);
374 line-height: var(--leading-relaxed);
375 }
376 .font-bold {
377 --tw-font-weight: var(--font-weight-bold);
378 font-weight: var(--font-weight-bold);
379 }
380 .font-semibold {
381 --tw-font-weight: var(--font-weight-semibold);
382 font-weight: var(--font-weight-semibold);
383 }
384 .text-\[\#1DB954\] {
385 color: #1DB954;
386 }
387 .text-gray-600 {
388 color: var(--color-gray-600);
389 }
390 .text-white {
391 color: var(--color-white);
392 }
393 .lowercase {
394 text-transform: lowercase;
395 }
396 .italic {
397 font-style: italic;
398 }
399 .no-underline {
400 text-decoration-line: none;
401 }
402 .filter {
403 filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
404 }
405 .hover\:opacity-90 {
406 &:hover {
407 @media (hover: hover) {
408 opacity: 90%;
409 }
410 }
411 }
412}
413@property --tw-rotate-x {
414 syntax: "*";
415 inherits: false;
416}
417@property --tw-rotate-y {
418 syntax: "*";
419 inherits: false;
420}
421@property --tw-rotate-z {
422 syntax: "*";
423 inherits: false;
424}
425@property --tw-skew-x {
426 syntax: "*";
427 inherits: false;
428}
429@property --tw-skew-y {
430 syntax: "*";
431 inherits: false;
432}
433@property --tw-space-y-reverse {
434 syntax: "*";
435 inherits: false;
436 initial-value: 0;
437}
438@property --tw-border-style {
439 syntax: "*";
440 inherits: false;
441 initial-value: solid;
442}
443@property --tw-leading {
444 syntax: "*";
445 inherits: false;
446}
447@property --tw-font-weight {
448 syntax: "*";
449 inherits: false;
450}
451@property --tw-blur {
452 syntax: "*";
453 inherits: false;
454}
455@property --tw-brightness {
456 syntax: "*";
457 inherits: false;
458}
459@property --tw-contrast {
460 syntax: "*";
461 inherits: false;
462}
463@property --tw-grayscale {
464 syntax: "*";
465 inherits: false;
466}
467@property --tw-hue-rotate {
468 syntax: "*";
469 inherits: false;
470}
471@property --tw-invert {
472 syntax: "*";
473 inherits: false;
474}
475@property --tw-opacity {
476 syntax: "*";
477 inherits: false;
478}
479@property --tw-saturate {
480 syntax: "*";
481 inherits: false;
482}
483@property --tw-sepia {
484 syntax: "*";
485 inherits: false;
486}
487@property --tw-drop-shadow {
488 syntax: "*";
489 inherits: false;
490}
491@property --tw-drop-shadow-color {
492 syntax: "*";
493 inherits: false;
494}
495@property --tw-drop-shadow-alpha {
496 syntax: "<percentage>";
497 inherits: false;
498 initial-value: 100%;
499}
500@property --tw-drop-shadow-size {
501 syntax: "*";
502 inherits: false;
503}
504@layer properties {
505 @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
506 *, ::before, ::after, ::backdrop {
507 --tw-rotate-x: initial;
508 --tw-rotate-y: initial;
509 --tw-rotate-z: initial;
510 --tw-skew-x: initial;
511 --tw-skew-y: initial;
512 --tw-space-y-reverse: 0;
513 --tw-border-style: solid;
514 --tw-leading: initial;
515 --tw-font-weight: initial;
516 --tw-blur: initial;
517 --tw-brightness: initial;
518 --tw-contrast: initial;
519 --tw-grayscale: initial;
520 --tw-hue-rotate: initial;
521 --tw-invert: initial;
522 --tw-opacity: initial;
523 --tw-saturate: initial;
524 --tw-sepia: initial;
525 --tw-drop-shadow: initial;
526 --tw-drop-shadow-color: initial;
527 --tw-drop-shadow-alpha: 100%;
528 --tw-drop-shadow-size: initial;
529 }
530 }
531}