OpenVibe.Surf

Where

25 of 37: the ones that cost most, from as many files as possible. Each opens its line on GitHub.

1. Timingpublic/css/surf.css:45html.ov-motion .sf-run-speed i { animation: sf-speed 1.1s linear infinite; animation-delay: calc(var(--i) * -.12s); }
2. Timingpublic/css/surf.css:55.sf-tile a { display: grid; gap: 8px; height: 100%; padding: 18px; border-radius: 20px; border: 1px solid var(--border, #1f2d47); background: var(--bg-card, #0f
3. Timingpublic/css/surf.css:55.sf-tile a { display: grid; gap: 8px; height: 100%; padding: 18px; border-radius: 20px; border: 1px solid var(--border, #1f2d47); background: var(--bg-card, #0f
4. Timingpublic/css/surf.css:78.sf-demo-steps li.is-now::before { border-color: var(--room-accent); animation: sf-pulse 1.4s ease-out infinite; } /* the step on now pulses out, never spins
5. Curvepublic/css/surf.css:78.sf-demo-steps li.is-now::before { border-color: var(--room-accent); animation: sf-pulse 1.4s ease-out infinite; } /* the step on now pulses out, never spins
6. Timingpublic/css/surf.css:89.sf-map-link { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px; border-radius: 18px; border: 1px solid
7. Timingpublic/css/surf.css:129.sf-tv-screen.is-changing { animation: sf-change .28s ease; }
8. Curvepublic/css/surf.css:129.sf-tv-screen.is-changing { animation: sf-change .28s ease; }
9. Timingpublic/css/surf.css:160html.ov-motion .sf-party-dot { animation: sf-party-pulse 2.4s ease-in-out infinite; }
10. Curvepublic/css/surf.css:160html.ov-motion .sf-party-dot { animation: sf-party-pulse 2.4s ease-in-out infinite; }
11. Timingpublic/css/surf.css:209html.ov-motion .sf-party-playing .sf-party-dot { animation: sf-pulse 1.6s ease-out infinite; }
12. Curvepublic/css/surf.css:209html.ov-motion .sf-party-playing .sf-party-dot { animation: sf-pulse 1.6s ease-out infinite; }
13. Timingpublic/css/surf.css:227.sf-desk-page[data-sf-desk-open="1"] .sf-desk-state::before { background: #22c55e; animation: sf-desk-pulse 1.6s ease-out infinite; }
14. Curvepublic/css/surf.css:227.sf-desk-page[data-sf-desk-open="1"] .sf-desk-state::before { background: #22c55e; animation: sf-desk-pulse 1.6s ease-out infinite; }
15. Colourpublic/css/surf.css:47.sf-run-hud { position: absolute; left: 50%; bottom: 10%; translate: -50% 0; display: grid; justify-items: center; gap: 2px; padding: 8px 16px; border-radius: 1
16. Colourpublic/css/surf.css:47.sf-run-hud { position: absolute; left: 50%; bottom: 10%; translate: -50% 0; display: grid; justify-items: center; gap: 2px; padding: 8px 16px; border-radius: 1
17. Colourpublic/css/surf.css:66.sf-demo-run { display: grid; gap: 10px; padding: 16px; border-radius: 18px; background: #0b0f17; color: #e9f2ff; border: 1px solid color-mix(in srgb, var(--roo
18. Colourpublic/css/surf.css:66.sf-demo-run { display: grid; gap: 10px; padding: 16px; border-radius: 18px; background: #0b0f17; color: #e9f2ff; border: 1px solid color-mix(in srgb, var(--roo
19. Colourpublic/css/surf.css:69.sf-demo-hud .is-good { color: #4ade80; font-variant-numeric: tabular-nums; }
20. Colourpublic/css/surf.css:70.sf-demo-bar { height: 6px; border-radius: 6px; background: rgba(255, 255, 255, .12); overflow: hidden; }
21. Colourpublic/css/surf.css:71.sf-demo-bar i { display: block; height: 100%; background: #00bef6; border-radius: inherit; }
22. Colourpublic/css/surf.css:82.sf-demo-screen { position: relative; display: flex; align-items: flex-end; gap: 8px; aspect-ratio: 16 / 6; max-height: 210px; padding: 12px; border-radius: 12p
23. Colourpublic/css/surf.css:83background: radial-gradient(120% 120% at 70% 30%, color-mix(in srgb, var(--room-accent) 45%, transparent), transparent 60%), linear-gradient(160deg, #1e293b, #0
24. Colourpublic/css/surf.css:83background: radial-gradient(120% 120% at 70% 30%, color-mix(in srgb, var(--room-accent) 45%, transparent), transparent 60%), linear-gradient(160deg, #1e293b, #0
25. Colourpublic/css/surf.css:85.sf-pill-live { padding: 1px 7px; border-radius: 5px; background: var(--live-red, #e11d48); color: #fff; font-size: .68rem; font-weight: 800; }