Fix README and revert top the new fixed version

#13
Files changed (1) hide show
  1. README.md +162 -33
README.md CHANGED
@@ -28,50 +28,171 @@ Our mission is to advance efficient and accessible AI by developing open-source
28
 
29
 
30
  <style>
31
- .sl{--b1:#3a46f5;--b2:#4c5cf7;--b3:#6f7fff;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;margin-top:6px}
32
  .sl *{box-sizing:border-box}
33
- .sl-site-wrap{text-align:center;margin:4px 0 24px!important}
34
- .sl-site{display:inline-flex;align-items:center;gap:10px;padding:11px 20px;border-radius:999px;background:#4c5cf7;color:#fff!important;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:.95rem;font-weight:800;letter-spacing:-.01em;line-height:1;text-decoration:none!important;transition:background .2s ease}
35
- .sl-site:hover::before{background:#fff}
36
- .sl-site span{font-weight:500;padding-right:10px;border-right:1px solid rgba(255,255,255,.4)}
37
- .sl-site:hover{background:#3a46f5}
38
- .sl-site:hover::before{background:#fff}
39
  .sl a{text-decoration:none!important}
40
  .sl img{margin:0!important;max-width:none}
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
41
  .sl-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:6px 0 16px;padding-bottom:12px;border-bottom:1px solid rgba(76,92,247,.3)}
42
  .sl-head h2,.sl-head h3{margin:0!important;padding:0;border:0;font-size:1.55rem;font-weight:800;letter-spacing:-.025em;line-height:1.1}
 
 
43
  .sl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-bottom:40px}
44
- .sl-card{position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:180px;padding:22px;border-radius:12px;color:#fff;background:radial-gradient(120% 90% at 0% 0%,var(--b1) 0%,transparent 60%),radial-gradient(110% 120% at 100% 100%,var(--b3) 0%,transparent 55%),var(--b2)}
45
- .sl-card::before,.sl-card::after{content:"";position:absolute;border-radius:50%;border:1.5px solid rgba(255,255,255,.22);pointer-events:none}
46
- .sl-card::before{width:150px;height:150px;right:-50px;top:-50px}
47
- .sl-card::after{width:90px;height:90px;right:-20px;top:-20px;border-color:rgba(255,255,255,.14)}
 
 
 
 
 
 
 
 
 
 
 
 
 
48
  .sl-flag{grid-column:1/-1;min-height:200px}
49
  .sl-flag h3{font-size:1.7rem!important}
50
- .sl-flag::before{width:260px;height:260px;right:-70px;top:-90px}
51
- .sl-flag::after{width:170px;height:170px;right:-25px;top:-45px}
52
- .sl-tag{align-self:flex-start;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.8}
 
53
  .sl-card h3{margin:16px 0 6px!important;font-size:1.18rem;font-weight:800;letter-spacing:-.02em;line-height:1.2;border:0}
54
  .sl-card h3 a{color:#fff!important}
55
  .sl-card p{margin:0 0 18px!important;font-size:.92rem;line-height:1.5;color:rgba(255,255,255,.86)}
 
 
56
  .sl-actions{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px}
57
- .sl-btn{display:inline-block;font-size:.8rem;font-weight:700;padding:8px 14px;border-radius:999px;line-height:1;transition:background .2s ease,color .2s ease}
 
 
 
58
  .sl-pri{background:#fff;color:var(--b1)!important}
59
- .sl-pri:hover{background:rgba(255,255,255,.88)}
60
  .sl-sec{border:1px solid rgba(255,255,255,.6);color:#fff!important}
61
- .sl-sec:hover{background:rgba(255,255,255,.14)}
62
- .sl-alt{background:transparent;color:inherit;border:1.5px dashed rgba(76,92,247,.55)}
63
- .sl-alt::before,.sl-alt::after{border-color:rgba(76,92,247,.2)}
 
 
64
  .sl-alt .sl-tag{color:var(--b2)}
65
  .sl-alt h3 a{color:var(--b2)!important}
66
  .sl-alt p{color:inherit;opacity:.75}
67
  .sl-alt .sl-pri{background:var(--b2);color:#fff!important}
 
 
 
68
  .sl-team{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin-bottom:28px}
69
- .sl-member{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;border:1px solid rgba(76,92,247,.28);color:inherit!important;transition:border-color .2s ease}
70
- .sl-member:hover{border-color:var(--b2)}
71
- .sl-member img{width:56px;height:56px;flex:0 0 56px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 0 0 2px var(--b2)}
72
- .sl-name{display:block;font-weight:800;font-size:1rem;letter-spacing:-.01em;line-height:1.2}
73
- .sl-role{display:block;margin-top:3px;font-size:.78rem;opacity:.7;line-height:1.3}
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
74
  @media (max-width:640px){.sl-card{padding:18px;min-height:0}.sl-flag h3{font-size:1.35rem!important}.sl-head h2,.sl-head h3{font-size:1.3rem}}
 
75
  </style>
76
  <div class="sl">
77
  <div class="sl-head">
@@ -79,6 +200,7 @@ Our mission is to advance efficient and accessible AI by developing open-source
79
  </div>
80
  <div class="sl-grid">
81
  <div class="sl-card sl-flag">
 
82
  <span class="sl-tag">Flagship</span>
83
  <h3><a href="https://huggingface.co/SupraLabs/Supra2-100M-Instruct" target="_blank">Supra2-100M-Instruct</a></h3>
84
  <p>Latest Instruction-tuned flagship model.</p>
@@ -87,16 +209,17 @@ Our mission is to advance efficient and accessible AI by developing open-source
87
  <a class="sl-btn sl-sec" href="https://huggingface.co/spaces/Axionlab-official/Supra2-100M-Instruct-Demo">Demo</a>
88
  </div>
89
  </div>
90
- <div class="sl-card">
 
91
  <span class="sl-tag">Speech</span>
92
- <h3><a href="https://huggingface.co/SupraLabs/SupraTTS-0.1-Beta" target="_blank">SupraTTS-0.1-Beta</a></h3>
93
  <p>Text to Speech Model.</p>
94
  <div class="sl-actions">
95
- <a class="sl-btn sl-pri" href="https://huggingface.co/SupraLabs/SupraTTS-0.1-Beta">View model</a>
96
- <a class="sl-btn sl-sec" href="https://huggingface.co/spaces/SupraLabs/supratts-0-1-beta">Demo</a>
97
  </div>
98
  </div>
99
- <div class="sl-card">
 
100
  <span class="sl-tag">Image</span>
101
  <h3><a href="https://huggingface.co/SupraLabs/Supra2-IMG" target="_blank">Supra2-IMG</a></h3>
102
  <p>Text to Image Model.</p>
@@ -106,14 +229,16 @@ Our mission is to advance efficient and accessible AI by developing open-source
106
  </div>
107
  </div>
108
  <div class="sl-card">
109
- <span class="sl-tag">Instruct</span>
110
- <h3><a href="https://huggingface.co/SupraLabs/Supra2-Medium-Instruct" target="_blank">Supra2-Medium-Instruct</a></h3>
111
- <p>Latest instruction tuned 25M model.</p>
 
112
  <div class="sl-actions">
113
- <a class="sl-btn sl-pri" href="https://huggingface.co/SupraLabs/Supra2-Medium-Instruct">View model</a>
114
  </div>
115
  </div>
116
  <div class="sl-card sl-alt">
 
117
  <span class="sl-tag">Catalog</span>
118
  <h3><a href="https://huggingface.co/SupraLabs/models" target="_blank">All Models from SupraLabs</a></h3>
119
  <p>View all the AI models from SupraLabs.</p>
@@ -138,6 +263,10 @@ Our mission is to advance efficient and accessible AI by developing open-source
138
  <img src="https://cdn-avatars.huggingface.co/v1/production/uploads/685ea8ff7b4139b6845ce395/Im--QSnbrnAhHPPhpX8L0.png" alt="Dedeprogames"/>
139
  <span><span class="sl-name">Dedeprogames</span><span class="sl-role">Contributor 1</span></span>
140
  </a>
 
 
 
 
141
  </div>
142
  </div>
143
 
 
28
 
29
 
30
  <style>
31
+ .sl{--b1:#3a46f5;--b2:#4c5cf7;--b3:#6f7fff;--ease:cubic-bezier(.2,.8,.2,1);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;margin-top:6px}
32
  .sl *{box-sizing:border-box}
 
 
 
 
 
 
33
  .sl a{text-decoration:none!important}
34
  .sl img{margin:0!important;max-width:none}
35
+
36
+ img[alt="banner"]{border-radius:12px!important}
37
+
38
+ /* ---------- Keyframes ---------- */
39
+ @keyframes sl-pulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.7)}70%{box-shadow:0 0 0 8px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
40
+ @keyframes sl-avatar{0%{box-shadow:0 0 0 2px var(--b2),0 0 0 2px rgba(76,92,247,.6)}100%{box-shadow:0 0 0 2px var(--b2),0 0 0 12px rgba(76,92,247,0)}}
41
+ @keyframes sl-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
42
+ @keyframes sl-blink{0%,100%{opacity:1}50%{opacity:.25}}
43
+
44
+ /* ---------- Site button ---------- */
45
+ .sl-site-wrap{text-align:center;margin:4px 0 24px!important}
46
+ .sl-site{--ease:cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;padding:11px 20px;border-radius:999px;color:#fff!important;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:.95rem;font-weight:800;letter-spacing:-.01em;line-height:1;text-decoration:none!important;
47
+ background-color:#4c5cf7;
48
+ background-image:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.3) 50%,transparent 60%),linear-gradient(90deg,#3a46f5,#6f7fff);
49
+ background-size:250% 100%,100% 100%;
50
+ background-position:130% 0,0 0;
51
+ background-repeat:no-repeat;
52
+ box-shadow:0 0 0 0 rgba(76,92,247,0);
53
+ transition:transform .35s var(--ease),box-shadow .35s var(--ease),background-position .9s var(--ease)}
54
+ .sl-site::before{content:"";width:8px;height:8px;border-radius:50%;background:#9be7a6;animation:sl-pulse 1.8s ease-out infinite}
55
+ .sl-site::after{content:"→";display:inline-block;transition:transform .35s var(--ease)}
56
+ .sl-site span{font-weight:500;padding-right:10px;border-right:1px solid rgba(255,255,255,.4)}
57
+ .sl-site:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(58,70,245,.38);background-position:-30% 0,0 0}
58
+ .sl-site:hover::after{transform:translateX(4px)}
59
+
60
+ /* ---------- Section headers ---------- */
61
  .sl-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:6px 0 16px;padding-bottom:12px;border-bottom:1px solid rgba(76,92,247,.3)}
62
  .sl-head h2,.sl-head h3{margin:0!important;padding:0;border:0;font-size:1.55rem;font-weight:800;letter-spacing:-.025em;line-height:1.1}
63
+
64
+ /* ---------- Model cards ---------- */
65
  .sl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-bottom:40px}
66
+ .sl-card{position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:180px;padding:22px;border-radius:12px;color:#fff;
67
+ background-color:var(--b2);
68
+ background-image:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.22) 50%,transparent 60%),radial-gradient(120% 90% at 0% 0%,var(--b1) 0%,transparent 60%),radial-gradient(110% 120% at 100% 100%,var(--b3) 0%,transparent 55%);
69
+ background-size:250% 100%,100% 100%,100% 100%;
70
+ background-position:130% 0,0 0,0 0;
71
+ background-repeat:no-repeat;
72
+ box-shadow:inset 0 0 0 1.5px rgba(255,255,255,0),0 0 0 rgba(58,70,245,0);
73
+ transition:transform .35s var(--ease),box-shadow .35s var(--ease),background-position .9s var(--ease);
74
+ animation:sl-rise .6s var(--ease) both}
75
+ .sl-grid .sl-card:nth-child(2){animation-delay:.08s}
76
+ .sl-grid .sl-card:nth-child(3){animation-delay:.16s}
77
+ .sl-grid .sl-card:nth-child(4){animation-delay:.24s}
78
+ .sl-grid .sl-card:nth-child(5){animation-delay:.32s}
79
+ .sl-card:hover{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55),0 14px 34px rgba(58,70,245,.38);background-position:-30% 0,0 0,0 0}
80
+ .sl-card{isolation:isolate}
81
+
82
+ /* Flagship */
83
  .sl-flag{grid-column:1/-1;min-height:200px}
84
  .sl-flag h3{font-size:1.7rem!important}
85
+ .sl-flag .sl-tag::before{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#9be7a6;vertical-align:middle;animation:sl-blink 1.4s ease-in-out infinite}
86
+
87
+ .sl-tag{align-self:flex-start;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.8;transition:letter-spacing .35s var(--ease),opacity .35s ease}
88
+ .sl-card:hover .sl-tag{letter-spacing:.14em;opacity:1}
89
  .sl-card h3{margin:16px 0 6px!important;font-size:1.18rem;font-weight:800;letter-spacing:-.02em;line-height:1.2;border:0}
90
  .sl-card h3 a{color:#fff!important}
91
  .sl-card p{margin:0 0 18px!important;font-size:.92rem;line-height:1.5;color:rgba(255,255,255,.86)}
92
+
93
+ /* ---------- Buttons ---------- */
94
  .sl-actions{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px}
95
+ .sl-btn{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:700;padding:8px 14px;border-radius:999px;line-height:1;transition:background .2s ease,color .2s ease,transform .2s var(--ease),box-shadow .2s ease}
96
+ .sl-btn::after{content:"→";display:inline-block;max-width:0;opacity:0;overflow:hidden;transition:max-width .25s var(--ease),opacity .2s ease,transform .25s var(--ease)}
97
+ .sl-btn:hover{transform:translateY(-1px)}
98
+ .sl-btn:hover::after{max-width:14px;opacity:1;transform:translateX(2px)}
99
  .sl-pri{background:#fff;color:var(--b1)!important}
100
+ .sl-pri:hover{background:rgba(255,255,255,.92);box-shadow:0 6px 16px rgba(0,0,0,.18)}
101
  .sl-sec{border:1px solid rgba(255,255,255,.6);color:#fff!important}
102
+ .sl-sec:hover{background:rgba(255,255,255,.18);border-color:#fff}
103
+
104
+ /* ---------- Catalog card ---------- */
105
+ .sl-alt{background-color:transparent;background-image:linear-gradient(110deg,transparent 40%,rgba(76,92,247,.14) 50%,transparent 60%);background-size:250% 100%;background-position:130% 0;color:inherit;border:1.5px dashed rgba(76,92,247,.55);transition:transform .35s var(--ease),box-shadow .35s var(--ease),background-position .9s var(--ease),border-color .3s ease}
106
+ .sl-alt:hover{border-style:solid;border-color:var(--b2);background-position:-30% 0;box-shadow:inset 0 0 0 1px rgba(76,92,247,.35),0 14px 34px rgba(76,92,247,.18)}
107
  .sl-alt .sl-tag{color:var(--b2)}
108
  .sl-alt h3 a{color:var(--b2)!important}
109
  .sl-alt p{color:inherit;opacity:.75}
110
  .sl-alt .sl-pri{background:var(--b2);color:#fff!important}
111
+ .sl-alt .sl-pri:hover{background:var(--b1);box-shadow:0 6px 16px rgba(76,92,247,.35)}
112
+
113
+ /* ---------- Team ---------- */
114
  .sl-team{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin-bottom:28px}
115
+ .sl-member{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;border:1px solid rgba(76,92,247,.28);color:inherit!important;
116
+ background-image:linear-gradient(90deg,rgba(76,92,247,.14),rgba(111,127,255,.04));background-size:0% 100%;background-repeat:no-repeat;
117
+ transition:border-color .25s ease,background-size .45s var(--ease),transform .3s var(--ease),box-shadow .3s ease}
118
+ .sl-member:hover{border-color:var(--b2);background-size:100% 100%;box-shadow:0 10px 24px rgba(76,92,247,.2)}
119
+ .sl-member img{width:56px;height:56px;flex:0 0 56px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 0 0 2px var(--b2);transition:transform .4s var(--ease)}
120
+ .sl-member:hover img{transform:scale(1.08);animation:sl-avatar 1.2s ease-out infinite}
121
+ .sl-name{display:block;font-weight:800;font-size:1rem;letter-spacing:-.01em;line-height:1.2;transition:color .25s ease}
122
+ .sl-member:hover .sl-name{color:var(--b2)}
123
+ .sl-role{display:block;margin-top:3px;font-size:.78rem;opacity:.7;line-height:1.3;transition:opacity .25s ease,transform .3s var(--ease)}
124
+ .sl-member:hover .sl-role{opacity:1;transform:translateX(3px)}
125
+
126
+ /* ---------- Galaxy: decorative rings + planets on invisible random orbits ---------- */
127
+ /* Orbits use long linear transitions (HF strips @keyframes): they spin while hovered and freeze when the mouse leaves. */
128
+ .sl-gx{position:absolute;z-index:-1;right:25px;top:25px;width:0;height:0;pointer-events:none;--r1:75px;--r2:45px}
129
+ .sl-flag .sl-gx{right:60px;top:40px;--r1:130px;--r2:85px}
130
+ .sl-ring{position:absolute;left:0;top:0;width:calc(var(--r1) * 2);height:calc(var(--r1) * 2);transform:translate(-50%,-50%);border-radius:50%;border:1.5px solid rgba(255,255,255,.22);transition:width .6s var(--ease),height .6s var(--ease),border-color .4s ease}
131
+ .sl-ring2{width:calc(var(--r2) * 2);height:calc(var(--r2) * 2);border-color:rgba(255,255,255,.14)}
132
+ .sl-card:hover .sl-ring{width:calc(var(--r1) * 2.4);height:calc(var(--r1) * 2.4);border-color:rgba(255,255,255,.35)}
133
+ .sl-card:hover .sl-ring2{width:calc(var(--r2) * 2.4);height:calc(var(--r2) * 2.4);border-color:rgba(255,255,255,.25)}
134
+
135
+ .sl-sys{position:absolute;left:0;top:0;width:0;height:0}
136
+ .sl-sys i{position:absolute;left:0;top:0;width:0;height:0;transform:rotate(calc(var(--a) * 1deg));transition:transform 9999999s linear}
137
+ .sl-card:hover .sl-sys i{transform:rotate(calc(var(--t) * 1deg));transition:transform 3600s linear}
138
+ .sl-sys b{position:absolute;left:0;top:0;width:0;height:0;transform:translateX(calc(var(--r1) * var(--f)));transition:transform .6s var(--ease)}
139
+ .sl-card:hover .sl-sys b{transform:translateX(calc(var(--r1) * var(--f) * 1.2))}
140
+ .sl-sys b::before{content:"";position:absolute;left:0;top:0;width:var(--s);height:var(--s);margin:calc(var(--s) / -2) 0 0 calc(var(--s) / -2);border-radius:50%;background:#fff;opacity:var(--o);box-shadow:0 0 calc(var(--s) * 1.6) rgba(255,255,255,.55)}
141
+ .sl-sys i:nth-child(1){--a:9.0;--t:37338.7;--sa:239;--st:420858.3;--f:0.721;--s:3.4px;--z:6.8px;--o:0.51}
142
+ .sl-sys i:nth-child(2){--a:134.5;--t:29108.2;--sa:103;--st:393950.6;--f:1.095;--s:1.9px;--z:11.3px;--o:0.55}
143
+ .sl-sys i:nth-child(3){--a:270.1;--t:30831.0;--sa:128;--st:-378851.6;--f:1.069;--s:2.3px;--z:11.2px;--o:0.42}
144
+ .sl-sys i:nth-child(4){--a:58.9;--t:31779.6;--sa:326;--st:-416640.3;--f:1.023;--s:3.6px;--z:5.3px;--o:0.61}
145
+ .sl-sys i:nth-child(5){--a:188.3;--t:47095.6;--sa:236;--st:-99339.4;--f:0.562;--s:2.9px;--z:9.3px;--o:0.68}
146
+ .sl-sys i:nth-child(6){--a:329.7;--t:39211.3;--sa:145;--st:103477.4;--f:0.995;--s:3.2px;--z:8.3px;--o:0.58}
147
+ .sl-sys i:nth-child(7){--a:98.9;--t:28746.7;--sa:47;--st:217817.3;--f:1.134;--s:2.6px;--z:5.7px;--o:0.68}
148
+ .sl-sys i:nth-child(8){--a:239.4;--t:47805.7;--sa:149;--st:-125919.9;--f:0.768;--s:3.2px;--z:8.0px;--o:0.45}
149
+ .sl-sys i:nth-child(9){--a:16.3;--t:32807.9;--sa:260;--st:116099.5;--f:0.939;--s:3.2px;--z:11.6px;--o:0.76}
150
+ .sl-sys i:nth-child(10){--a:167.9;--t:58855.8;--sa:51;--st:150173.8;--f:0.434;--s:2.2px;--z:5.2px;--o:0.84}
151
+ .sl-sys i:nth-child(11){--a:285.1;--t:33677.0;--sa:12;--st:215696.9;--f:0.922;--s:3.3px;--z:10.5px;--o:0.63}
152
+ .sl-sys i:nth-child(12){--a:69.3;--t:34375.2;--sa:120;--st:239746.6;--f:0.868;--s:4.4px;--z:10.8px;--o:0.73}
153
+ .sl-sys i:nth-child(13){--a:201.7;--t:90710.7;--sa:73;--st:-382518.8;--f:0.306;--s:1.9px;--z:11.1px;--o:0.73}
154
+ .sl-sys i:nth-child(14){--a:345.5;--t:26619.8;--sa:3;--st:418569.1;--f:1.152;--s:4.3px;--z:10.9px;--o:0.45}
155
+ .sl-sys i:nth-child(15){--a:133.5;--t:26139.7;--sa:271;--st:249675.6;--f:1.182;--s:2.3px;--z:5.6px;--o:0.41}
156
+ .sl-sys i:nth-child(16){--a:269.8;--t:37137.4;--sa:307;--st:470045.1;--f:0.687;--s:3.3px;--z:11.5px;--o:0.52}
157
+ .sl-sys i:nth-child(17){--a:44.8;--t:43544.8;--sa:128;--st:-99797.3;--f:0.602;--s:1.9px;--z:11.2px;--o:0.61}
158
+ .sl-sys i:nth-child(18){--a:187.5;--t:40566.1;--sa:317;--st:312826.9;--f:0.826;--s:1.9px;--z:11.8px;--o:0.45}
159
+ .sl-sys i:nth-child(19){--a:311.0;--t:54127.4;--sa:341;--st:-219216.0;--f:0.635;--s:3.2px;--z:6.4px;--o:0.73}
160
+ .sl-sys i:nth-child(20){--a:102.1;--t:32084.8;--sa:306;--st:349279.6;--f:1.157;--s:3.9px;--z:6.8px;--o:0.94}
161
+ .sl-sys i:nth-child(21){--a:228.3;--t:40355.3;--sa:10;--st:157306.3;--f:0.953;--s:3.3px;--z:10.8px;--o:0.81}
162
+ .sl-sys i:nth-child(22){--a:3.9;--t:28580.3;--sa:345;--st:494900.4;--f:1.032;--s:3.0px;--z:5.6px;--o:0.64}
163
+ .sl-sys i:nth-child(23){--a:148.1;--t:39101.8;--sa:280;--st:-100541.5;--f:0.815;--s:4.4px;--z:6.1px;--o:0.89}
164
+ .sl-sys i:nth-child(24){--a:291.6;--t:29617.5;--sa:341;--st:-473911.4;--f:1.185;--s:2.1px;--z:10.6px;--o:0.66}
165
+ .sl-sys i:nth-child(25){--a:67.7;--t:87183.4;--sa:201;--st:-165397.6;--f:0.325;--s:2.2px;--z:8.9px;--o:0.9}
166
+ .sl-sys i:nth-child(26){--a:194.4;--t:35266.5;--sa:183;--st:-304455.2;--f:1.095;--s:2.5px;--z:8.8px;--o:0.89}
167
+ .sl-sys i:nth-child(27){--a:337.9;--t:37965.5;--sa:28;--st:395398.5;--f:0.883;--s:3.3px;--z:10.5px;--o:0.79}
168
+ .sl-sys i:nth-child(28){--a:124.3;--t:27400.6;--sa:181;--st:441898.3;--f:1.128;--s:2.2px;--z:5.8px;--o:0.42}
169
+ .sl-sys i:nth-child(29){--a:257.4;--t:42881.7;--sa:63;--st:268207.7;--f:0.561;--s:1.9px;--z:6.2px;--o:0.41}
170
+ .sl-sys i:nth-child(30){--a:23.5;--t:42333.0;--sa:134;--st:467346.4;--f:0.792;--s:2.6px;--z:8.2px;--o:0.83}
171
+ .sl-sys i:nth-child(31){--a:160.1;--t:60008.8;--sa:197;--st:123676.6;--f:0.429;--s:3.1px;--z:7.8px;--o:0.68}
172
+ .sl-sys i:nth-child(32){--a:301.4;--t:34190.1;--sa:108;--st:-464307.5;--f:1.063;--s:3.1px;--z:6.8px;--o:0.64}
173
+ .sl-sys i:nth-child(33){--a:80.4;--t:30941.1;--sa:88;--st:-486769.1;--f:0.925;--s:3.9px;--z:11.8px;--o:0.93}
174
+ .sl-sys i:nth-child(34){--a:221.7;--t:39617.8;--sa:133;--st:-425551.7;--f:0.687;--s:2.3px;--z:9.9px;--o:0.67}
175
+ .sl-sys i:nth-child(35){--a:348.6;--t:50481.1;--sa:138;--st:-397341.1;--f:0.712;--s:1.9px;--z:6.8px;--o:0.64}
176
+ .sl-sys i:nth-child(36){--a:129.5;--t:26479.9;--sa:68;--st:452510.9;--f:0.987;--s:2.5px;--z:7.8px;--o:0.82}
177
+ .sl-grid>.sl-card:nth-child(1) .sl-sys{transform:rotate(137deg)}
178
+ .sl-grid>.sl-card:nth-child(2) .sl-sys{transform:rotate(113deg)}
179
+ .sl-grid>.sl-card:nth-child(3) .sl-sys{transform:rotate(83deg)}
180
+ .sl-grid>.sl-card:nth-child(4) .sl-sys{transform:rotate(168deg)}
181
+ .sl-grid>.sl-card:nth-child(5) .sl-sys{transform:rotate(181deg)}
182
+
183
+ /* Speech / Image: the planets themselves are icons (each also spins on itself at its own speed) */
184
+ .sl-mic .sl-sys b::before,.sl-imgc .sl-sys b::before{width:var(--z);height:var(--z);margin:calc(var(--z) / -2) 0 0 calc(var(--z) / -2);border-radius:0;background:center/contain no-repeat;box-shadow:none;filter:drop-shadow(0 0 3px rgba(255,255,255,.5));transform:rotate(calc(var(--sa) * 1deg));transition:transform 9999999s linear}
185
+ .sl-mic:hover .sl-sys b::before,.sl-imgc:hover .sl-sys b::before{transform:rotate(calc(var(--st) * 1deg));transition:transform 3600s linear}
186
+ .sl-mic .sl-sys b::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='2' width='6' height='12' rx='3'/%3E%3Cpath d='M5 10v1a7 7 0 0 0 14 0v-1M12 18v4M8 22h8'/%3E%3C/svg%3E")}
187
+ .sl-imgc .sl-sys b::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='3'/%3E%3Ccircle cx='9' cy='9' r='2'/%3E%3Cpath d='M21 15l-5-5L5 21'/%3E%3C/svg%3E")}
188
+
189
+ /* Catalog: blue galaxy */
190
+ .sl-alt .sl-ring{border-color:rgba(76,92,247,.2)}
191
+ .sl-alt:hover .sl-ring{border-color:rgba(76,92,247,.35)}
192
+ .sl-alt .sl-sys b::before{background:var(--b2);box-shadow:0 0 calc(var(--s) * 1.6) rgba(76,92,247,.45)}
193
+
194
  @media (max-width:640px){.sl-card{padding:18px;min-height:0}.sl-flag h3{font-size:1.35rem!important}.sl-head h2,.sl-head h3{font-size:1.3rem}}
195
+ @media (prefers-reduced-motion:reduce){.sl *,.sl-site,.sl-site::before{animation:none!important;transition:none!important}}
196
  </style>
197
  <div class="sl">
198
  <div class="sl-head">
 
200
  </div>
201
  <div class="sl-grid">
202
  <div class="sl-card sl-flag">
203
+ <span class="sl-gx"><span class="sl-ring"></span><span class="sl-ring sl-ring2"></span><span class="sl-sys"><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i></span></span>
204
  <span class="sl-tag">Flagship</span>
205
  <h3><a href="https://huggingface.co/SupraLabs/Supra2-100M-Instruct" target="_blank">Supra2-100M-Instruct</a></h3>
206
  <p>Latest Instruction-tuned flagship model.</p>
 
209
  <a class="sl-btn sl-sec" href="https://huggingface.co/spaces/Axionlab-official/Supra2-100M-Instruct-Demo">Demo</a>
210
  </div>
211
  </div>
212
+ <div class="sl-card sl-mic">
213
+ <span class="sl-gx"><span class="sl-ring"></span><span class="sl-ring sl-ring2"></span><span class="sl-sys"><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i></span></span>
214
  <span class="sl-tag">Speech</span>
215
+ <h3><a href="https://huggingface.co/SupraLabs/SupraTTS-1.0-Preview" target="_blank">SupraTTS-1.0-Preview</a></h3>
216
  <p>Text to Speech Model.</p>
217
  <div class="sl-actions">
218
+ <a class="sl-btn sl-pri" href="https://huggingface.co/SupraLabs/SupraTTS-1.0-Preview">View model</a>
 
219
  </div>
220
  </div>
221
+ <div class="sl-card sl-imgc">
222
+ <span class="sl-gx"><span class="sl-ring"></span><span class="sl-ring sl-ring2"></span><span class="sl-sys"><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i></span></span>
223
  <span class="sl-tag">Image</span>
224
  <h3><a href="https://huggingface.co/SupraLabs/Supra2-IMG" target="_blank">Supra2-IMG</a></h3>
225
  <p>Text to Image Model.</p>
 
229
  </div>
230
  </div>
231
  <div class="sl-card">
232
+ <span class="sl-gx"><span class="sl-ring"></span><span class="sl-ring sl-ring2"></span><span class="sl-sys"><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i></span></span>
233
+ <span class="sl-tag">Tiny</span>
234
+ <h3><a href="https://huggingface.co/SupraLabs/SupraNeo-4M" target="_blank">SupraNeo-4M</a></h3>
235
+ <p>Tiny 4M base language model.</p>
236
  <div class="sl-actions">
237
+ <a class="sl-btn sl-pri" href="https://huggingface.co/SupraLabs/SupraNeo-4M">View model</a>
238
  </div>
239
  </div>
240
  <div class="sl-card sl-alt">
241
+ <span class="sl-gx"><span class="sl-ring"></span><span class="sl-ring sl-ring2"></span><span class="sl-sys"><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i><i><b></b></i></span></span>
242
  <span class="sl-tag">Catalog</span>
243
  <h3><a href="https://huggingface.co/SupraLabs/models" target="_blank">All Models from SupraLabs</a></h3>
244
  <p>View all the AI models from SupraLabs.</p>
 
263
  <img src="https://cdn-avatars.huggingface.co/v1/production/uploads/685ea8ff7b4139b6845ce395/Im--QSnbrnAhHPPhpX8L0.png" alt="Dedeprogames"/>
264
  <span><span class="sl-name">Dedeprogames</span><span class="sl-role">Contributor 1</span></span>
265
  </a>
266
+ <a class="sl-member" href="https://huggingface.co/arthurblg1802" target="_blank">
267
+ <img src="https://huggingface.co/avatars/c026de3d230e5068ef1822d6150c4736.svg" alt="Arthurblg1802"/>
268
+ <span><span class="sl-name">Arthurblg1802</span><span class="sl-role">Contributor 2 (TTS guy)</span></span>
269
+ </a>
270
  </div>
271
  </div>
272