@rovula/ui 0.0.81 → 0.0.82

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1114,1324 +1114,248 @@
1114
1114
  --switch-disabled-color: rgb(from var(--state-color-disable-solid) r g b / 0.32);
1115
1115
  --switch-thumb-disabled-color: var(--state-color-disable-solid)
1116
1116
  ;
1117
- /* COLOR PROJECT */
1118
- --main-primary-xspector: #ddcd00;
1119
- --main-primary-report-xspector-light-mode: #1e3249;
1120
- --main-primary-skyller: #2563eb;
1121
- --main-secondary-xspector: #9e9e9e;
1122
- --main-secondary-report-xspector-light-mode: #ddcd00;
1123
- --main-secondary-skyller: #60a5fa;
1124
- --main-tertiary-xspector: #adcad6;
1125
- --main-tertiary-report-xspector-light-mode: #9e9e9e;
1126
- --main-tertiary-skyller: #0891b2;
1127
- --brand-midnight-blue-xspector: #002038;
1128
- --brand-midnight-blue-report-xspector-light-mode: #002038;
1129
- --brand-midnight-blue-skyller: #2563eb;
1130
- --brand-columbia-blue-xspector: #adcad6;
1131
- --brand-columbia-blue-report-xspector-light-mode: #adcad6;
1132
- --brand-columbia-blue-skyller: #0891b2;
1133
- --brand-backgroud-xspector: #1e3249;
1134
- --brand-backgroud-report-xspector-light-mode: #1e3249;
1135
- --brand-backgroud-skyller: #60a5fa;
1136
- --brand-lemon-glacier-xspector: #f5ff00;
1137
- --brand-lemon-glacier-report-xspector-light-mode: #f5ff00;
1138
- --brand-lemon-glacier-skyller: #fde68a;
1139
- --text-black-xspector: #000000;
1140
- --text-black-report-xspector-light-mode: #000000;
1141
- --text-black-skyller: #000000;
1142
- --text-dark-xspector: #212b36;
1143
- --text-dark-report-xspector-light-mode: #18283a;
1144
- --text-dark-skyller: #a3a3a3;
1145
- --text-medium-xspector: #637381;
1146
- --text-medium-report-xspector-light-mode: #4b5b6d;
1147
- --text-medium-skyller: #737373;
1148
- --text-light-xspector: #919eab;
1149
- --text-light-report-xspector-light-mode: #8e98a4;
1150
- --text-light-skyller: #171717;
1151
- --text-grey-dark-xspector: #7e7e7e;
1152
- --text-grey-dark-report-xspector-light-mode: #4f4f4f;
1153
- --text-grey-dark-skyller: #a3a3a3;
1154
- --text-grey-medium-xspector: #aaaaaa;
1155
- --text-grey-medium-report-xspector-light-mode: #7e7e7e;
1156
- --text-grey-medium-skyller: #737373;
1157
- --text-grey-light-xspector: #dfe3e8;
1158
- --text-grey-light-report-xspector-light-mode: #9e9e9e;
1159
- --text-grey-light-skyller: #171717;
1160
- --text-white-xspector: #ffffff;
1161
- --text-white-report-xspector-light-mode: #7e7e7e;
1162
- --text-white-skyller: #171717;
1163
- --state-primary-default-xspector: #b1a400;
1164
- --state-primary-default-report-xspector-light-mode: #1e3249;
1165
- --state-primary-default-skyller: #2563eb;
1166
- --state-primary-hover-xspector: #ddcd00;
1167
- --state-primary-hover-report-xspector-light-mode: #35475b;
1168
- --state-primary-hover-skyller: #6692f1;
1169
- --state-primary-stroke-xspector: rgba(177 164 0 / 0.48);
1170
- --state-primary-stroke-report-xspector-light-mode: rgba(30 50 73 / 0.64);
1171
- --state-primary-stroke-skyller: rgba(189 189 189 / 0.64);
1172
- --state-primary-hover-bg-xspector: rgba(221 205 0 / 0.08);
1173
- --state-primary-hover-bg-report-xspector-light-mode: rgba(30 50 73 / 0.08);
1174
- --state-primary-hover-bg-skyller: rgba(102 146 241 / 0.08);
1175
- --state-primary-pressed-xspector: #6f6700;
1176
- --state-primary-pressed-report-xspector-light-mode: #152333;
1177
- --state-primary-pressed-skyller: #1e40af;
1178
- --state-primary-active-xspector: #ddcd00;
1179
- --state-primary-active-report-xspector-light-mode: #35475b;
1180
- --state-primary-active-skyller: #1e3a8a;
1181
- --state-primary-text-solid-xspector: #212b36;
1182
- --state-primary-text-solid-report-xspector-light-mode: #ffffff;
1183
- --state-primary-text-solid-skyller: #ffffff;
1184
- --state-primary-text-outline-xspector: #b1a400;
1185
- --state-primary-text-outline-report-xspector-light-mode: #1e3249;
1186
- --state-primary-text-outline-skyller: #2563eb;
1187
- --state-primary-text-hover-xspector: #ddcd00;
1188
- --state-primary-text-hover-report-xspector-light-mode: #35475b;
1189
- --state-primary-text-hover-skyller: #6692f1;
1190
- --state-primary-text-pressed-xspector: #6f6700;
1191
- --state-primary-text-pressed-report-xspector-light-mode: #152333;
1192
- --state-primary-text-pressed-skyller: #1e40af;
1193
- --state-secondary-default-xspector: #ececec;
1194
- --state-secondary-default-report-xspector-light-mode: #9b8f00;
1195
- --state-secondary-default-skyller: #60a5fa;
1196
- --state-secondary-hover-xspector: #fafafa;
1197
- --state-secondary-hover-report-xspector-light-mode: #b1a400;
1198
- --state-secondary-hover-skyller: #90c0fc;
1199
- --state-secondary-stroke-xspector: rgba(236 236 236 / 0.48);
1200
- --state-secondary-stroke-report-xspector-light-mode: rgba(155 143 0 / 0.64);
1201
- --state-secondary-stroke-skyller: rgba(189 189 189 / 0.64);
1202
- --state-secondary-hover-bg-xspector: rgba(250 250 250 / 0.08);
1203
- --state-secondary-hover-bg-report-xspector-light-mode: rgba(221 205 0 / 0.08);
1204
- --state-secondary-hover-bg-skyller: rgba(144 192 252 / 0.08);
1205
- --state-secondary-pressed-xspector: #bbbbbb;
1206
- --state-secondary-pressed-report-xspector-light-mode: #6f6700;
1207
- --state-secondary-pressed-skyller: #1e40af;
1208
- --state-secondary-active-xspector: #fafafa;
1209
- --state-secondary-active-report-xspector-light-mode: #b1a400;
1210
- --state-secondary-active-skyller: #1e3a8a;
1211
- --state-secondary-text-solid-xspector: #212b36;
1212
- --state-secondary-text-solid-report-xspector-light-mode: #ffffff;
1213
- --state-secondary-text-solid-skyller: #ffffff;
1214
- --state-secondary-text-outline-xspector: #ececec;
1215
- --state-secondary-text-outline-report-xspector-light-mode: #9b8f00;
1216
- --state-secondary-text-outline-skyller: #60a5fa;
1217
- --state-secondary-text-hover-xspector: #fafafa;
1218
- --state-secondary-text-hover-report-xspector-light-mode: #b1a400;
1219
- --state-secondary-text-hover-skyller: #90c0fc;
1220
- --state-secondary-text-pressed-xspector: #c5c5c5;
1221
- --state-secondary-text-pressed-report-xspector-light-mode: #6f6700;
1222
- --state-secondary-text-pressed-skyller: #1e40af;
1223
- --state-tertiery-default-xspector: #8aa2ab;
1224
- --state-tertiery-default-report-xspector-light-mode: #4f4f4f;
1225
- --state-tertiery-default-skyller: #0891b2;
1226
- --state-tertiery-hover-xspector: #adcad6;
1227
- --state-tertiery-hover-report-xspector-light-mode: #6f6f6f;
1228
- --state-tertiery-hover-skyller: #52b2c9;
1229
- --state-tertiery-stroke-xspector: rgba(138 162 171 / 0.48);
1230
- --state-tertiery-stroke-report-xspector-light-mode: rgba(79 79 79 / 0.48);
1231
- --state-tertiery-stroke-skyller: rgba(8 145 178 / 0.48);
1232
- --state-tertiery-hover-bg-xspector: rgba(173 202 214 / 0.08);
1233
- --state-tertiery-hover-bg-report-xspector-light-mode: rgba(158 158 158 / 0.08);
1234
- --state-tertiery-hover-bg-skyller: rgba(82 178 201 / 0.08);
1235
- --state-tertiery-pressed-xspector: #57656b;
1236
- --state-tertiery-pressed-report-xspector-light-mode: #b1b1b1;
1237
- --state-tertiery-pressed-skyller: #06667d;
1238
- --state-tertiery-active-xspector: #adcad6;
1239
- --state-tertiery-active-report-xspector-light-mode: #6f6f6f;
1240
- --state-tertiery-active-skyller: #044959;
1241
- --state-tertiery-text-solid-xspector: #212b36;
1242
- --state-tertiery-text-solid-report-xspector-light-mode: #ffffff;
1243
- --state-tertiery-text-solid-skyller: #ffffff;
1244
- --state-tertiery-text-outline-xspector: #8aa2ab;
1245
- --state-tertiery-text-outline-report-xspector-light-mode: #4f4f4f;
1246
- --state-tertiery-text-outline-skyller: #0891b2;
1247
- --state-tertiery-text-hover-xspector: #adcad6;
1248
- --state-tertiery-text-hover-report-xspector-light-mode: #6f6f6f;
1249
- --state-tertiery-text-hover-skyller: #52b2c9;
1250
- --state-tertiery-text-pressed-xspector: #57656b;
1251
- --state-tertiery-text-pressed-report-xspector-light-mode: #b1b1b1;
1252
- --state-tertiery-text-pressed-skyller: #06667d;
1253
- --state-info-default-xspector: #1b7df5;
1254
- --state-info-default-report-xspector-light-mode: #1b7df5;
1255
- --state-info-default-skyller: #2563eb;
1256
- --state-info-hover-xspector: #2998ff;
1257
- --state-info-hover-report-xspector-light-mode: #2998ff;
1258
- --state-info-hover-skyller: #6692f1;
1259
- --state-info-stroke-xspector: rgba(27 125 245 / 0.48);
1260
- --state-info-stroke-report-xspector-light-mode: rgba(41 152 255 / 0.48);
1261
- --state-info-stroke-skyller: rgba(37 99 235 / 0.48);
1262
- --state-info-hover-bg-xspector: rgba(41 152 255 / 0.08);
1263
- --state-info-hover-bg-report-xspector-light-mode: rgba(41 152 255 / 0.08);
1264
- --state-info-hover-bg-skyller: rgba(102 146 241 / 0.08);
1265
- --state-info-pressed-xspector: #1752b6;
1266
- --state-info-pressed-report-xspector-light-mode: #1752b6;
1267
- --state-info-pressed-skyller: #1e40af;
1268
- --state-info-active-xspector: #2998ff;
1269
- --state-info-active-report-xspector-light-mode: #2998ff;
1270
- --state-info-active-skyller: #1e3a8a;
1271
- --state-info-text-solid-xspector: #ffffff;
1272
- --state-info-text-solid-report-xspector-light-mode: #ffffff;
1273
- --state-info-text-solid-skyller: #ffffff;
1274
- --state-info-text-outline-xspector: #1b7df5;
1275
- --state-info-text-outline-report-xspector-light-mode: #1b7df5;
1276
- --state-info-text-outline-skyller: #2563eb;
1277
- --state-info-text-hover-xspector: #2998ff;
1278
- --state-info-text-hover-report-xspector-light-mode: #2998ff;
1279
- --state-info-text-hover-skyller: #6692f1;
1280
- --state-info-text-pressed-xspector: #1752b6;
1281
- --state-info-text-pressed-report-xspector-light-mode: #1752b6;
1282
- --state-info-text-pressed-skyller: #1e40af;
1283
- --state-success-default-xspector: #44c022;
1284
- --state-success-default-report-xspector-light-mode: #44c022;
1285
- --state-success-default-skyller: #16a34a;
1286
- --state-success-hover-xspector: #54d62c;
1287
- --state-success-hover-report-xspector-light-mode: #54d62c;
1288
- --state-success-hover-skyller: #4ade80;
1289
- --state-success-stroke-xspector: rgba(49 153 23 / 0.48);
1290
- --state-success-stroke-report-xspector-light-mode: rgba(68 192 34 / 0.48);
1291
- --state-success-stroke-skyller: rgba(22 163 74 / 0.48);
1292
- --state-success-hover-bg-xspector: rgba(84 214 44 / 0.08);
1293
- --state-success-hover-bg-report-xspector-light-mode: rgba(84 214 44 / 0.08);
1294
- --state-success-hover-bg-skyller: rgba(74 222 128 / 0.08);
1295
- --state-success-pressed-xspector: #235d17;
1296
- --state-success-pressed-report-xspector-light-mode: #235d17;
1297
- --state-success-pressed-skyller: #166534;
1298
- --state-success-active-xspector: #44c022;
1299
- --state-success-active-report-xspector-light-mode: #44c022;
1300
- --state-success-active-skyller: #14532d;
1301
- --state-success-text-solid-xspector: #ffffff;
1302
- --state-success-text-solid-report-xspector-light-mode: #ffffff;
1303
- --state-success-text-solid-skyller: #ffffff;
1304
- --state-success-text-outline-xspector: #44c022;
1305
- --state-success-text-outline-report-xspector-light-mode: #44c022;
1306
- --state-success-text-outline-skyller: #16a34a;
1307
- --state-success-text-hover-xspector: #54d62c;
1308
- --state-success-text-hover-report-xspector-light-mode: #54d62c;
1309
- --state-success-text-hover-skyller: #4ade80;
1310
- --state-success-text-pressed-xspector: #235d17;
1311
- --state-success-text-pressed-report-xspector-light-mode: #235d17;
1312
- --state-success-text-pressed-skyller: #166534;
1313
- --state-warning-default-xspector: #ffc107;
1314
- --state-warning-default-report-xspector-light-mode: #ffc107;
1315
- --state-warning-default-skyller: #fbbf24;
1316
- --state-warning-hover-xspector: #ffdf1b;
1317
- --state-warning-hover-report-xspector-light-mode: #ffdf1b;
1318
- --state-warning-hover-skyller: #fde68a;
1319
- --state-warning-stroke-xspector: rgba(255 193 7 / 0.48);
1320
- --state-warning-stroke-report-xspector-light-mode: rgba(255 223 27 / 0.48);
1321
- --state-warning-stroke-skyller: rgba(251 191 36 / 0.48);
1322
- --state-warning-hover-bg-xspector: rgba(255 193 7 / 0.08);
1323
- --state-warning-hover-bg-report-xspector-light-mode: rgba(255 193 7 / 0.08);
1324
- --state-warning-hover-bg-skyller: rgba(253 230 138 / 0.08);
1325
- --state-warning-pressed-xspector: #985108;
1326
- --state-warning-pressed-report-xspector-light-mode: #985108;
1327
- --state-warning-pressed-skyller: #f59e0b;
1328
- --state-warning-active-xspector: #ffc107;
1329
- --state-warning-active-report-xspector-light-mode: #ffc107;
1330
- --state-warning-active-skyller: #d97706;
1331
- --state-warning-text-solid-xspector: #212b36;
1332
- --state-warning-text-solid-report-xspector-light-mode: #ffffff;
1333
- --state-warning-text-solid-skyller: #ffffff;
1334
- --state-warning-text-outline-xspector: #ffc107;
1335
- --state-warning-text-outline-report-xspector-light-mode: #ffc107;
1336
- --state-warning-text-outline-skyller: #fbbf24;
1337
- --state-warning-text-hover-xspector: #ffdf1b;
1338
- --state-warning-text-hover-report-xspector-light-mode: #ffdf1b;
1339
- --state-warning-text-hover-skyller: #fde68a;
1340
- --state-warning-text-pressed-xspector: #985108;
1341
- --state-warning-text-pressed-report-xspector-light-mode: #985108;
1342
- --state-warning-text-pressed-skyller: #f59e0b;
1343
- --state-error-default-xspector: #ff4d35;
1344
- --state-error-default-report-xspector-light-mode: #ed2f15;
1345
- --state-error-default-skyller: #ef4444;
1346
- --state-error-hover-xspector: #f87171;
1347
- --state-error-hover-report-xspector-light-mode: #ff4d35;
1348
- --state-error-hover-skyller: #f87171;
1349
- --state-error-stroke-xspector: rgba(255 77 53 / 0.48);
1350
- --state-error-stroke-report-xspector-light-mode: rgba(237 47 21 / 0.64);
1351
- --state-error-stroke-skyller: rgba(220 38 38 / 0.64);
1352
- --state-error-hover-bg-xspector: rgba(248 113 113 / 0.08);
1353
- --state-error-hover-bg-report-xspector-light-mode: rgba(255 77 53 / 0.08);
1354
- --state-error-hover-bg-skyller: rgba(248 113 113 / 0.08);
1355
- --state-error-pressed-xspector: #a5210f;
1356
- --state-error-pressed-report-xspector-light-mode: #a5210f;
1357
- --state-error-pressed-skyller: #991b1b;
1358
- --state-error-active-xspector: #ff4d35;
1359
- --state-error-active-report-xspector-light-mode: #ff4d35;
1360
- --state-error-active-skyller: #7f1d1d;
1361
- --state-error-text-solid-xspector: #ffffff;
1362
- --state-error-text-solid-report-xspector-light-mode: #ffffff;
1363
- --state-error-text-solid-skyller: #ffffff;
1364
- --state-error-text-outline-xspector: #ff4d35;
1365
- --state-error-text-outline-report-xspector-light-mode: #ed2f15;
1366
- --state-error-text-outline-skyller: #dc2626;
1367
- --state-error-text-hover-xspector: #f87171;
1368
- --state-error-text-hover-report-xspector-light-mode: #ff4d35;
1369
- --state-error-text-hover-skyller: #f87171;
1370
- --state-error-text-pressed-xspector: #a5210f;
1371
- --state-error-text-pressed-report-xspector-light-mode: #a5210f;
1372
- --state-error-text-pressed-skyller: #991b1b;
1373
- --state-disable-solid-xspector: #454f5b;
1374
- --state-disable-solid-report-xspector-light-mode: #d3dadf;
1375
- --state-disable-solid-skyller: #d4d4d4;
1376
- --state-disable-outline-xspector: #637381;
1377
- --state-disable-outline-report-xspector-light-mode: #9dabb5;
1378
- --state-disable-outline-skyller: #a3a3a3;
1379
- --ramps-primary-5-xspector: #fdfcf2;
1380
- --ramps-primary-5-report-xspector-light-mode: #f4f5f6;
1381
- --ramps-primary-5-skyller: #f4f7fe;
1382
- --ramps-primary-10-xspector: #fcfae5;
1383
- --ramps-primary-10-report-xspector-light-mode: #e8eaed;
1384
- --ramps-primary-10-skyller: #e9effd;
1385
- --ramps-primary-20-xspector: #f8f5cc;
1386
- --ramps-primary-20-report-xspector-light-mode: #d2d6db;
1387
- --ramps-primary-20-skyller: #d3e0fb;
1388
- --ramps-primary-30-xspector: #f5f0b2;
1389
- --ramps-primary-30-report-xspector-light-mode: #bbc1c8;
1390
- --ramps-primary-30-skyller: #bed0f9;
1391
- --ramps-primary-40-xspector: #f1eb99;
1392
- --ramps-primary-40-report-xspector-light-mode: #a5adb6;
1393
- --ramps-primary-40-skyller: #a8c1f7;
1394
- --ramps-primary-50-xspector: #eee680;
1395
- --ramps-primary-50-report-xspector-light-mode: #8e98a4;
1396
- --ramps-primary-50-skyller: #92b1f5;
1397
- --ramps-primary-60-xspector: #ebe166;
1398
- --ramps-primary-60-report-xspector-light-mode: #788492;
1399
- --ramps-primary-60-skyller: #7ca1f3;
1400
- --ramps-primary-70-xspector: #e7dc4d;
1401
- --ramps-primary-70-report-xspector-light-mode: #627080;
1402
- --ramps-primary-70-skyller: #6692f1;
1403
- --ramps-primary-80-xspector: #e4d733;
1404
- --ramps-primary-80-report-xspector-light-mode: #4b5b6d;
1405
- --ramps-primary-80-skyller: #5182ef;
1406
- --ramps-primary-90-xspector: #e0d21a;
1407
- --ramps-primary-90-report-xspector-light-mode: #35475b;
1408
- --ramps-primary-90-skyller: #3b73ed;
1409
- --ramps-primary-100-xspector: #ddcd00;
1410
- --ramps-primary-100-report-xspector-light-mode: #1e3249;
1411
- --ramps-primary-100-skyller: #2563eb;
1412
- --ramps-primary-110-xspector: #c7b800;
1413
- --ramps-primary-110-report-xspector-light-mode: #1b2d42;
1414
- --ramps-primary-110-skyller: #2159d3;
1415
- --ramps-primary-120-xspector: #b1a400;
1416
- --ramps-primary-120-report-xspector-light-mode: #18283a;
1417
- --ramps-primary-120-skyller: #1e4fbc;
1418
- --ramps-primary-130-xspector: #9b8f00;
1419
- --ramps-primary-130-report-xspector-light-mode: #152333;
1420
- --ramps-primary-130-skyller: #1a45a4;
1421
- --ramps-primary-140-xspector: #857b00;
1422
- --ramps-primary-140-report-xspector-light-mode: #121e2c;
1423
- --ramps-primary-140-skyller: #163b8d;
1424
- --ramps-primary-150-xspector: #6f6700;
1425
- --ramps-primary-150-report-xspector-light-mode: #0f1925;
1426
- --ramps-primary-150-skyller: #133276;
1427
- --ramps-secondary-5-xspector: #fafafa;
1428
- --ramps-secondary-5-report-xspector-light-mode: #fdfcf2;
1429
- --ramps-secondary-5-skyller: #f7faff;
1430
- --ramps-secondary-10-xspector: #f5f5f5;
1431
- --ramps-secondary-10-report-xspector-light-mode: #fcfae5;
1432
- --ramps-secondary-10-skyller: #eff6fe;
1433
- --ramps-secondary-20-xspector: #ececec;
1434
- --ramps-secondary-20-report-xspector-light-mode: #f8f5cc;
1435
- --ramps-secondary-20-skyller: #dfedfe;
1436
- --ramps-secondary-30-xspector: #e2e2e2;
1437
- --ramps-secondary-30-report-xspector-light-mode: #f5f0b2;
1438
- --ramps-secondary-30-skyller: #cfe4fd;
1439
- --ramps-secondary-40-xspector: #d8d8d8;
1440
- --ramps-secondary-40-report-xspector-light-mode: #f1eb99;
1441
- --ramps-secondary-40-skyller: #bfdbfd;
1442
- --ramps-secondary-50-xspector: #cfcfcf;
1443
- --ramps-secondary-50-report-xspector-light-mode: #eee680;
1444
- --ramps-secondary-50-skyller: #afd2fd;
1445
- --ramps-secondary-60-xspector: #c5c5c5;
1446
- --ramps-secondary-60-report-xspector-light-mode: #ebe166;
1447
- --ramps-secondary-60-skyller: #a0c9fc;
1448
- --ramps-secondary-70-xspector: #bbbbbb;
1449
- --ramps-secondary-70-report-xspector-light-mode: #e7dc4d;
1450
- --ramps-secondary-70-skyller: #90c0fc;
1451
- --ramps-secondary-80-xspector: #b1b1b1;
1452
- --ramps-secondary-80-report-xspector-light-mode: #e4d733;
1453
- --ramps-secondary-80-skyller: #80b7fb;
1454
- --ramps-secondary-90-xspector: #a8a8a8;
1455
- --ramps-secondary-90-report-xspector-light-mode: #e0d21a;
1456
- --ramps-secondary-90-skyller: #70aefb;
1457
- --ramps-secondary-100-xspector: #9e9e9e;
1458
- --ramps-secondary-100-report-xspector-light-mode: #ddcd00;
1459
- --ramps-secondary-100-skyller: #60a5fa;
1460
- --ramps-secondary-110-xspector: #8e8e8e;
1461
- --ramps-secondary-110-report-xspector-light-mode: #c7b800;
1462
- --ramps-secondary-110-skyller: #5694e1;
1463
- --ramps-secondary-120-xspector: #7e7e7e;
1464
- --ramps-secondary-120-report-xspector-light-mode: #b1a400;
1465
- --ramps-secondary-120-skyller: #4d84c8;
1466
- --ramps-secondary-130-xspector: #6f6f6f;
1467
- --ramps-secondary-130-report-xspector-light-mode: #9b8f00;
1468
- --ramps-secondary-130-skyller: #4374af;
1469
- --ramps-secondary-140-xspector: #5f5f5f;
1470
- --ramps-secondary-140-report-xspector-light-mode: #857b00;
1471
- --ramps-secondary-140-skyller: #3a6396;
1472
- --ramps-secondary-150-xspector: #4f4f4f;
1473
- --ramps-secondary-150-report-xspector-light-mode: #6f6700;
1474
- --ramps-secondary-150-skyller: #30537d;
1475
- --ramps-tertiary-5-xspector: #fbfcfd;
1476
- --ramps-tertiary-5-report-xspector-light-mode: #fafafa;
1477
- --ramps-tertiary-5-skyller: #f3f9fb;
1478
- --ramps-tertiary-10-xspector: #f7fafb;
1479
- --ramps-tertiary-10-report-xspector-light-mode: #f5f5f5;
1480
- --ramps-tertiary-10-skyller: #e6f4f7;
1481
- --ramps-tertiary-20-xspector: #eff4f7;
1482
- --ramps-tertiary-20-report-xspector-light-mode: #ececec;
1483
- --ramps-tertiary-20-skyller: #cee9f0;
1484
- --ramps-tertiary-30-xspector: #e6eff3;
1485
- --ramps-tertiary-30-report-xspector-light-mode: #e2e2e2;
1486
- --ramps-tertiary-30-skyller: #b5dee8;
1487
- --ramps-tertiary-40-xspector: #deeaef;
1488
- --ramps-tertiary-40-report-xspector-light-mode: #d8d8d8;
1489
- --ramps-tertiary-40-skyller: #9cd3e0;
1490
- --ramps-tertiary-50-xspector: #d6e5eb;
1491
- --ramps-tertiary-50-report-xspector-light-mode: #cfcfcf;
1492
- --ramps-tertiary-50-skyller: #83c8d9;
1493
- --ramps-tertiary-60-xspector: #cedfe6;
1494
- --ramps-tertiary-60-report-xspector-light-mode: #c5c5c5;
1495
- --ramps-tertiary-60-skyller: #6bbdd1;
1496
- --ramps-tertiary-70-xspector: #c6dae2;
1497
- --ramps-tertiary-70-report-xspector-light-mode: #bbbbbb;
1498
- --ramps-tertiary-70-skyller: #52b2c9;
1499
- --ramps-tertiary-80-xspector: #bdd5de;
1500
- --ramps-tertiary-80-report-xspector-light-mode: #b1b1b1;
1501
- --ramps-tertiary-80-skyller: #39a7c1;
1502
- --ramps-tertiary-90-xspector: #b5cfda;
1503
- --ramps-tertiary-90-report-xspector-light-mode: #a8a8a8;
1504
- --ramps-tertiary-90-skyller: #219cba;
1505
- --ramps-tertiary-100-xspector: #adcad6;
1506
- --ramps-tertiary-100-report-xspector-light-mode: #9e9e9e;
1507
- --ramps-tertiary-100-skyller: #0891b2;
1508
- --ramps-tertiary-110-xspector: #9cb6c1;
1509
- --ramps-tertiary-110-report-xspector-light-mode: #8e8e8e;
1510
- --ramps-tertiary-110-skyller: #0782a0;
1511
- --ramps-tertiary-120-xspector: #8aa2ab;
1512
- --ramps-tertiary-120-report-xspector-light-mode: #7e7e7e;
1513
- --ramps-tertiary-120-skyller: #06748e;
1514
- --ramps-tertiary-130-xspector: #798d96;
1515
- --ramps-tertiary-130-report-xspector-light-mode: #6f6f6f;
1516
- --ramps-tertiary-130-skyller: #06667d;
1517
- --ramps-tertiary-140-xspector: #687980;
1518
- --ramps-tertiary-140-report-xspector-light-mode: #5f5f5f;
1519
- --ramps-tertiary-140-skyller: #05576b;
1520
- --ramps-tertiary-150-xspector: #57656b;
1521
- --ramps-tertiary-150-report-xspector-light-mode: #4f4f4f;
1522
- --ramps-tertiary-150-skyller: #044959;
1523
- --ramps-grey-5-xspector: #fafafa;
1524
- --ramps-grey-5-report-xspector-light-mode: #fafafa;
1525
- --ramps-grey-5-skyller: #fafafa;
1526
- --ramps-grey-10-xspector: #f5f5f5;
1527
- --ramps-grey-10-report-xspector-light-mode: #f5f5f5;
1528
- --ramps-grey-10-skyller: #f5f5f5;
1529
- --ramps-grey-20-xspector: #ececec;
1530
- --ramps-grey-20-report-xspector-light-mode: #ececec;
1531
- --ramps-grey-20-skyller: #ececec;
1532
- --ramps-grey-30-xspector: #e2e2e2;
1533
- --ramps-grey-30-report-xspector-light-mode: #e2e2e2;
1534
- --ramps-grey-30-skyller: #e2e2e2;
1535
- --ramps-grey-40-xspector: #d8d8d8;
1536
- --ramps-grey-40-report-xspector-light-mode: #d8d8d8;
1537
- --ramps-grey-40-skyller: #d8d8d8;
1538
- --ramps-grey-50-xspector: #cfcfcf;
1539
- --ramps-grey-50-report-xspector-light-mode: #cfcfcf;
1540
- --ramps-grey-50-skyller: #cfcfcf;
1541
- --ramps-grey-60-xspector: #c5c5c5;
1542
- --ramps-grey-60-report-xspector-light-mode: #c5c5c5;
1543
- --ramps-grey-60-skyller: #c5c5c5;
1544
- --ramps-grey-70-xspector: #bbbbbb;
1545
- --ramps-grey-70-report-xspector-light-mode: #bbbbbb;
1546
- --ramps-grey-70-skyller: #bbbbbb;
1547
- --ramps-grey-80-xspector: #b1b1b1;
1548
- --ramps-grey-80-report-xspector-light-mode: #b1b1b1;
1549
- --ramps-grey-80-skyller: #b1b1b1;
1550
- --ramps-grey-90-xspector: #a8a8a8;
1551
- --ramps-grey-90-report-xspector-light-mode: #a8a8a8;
1552
- --ramps-grey-90-skyller: #a8a8a8;
1553
- --ramps-grey-100-xspector: #9e9e9e;
1554
- --ramps-grey-100-report-xspector-light-mode: #9e9e9e;
1555
- --ramps-grey-100-skyller: #9e9e9e;
1556
- --ramps-grey-110-xspector: #8e8e8e;
1557
- --ramps-grey-110-report-xspector-light-mode: #8e8e8e;
1558
- --ramps-grey-110-skyller: #8e8e8e;
1559
- --ramps-grey-120-xspector: #7e7e7e;
1560
- --ramps-grey-120-report-xspector-light-mode: #7e7e7e;
1561
- --ramps-grey-120-skyller: #7e7e7e;
1562
- --ramps-grey-130-xspector: #6f6f6f;
1563
- --ramps-grey-130-report-xspector-light-mode: #6f6f6f;
1564
- --ramps-grey-130-skyller: #6f6f6f;
1565
- --ramps-grey-140-xspector: #5f5f5f;
1566
- --ramps-grey-140-report-xspector-light-mode: #5f5f5f;
1567
- --ramps-grey-140-skyller: #5f5f5f;
1568
- --ramps-grey-150-xspector: #4f4f4f;
1569
- --ramps-grey-150-report-xspector-light-mode: #4f4f4f;
1570
- --ramps-grey-150-skyller: #4f4f4f;
1571
- --ramps-grey2-50-xspector: #f8fafa;
1572
- --ramps-grey2-50-report-xspector-light-mode: #f8fafa;
1573
- --ramps-grey2-50-skyller: #fafafa;
1574
- --ramps-grey2-100-xspector: #f2f5f5;
1575
- --ramps-grey2-100-report-xspector-light-mode: #f2f5f5;
1576
- --ramps-grey2-100-skyller: #f5f5f5;
1577
- --ramps-grey2-200-xspector: #e7ebed;
1578
- --ramps-grey2-200-report-xspector-light-mode: #e7ebed;
1579
- --ramps-grey2-200-skyller: #e5e5e5;
1580
- --ramps-grey2-300-xspector: #d3dadf;
1581
- --ramps-grey2-300-report-xspector-light-mode: #d3dadf;
1582
- --ramps-grey2-300-skyller: #d4d4d4;
1583
- --ramps-grey2-400-xspector: #bac5cb;
1584
- --ramps-grey2-400-report-xspector-light-mode: #bac5cb;
1585
- --ramps-grey2-400-skyller: #a3a3a3;
1586
- --ramps-grey2-500-xspector: #9dabb5;
1587
- --ramps-grey2-500-report-xspector-light-mode: #9dabb5;
1588
- --ramps-grey2-500-skyller: #737373;
1589
- --ramps-grey2-600-xspector: #919eab;
1590
- --ramps-grey2-600-report-xspector-light-mode: #919eab;
1591
- --ramps-grey2-600-skyller: #525252;
1592
- --ramps-grey2-700-xspector: #72808f;
1593
- --ramps-grey2-700-report-xspector-light-mode: #72808f;
1594
- --ramps-grey2-700-skyller: #404040;
1595
- --ramps-grey2-800-xspector: #606b77;
1596
- --ramps-grey2-800-report-xspector-light-mode: #606b77;
1597
- --ramps-grey2-800-skyller: #262626;
1598
- --ramps-grey2-900-xspector: #4f5863;
1599
- --ramps-grey2-900-report-xspector-light-mode: #4f5863;
1600
- --ramps-grey2-900-skyller: #171717;
1601
- --ramps-grey2-950-xspector: #343b41;
1602
- --ramps-grey2-950-report-xspector-light-mode: #343b41;
1603
- --ramps-grey2-950-skyller: #1b1f22;
1604
- --ramps-info-50-xspector: #eef8ff;
1605
- --ramps-info-50-report-xspector-light-mode: #eef8ff;
1606
- --ramps-info-50-skyller: #eff6ff;
1607
- --ramps-info-100-xspector: #d9efff;
1608
- --ramps-info-100-report-xspector-light-mode: #d9efff;
1609
- --ramps-info-100-skyller: #dbeafe;
1610
- --ramps-info-200-xspector: #bce4ff;
1611
- --ramps-info-200-report-xspector-light-mode: #bce4ff;
1612
- --ramps-info-200-skyller: #bfdbfe;
1613
- --ramps-info-300-xspector: #8ed5ff;
1614
- --ramps-info-300-report-xspector-light-mode: #8ed5ff;
1615
- --ramps-info-300-skyller: #93c5fd;
1616
- --ramps-info-400-xspector: #59bbff;
1617
- --ramps-info-400-report-xspector-light-mode: #59bbff;
1618
- --ramps-info-400-skyller: #60a5fa;
1619
- --ramps-info-500-xspector: #2998ff;
1620
- --ramps-info-500-report-xspector-light-mode: #2998ff;
1621
- --ramps-info-500-skyller: #3b82f6;
1622
- --ramps-info-600-xspector: #1b7df5;
1623
- --ramps-info-600-report-xspector-light-mode: #1b7df5;
1624
- --ramps-info-600-skyller: #2563eb;
1625
- --ramps-info-700-xspector: #1466e1;
1626
- --ramps-info-700-report-xspector-light-mode: #1466e1;
1627
- --ramps-info-700-skyller: #1d4ed8;
1628
- --ramps-info-800-xspector: #1752b6;
1629
- --ramps-info-800-report-xspector-light-mode: #1752b6;
1630
- --ramps-info-800-skyller: #1e40af;
1631
- --ramps-info-900-xspector: #19478f;
1632
- --ramps-info-900-report-xspector-light-mode: #19478f;
1633
- --ramps-info-900-skyller: #1e3a8a;
1634
- --ramps-info-950-xspector: #142c57;
1635
- --ramps-info-950-report-xspector-light-mode: #142c57;
1636
- --ramps-info-950-skyller: #162a63;
1637
- --ramps-success-50-xspector: #effce9;
1638
- --ramps-success-50-report-xspector-light-mode: #effce9;
1639
- --ramps-success-50-skyller: #f0fdf4;
1640
- --ramps-success-100-xspector: #daf9ce;
1641
- --ramps-success-100-report-xspector-light-mode: #daf9ce;
1642
- --ramps-success-100-skyller: #dcfce7;
1643
- --ramps-success-200-xspector: #b8f3a3;
1644
- --ramps-success-200-report-xspector-light-mode: #b8f3a3;
1645
- --ramps-success-200-skyller: #bbf7d0;
1646
- --ramps-success-300-xspector: #8ce86e;
1647
- --ramps-success-300-report-xspector-light-mode: #8ce86e;
1648
- --ramps-success-300-skyller: #86efac;
1649
- --ramps-success-400-xspector: #54d62c;
1650
- --ramps-success-400-report-xspector-light-mode: #54d62c;
1651
- --ramps-success-400-skyller: #4ade80;
1652
- --ramps-success-500-xspector: #44c022;
1653
- --ramps-success-500-report-xspector-light-mode: #44c022;
1654
- --ramps-success-500-skyller: #22c55e;
1655
- --ramps-success-600-xspector: #319917;
1656
- --ramps-success-600-report-xspector-light-mode: #319917;
1657
- --ramps-success-600-skyller: #16a34a;
1658
- --ramps-success-700-xspector: #277516;
1659
- --ramps-success-700-report-xspector-light-mode: #277516;
1660
- --ramps-success-700-skyller: #15803d;
1661
- --ramps-success-800-xspector: #235d17;
1662
- --ramps-success-800-report-xspector-light-mode: #235d17;
1663
- --ramps-success-800-skyller: #166534;
1664
- --ramps-success-900-xspector: #214f18;
1665
- --ramps-success-900-report-xspector-light-mode: #214f18;
1666
- --ramps-success-900-skyller: #14532d;
1667
- --ramps-success-950-xspector: #0c2b08;
1668
- --ramps-success-950-report-xspector-light-mode: #0c2b08;
1669
- --ramps-success-950-skyller: #0a2e18;
1670
- --ramps-warning-50-xspector: #ffffea;
1671
- --ramps-warning-50-report-xspector-light-mode: #ffffea;
1672
- --ramps-warning-50-skyller: #fffbeb;
1673
- --ramps-warning-100-xspector: #fffbc5;
1674
- --ramps-warning-100-report-xspector-light-mode: #fffbc5;
1675
- --ramps-warning-100-skyller: #fef3c7;
1676
- --ramps-warning-200-xspector: #fff885;
1677
- --ramps-warning-200-report-xspector-light-mode: #fff885;
1678
- --ramps-warning-200-skyller: #fde68a;
1679
- --ramps-warning-300-xspector: #ffee46;
1680
- --ramps-warning-300-report-xspector-light-mode: #ffee46;
1681
- --ramps-warning-300-skyller: #fcd34d;
1682
- --ramps-warning-400-xspector: #ffdf1b;
1683
- --ramps-warning-400-report-xspector-light-mode: #ffdf1b;
1684
- --ramps-warning-400-skyller: #fbbf24;
1685
- --ramps-warning-500-xspector: #ffc107;
1686
- --ramps-warning-500-report-xspector-light-mode: #ffc107;
1687
- --ramps-warning-500-skyller: #f59e0b;
1688
- --ramps-warning-600-xspector: #e29400;
1689
- --ramps-warning-600-report-xspector-light-mode: #e29400;
1690
- --ramps-warning-600-skyller: #d97706;
1691
- --ramps-warning-700-xspector: #bb6902;
1692
- --ramps-warning-700-report-xspector-light-mode: #bb6902;
1693
- --ramps-warning-700-skyller: #b45309;
1694
- --ramps-warning-800-xspector: #985108;
1695
- --ramps-warning-800-report-xspector-light-mode: #985108;
1696
- --ramps-warning-800-skyller: #92400e;
1697
- --ramps-warning-900-xspector: #7c420b;
1698
- --ramps-warning-900-report-xspector-light-mode: #7c420b;
1699
- --ramps-warning-900-skyller: #7c420b;
1700
- --ramps-warning-950-xspector: #482200;
1701
- --ramps-warning-950-report-xspector-light-mode: #482200;
1702
- --ramps-warning-950-skyller: #472505;
1703
- --ramps-error-50-xspector: #fff3f1;
1704
- --ramps-error-50-report-xspector-light-mode: #fff3f1;
1705
- --ramps-error-50-skyller: #fef2f2;
1706
- --ramps-error-100-xspector: #ffe3df;
1707
- --ramps-error-100-report-xspector-light-mode: #ffe3df;
1708
- --ramps-error-100-skyller: #ffdfdf;
1709
- --ramps-error-200-xspector: #ffccc5;
1710
- --ramps-error-200-report-xspector-light-mode: #ffccc5;
1711
- --ramps-error-200-skyller: #fecaca;
1712
- --ramps-error-300-xspector: #ffa99d;
1713
- --ramps-error-300-report-xspector-light-mode: #ffa99d;
1714
- --ramps-error-300-skyller: #fca5a5;
1715
- --ramps-error-400-xspector: #ff7664;
1716
- --ramps-error-400-report-xspector-light-mode: #ff7664;
1717
- --ramps-error-400-skyller: #f87171;
1718
- --ramps-error-500-xspector: #ff4d35;
1719
- --ramps-error-500-report-xspector-light-mode: #ff4d35;
1720
- --ramps-error-500-skyller: #ef4444;
1721
- --ramps-error-600-xspector: #ed2f15;
1722
- --ramps-error-600-report-xspector-light-mode: #ed2f15;
1723
- --ramps-error-600-skyller: #dc2626;
1724
- --ramps-error-700-xspector: #c8230d;
1725
- --ramps-error-700-report-xspector-light-mode: #c8230d;
1726
- --ramps-error-700-skyller: #b91c1c;
1727
- --ramps-error-800-xspector: #a5210f;
1728
- --ramps-error-800-report-xspector-light-mode: #a5210f;
1729
- --ramps-error-800-skyller: #991b1b;
1730
- --ramps-error-900-xspector: #882214;
1731
- --ramps-error-900-report-xspector-light-mode: #882214;
1732
- --ramps-error-900-skyller: #7f1d1d;
1733
- --ramps-error-950-xspector: #4b0c04;
1734
- --ramps-error-950-report-xspector-light-mode: #4b0c04;
1735
- --ramps-error-950-skyller: #410a0a;
1736
- --transparency-primary-8-xspector: rgba(221 205 0 / 0.08);
1737
- --transparency-primary-8-report-xspector-light-mode: rgba(30 50 73 / 0.08);
1738
- --transparency-primary-8-skyller: rgba(37 99 235 / 0.08);
1739
- --transparency-primary-12-xspector: rgba(221 205 0 / 0.12);
1740
- --transparency-primary-12-report-xspector-light-mode: rgba(30 50 73 / 0.12);
1741
- --transparency-primary-12-skyller: rgba(37 99 235 / 0.12);
1742
- --transparency-primary-16-xspector: rgba(221 205 0 / 0.16);
1743
- --transparency-primary-16-report-xspector-light-mode: rgba(30 50 73 / 0.16);
1744
- --transparency-primary-16-skyller: rgba(37 99 235 / 0.16);
1745
- --transparency-primary-24-xspector: rgba(221 205 0 / 0.24);
1746
- --transparency-primary-24-report-xspector-light-mode: rgba(30 50 73 / 0.24);
1747
- --transparency-primary-24-skyller: rgba(37 99 235 / 0.24);
1748
- --transparency-primary-32-xspector: rgba(221 205 0 / 0.32);
1749
- --transparency-primary-32-report-xspector-light-mode: rgba(30 50 73 / 0.32);
1750
- --transparency-primary-32-skyller: rgba(37 99 235 / 0.32);
1751
- --transparency-primary-48-xspector: rgba(221 205 0 / 0.48);
1752
- --transparency-primary-48-report-xspector-light-mode: rgba(30 50 73 / 0.48);
1753
- --transparency-primary-48-skyller: rgba(37 99 235 / 0.48);
1754
- --transparency-secondary-8-xspector: rgba(158 158 158 / 0.08);
1755
- --transparency-secondary-8-report-xspector-light-mode: rgba(221 205 0 / 0.08);
1756
- --transparency-secondary-8-skyller: rgba(96 165 250 / 0.08);
1757
- --transparency-secondary-12-xspector: rgba(158 158 158 / 0.12);
1758
- --transparency-secondary-12-report-xspector-light-mode: rgba(221 205 0 / 0.12);
1759
- --transparency-secondary-12-skyller: rgba(96 165 250 / 0.12);
1760
- --transparency-secondary-16-xspector: rgba(158 158 158 / 0.16);
1761
- --transparency-secondary-16-report-xspector-light-mode: rgba(221 205 0 / 0.16);
1762
- --transparency-secondary-16-skyller: rgba(96 165 250 / 0.16);
1763
- --transparency-secondary-24-xspector: rgba(158 158 158 / 0.24);
1764
- --transparency-secondary-24-report-xspector-light-mode: rgba(221 205 0 / 0.24);
1765
- --transparency-secondary-24-skyller: rgba(96 165 250 / 0.24);
1766
- --transparency-secondary-32-xspector: rgba(158 158 158 / 0.32);
1767
- --transparency-secondary-32-report-xspector-light-mode: rgba(221 205 0 / 0.32);
1768
- --transparency-secondary-32-skyller: rgba(96 165 250 / 0.32);
1769
- --transparency-secondary-48-xspector: rgba(158 158 158 / 0.48);
1770
- --transparency-secondary-48-report-xspector-light-mode: rgba(221 205 0 / 0.48);
1771
- --transparency-secondary-48-skyller: rgba(96 165 250 / 0.48);
1772
- --transparency-tertiary-8-xspector: rgba(173 202 214 / 0.08);
1773
- --transparency-tertiary-8-report-xspector-light-mode: rgba(158 158 158 / 0.08);
1774
- --transparency-tertiary-8-skyller: rgba(8 145 178 / 0.08);
1775
- --transparency-tertiary-12-xspector: rgba(173 202 214 / 0.12);
1776
- --transparency-tertiary-12-report-xspector-light-mode: rgba(158 158 158 / 0.12);
1777
- --transparency-tertiary-12-skyller: rgba(8 145 178 / 0.12);
1778
- --transparency-tertiary-16-xspector: rgba(173 202 214 / 0.16);
1779
- --transparency-tertiary-16-report-xspector-light-mode: rgba(158 158 158 / 0.16);
1780
- --transparency-tertiary-16-skyller: rgba(8 145 178 / 0.16);
1781
- --transparency-tertiary-24-xspector: rgba(173 202 214 / 0.24);
1782
- --transparency-tertiary-24-report-xspector-light-mode: rgba(158 158 158 / 0.24);
1783
- --transparency-tertiary-24-skyller: rgba(8 145 178 / 0.24);
1784
- --transparency-tertiary-32-xspector: rgba(173 202 214 / 0.32);
1785
- --transparency-tertiary-32-report-xspector-light-mode: rgba(158 158 158 / 0.32);
1786
- --transparency-tertiary-32-skyller: rgba(8 145 178 / 0.32);
1787
- --transparency-tertiary-48-xspector: rgba(173 202 214 / 0.48);
1788
- --transparency-tertiary-48-report-xspector-light-mode: rgba(158 158 158 / 0.48);
1789
- --transparency-tertiary-48-skyller: rgba(8 145 178 / 0.48);
1790
- --transparency-info-8-xspector: rgba(41 152 255 / 0.08);
1791
- --transparency-info-8-report-xspector-light-mode: rgba(41 152 255 / 0.08);
1792
- --transparency-info-8-skyller: rgba(37 99 235 / 0.08);
1793
- --transparency-info-12-xspector: rgba(41 152 255 / 0.12);
1794
- --transparency-info-12-report-xspector-light-mode: rgba(41 152 255 / 0.12);
1795
- --transparency-info-12-skyller: rgba(37 99 235 / 0.12);
1796
- --transparency-info-16-xspector: rgba(41 152 255 / 0.16);
1797
- --transparency-info-16-report-xspector-light-mode: rgba(41 152 255 / 0.16);
1798
- --transparency-info-16-skyller: rgba(37 99 235 / 0.16);
1799
- --transparency-info-24-xspector: rgba(41 152 255 / 0.24);
1800
- --transparency-info-24-report-xspector-light-mode: rgba(41 152 255 / 0.24);
1801
- --transparency-info-24-skyller: rgba(37 99 235 / 0.24);
1802
- --transparency-info-32-xspector: rgba(41 152 255 / 0.32);
1803
- --transparency-info-32-report-xspector-light-mode: rgba(41 152 255 / 0.32);
1804
- --transparency-info-32-skyller: rgba(37 99 235 / 0.32);
1805
- --transparency-info-48-xspector: rgba(41 152 255 / 0.48);
1806
- --transparency-info-48-report-xspector-light-mode: rgba(41 152 255 / 0.48);
1807
- --transparency-info-48-skyller: rgba(37 99 235 / 0.48);
1808
- --transparency-success-8-xspector: rgba(84 214 44 / 0.08);
1809
- --transparency-success-8-report-xspector-light-mode: rgba(84 214 44 / 0.08);
1810
- --transparency-success-8-skyller: rgba(22 163 74 / 0.08);
1811
- --transparency-success-12-xspector: rgba(84 214 44 / 0.12);
1812
- --transparency-success-12-report-xspector-light-mode: rgba(84 214 44 / 0.12);
1813
- --transparency-success-12-skyller: rgba(22 163 74 / 0.12);
1814
- --transparency-success-16-xspector: rgba(84 214 44 / 0.16);
1815
- --transparency-success-16-report-xspector-light-mode: rgba(84 214 44 / 0.16);
1816
- --transparency-success-16-skyller: rgba(22 163 74 / 0.16);
1817
- --transparency-success-24-xspector: rgba(84 214 44 / 0.24);
1818
- --transparency-success-24-report-xspector-light-mode: rgba(84 214 44 / 0.24);
1819
- --transparency-success-24-skyller: rgba(22 163 74 / 0.24);
1820
- --transparency-success-32-xspector: rgba(84 214 44 / 0.32);
1821
- --transparency-success-32-report-xspector-light-mode: rgba(84 214 44 / 0.32);
1822
- --transparency-success-32-skyller: rgba(22 163 74 / 0.32);
1823
- --transparency-success-48-xspector: rgba(84 214 44 / 0.48);
1824
- --transparency-success-48-report-xspector-light-mode: rgba(84 214 44 / 0.48);
1825
- --transparency-success-48-skyller: rgba(22 163 74 / 0.48);
1826
- --transparency-warning-8-xspector: rgba(255 193 7 / 0.08);
1827
- --transparency-warning-8-report-xspector-light-mode: rgba(255 193 7 / 0.08);
1828
- --transparency-warning-8-skyller: rgba(251 191 36 / 0.08);
1829
- --transparency-warning-12-xspector: rgba(255 193 7 / 0.12);
1830
- --transparency-warning-12-report-xspector-light-mode: rgba(255 193 7 / 0.12);
1831
- --transparency-warning-12-skyller: rgba(251 191 36 / 0.12);
1832
- --transparency-warning-16-xspector: rgba(255 193 7 / 0.16);
1833
- --transparency-warning-16-report-xspector-light-mode: rgba(255 193 7 / 0.16);
1834
- --transparency-warning-16-skyller: rgba(251 191 36 / 0.16);
1835
- --transparency-warning-24-xspector: rgba(255 193 7 / 0.24);
1836
- --transparency-warning-24-report-xspector-light-mode: rgba(255 193 7 / 0.24);
1837
- --transparency-warning-24-skyller: rgba(251 191 36 / 0.24);
1838
- --transparency-warning-32-xspector: rgba(255 193 7 / 0.32);
1839
- --transparency-warning-32-report-xspector-light-mode: rgba(255 193 7 / 0.32);
1840
- --transparency-warning-32-skyller: rgba(251 191 36 / 0.32);
1841
- --transparency-warning-48-xspector: rgba(255 193 7 / 0.48);
1842
- --transparency-warning-48-report-xspector-light-mode: rgba(255 193 7 / 0.48);
1843
- --transparency-warning-48-skyller: rgba(251 191 36 / 0.48);
1844
- --transparency-error-8-xspector: rgba(255 72 66 / 0.08);
1845
- --transparency-error-8-report-xspector-light-mode: rgba(255 72 66 / 0.08);
1846
- --transparency-error-8-skyller: rgba(220 38 38 / 0.08);
1847
- --transparency-error-12-xspector: rgba(255 72 66 / 0.12);
1848
- --transparency-error-12-report-xspector-light-mode: rgba(255 72 66 / 0.12);
1849
- --transparency-error-12-skyller: rgba(220 38 38 / 0.12);
1850
- --transparency-error-16-xspector: rgba(255 72 66 / 0.16);
1851
- --transparency-error-16-report-xspector-light-mode: rgba(255 72 66 / 0.16);
1852
- --transparency-error-16-skyller: rgba(220 38 38 / 0.16);
1853
- --transparency-error-24-xspector: rgba(255 72 66 / 0.24);
1854
- --transparency-error-24-report-xspector-light-mode: rgba(255 72 66 / 0.24);
1855
- --transparency-error-24-skyller: rgba(220 38 38 / 0.24);
1856
- --transparency-error-32-xspector: rgba(255 72 66 / 0.32);
1857
- --transparency-error-32-report-xspector-light-mode: rgba(255 72 66 / 0.32);
1858
- --transparency-error-32-skyller: rgba(220 38 38 / 0.32);
1859
- --transparency-error-48-xspector: rgba(255 72 66 / 0.48);
1860
- --transparency-error-48-report-xspector-light-mode: rgba(255 72 66 / 0.48);
1861
- --transparency-error-48-skyller: rgba(220 38 38 / 0.48);
1862
- --transparency-grey-8-xspector: rgba(158 158 158 / 0.08);
1863
- --transparency-grey-8-report-xspector-light-mode: rgba(158 158 158 / 0.08);
1864
- --transparency-grey-8-skyller: rgba(115 115 115 / 0.08);
1865
- --transparency-grey-12-xspector: rgba(158 158 158 / 0.12);
1866
- --transparency-grey-12-report-xspector-light-mode: rgba(158 158 158 / 0.12);
1867
- --transparency-grey-12-skyller: rgba(115 115 115 / 0.12);
1868
- --transparency-grey-16-xspector: rgba(158 158 158 / 0.16);
1869
- --transparency-grey-16-report-xspector-light-mode: rgba(158 158 158 / 0.16);
1870
- --transparency-grey-16-skyller: rgba(115 115 115 / 0.16);
1871
- --transparency-grey-24-xspector: rgba(158 158 158 / 0.24);
1872
- --transparency-grey-24-report-xspector-light-mode: rgba(158 158 158 / 0.24);
1873
- --transparency-grey-24-skyller: rgba(115 115 115 / 0.24);
1874
- --transparency-grey-32-xspector: rgba(158 158 158 / 0.32);
1875
- --transparency-grey-32-report-xspector-light-mode: rgba(158 158 158 / 0.32);
1876
- --transparency-grey-32-skyller: rgba(115 115 115 / 0.32);
1877
- --transparency-grey-48-xspector: rgba(158 158 158 / 0.48);
1878
- --transparency-grey-48-report-xspector-light-mode: rgba(158 158 158 / 0.48);
1879
- --transparency-grey-48-skyller: rgba(115 115 115 / 0.48);
1880
- --transparency-grey2-8-xspector: rgba(145 158 171 / 0.08);
1881
- --transparency-grey2-8-report-xspector-light-mode: rgba(145 158 171 / 0.08);
1882
- --transparency-grey2-8-skyller: rgba(163 163 163 / 0.08);
1883
- --transparency-grey2-12-xspector: rgba(145 158 171 / 0.12);
1884
- --transparency-grey2-12-report-xspector-light-mode: rgba(145 158 171 / 0.12);
1885
- --transparency-grey2-12-skyller: rgba(163 163 163 / 0.12);
1886
- --transparency-grey2-16-xspector: rgba(145 158 171 / 0.16);
1887
- --transparency-grey2-16-report-xspector-light-mode: rgba(145 158 171 / 0.16);
1888
- --transparency-grey2-16-skyller: rgba(163 163 163 / 0.16);
1889
- --transparency-grey2-24-xspector: rgba(145 158 171 / 0.24);
1890
- --transparency-grey2-24-report-xspector-light-mode: rgba(145 158 171 / 0.24);
1891
- --transparency-grey2-24-skyller: rgba(163 163 163 / 0.24);
1892
- --transparency-grey2-32-xspector: rgba(145 158 171 / 0.32);
1893
- --transparency-grey2-32-report-xspector-light-mode: rgba(145 158 171 / 0.32);
1894
- --transparency-grey2-32-skyller: rgba(163 163 163 / 0.32);
1895
- --transparency-grey2-48-xspector: rgba(145 158 171 / 0.48);
1896
- --transparency-grey2-48-report-xspector-light-mode: rgba(145 158 171 / 0.48);
1897
- --transparency-grey2-48-skyller: rgba(163 163 163 / 0.48);
1898
- --transparency-white-8-xspector: rgba(255 255 255 / 0.08);
1899
- --transparency-white-8-report-xspector-light-mode: rgba(255 255 255 / 0.08);
1900
- --transparency-white-8-skyller: rgba(255 255 255 / 0.08);
1901
- --transparency-white-12-xspector: rgba(255 255 255 / 0.12);
1902
- --transparency-white-12-report-xspector-light-mode: rgba(255 255 255 / 0.12);
1903
- --transparency-white-12-skyller: rgba(255 255 255 / 0.12);
1904
- --transparency-white-16-xspector: rgba(255 255 255 / 0.16);
1905
- --transparency-white-16-report-xspector-light-mode: rgba(255 255 255 / 0.16);
1906
- --transparency-white-16-skyller: rgba(255 255 255 / 0.16);
1907
- --transparency-white-24-xspector: rgba(255 255 255 / 0.24);
1908
- --transparency-white-24-report-xspector-light-mode: rgba(255 255 255 / 0.24);
1909
- --transparency-white-24-skyller: rgba(255 255 255 / 0.24);
1910
- --transparency-white-32-xspector: rgba(255 255 255 / 0.32);
1911
- --transparency-white-32-report-xspector-light-mode: rgba(255 255 255 / 0.32);
1912
- --transparency-white-32-skyller: rgba(255 255 255 / 0.32);
1913
- --transparency-white-48-xspector: rgba(255 255 255 / 0.48);
1914
- --transparency-white-48-report-xspector-light-mode: rgba(255 255 255 / 0.48);
1915
- --transparency-white-48-skyller: rgba(255 255 255 / 0.48);
1916
- --transparency-black-8-xspector: rgba(0 0 0 / 0.08);
1917
- --transparency-black-8-report-xspector-light-mode: rgba(0 0 0 / 0.08);
1918
- --transparency-black-8-skyller: rgba(0 0 0 / 0.08);
1919
- --transparency-black-12-xspector: rgba(0 0 0 / 0.12);
1920
- --transparency-black-12-report-xspector-light-mode: rgba(0 0 0 / 0.12);
1921
- --transparency-black-12-skyller: rgba(0 0 0 / 0.12);
1922
- --transparency-black-16-xspector: rgba(0 0 0 / 0.16);
1923
- --transparency-black-16-report-xspector-light-mode: rgba(0 0 0 / 0.16);
1924
- --transparency-black-16-skyller: rgba(0 0 0 / 0.16);
1925
- --transparency-black-24-xspector: rgba(0 0 0 / 0.24);
1926
- --transparency-black-24-report-xspector-light-mode: rgba(0 0 0 / 0.24);
1927
- --transparency-black-24-skyller: rgba(0 0 0 / 0.24);
1928
- --transparency-black-32-xspector: rgba(0 0 0 / 0.32);
1929
- --transparency-black-32-report-xspector-light-mode: rgba(0 0 0 / 0.32);
1930
- --transparency-black-32-skyller: rgba(0 0 0 / 0.32);
1931
- --transparency-black-48-xspector: rgba(0 0 0 / 0.48);
1932
- --transparency-black-48-report-xspector-light-mode: rgba(0 0 0 / 0.48);
1933
- --transparency-black-48-skyller: rgba(0 0 0 / 0.48);
1934
- --base-modal-modal-xspector: #2d2e30;
1935
- --base-modal-modal-report-xspector-light-mode: #ffffff;
1936
- --base-modal-modal-skyller: #ffffff;
1937
- --base-modal-modal-hightlight-xspector: #343638;
1938
- --base-modal-modal-hightlight-report-xspector-light-mode: #f5f5f5;
1939
- --base-modal-modal-hightlight-skyller: #f5f5f5;
1940
- --base-modal-modal-curtain-xspector: rgba(11 10 10 / 0.64);
1941
- --base-modal-modal-curtain-report-xspector-light-mode: rgba(0 0 0 / 0.64);
1942
- --base-modal-modal-curtain-skyller: rgba(0 0 0 / 0.64);
1943
- --base-bg-bg1-xspector: #202427;
1944
- --base-bg-bg1-report-xspector-light-mode: #ffffff;
1945
- --base-bg-bg1-skyller: #ffffff;
1946
- --base-bg-bg2-xspector: #282c31;
1947
- --base-bg-bg2-report-xspector-light-mode: #f5f5f5;
1948
- --base-bg-bg2-skyller: #fafafa;
1949
- --base-bg-bg3-xspector: #000000;
1950
- --base-bg-bg3-report-xspector-light-mode: #d8d8d8;
1951
- --base-bg-bg3-skyller: #f5f5f5;
1952
- --base-bg-stroke1-xspector: #000000;
1953
- --base-bg-stroke1-report-xspector-light-mode: #e2e2e2;
1954
- --base-bg-stroke1-skyller: #e5e5e5;
1955
- --base-bg-stroke2-xspector: #000000;
1956
- --base-bg-stroke2-report-xspector-light-mode: #c5c5c5;
1957
- --base-bg-stroke2-skyller: #d4d4d4;
1958
- --input-default-text-xspector: #9e9e9e;
1959
- --input-default-text-report-xspector-light-mode: #9e9e9e;
1960
- --input-default-text-skyller: #737373;
1961
- --input-default-stroke-xspector: rgba(158 158 158 / 0.24);
1962
- --input-default-stroke-report-xspector-light-mode: #cfcfcf;
1963
- --input-default-stroke-skyller: #d4d4d4;
1964
- --input-filled-text-xspector: #dfe3e8;
1965
- --input-filled-text-report-xspector-light-mode: #18283a;
1966
- --input-filled-text-skyller: #171717;
1967
- --input-active-stroke-xspector: rgba(158 158 158 / 0.48);
1968
- --input-active-stroke-report-xspector-light-mode: #9e9e9e;
1969
- --input-active-stroke-skyller: #2563eb;
1970
- --input-disable-text-xspector: rgba(145 158 171 / 0.52);
1971
- --input-disable-text-report-xspector-light-mode: #919eab;
1972
- --input-disable-text-skyller: #a3a3a3;
1973
- --input-disable-stroke-xspector: rgba(145 158 171 / 0.08);
1974
- --input-disable-stroke-report-xspector-light-mode: #e7ebed;
1975
- --input-disable-stroke-skyller: #d4d4d4;
1976
- --input-disable-bg-xspector: rgba(145 158 171 / 0.04);
1977
- --input-disable-bg-report-xspector-light-mode: #f2f5f5;
1978
- --input-disable-bg-skyller: #f5f5f5;
1979
- --input-label-bg-xspector: #2d2e30;
1980
- --input-label-bg-report-xspector-light-mode: #ffffff;
1981
- --input-label-bg-skyller: #ffffff;
1982
- --input-error-xspector: #ff4d35;
1983
- --input-error-report-xspector-light-mode: #ed2f15;
1984
- --input-error-skyller: #dc2626;
1985
- --function-default-solid-xspector: #ececec;
1986
- --function-default-solid-report-xspector-light-mode: #1e3249;
1987
- --function-default-solid-skyller: #2563eb;
1988
- --function-default-hover-xspector: #fafafa;
1989
- --function-default-hover-report-xspector-light-mode: #35475b;
1990
- --function-default-hover-skyller: #90c0fc;
1991
- --function-default-hover-bg-xspector: rgba(250 250 250 / 0.08);
1992
- --function-default-hover-bg-report-xspector-light-mode: rgba(30 50 73 / 0.08);
1993
- --function-default-hover-bg-skyller: rgba(144 192 252 / 0.08);
1994
- --function-default-stroke-xspector: rgba(158 158 158 / 0.24);
1995
- --function-default-stroke-report-xspector-light-mode: rgba(30 50 73 / 0.48);
1996
- --function-default-stroke-skyller: rgba(189 189 189 / 0.48);
1997
- --function-default-icon-xspector: #212b36;
1998
- --function-default-icon-report-xspector-light-mode: #ffffff;
1999
- --function-default-icon-skyller: #ffffff;
2000
- --function-default-outline-icon-xspector: #9e9e9e;
2001
- --function-default-outline-icon-report-xspector-light-mode: #1e3249;
2002
- --function-default-outline-icon-skyller: #2563eb;
2003
- --function-active-solid-xspector: #b1a400;
2004
- --function-active-solid-report-xspector-light-mode: #9b8f00;
2005
- --function-active-solid-skyller: #2563eb;
2006
- --function-active-hover-xspector: #ddcd00;
2007
- --function-active-hover-report-xspector-light-mode: #b1a400;
2008
- --function-active-hover-skyller: #90c0fc;
2009
- --function-active-hover-bg-xspector: rgba(221 205 0 / 0.08);
2010
- --function-active-hover-bg-report-xspector-light-mode: rgba(221 205 0 / 0.08);
2011
- --function-active-hover-bg-skyller: rgba(144 192 252 / 0.08);
2012
- --function-active-stroke-xspector: rgba(177 164 0 / 0.48);
2013
- --function-active-stroke-report-xspector-light-mode: rgba(177 164 0 / 0.48);
2014
- --function-active-stroke-skyller: rgba(37 99 235 / 0.48);
2015
- --function-active-icon-xspector: #212b36;
2016
- --function-active-icon-report-xspector-light-mode: #ffffff;
2017
- --function-active-icon-skyller: #ffffff;
2018
- --common-white-xspector: #ffffff;
2019
- --common-white-report-xspector-light-mode: #ffffff;
2020
- --common-white-skyller: #ffffff;
2021
- --common-black-xspector: #000000;
2022
- --common-black-report-xspector-light-mode: #000000;
2023
- --common-black-skyller: #000000;
2024
- --brand-rvl-yellow-xspector: #ddcd00;
2025
- --brand-rvl-yellow-report-xspector-light-mode: #ddcd00;
2026
- --brand-rvl-yellow-skyller: #fbbf24;
2027
- --brand-rvl-grey-xspector: #9e9e9e;
2028
- --brand-rvl-grey-report-xspector-light-mode: #9e9e9e;
2029
- --brand-rvl-grey-skyller: #d4d4d4;
2030
- --others-1-xspector: #1158c7;
2031
- --others-1-report-xspector-light-mode: #1158c7;
2032
- --others-1-skyller: #1158c7;
2033
- --others-2-xspector: #206feb;
2034
- --others-2-report-xspector-light-mode: #206feb;
2035
- --others-2-skyller: #206feb;
2036
- --others-3-xspector: #388bfd;
2037
- --others-3-report-xspector-light-mode: #388bfd;
2038
- --others-3-skyller: #388bfd;
2039
- --others-4-xspector: #58a6ff;
2040
- --others-4-report-xspector-light-mode: #58a6ff;
2041
- --others-4-skyller: #58a6ff;
2042
- --others-5-xspector: #79c0ff;
2043
- --others-5-report-xspector-light-mode: #79c0ff;
2044
- --others-5-skyller: #79c0ff;
2045
- --others-6-xspector: #6e40c9;
2046
- --others-6-report-xspector-light-mode: #6e40c9;
2047
- --others-6-skyller: #6e40c9;
2048
- --others-7-xspector: #8957e5;
2049
- --others-7-report-xspector-light-mode: #8957e5;
2050
- --others-7-skyller: #8957e5;
2051
- --others-8-xspector: #a371f7;
2052
- --others-8-report-xspector-light-mode: #a371f7;
2053
- --others-8-skyller: #a371f7;
2054
- --others-9-xspector: #bc8cff;
2055
- --others-9-report-xspector-light-mode: #bc8cff;
2056
- --others-9-skyller: #bc8cff;
2057
- --others-10-xspector: #d2a8ff;
2058
- --others-10-report-xspector-light-mode: #d2a8ff;
2059
- --others-10-skyller: #d2a8ff;
2060
- --others-11-xspector: #7d2457;
2061
- --others-11-report-xspector-light-mode: #7d2457;
2062
- --others-11-skyller: #7d2457;
2063
- --others-12-xspector: #9e3670;
2064
- --others-12-report-xspector-light-mode: #9e3670;
2065
- --others-12-skyller: #9e3670;
2066
- --others-13-xspector: #bf4b8a;
2067
- --others-13-report-xspector-light-mode: #bf4b8a;
2068
- --others-13-skyller: #bf4b8a;
2069
- --others-14-xspector: #db61a2;
2070
- --others-14-report-xspector-light-mode: #db61a2;
2071
- --others-14-skyller: #db61a2;
2072
- --others-15-xspector: #f778ba;
2073
- --others-15-report-xspector-light-mode: #f778ba;
2074
- --others-15-skyller: #f778ba;
2075
- --others-16-xspector: #8e1619;
2076
- --others-16-report-xspector-light-mode: #8e1619;
2077
- --others-16-skyller: #8e1619;
2078
- --others-17-xspector: #b62324;
2079
- --others-17-report-xspector-light-mode: #b62324;
2080
- --others-17-skyller: #b62324;
2081
- --others-18-xspector: #da3633;
2082
- --others-18-report-xspector-light-mode: #da3633;
2083
- --others-18-skyller: #da3633;
2084
- --others-19-xspector: #f85149;
2085
- --others-19-report-xspector-light-mode: #f85149;
2086
- --others-19-skyller: #f85149;
2087
- --others-20-xspector: #ff7b72;
2088
- --others-20-report-xspector-light-mode: #ff7b72;
2089
- --others-20-skyller: #ff7b72;
2090
- --others-21-xspector: #9b4216;
2091
- --others-21-report-xspector-light-mode: #9b4216;
2092
- --others-21-skyller: #9b4216;
2093
- --others-22-xspector: #bd561d;
2094
- --others-22-report-xspector-light-mode: #bd561d;
2095
- --others-22-skyller: #bd561d;
2096
- --others-23-xspector: #db6d28;
2097
- --others-23-report-xspector-light-mode: #db6d28;
2098
- --others-23-skyller: #db6d28;
2099
- --others-24-xspector: #f0883e;
2100
- --others-24-report-xspector-light-mode: #f0883e;
2101
- --others-24-skyller: #f0883e;
2102
- --others-25-xspector: #ffa657;
2103
- --others-25-report-xspector-light-mode: #ffa657;
2104
- --others-25-skyller: #ffa657;
2105
- --others-26-xspector: #825303;
2106
- --others-26-report-xspector-light-mode: #825303;
2107
- --others-26-skyller: #825303;
2108
- --others-27-xspector: #9e6a03;
2109
- --others-27-report-xspector-light-mode: #9e6a03;
2110
- --others-27-skyller: #9e6a03;
2111
- --others-28-xspector: #bb800a;
2112
- --others-28-report-xspector-light-mode: #bb800a;
2113
- --others-28-skyller: #bb800a;
2114
- --others-29-xspector: #d29922;
2115
- --others-29-report-xspector-light-mode: #d29922;
2116
- --others-29-skyller: #d29922;
2117
- --others-30-xspector: #e3b341;
2118
- --others-30-report-xspector-light-mode: #e3b341;
2119
- --others-30-skyller: #e3b341;
2120
- --others-31-xspector: #186c2e;
2121
- --others-31-report-xspector-light-mode: #186c2e;
2122
- --others-31-skyller: #186c2e;
2123
- --others-32-xspector: #228636;
2124
- --others-32-report-xspector-light-mode: #228636;
2125
- --others-32-skyller: #228636;
2126
- --others-33-xspector: #2ea043;
2127
- --others-33-report-xspector-light-mode: #2ea043;
2128
- --others-33-skyller: #2ea043;
2129
- --others-34-xspector: #3fb950;
2130
- --others-34-report-xspector-light-mode: #3fb950;
2131
- --others-34-skyller: #3fb950;
2132
- --others-35-xspector: #56d364;
2133
- --others-35-report-xspector-light-mode: #56d364;
2134
- --others-35-skyller: #56d364;
2135
- --brand-new-blue-bg-xspector: #091d33;
2136
- --brand-new-blue-bg-report-xspector-light-mode: #091d33;
2137
- --brand-new-blue-bg-skyller: #dbeafe;
2138
- /* BUTTON RADIUS */
2139
- --button-l-round: 8px;
2140
- --button-l-rem-round: 0.5rem;
2141
- --button-l-capsule: 56px;
2142
- --button-l-rem-capsule: 3.5rem;
2143
- --button-m-round: 8px;
2144
- --button-m-rem-round: 0.5rem;
2145
- --button-m-capsule: 38px;
2146
- --button-m-rem-capsule: 2.375rem;
2147
- --button-s-round: 6px;
2148
- --button-s-rem-round: 0.375rem;
2149
- --button-s-capsule: 30px;
2150
- --button-s-rem-capsule: 1.875rem;
2151
- --function-button-l-round: 8px;
2152
- --function-button-l-rem-round: 0.5rem;
2153
- --function-button-l-capsule: 56px;
2154
- --function-button-l-rem-capsule: 3.5rem;
2155
- --function-button-m-round: 8px;
2156
- --function-button-m-rem-round: 0.5rem;
2157
- --function-button-m-capsule: 38px;
2158
- --function-button-m-rem-capsule: 2.375rem;
2159
- --function-button-s-round: 6px;
2160
- --function-button-s-rem-round: 0.375rem;
2161
- --function-button-s-capsule: 30px;
2162
- --function-button-s-rem-capsule: 1.875rem;
2163
- --function-button-xs-round: 4px;
2164
- --function-button-xs-rem-round: 0.25rem;
2165
- --function-button-xs-capsule: 18px;
2166
- --function-button-xs-rem-capsule: 1.125rem;
2167
- --function-button-xxs-round: 2px;
2168
- --function-button-xxs-rem-round: 0.125rem;
2169
- --function-button-xxs-capsule: 12px;
2170
- --function-button-xxs-rem-capsule: 0.75rem;
2171
- }
2172
-
2173
- :root[data-theme="xspector"] {
2174
- /* ------------------------------------------------------------------ */
2175
- /* Color Ramps — from variable_lasted.css */
2176
- /* ------------------------------------------------------------------ */
2177
- /* Primary */
2178
- --primary-ramps-primary-5: var(--ramps-primary-5-xspector);
2179
- --primary-ramps-primary-10: var(--ramps-primary-10-xspector);
2180
- --primary-ramps-primary-20: var(--ramps-primary-20-xspector);
2181
- --primary-ramps-primary-30: var(--ramps-primary-30-xspector);
2182
- --primary-ramps-primary-40: var(--ramps-primary-40-xspector);
2183
- --primary-ramps-primary-50: var(--ramps-primary-50-xspector);
2184
- --primary-ramps-primary-60: var(--ramps-primary-60-xspector);
2185
- --primary-ramps-primary-70: var(--ramps-primary-70-xspector);
2186
- --primary-ramps-primary-80: var(--ramps-primary-80-xspector);
2187
- --primary-ramps-primary-90: var(--ramps-primary-90-xspector);
2188
- --primary-ramps-primary-100: var(--ramps-primary-100-xspector);
2189
- --primary-ramps-primary-110: var(--ramps-primary-110-xspector);
2190
- --primary-ramps-primary-120: var(--ramps-primary-120-xspector);
2191
- --primary-ramps-primary-130: var(--ramps-primary-130-xspector);
2192
- --primary-ramps-primary-140: var(--ramps-primary-140-xspector);
2193
- --primary-ramps-primary-150: var(--ramps-primary-150-xspector);
2194
- /* Secondary */
2195
- --secondary-ramps-secondary-5: var(--ramps-secondary-5-xspector);
2196
- --secondary-ramps-secondary-10: var(--ramps-secondary-10-xspector);
2197
- --secondary-ramps-secondary-20: var(--ramps-secondary-20-xspector);
2198
- --secondary-ramps-secondary-30: var(--ramps-secondary-30-xspector);
2199
- --secondary-ramps-secondary-40: var(--ramps-secondary-40-xspector);
2200
- --secondary-ramps-secondary-50: var(--ramps-secondary-50-xspector);
2201
- --secondary-ramps-secondary-60: var(--ramps-secondary-60-xspector);
2202
- --secondary-ramps-secondary-70: var(--ramps-secondary-70-xspector);
2203
- --secondary-ramps-secondary-80: var(--ramps-secondary-80-xspector);
2204
- --secondary-ramps-secondary-90: var(--ramps-secondary-90-xspector);
2205
- --secondary-ramps-secondary-100: var(--ramps-secondary-100-xspector);
2206
- --secondary-ramps-secondary-110: var(--ramps-secondary-110-xspector);
2207
- --secondary-ramps-secondary-120: var(--ramps-secondary-120-xspector);
2208
- --secondary-ramps-secondary-130: var(--ramps-secondary-130-xspector);
2209
- --secondary-ramps-secondary-140: var(--ramps-secondary-140-xspector);
2210
- --secondary-ramps-secondary-150: var(--ramps-secondary-150-xspector);
2211
- /* Tertiary */
2212
- --tertiary-ramps-tertiary-5: var(--ramps-tertiary-5-xspector);
2213
- --tertiary-ramps-tertiary-10: var(--ramps-tertiary-10-xspector);
2214
- --tertiary-ramps-tertiary-20: var(--ramps-tertiary-20-xspector);
2215
- --tertiary-ramps-tertiary-30: var(--ramps-tertiary-30-xspector);
2216
- --tertiary-ramps-tertiary-40: var(--ramps-tertiary-40-xspector);
2217
- --tertiary-ramps-tertiary-50: var(--ramps-tertiary-50-xspector);
2218
- --tertiary-ramps-tertiary-60: var(--ramps-tertiary-60-xspector);
2219
- --tertiary-ramps-tertiary-70: var(--ramps-tertiary-70-xspector);
2220
- --tertiary-ramps-tertiary-80: var(--ramps-tertiary-80-xspector);
2221
- --tertiary-ramps-tertiary-90: var(--ramps-tertiary-90-xspector);
2222
- --tertiary-ramps-tertiary-100: var(--ramps-tertiary-100-xspector);
2223
- --tertiary-ramps-tertiary-110: var(--ramps-tertiary-110-xspector);
2224
- --tertiary-ramps-tertiary-120: var(--ramps-tertiary-120-xspector);
2225
- --tertiary-ramps-tertiary-130: var(--ramps-tertiary-130-xspector);
2226
- --tertiary-ramps-tertiary-140: var(--ramps-tertiary-140-xspector);
2227
- --tertiary-ramps-tertiary-150: var(--ramps-tertiary-150-xspector);
2228
- /* Grey */
2229
- --grey-grey-5: var(--ramps-grey-5-xspector);
2230
- --grey-grey-10: var(--ramps-grey-10-xspector);
2231
- --grey-grey-20: var(--ramps-grey-20-xspector);
2232
- --grey-grey-30: var(--ramps-grey-30-xspector);
2233
- --grey-grey-40: var(--ramps-grey-40-xspector);
2234
- --grey-grey-50: var(--ramps-grey-50-xspector);
2235
- --grey-grey-60: var(--ramps-grey-60-xspector);
2236
- --grey-grey-70: var(--ramps-grey-70-xspector);
2237
- --grey-grey-80: var(--ramps-grey-80-xspector);
2238
- --grey-grey-90: var(--ramps-grey-90-xspector);
2239
- --grey-grey-100: var(--ramps-grey-100-xspector);
2240
- --grey-grey-110: var(--ramps-grey-110-xspector);
2241
- --grey-grey-120: var(--ramps-grey-120-xspector);
2242
- --grey-grey-130: var(--ramps-grey-130-xspector);
2243
- --grey-grey-140: var(--ramps-grey-140-xspector);
2244
- --grey-grey-150: var(--ramps-grey-150-xspector);
2245
- /* Grey2 */
2246
- --grey2-grey2-50: var(--ramps-grey2-50-xspector);
2247
- --grey2-grey2-100: var(--ramps-grey2-100-xspector);
2248
- --grey2-grey2-200: var(--ramps-grey2-200-xspector);
2249
- --grey2-grey2-300: var(--ramps-grey2-300-xspector);
2250
- --grey2-grey2-400: var(--ramps-grey2-400-xspector);
2251
- --grey2-grey2-500: var(--ramps-grey2-500-xspector);
2252
- --grey2-grey2-600: var(--ramps-grey2-600-xspector);
2253
- --grey2-grey2-700: var(--ramps-grey2-700-xspector);
2254
- --grey2-grey2-800: var(--ramps-grey2-800-xspector);
2255
- --grey2-grey2-900: var(--ramps-grey2-900-xspector);
2256
- --grey2-grey2-950: var(--ramps-grey2-950-xspector);
2257
- /* Info */
2258
- --info-info-50: var(--ramps-info-50-xspector);
2259
- --info-info-100: var(--ramps-info-100-xspector);
2260
- --info-info-200: var(--ramps-info-200-xspector);
2261
- --info-info-300: var(--ramps-info-300-xspector);
2262
- --info-info-400: var(--ramps-info-400-xspector);
2263
- --info-info-500: var(--ramps-info-500-xspector);
2264
- --info-info-600: var(--ramps-info-600-xspector);
2265
- --info-info-700: var(--ramps-info-700-xspector);
2266
- --info-info-800: var(--ramps-info-800-xspector);
2267
- --info-info-900: var(--ramps-info-900-xspector);
2268
- --info-info-950: var(--ramps-info-950-xspector);
2269
- /* Success */
2270
- --success-success-50: var(--ramps-success-50-xspector);
2271
- --success-success-100: var(--ramps-success-100-xspector);
2272
- --success-success-200: var(--ramps-success-200-xspector);
2273
- --success-success-300: var(--ramps-success-300-xspector);
2274
- --success-success-400: var(--ramps-success-400-xspector);
2275
- --success-success-500: var(--ramps-success-500-xspector);
2276
- --success-success-600: var(--ramps-success-600-xspector);
2277
- --success-success-700: var(--ramps-success-700-xspector);
2278
- --success-success-800: var(--ramps-success-800-xspector);
2279
- --success-success-900: var(--ramps-success-900-xspector);
2280
- --success-success-950: var(--ramps-success-950-xspector);
2281
- /* Warning */
2282
- --warning-warning-50: var(--ramps-warning-50-xspector);
2283
- --warning-warning-100: var(--ramps-warning-100-xspector);
2284
- --warning-warning-200: var(--ramps-warning-200-xspector);
2285
- --warning-warning-300: var(--ramps-warning-300-xspector);
2286
- --warning-warning-400: var(--ramps-warning-400-xspector);
2287
- --warning-warning-500: var(--ramps-warning-500-xspector);
2288
- --warning-warning-600: var(--ramps-warning-600-xspector);
2289
- --warning-warning-700: var(--ramps-warning-700-xspector);
2290
- --warning-warning-800: var(--ramps-warning-800-xspector);
2291
- --warning-warning-900: var(--ramps-warning-900-xspector);
2292
- --warning-warning-950: var(--ramps-warning-950-xspector);
2293
- /* Error */
2294
- --error-error-50: var(--ramps-error-50-xspector);
2295
- --error-error-100: var(--ramps-error-100-xspector);
2296
- --error-error-200: var(--ramps-error-200-xspector);
2297
- --error-error-300: var(--ramps-error-300-xspector);
2298
- --error-error-400: var(--ramps-error-400-xspector);
2299
- --error-error-500: var(--ramps-error-500-xspector);
2300
- --error-error-600: var(--ramps-error-600-xspector);
2301
- --error-error-700: var(--ramps-error-700-xspector);
2302
- --error-error-800: var(--ramps-error-800-xspector);
2303
- --error-error-900: var(--ramps-error-900-xspector);
2304
- --error-error-950: var(--ramps-error-950-xspector);
2305
- /* ------------------------------------------------------------------ */
2306
- /* State Tokens — from variable_lasted.css */
2307
- /* ------------------------------------------------------------------ */
2308
- /* Maps --state-color-* (code) → --state-*-xspector (Figma export) */
2309
- /* Primary */
2310
- --state-color-primary-default: var(--state-primary-default-xspector);
2311
- --state-color-primary-hover: var(--state-primary-hover-xspector);
2312
- --state-color-primary-stroke: var(--state-primary-stroke-xspector);
2313
- --state-color-primary-hover-bg: var(--state-primary-hover-bg-xspector);
2314
- --state-color-primary-pressed: var(--state-primary-pressed-xspector);
2315
- --state-color-primary-active: var(--state-primary-active-xspector);
2316
- --state-color-primary-text-solid: var(--state-primary-text-solid-xspector);
2317
- --state-color-primary-text-outline: var(--state-primary-text-outline-xspector);
2318
- --state-color-primary-text-hover: var(--state-primary-text-hover-xspector);
2319
- --state-color-primary-text-pressed: var(--state-primary-text-pressed-xspector);
2320
- /* Secondary */
2321
- --state-color-secondary-default: var(--state-secondary-default-xspector);
2322
- --state-color-secondary-hover: var(--state-secondary-hover-xspector);
2323
- --state-color-secondary-stroke: var(--state-secondary-stroke-xspector);
2324
- --state-color-secondary-hover-bg: var(--state-secondary-hover-bg-xspector);
2325
- --state-color-secondary-pressed: var(--state-secondary-pressed-xspector);
2326
- --state-color-secondary-active: var(--state-secondary-active-xspector);
2327
- --state-color-secondary-text-solid: var(--state-secondary-text-solid-xspector);
2328
- --state-color-secondary-text-outline: var(--state-secondary-text-outline-xspector);
2329
- --state-color-secondary-text-hover: var(--state-secondary-text-hover-xspector);
2330
- --state-color-secondary-text-pressed: var(--state-secondary-text-pressed-xspector);
2331
- /* Tertiary — note: variable_lasted uses state-tertiery (typo) */
2332
- --state-color-tertiary-default: var(--state-tertiery-default-xspector);
2333
- --state-color-tertiary-hover: var(--state-tertiery-hover-xspector);
2334
- --state-color-tertiary-stroke: var(--state-tertiery-stroke-xspector);
2335
- --state-color-tertiary-hover-bg: var(--state-tertiery-hover-bg-xspector);
2336
- --state-color-tertiary-pressed: var(--state-tertiery-pressed-xspector);
2337
- --state-color-tertiary-active: var(--state-tertiery-active-xspector);
2338
- --state-color-tertiary-text-solid: var(--state-tertiery-text-solid-xspector);
2339
- --state-color-tertiary-text-outline: var(--state-tertiery-text-outline-xspector);
2340
- --state-color-tertiary-text-hover: var(--state-tertiery-text-hover-xspector);
2341
- --state-color-tertiary-text-pressed: var(--state-tertiery-text-pressed-xspector);
2342
- /* Info */
2343
- --state-color-info-default: var(--state-info-default-xspector);
2344
- --state-color-info-hover: var(--state-info-hover-xspector);
2345
- --state-color-info-stroke: var(--state-info-stroke-xspector);
2346
- --state-color-info-hover-bg: var(--state-info-hover-bg-xspector);
2347
- --state-color-info-pressed: var(--state-info-pressed-xspector);
2348
- --state-color-info-active: var(--state-info-active-xspector);
2349
- --state-color-info-text-solid: var(--state-info-text-solid-xspector);
2350
- --state-color-info-text-outline: var(--state-info-text-outline-xspector);
2351
- --state-color-info-text-hover: var(--state-info-text-hover-xspector);
2352
- --state-color-info-text-pressed: var(--state-info-text-pressed-xspector);
2353
- /* Success */
2354
- --state-color-success-default: var(--state-success-default-xspector);
2355
- --state-color-success-hover: var(--state-success-hover-xspector);
2356
- --state-color-success-stroke: var(--state-success-stroke-xspector);
2357
- --state-color-success-hover-bg: var(--state-success-hover-bg-xspector);
2358
- --state-color-success-pressed: var(--state-success-pressed-xspector);
2359
- --state-color-success-active: var(--state-success-active-xspector);
2360
- --state-color-success-text-solid: var(--state-success-text-solid-xspector);
2361
- --state-color-success-text-outline: var(--state-success-text-outline-xspector);
2362
- --state-color-success-text-hover: var(--state-success-text-hover-xspector);
2363
- --state-color-success-text-pressed: var(--state-success-text-pressed-xspector);
2364
- /* Warning */
2365
- --state-color-warning-default: var(--state-warning-default-xspector);
2366
- --state-color-warning-hover: var(--state-warning-hover-xspector);
2367
- --state-color-warning-stroke: var(--state-warning-stroke-xspector);
2368
- --state-color-warning-hover-bg: var(--state-warning-hover-bg-xspector);
2369
- --state-color-warning-pressed: var(--state-warning-pressed-xspector);
2370
- --state-color-warning-active: var(--state-warning-active-xspector);
2371
- --state-color-warning-text-solid: var(--state-warning-text-solid-xspector);
2372
- --state-color-warning-text-outline: var(--state-warning-text-outline-xspector);
2373
- --state-color-warning-text-hover: var(--state-warning-text-hover-xspector);
2374
- --state-color-warning-text-pressed: var(--state-warning-text-pressed-xspector);
2375
- /* Error */
2376
- --state-color-error-default: var(--state-error-default-xspector);
2377
- --state-color-error-hover: var(--state-error-hover-xspector);
2378
- --state-color-error-stroke: var(--state-error-stroke-xspector);
2379
- --state-color-error-hover-bg: var(--state-error-hover-bg-xspector);
2380
- --state-color-error-pressed: var(--state-error-pressed-xspector);
2381
- --state-color-error-active: var(--state-error-active-xspector);
2382
- --state-color-error-text-solid: var(--state-error-text-solid-xspector);
2383
- --state-color-error-text-outline: var(--state-error-text-outline-xspector);
2384
- --state-color-error-text-hover: var(--state-error-text-hover-xspector);
2385
- --state-color-error-text-pressed: var(--state-error-text-pressed-xspector);
2386
- /* Disable */
2387
- --state-color-disable-solid: var(--state-disable-solid-xspector);
2388
- --state-color-disable-outline: var(--state-disable-outline-xspector);
1117
+ }
1118
+
1119
+ :root[data-theme="xspector"]{
1120
+ --primary-ramps-primary-5: #fdfcf2;
1121
+ --primary-ramps-primary-10: #fcfae5;
1122
+ --primary-ramps-primary-20: #f8f5cc;
1123
+ --primary-ramps-primary-30: #f5f0b2;
1124
+ --primary-ramps-primary-40: #f1eb99;
1125
+ --primary-ramps-primary-50: #eee680;
1126
+ --primary-ramps-primary-60: #ebe166;
1127
+ --primary-ramps-primary-70: #e7dc4d;
1128
+ --primary-ramps-primary-80: #e4d733;
1129
+ --primary-ramps-primary-90: #e0d21a;
1130
+ --primary-ramps-primary-100: #ddcd00;
1131
+ --primary-ramps-primary-110: #c7b800;
1132
+ --primary-ramps-primary-120: #b1a400;
1133
+ --primary-ramps-primary-130: #9b8f00;
1134
+ --primary-ramps-primary-140: #857b00;
1135
+ --primary-ramps-primary-150: #6f6700;
1136
+ --secondary-ramps-secondary-5: #fafafa;
1137
+ --secondary-ramps-secondary-10: #f5f5f5;
1138
+ --secondary-ramps-secondary-20: #ececec;
1139
+ --secondary-ramps-secondary-30: #e2e2e2;
1140
+ --secondary-ramps-secondary-40: #d8d8d8;
1141
+ --secondary-ramps-secondary-50: #cfcfcf;
1142
+ --secondary-ramps-secondary-60: #c5c5c5;
1143
+ --secondary-ramps-secondary-70: #bbbbbb;
1144
+ --secondary-ramps-secondary-80: #b1b1b1;
1145
+ --secondary-ramps-secondary-90: #a8a8a8;
1146
+ --secondary-ramps-secondary-100: #9e9e9e;
1147
+ --secondary-ramps-secondary-110: #8e8e8e;
1148
+ --secondary-ramps-secondary-120: #7e7e7e;
1149
+ --secondary-ramps-secondary-130: #6f6f6f;
1150
+ --secondary-ramps-secondary-140: #5f5f5f;
1151
+ --secondary-ramps-secondary-150: #4f4f4f;
1152
+ --tertiary-ramps-tertiary-5: #fbfcfd;
1153
+ --tertiary-ramps-tertiary-10: #f7fafb;
1154
+ --tertiary-ramps-tertiary-20: #eff4f7;
1155
+ --tertiary-ramps-tertiary-30: #e6eff3;
1156
+ --tertiary-ramps-tertiary-40: #deeaef;
1157
+ --tertiary-ramps-tertiary-50: #d6e5eb;
1158
+ --tertiary-ramps-tertiary-60: #cedfe6;
1159
+ --tertiary-ramps-tertiary-70: #c6dae2;
1160
+ --tertiary-ramps-tertiary-80: #bdd5de;
1161
+ --tertiary-ramps-tertiary-90: #b5cfda;
1162
+ --tertiary-ramps-tertiary-100: #adcad6;
1163
+ --tertiary-ramps-tertiary-110: #9cb6c1;
1164
+ --tertiary-ramps-tertiary-120: #8aa2ab;
1165
+ --tertiary-ramps-tertiary-130: #798d96;
1166
+ --tertiary-ramps-tertiary-140: #687980;
1167
+ --tertiary-ramps-tertiary-150: #57656b;
1168
+ --grey-grey-5: #fafafa;
1169
+ --grey-grey-10: #f5f5f5;
1170
+ --grey-grey-20: #ececec;
1171
+ --grey-grey-30: #e2e2e2;
1172
+ --grey-grey-40: #d8d8d8;
1173
+ --grey-grey-50: #cfcfcf;
1174
+ --grey-grey-60: #c5c5c5;
1175
+ --grey-grey-70: #bbbbbb;
1176
+ --grey-grey-80: #b1b1b1;
1177
+ --grey-grey-90: #a8a8a8;
1178
+ --grey-grey-100: #9e9e9e;
1179
+ --grey-grey-110: #8e8e8e;
1180
+ --grey-grey-120: #7e7e7e;
1181
+ --grey-grey-130: #6f6f6f;
1182
+ --grey-grey-140: #5f5f5f;
1183
+ --grey-grey-150: #4f4f4f;
1184
+ --grey2-grey2-50: #f8fafa;
1185
+ --grey2-grey2-100: #f2f5f5;
1186
+ --grey2-grey2-200: #e7ebed;
1187
+ --grey2-grey2-300: #d3dadf;
1188
+ --grey2-grey2-400: #bac5cb;
1189
+ --grey2-grey2-500: #9dabb5;
1190
+ --grey2-grey2-600: #919eab;
1191
+ --grey2-grey2-700: #72808f;
1192
+ --grey2-grey2-800: #606b77;
1193
+ --grey2-grey2-900: #4f5863;
1194
+ --grey2-grey2-950: #343b41;
1195
+ --info-info-50: #eef8ff;
1196
+ --info-info-100: #d9efff;
1197
+ --info-info-200: #bce4ff;
1198
+ --info-info-300: #8ed5ff;
1199
+ --info-info-400: #59bbff;
1200
+ --info-info-500: #2998ff;
1201
+ --info-info-600: #1b7df5;
1202
+ --info-info-700: #1466e1;
1203
+ --info-info-800: #1752b6;
1204
+ --info-info-900: #19478f;
1205
+ --info-info-950: #142c57;
1206
+ --success-success-50: #effce9;
1207
+ --success-success-100: #daf9ce;
1208
+ --success-success-200: #b8f3a3;
1209
+ --success-success-300: #8ce86e;
1210
+ --success-success-400: #54d62c;
1211
+ --success-success-500: #44c022;
1212
+ --success-success-600: #319917;
1213
+ --success-success-700: #277516;
1214
+ --success-success-800: #235d17;
1215
+ --success-success-900: #214f18;
1216
+ --success-success-950: #0c2b08;
1217
+ --warning-warning-50: #ffffea;
1218
+ --warning-warning-100: #fffbc5;
1219
+ --warning-warning-200: #fff885;
1220
+ --warning-warning-300: #ffee46;
1221
+ --warning-warning-400: #ffdf1b;
1222
+ --warning-warning-500: #ffc107;
1223
+ --warning-warning-600: #e29400;
1224
+ --warning-warning-700: #bb6902;
1225
+ --warning-warning-800: #985108;
1226
+ --warning-warning-900: #7c420b;
1227
+ --warning-warning-950: #482200;
1228
+ --error-error-50: #fff3f1;
1229
+ --error-error-100: #ffe3df;
1230
+ --error-error-200: #ffccc5;
1231
+ --error-error-300: #ffa99d;
1232
+ --error-error-400: #ff7664;
1233
+ --error-error-500: #ff4d35;
1234
+ --error-error-600: #ed2f15;
1235
+ --error-error-700: #c8230d;
1236
+ --error-error-800: #a5210f;
1237
+ --error-error-900: #882214;
1238
+ --error-error-950: #4b0c04;
2389
1239
  /* ------------------------------------------------------------------ */
2390
- /* Semantic Colors — from variable_lasted.css */
1240
+ /* State Tokens */
2391
1241
  /* ------------------------------------------------------------------ */
2392
- /* Input */
2393
- --input-color-default-text: var(--input-default-text-xspector);
2394
- --input-color-default-stroke: var(--input-default-stroke-xspector);
2395
- --input-color-filled-text: var(--input-filled-text-xspector);
2396
- --input-color-active-stroke: var(--input-active-stroke-xspector);
2397
- --input-color-disable-text: var(--input-disable-text-xspector);
2398
- --input-color-disable-stroke: var(--input-disable-stroke-xspector);
2399
- --input-color-disable-bg: var(--input-disable-bg-xspector);
2400
- --input-color-label-bg: var(--input-label-bg-xspector);
2401
- --input-color-error: var(--input-error-xspector);
1242
+ /* Naming Convention: --state-color-[theme]-[element?]-[state] */
1243
+ /* States: [default, hover, pressed, disabled] */
1244
+ --state-color-primary-default: #b1a400;
1245
+ --state-color-primary-hover: #ddcd00;
1246
+ --state-color-primary-stroke: rgba(177 164 0 / 0.48);
1247
+ --state-color-primary-hover-bg: rgba(221 205 0 / 0.08);
1248
+ --state-color-primary-pressed: #6f6700;
1249
+ --state-color-primary-active: #ddcd00;
1250
+ --state-color-primary-text-solid: #212B36;
1251
+ --state-color-primary-text-outline: #b1a400;
1252
+ --state-color-primary-text-hover: #ddcd00;
1253
+ --state-color-primary-text-pressed: #6f6700;
1254
+ --state-color-secondary-default: #ececec;
1255
+ --state-color-secondary-hover: #fafafa;
1256
+ --state-color-secondary-stroke: rgba(236 236 236 / 0.48);
1257
+ --state-color-secondary-hover-bg: rgba(250 250 250 / 0.08);
1258
+ --state-color-secondary-pressed: #bbbbbb;
1259
+ --state-color-secondary-active: #fafafa;
1260
+ --state-color-secondary-text-solid: #212B36;
1261
+ --state-color-secondary-text-outline: #ececec;
1262
+ --state-color-secondary-text-hover: #fafafa;
1263
+ --state-color-secondary-text-pressed: #bbbbbb;
1264
+ --state-color-tertiary-default: #8aa2ab;
1265
+ --state-color-tertiary-hover: #adcad6;
1266
+ --state-color-tertiary-stroke: rgba(138 162 171 / 0.48);
1267
+ --state-color-tertiary-hover-bg: rgba(173 202 214 / 0.08);
1268
+ --state-color-tertiary-pressed: #57656b;
1269
+ --state-color-tertiary-active: #adcad6;
1270
+ --state-color-tertiary-text-solid: #212B36;
1271
+ --state-color-tertiary-text-outline: #8aa2ab;
1272
+ --state-color-tertiary-text-hover: #adcad6;
1273
+ --state-color-tertiary-text-pressed: #57656b;
1274
+ --state-color-info-default: #1b7df5;
1275
+ --state-color-info-hover: #2998ff;
1276
+ --state-color-info-stroke: rgba(27 125 245 / 0.48);
1277
+ --state-color-info-hover-bg: rgba(41 152 255 / 0.08);
1278
+ --state-color-info-pressed: #1752b6;
1279
+ --state-color-info-active: #2998ff;
1280
+ --state-color-info-text-solid: #ffffff;
1281
+ --state-color-info-text-outline: #1b7df5;
1282
+ --state-color-info-text-hover: #2998ff;
1283
+ --state-color-info-text-pressed: #1752b6;
1284
+ --state-color-success-default: #319917;
1285
+ --state-color-success-hover: #44c022;
1286
+ --state-color-success-stroke: rgba(49 153 23 / 0.48);
1287
+ --state-color-success-hover-bg: rgba(84 214 44 / 0.08);
1288
+ --state-color-success-pressed: #235d17;
1289
+ --state-color-success-active: #44c022;
1290
+ --state-color-success-text-solid: #ffffff;
1291
+ --state-color-success-text-outline: #319917;
1292
+ --state-color-success-text-hover: #44c022;
1293
+ --state-color-success-text-pressed: #235d17;
1294
+ --state-color-warning-default: #ffc107;
1295
+ --state-color-warning-hover: #ffdf1b;
1296
+ --state-color-warning-stroke: rgba(255 193 7 / 0.48);
1297
+ --state-color-warning-hover-bg: rgba(255 193 7 / 0.08);
1298
+ --state-color-warning-pressed: #985108;
1299
+ --state-color-warning-active: #ffc107;
1300
+ --state-color-warning-text-solid: #ffffff;
1301
+ --state-color-warning-text-outline: #ffc107;
1302
+ --state-color-warning-text-hover: #ffdf1b;
1303
+ --state-color-warning-text-pressed: #985108;
1304
+ --state-color-error-default: #ed2f15;
1305
+ --state-color-error-hover: #ff4d35;
1306
+ --state-color-error-stroke: rgba(237 47 21 / 0.48);
1307
+ --state-color-error-hover-bg: rgba(255 77 53 / 0.08);
1308
+ --state-color-error-pressed: #a5210f;
1309
+ --state-color-error-active: #ff4d35;
1310
+ --state-color-error-text-solid: #ffffff;
1311
+ --state-color-error-text-outline: #ed2f15;
1312
+ --state-color-error-text-hover: #ff4d35;
1313
+ --state-color-error-text-pressed: #a5210f;
1314
+ --state-color-disable-solid: #454f5b;
1315
+ --state-color-disable-outline: #637381;
1316
+ /* Base from design */
1317
+ --input-color-default-text: #9e9e9e;
1318
+ --input-color-default-stroke: rgba(158 158 158 / 0.24);
1319
+ --input-color-filled-text: #dfe3e8;
1320
+ --input-color-active-stroke: rgba(158 158 158 / 0.48);
1321
+ --input-color-disable-text: rgba(145 158 171 / 0.52);
1322
+ --input-color-disable-stroke: rgba(145 158 171 / 0.08);
1323
+ --input-color-disable-bg: rgba(145 158 171 / 0.04);
1324
+ --input-color-label-bg: #2d2e30;
1325
+ --input-color-error: #ff4d35;
2402
1326
  /* Function button */
2403
- --function-default-solid: var(--function-default-solid-xspector);
2404
- --function-default-hover: var(--function-default-hover-xspector);
2405
- --function-default-hover-bg: var(--function-default-hover-bg-xspector);
2406
- --function-default-stroke: var(--function-default-stroke-xspector);
2407
- --function-default-icon: var(--function-default-icon-xspector);
2408
- --function-default-outline-icon: var(--function-default-outline-icon-xspector);
2409
- --function-active-solid: var(--function-active-solid-xspector);
2410
- --function-active-hover: var(--function-active-hover-xspector);
2411
- --function-active-hover-bg: var(--function-active-hover-bg-xspector);
2412
- --function-active-stroke: var(--function-active-stroke-xspector);
2413
- --function-active-icon: var(--function-active-icon-xspector);
2414
- /* Text */
2415
- --text-black: var(--text-black-xspector);
2416
- --text-dark: var(--text-dark-xspector);
2417
- --text-medium: var(--text-medium-xspector);
2418
- --text-light: var(--text-light-xspector);
2419
- --text-grey-dark: var(--text-grey-dark-xspector);
2420
- --text-grey-medium: var(--text-grey-medium-xspector);
2421
- --text-grey-light: var(--text-grey-light-xspector);
2422
- --text-white: var(--text-white-xspector);
2423
- /* Base */
2424
- --base-color-bg: var(--base-bg-bg1-xspector);
2425
- --base-color-bg2: var(--base-bg-bg2-xspector);
2426
- --base-color-bg3: var(--base-bg-bg3-xspector);
2427
- --base-color-workspace-stroke: var(--base-bg-stroke1-xspector);
2428
- --base-color-guideline-stroke: var(--base-bg-stroke2-xspector);
2429
- --base-color-popup: var(--base-modal-modal-xspector);
2430
- --base-color-popup-hightlight: var(--base-modal-modal-hightlight-xspector);
2431
- --base-color-popup-curtain: var(--base-modal-modal-curtain-xspector);
2432
- --common-white: var(--common-white-xspector);
2433
- --common-black: var(--common-black-xspector);
2434
- /* Addon */
1327
+ --function-default-solid: #ececec;
1328
+ --function-default-hover: #fafafa;
1329
+ --function-default-hover-bg: rgba(250 250 250 / 0.08);
1330
+ --function-default-stroke: rgba(158 158 158 / 0.24);
1331
+ --function-default-icon: #212b36;
1332
+ --function-default-outline-icon: #9e9e9e;
1333
+ --function-active-solid: #b1a400;
1334
+ --function-active-hover: #ddcd00;
1335
+ --function-active-hover-bg: rgba(221 205 0 / 0.08);
1336
+ --function-active-stroke: rgba(177 164 0 / 0.48);
1337
+ --function-active-icon: #212b36;
1338
+ --text-dark: #212b36;
1339
+ --text-medium: #637381;
1340
+ --text-light: #919eab;
1341
+ --text-grey-dark: #7e7e7e;
1342
+ --text-grey-medium: #aaaaaa;
1343
+ --text-grey-light: #dfe3e8;
1344
+ --text-white: #ffffff;
1345
+ --base-color-bg: #202427;
1346
+ --base-color-bg2: #282c31;
1347
+ --base-color-bg3: #d8d8d8;
1348
+ --base-color-workspace-stroke: #e2e2e2;
1349
+ --base-color-guideline-stroke: #c5c5c5;
1350
+ --base-color-popup: #2d2e30;
1351
+ --base-color-popup-hightlight: #343638;
1352
+ --base-color-popup-curtain: rgba(0 0 0 / 0.6);
1353
+ --common-white: #ffffff;
1354
+ --common-black: #000000;
1355
+ --dashboard-panel-bg-grey: rgba(145 158 171 / 0.08);
1356
+ --dashboard-panel-bg-white: rgba(255 255 255 / 0.08);
1357
+ --dashboard-panel-border: rgba(168 162 168 / 0.24);
1358
+ /* ------- Addon base ---------- */
2435
1359
  --background: var(--base-color-bg);
2436
1360
  --foreground: var(--common-white);
2437
1361
  --primary: var(--primary-ramps-primary-100);
@@ -2444,12 +1368,12 @@
2444
1368
  --grey: var(--grey-grey-100);
2445
1369
  --grey2: var(--grey2-grey2-100);
2446
1370
  --primary-foreground: var(--state-color-primary-text-solid);
2447
- --secondary-foreground: var(--state-color-secondary-text-solid);
1371
+ --secondary-foreground: var(--state-color-secondary-text-solid);
2448
1372
  --tertiary-foreground: var(--state-color-tertiary-text-solid);
2449
1373
  --info-foreground: var(--state-color-info-text-solid);
2450
- --success-foreground: var(--state-color-success-text-solid);
2451
- --warning-foreground: var(--state-color-warning-text-solid);
2452
- --error-foreground: var(--state-color-error-text-solid);
1374
+ --success-foreground: var(--state-color-success-text-solid);
1375
+ --warning-foreground: var(--state-color-warning-text-solid);
1376
+ --error-foreground: var(--state-color-error-text-solid);
2453
1377
  --grey-foreground: var(--common-black);
2454
1378
  --grey2-foreground: var(--common-black);
2455
1379
  --surface: var(--base-color-bg);
@@ -2457,86 +1381,72 @@
2457
1381
  --primary-foreground: var(--common-white);
2458
1382
  --secondary-foreground: var(--common-white);
2459
1383
  --base-color-popup-foreground: var(--text-grey-light);
2460
- /* ------------------------------------------------------------------ */
2461
- /* Transparency Variants from variable_lasted.css */
2462
- /* ------------------------------------------------------------------ */
2463
- /* Primary (main) */
2464
- --main-transparency-primary-8: var(--transparency-primary-8-xspector);
2465
- --main-transparency-primary-12: var(--transparency-primary-12-xspector);
2466
- --main-transparency-primary-16: var(--transparency-primary-16-xspector);
2467
- --main-transparency-primary-24: var(--transparency-primary-24-xspector);
2468
- --main-transparency-primary-32: var(--transparency-primary-32-xspector);
2469
- --main-transparency-primary-48: var(--transparency-primary-48-xspector);
2470
- /* Secondary (main) */
2471
- --main-transparency-secondary-8: var(--transparency-secondary-8-xspector);
2472
- --main-transparency-secondary-12: var(--transparency-secondary-12-xspector);
2473
- --main-transparency-secondary-16: var(--transparency-secondary-16-xspector);
2474
- --main-transparency-secondary-24: var(--transparency-secondary-24-xspector);
2475
- --main-transparency-secondary-32: var(--transparency-secondary-32-xspector);
2476
- --main-transparency-secondary-48: var(--transparency-secondary-48-xspector);
2477
- /* Tertiary (main) */
2478
- --main-transparency-tertiary-8: var(--transparency-tertiary-8-xspector);
2479
- --main-transparency-tertiary-12: var(--transparency-tertiary-12-xspector);
2480
- --main-transparency-tertiary-16: var(--transparency-tertiary-16-xspector);
2481
- --main-transparency-tertiary-24: var(--transparency-tertiary-24-xspector);
2482
- --main-transparency-tertiary-32: var(--transparency-tertiary-32-xspector);
2483
- --main-transparency-tertiary-48: var(--transparency-tertiary-48-xspector);
2484
- /* Info (other) */
2485
- --other-transparency-info-8: var(--transparency-info-8-xspector);
2486
- --other-transparency-info-12: var(--transparency-info-12-xspector);
2487
- --other-transparency-info-16: var(--transparency-info-16-xspector);
2488
- --other-transparency-info-24: var(--transparency-info-24-xspector);
2489
- --other-transparency-info-32: var(--transparency-info-32-xspector);
2490
- --other-transparency-info-48: var(--transparency-info-48-xspector);
2491
- /* Success (other) */
2492
- --other-transparency-success-8: var(--transparency-success-8-xspector);
2493
- --other-transparency-success-12: var(--transparency-success-12-xspector);
2494
- --other-transparency-success-16: var(--transparency-success-16-xspector);
2495
- --other-transparency-success-24: var(--transparency-success-24-xspector);
2496
- --other-transparency-success-32: var(--transparency-success-32-xspector);
2497
- --other-transparency-success-48: var(--transparency-success-48-xspector);
2498
- /* Warning (other) */
2499
- --other-transparency-warning-8: var(--transparency-warning-8-xspector);
2500
- --other-transparency-warning-12: var(--transparency-warning-12-xspector);
2501
- --other-transparency-warning-16: var(--transparency-warning-16-xspector);
2502
- --other-transparency-warning-24: var(--transparency-warning-24-xspector);
2503
- --other-transparency-warning-32: var(--transparency-warning-32-xspector);
2504
- --other-transparency-warning-48: var(--transparency-warning-48-xspector);
2505
- /* Error (other) */
2506
- --other-transparency-error-8: var(--transparency-error-8-xspector);
2507
- --other-transparency-error-12: var(--transparency-error-12-xspector);
2508
- --other-transparency-error-16: var(--transparency-error-16-xspector);
2509
- --other-transparency-error-24: var(--transparency-error-24-xspector);
2510
- --other-transparency-error-32: var(--transparency-error-32-xspector);
2511
- --other-transparency-error-48: var(--transparency-error-48-xspector);
2512
- /* Grey (other) */
2513
- --other-transparency-grey-8: var(--transparency-grey-8-xspector);
2514
- --other-transparency-grey-12: var(--transparency-grey-12-xspector);
2515
- --other-transparency-grey-16: var(--transparency-grey-16-xspector);
2516
- --other-transparency-grey-24: var(--transparency-grey-24-xspector);
2517
- --other-transparency-grey-32: var(--transparency-grey-32-xspector);
2518
- --other-transparency-grey-48: var(--transparency-grey-48-xspector);
2519
- /* Grey2 (other) */
2520
- --other-transparency-grey2-8: var(--transparency-grey2-8-xspector);
2521
- --other-transparency-grey2-12: var(--transparency-grey2-12-xspector);
2522
- --other-transparency-grey2-16: var(--transparency-grey2-16-xspector);
2523
- --other-transparency-grey2-24: var(--transparency-grey2-24-xspector);
2524
- --other-transparency-grey2-32: var(--transparency-grey2-32-xspector);
2525
- --other-transparency-grey2-48: var(--transparency-grey2-48-xspector);
2526
- /* White (other) */
2527
- --other-transparency-white-08: var(--transparency-white-8-xspector);
2528
- --other-transparency-white-12: var(--transparency-white-12-xspector);
2529
- --other-transparency-white-16: var(--transparency-white-16-xspector);
2530
- --other-transparency-white-24: var(--transparency-white-24-xspector);
2531
- --other-transparency-white-32: var(--transparency-white-32-xspector);
2532
- --other-transparency-white-48: var(--transparency-white-48-xspector);
2533
- /* Black (other) */
2534
- --other-transparency-black-08: var(--transparency-black-8-xspector);
2535
- --other-transparency-black-12: var(--transparency-black-12-xspector);
2536
- --other-transparency-black-16: var(--transparency-black-16-xspector);
2537
- --other-transparency-black-24: var(--transparency-black-24-xspector);
2538
- --other-transparency-black-32: var(--transparency-black-32-xspector);
2539
- --other-transparency-black-48: var(--transparency-black-48-xspector);
1384
+ --main-transparency-primary-8: rgba(221 205 0 / 0.08);
1385
+ --main-transparency-primary-12: rgba(221 205 0 / 0.12);
1386
+ --main-transparency-primary-16: rgba(221 205 0 / 0.16);
1387
+ --main-transparency-primary-24: rgba(221 205 0 / 0.24);
1388
+ --main-transparency-primary-32: rgba(221 205 0 / 0.32);
1389
+ --main-transparency-primary-48: rgba(221 205 0 / 0.48);
1390
+ --main-transparency-secondary-8: rgba(158 158 158 / 0.08);
1391
+ --main-transparency-secondary-12: rgba(158 158 158 / 0.12);
1392
+ --main-transparency-secondary-16: rgba(158 158 158 / 0.16);
1393
+ --main-transparency-secondary-24: rgba(158 158 158 / 0.24);
1394
+ --main-transparency-secondary-32: rgba(158 158 158 / 0.32);
1395
+ --main-transparency-secondary-48: rgba(158 158 158 / 0.48);
1396
+ --main-transparency-tertiary-8: rgba(173 202 214 / 0.08);
1397
+ --main-transparency-tertiary-12: rgba(173 202 214 / 0.12);
1398
+ --main-transparency-tertiary-16: rgba(173 202 214 / 0.16);
1399
+ --main-transparency-tertiary-24: rgba(173 202 214 / 0.24);
1400
+ --main-transparency-tertiary-32: rgba(173 202 214 / 0.32);
1401
+ --main-transparency-tertiary-48: rgba(173 202 214 / 0.48);
1402
+ --other-transparency-info-8: rgba(41 152 255 / 0.08);
1403
+ --other-transparency-info-12: rgba(41 152 255 / 0.12);
1404
+ --other-transparency-info-16: rgba(41 152 255 / 0.16);
1405
+ --other-transparency-info-24: rgba(41 152 255 / 0.24);
1406
+ --other-transparency-info-32: rgba(41 152 255 / 0.32);
1407
+ --other-transparency-info-48: rgba(41 152 255 / 0.48);
1408
+ --other-transparency-success-8: rgba(84 214 44 / 0.08);
1409
+ --other-transparency-success-12: rgba(84 214 44 / 0.12);
1410
+ --other-transparency-success-16: rgba(84 214 44 / 0.16);
1411
+ --other-transparency-success-24: rgba(84 214 44 / 0.24);
1412
+ --other-transparency-success-32: rgba(84 214 44 / 0.32);
1413
+ --other-transparency-success-48: rgba(84 214 44 / 0.48);
1414
+ --other-transparency-warning-8: rgba(255 193 7 / 0.08);
1415
+ --other-transparency-warning-12: rgba(255 193 7 / 0.12);
1416
+ --other-transparency-warning-16: rgba(255 193 7 / 0.16);
1417
+ --other-transparency-warning-24: rgba(255 193 7 / 0.24);
1418
+ --other-transparency-warning-32: rgba(255 193 7 / 0.32);
1419
+ --other-transparency-warning-48: rgba(255 193 7 / 0.48);
1420
+ --other-transparency-error-8: rgba(255 72 66 / 0.08);
1421
+ --other-transparency-error-12: rgba(255 72 66 / 0.12);
1422
+ --other-transparency-error-16: rgba(255 72 66 / 0.16);
1423
+ --other-transparency-error-24: rgba(255 72 66 / 0.24);
1424
+ --other-transparency-error-32: rgba(255 72 66 / 0.32);
1425
+ --other-transparency-error-48: rgba(255 72 66 / 0.48);
1426
+ --other-transparency-grey-8: rgba(158 158 158 / 0.08);
1427
+ --other-transparency-grey-12: rgba(158 158 158 / 0.12);
1428
+ --other-transparency-grey-16: rgba(158 158 158 / 0.16);
1429
+ --other-transparency-grey-24: rgba(158 158 158 / 0.24);
1430
+ --other-transparency-grey-32: rgba(158 158 158 / 0.32);
1431
+ --other-transparency-grey-48: rgba(158 158 158 / 0.48);
1432
+ --other-transparency-grey2-8: rgba(145 158 171 / 0.08);
1433
+ --other-transparency-grey2-12: rgba(145 158 171 / 0.12);
1434
+ --other-transparency-grey2-16: rgba(145 158 171 / 0.16);
1435
+ --other-transparency-grey2-24: rgba(145 158 171 / 0.24);
1436
+ --other-transparency-grey2-32: rgba(145 158 171 / 0.32);
1437
+ --other-transparency-grey2-48: rgba(145 158 171 / 0.48);
1438
+ --other-transparency-white-08: rgba(255 255 255 / 0.08);
1439
+ --other-transparency-white-12: rgba(255 255 255 / 0.12);
1440
+ --other-transparency-white-16: rgba(255 255 255 / 0.16);
1441
+ --other-transparency-white-24: rgba(255 255 255 / 0.24);
1442
+ --other-transparency-white-32: rgba(255 255 255 / 0.32);
1443
+ --other-transparency-white-48: rgba(255 255 255 / 0.48);
1444
+ --other-transparency-black-08: rgba(0 0 0 / 0.08);
1445
+ --other-transparency-black-12: rgba(0 0 0 / 0.12);
1446
+ --other-transparency-black-16: rgba(0 0 0 / 0.16);
1447
+ --other-transparency-black-24: rgba(0 0 0 / 0.24);
1448
+ --other-transparency-black-32: rgba(0 0 0 / 0.32);
1449
+ --other-transparency-black-48: rgba(0 0 0 / 0.48);
2540
1450
  /* TYPE */
2541
1451
  --h1-family: "Poppins";
2542
1452
  --h2-family: "Poppins";
@@ -2692,460 +1602,6 @@
2692
1602
  ;
2693
1603
  }
2694
1604
 
2695
- :root[data-theme="skyller"] {
2696
- /* ------------------------------------------------------------------ */
2697
- /* Color Ramps — from variable_lasted.css */
2698
- /* ------------------------------------------------------------------ */
2699
- /* Maps --{base}-ramps-{base}-{num} (code) → --ramps-{base}-{num}-skyller */
2700
- /* Primary */
2701
- --primary-ramps-primary-5: var(--ramps-primary-5-skyller);
2702
- --primary-ramps-primary-10: var(--ramps-primary-10-skyller);
2703
- --primary-ramps-primary-20: var(--ramps-primary-20-skyller);
2704
- --primary-ramps-primary-30: var(--ramps-primary-30-skyller);
2705
- --primary-ramps-primary-40: var(--ramps-primary-40-skyller);
2706
- --primary-ramps-primary-50: var(--ramps-primary-50-skyller);
2707
- --primary-ramps-primary-60: var(--ramps-primary-60-skyller);
2708
- --primary-ramps-primary-70: var(--ramps-primary-70-skyller);
2709
- --primary-ramps-primary-80: var(--ramps-primary-80-skyller);
2710
- --primary-ramps-primary-90: var(--ramps-primary-90-skyller);
2711
- --primary-ramps-primary-100: var(--ramps-primary-100-skyller);
2712
- --primary-ramps-primary-110: var(--ramps-primary-110-skyller);
2713
- --primary-ramps-primary-120: var(--ramps-primary-120-skyller);
2714
- --primary-ramps-primary-130: var(--ramps-primary-130-skyller);
2715
- --primary-ramps-primary-140: var(--ramps-primary-140-skyller);
2716
- --primary-ramps-primary-150: var(--ramps-primary-150-skyller);
2717
- /* Secondary */
2718
- --secondary-ramps-secondary-5: var(--ramps-secondary-5-skyller);
2719
- --secondary-ramps-secondary-10: var(--ramps-secondary-10-skyller);
2720
- --secondary-ramps-secondary-20: var(--ramps-secondary-20-skyller);
2721
- --secondary-ramps-secondary-30: var(--ramps-secondary-30-skyller);
2722
- --secondary-ramps-secondary-40: var(--ramps-secondary-40-skyller);
2723
- --secondary-ramps-secondary-50: var(--ramps-secondary-50-skyller);
2724
- --secondary-ramps-secondary-60: var(--ramps-secondary-60-skyller);
2725
- --secondary-ramps-secondary-70: var(--ramps-secondary-70-skyller);
2726
- --secondary-ramps-secondary-80: var(--ramps-secondary-80-skyller);
2727
- --secondary-ramps-secondary-90: var(--ramps-secondary-90-skyller);
2728
- --secondary-ramps-secondary-100: var(--ramps-secondary-100-skyller);
2729
- --secondary-ramps-secondary-110: var(--ramps-secondary-110-skyller);
2730
- --secondary-ramps-secondary-120: var(--ramps-secondary-120-skyller);
2731
- --secondary-ramps-secondary-130: var(--ramps-secondary-130-skyller);
2732
- --secondary-ramps-secondary-140: var(--ramps-secondary-140-skyller);
2733
- --secondary-ramps-secondary-150: var(--ramps-secondary-150-skyller);
2734
- /* Tertiary */
2735
- --tertiary-ramps-tertiary-5: var(--ramps-tertiary-5-skyller);
2736
- --tertiary-ramps-tertiary-10: var(--ramps-tertiary-10-skyller);
2737
- --tertiary-ramps-tertiary-20: var(--ramps-tertiary-20-skyller);
2738
- --tertiary-ramps-tertiary-30: var(--ramps-tertiary-30-skyller);
2739
- --tertiary-ramps-tertiary-40: var(--ramps-tertiary-40-skyller);
2740
- --tertiary-ramps-tertiary-50: var(--ramps-tertiary-50-skyller);
2741
- --tertiary-ramps-tertiary-60: var(--ramps-tertiary-60-skyller);
2742
- --tertiary-ramps-tertiary-70: var(--ramps-tertiary-70-skyller);
2743
- --tertiary-ramps-tertiary-80: var(--ramps-tertiary-80-skyller);
2744
- --tertiary-ramps-tertiary-90: var(--ramps-tertiary-90-skyller);
2745
- --tertiary-ramps-tertiary-100: var(--ramps-tertiary-100-skyller);
2746
- --tertiary-ramps-tertiary-110: var(--ramps-tertiary-110-skyller);
2747
- --tertiary-ramps-tertiary-120: var(--ramps-tertiary-120-skyller);
2748
- --tertiary-ramps-tertiary-130: var(--ramps-tertiary-130-skyller);
2749
- --tertiary-ramps-tertiary-140: var(--ramps-tertiary-140-skyller);
2750
- --tertiary-ramps-tertiary-150: var(--ramps-tertiary-150-skyller);
2751
- /* Grey */
2752
- --grey-grey-5: var(--ramps-grey-5-skyller);
2753
- --grey-grey-10: var(--ramps-grey-10-skyller);
2754
- --grey-grey-20: var(--ramps-grey-20-skyller);
2755
- --grey-grey-30: var(--ramps-grey-30-skyller);
2756
- --grey-grey-40: var(--ramps-grey-40-skyller);
2757
- --grey-grey-50: var(--ramps-grey-50-skyller);
2758
- --grey-grey-60: var(--ramps-grey-60-skyller);
2759
- --grey-grey-70: var(--ramps-grey-70-skyller);
2760
- --grey-grey-80: var(--ramps-grey-80-skyller);
2761
- --grey-grey-90: var(--ramps-grey-90-skyller);
2762
- --grey-grey-100: var(--ramps-grey-100-skyller);
2763
- --grey-grey-110: var(--ramps-grey-110-skyller);
2764
- --grey-grey-120: var(--ramps-grey-120-skyller);
2765
- --grey-grey-130: var(--ramps-grey-130-skyller);
2766
- --grey-grey-140: var(--ramps-grey-140-skyller);
2767
- --grey-grey-150: var(--ramps-grey-150-skyller);
2768
- /* Grey2 */
2769
- --grey2-grey2-50: var(--ramps-grey2-50-skyller);
2770
- --grey2-grey2-100: var(--ramps-grey2-100-skyller);
2771
- --grey2-grey2-200: var(--ramps-grey2-200-skyller);
2772
- --grey2-grey2-300: var(--ramps-grey2-300-skyller);
2773
- --grey2-grey2-400: var(--ramps-grey2-400-skyller);
2774
- --grey2-grey2-500: var(--ramps-grey2-500-skyller);
2775
- --grey2-grey2-600: var(--ramps-grey2-600-skyller);
2776
- --grey2-grey2-700: var(--ramps-grey2-700-skyller);
2777
- --grey2-grey2-800: var(--ramps-grey2-800-skyller);
2778
- --grey2-grey2-900: var(--ramps-grey2-900-skyller);
2779
- --grey2-grey2-950: var(--ramps-grey2-950-skyller);
2780
- /* Info */
2781
- --info-info-50: var(--ramps-info-50-skyller);
2782
- --info-info-100: var(--ramps-info-100-skyller);
2783
- --info-info-200: var(--ramps-info-200-skyller);
2784
- --info-info-300: var(--ramps-info-300-skyller);
2785
- --info-info-400: var(--ramps-info-400-skyller);
2786
- --info-info-500: var(--ramps-info-500-skyller);
2787
- --info-info-600: var(--ramps-info-600-skyller);
2788
- --info-info-700: var(--ramps-info-700-skyller);
2789
- --info-info-800: var(--ramps-info-800-skyller);
2790
- --info-info-900: var(--ramps-info-900-skyller);
2791
- --info-info-950: var(--ramps-info-950-skyller);
2792
- /* Success */
2793
- --success-success-50: var(--ramps-success-50-skyller);
2794
- --success-success-100: var(--ramps-success-100-skyller);
2795
- --success-success-200: var(--ramps-success-200-skyller);
2796
- --success-success-300: var(--ramps-success-300-skyller);
2797
- --success-success-400: var(--ramps-success-400-skyller);
2798
- --success-success-500: var(--ramps-success-500-skyller);
2799
- --success-success-600: var(--ramps-success-600-skyller);
2800
- --success-success-700: var(--ramps-success-700-skyller);
2801
- --success-success-800: var(--ramps-success-800-skyller);
2802
- --success-success-900: var(--ramps-success-900-skyller);
2803
- --success-success-950: var(--ramps-success-950-skyller);
2804
- /* Warning */
2805
- --warning-warning-50: var(--ramps-warning-50-skyller);
2806
- --warning-warning-100: var(--ramps-warning-100-skyller);
2807
- --warning-warning-200: var(--ramps-warning-200-skyller);
2808
- --warning-warning-300: var(--ramps-warning-300-skyller);
2809
- --warning-warning-400: var(--ramps-warning-400-skyller);
2810
- --warning-warning-500: var(--ramps-warning-500-skyller);
2811
- --warning-warning-600: var(--ramps-warning-600-skyller);
2812
- --warning-warning-700: var(--ramps-warning-700-skyller);
2813
- --warning-warning-800: var(--ramps-warning-800-skyller);
2814
- --warning-warning-900: var(--ramps-warning-900-skyller);
2815
- --warning-warning-950: var(--ramps-warning-950-skyller);
2816
- /* Error */
2817
- --error-error-50: var(--ramps-error-50-skyller);
2818
- --error-error-100: var(--ramps-error-100-skyller);
2819
- --error-error-200: var(--ramps-error-200-skyller);
2820
- --error-error-300: var(--ramps-error-300-skyller);
2821
- --error-error-400: var(--ramps-error-400-skyller);
2822
- --error-error-500: var(--ramps-error-500-skyller);
2823
- --error-error-600: var(--ramps-error-600-skyller);
2824
- --error-error-700: var(--ramps-error-700-skyller);
2825
- --error-error-800: var(--ramps-error-800-skyller);
2826
- --error-error-900: var(--ramps-error-900-skyller);
2827
- --error-error-950: var(--ramps-error-950-skyller);
2828
- /* ------------------------------------------------------------------ */
2829
- /* State Tokens — from variable_lasted.css */
2830
- /* ------------------------------------------------------------------ */
2831
- /* Maps --state-color-* (code) → --state-*-skyller (Figma export) */
2832
- /* Primary */
2833
- --state-color-primary-default: var(--state-primary-default-skyller);
2834
- --state-color-primary-hover: var(--state-primary-hover-skyller);
2835
- --state-color-primary-stroke: var(--state-primary-stroke-skyller);
2836
- --state-color-primary-hover-bg: var(--state-primary-hover-bg-skyller);
2837
- --state-color-primary-pressed: var(--state-primary-pressed-skyller);
2838
- --state-color-primary-active: var(--state-primary-active-skyller);
2839
- --state-color-primary-text-solid: var(--state-primary-text-solid-skyller);
2840
- --state-color-primary-text-outline: var(--state-primary-text-outline-skyller);
2841
- --state-color-primary-text-hover: var(--state-primary-text-hover-skyller);
2842
- --state-color-primary-text-pressed: var(--state-primary-text-pressed-skyller);
2843
- /* Secondary */
2844
- --state-color-secondary-default: var(--state-secondary-default-skyller);
2845
- --state-color-secondary-hover: var(--state-secondary-hover-skyller);
2846
- --state-color-secondary-stroke: var(--state-secondary-stroke-skyller);
2847
- --state-color-secondary-hover-bg: var(--state-secondary-hover-bg-skyller);
2848
- --state-color-secondary-pressed: var(--state-secondary-pressed-skyller);
2849
- --state-color-secondary-active: var(--state-secondary-active-skyller);
2850
- --state-color-secondary-text-solid: var(--state-secondary-text-solid-skyller);
2851
- --state-color-secondary-text-outline: var(--state-secondary-text-outline-skyller);
2852
- --state-color-secondary-text-hover: var(--state-secondary-text-hover-skyller);
2853
- --state-color-secondary-text-pressed: var(--state-secondary-text-pressed-skyller);
2854
- /* Tertiary — note: variable_lasted uses state-tertiery (typo) */
2855
- --state-color-tertiary-default: var(--state-tertiery-default-skyller);
2856
- --state-color-tertiary-hover: var(--state-tertiery-hover-skyller);
2857
- --state-color-tertiary-stroke: var(--state-tertiery-stroke-skyller);
2858
- --state-color-tertiary-hover-bg: var(--state-tertiery-hover-bg-skyller);
2859
- --state-color-tertiary-pressed: var(--state-tertiery-pressed-skyller);
2860
- --state-color-tertiary-active: var(--state-tertiery-active-skyller);
2861
- --state-color-tertiary-text-solid: var(--state-tertiery-text-solid-skyller);
2862
- --state-color-tertiary-text-outline: var(--state-tertiery-text-outline-skyller);
2863
- --state-color-tertiary-text-hover: var(--state-tertiery-text-hover-skyller);
2864
- --state-color-tertiary-text-pressed: var(--state-tertiery-text-pressed-skyller);
2865
- /* Info */
2866
- --state-color-info-default: var(--state-info-default-skyller);
2867
- --state-color-info-hover: var(--state-info-hover-skyller);
2868
- --state-color-info-stroke: var(--state-info-stroke-skyller);
2869
- --state-color-info-hover-bg: var(--state-info-hover-bg-skyller);
2870
- --state-color-info-pressed: var(--state-info-pressed-skyller);
2871
- --state-color-info-active: var(--state-info-active-skyller);
2872
- --state-color-info-text-solid: var(--state-info-text-solid-skyller);
2873
- --state-color-info-text-outline: var(--state-info-text-outline-skyller);
2874
- --state-color-info-text-hover: var(--state-info-text-hover-skyller);
2875
- --state-color-info-text-pressed: var(--state-info-text-pressed-skyller);
2876
- /* Success */
2877
- --state-color-success-default: var(--state-success-default-skyller);
2878
- --state-color-success-hover: var(--state-success-hover-skyller);
2879
- --state-color-success-stroke: var(--state-success-stroke-skyller);
2880
- --state-color-success-hover-bg: var(--state-success-hover-bg-skyller);
2881
- --state-color-success-pressed: var(--state-success-pressed-skyller);
2882
- --state-color-success-active: var(--state-success-active-skyller);
2883
- --state-color-success-text-solid: var(--state-success-text-solid-skyller);
2884
- --state-color-success-text-outline: var(--state-success-text-outline-skyller);
2885
- --state-color-success-text-hover: var(--state-success-text-hover-skyller);
2886
- --state-color-success-text-pressed: var(--state-success-text-pressed-skyller);
2887
- /* Warning */
2888
- --state-color-warning-default: var(--state-warning-default-skyller);
2889
- --state-color-warning-hover: var(--state-warning-hover-skyller);
2890
- --state-color-warning-stroke: var(--state-warning-stroke-skyller);
2891
- --state-color-warning-hover-bg: var(--state-warning-hover-bg-skyller);
2892
- --state-color-warning-pressed: var(--state-warning-pressed-skyller);
2893
- --state-color-warning-active: var(--state-warning-active-skyller);
2894
- --state-color-warning-text-solid: var(--state-warning-text-solid-skyller);
2895
- --state-color-warning-text-outline: var(--state-warning-text-outline-skyller);
2896
- --state-color-warning-text-hover: var(--state-warning-text-hover-skyller);
2897
- --state-color-warning-text-pressed: var(--state-warning-text-pressed-skyller);
2898
- /* Error */
2899
- --state-color-error-default: var(--state-error-default-skyller);
2900
- --state-color-error-hover: var(--state-error-hover-skyller);
2901
- --state-color-error-stroke: var(--state-error-stroke-skyller);
2902
- --state-color-error-hover-bg: var(--state-error-hover-bg-skyller);
2903
- --state-color-error-pressed: var(--state-error-pressed-skyller);
2904
- --state-color-error-active: var(--state-error-active-skyller);
2905
- --state-color-error-text-solid: var(--state-error-text-solid-skyller);
2906
- --state-color-error-text-outline: var(--state-error-text-outline-skyller);
2907
- --state-color-error-text-hover: var(--state-error-text-hover-skyller);
2908
- --state-color-error-text-pressed: var(--state-error-text-pressed-skyller);
2909
- /* Disable */
2910
- --state-color-disable-solid: var(--state-disable-solid-skyller);
2911
- --state-color-disable-outline: var(--state-disable-outline-skyller);
2912
- /* ------------------------------------------------------------------ */
2913
- /* Semantic Colors — from variable_lasted.css */
2914
- /* ------------------------------------------------------------------ */
2915
- /* Input */
2916
- --input-color-default-text: var(--input-default-text-skyller);
2917
- --input-color-default-stroke: var(--input-default-stroke-skyller);
2918
- --input-color-filled-text: var(--input-filled-text-skyller);
2919
- --input-color-active-stroke: var(--input-active-stroke-skyller);
2920
- --input-color-disable-text: var(--input-disable-text-skyller);
2921
- --input-color-disable-stroke: var(--input-disable-stroke-skyller);
2922
- --input-color-disable-bg: var(--input-disable-bg-skyller);
2923
- --input-color-label-bg: var(--input-label-bg-skyller);
2924
- --input-color-error: var(--input-error-skyller);
2925
- /* Function button */
2926
- --function-default-solid: var(--function-default-solid-skyller);
2927
- --function-default-hover: var(--function-default-hover-skyller);
2928
- --function-default-hover-bg: var(--function-default-hover-bg-skyller);
2929
- --function-default-stroke: var(--function-default-stroke-skyller);
2930
- --function-default-icon: var(--function-default-icon-skyller);
2931
- --function-default-outline-icon: var(--function-default-outline-icon-skyller);
2932
- --function-active-solid: var(--function-active-solid-skyller);
2933
- --function-active-hover: var(--function-active-hover-skyller);
2934
- --function-active-hover-bg: var(--function-active-hover-bg-skyller);
2935
- --function-active-stroke: var(--function-active-stroke-skyller);
2936
- --function-active-icon: var(--function-active-icon-skyller);
2937
- /* Text */
2938
- --text-black: var(--text-black-skyller);
2939
- --text-dark: var(--text-dark-skyller);
2940
- --text-medium: var(--text-medium-skyller);
2941
- --text-light: var(--text-light-skyller);
2942
- --text-grey-dark: var(--text-grey-dark-skyller);
2943
- --text-grey-medium: var(--text-grey-medium-skyller);
2944
- --text-grey-light: var(--text-grey-light-skyller);
2945
- --text-white: var(--text-white-skyller);
2946
- /* Base */
2947
- --base-color-bg: var(--base-bg-bg1-skyller);
2948
- --base-color-bg2: var(--base-bg-bg2-skyller);
2949
- --base-color-bg3: var(--base-bg-bg3-skyller);
2950
- --base-color-workspace-stroke: var(--base-bg-stroke1-skyller);
2951
- --base-color-guideline-stroke: var(--base-bg-stroke2-skyller);
2952
- --base-color-popup: var(--base-modal-modal-skyller);
2953
- --base-color-popup-hightlight: var(--base-modal-modal-hightlight-skyller);
2954
- --base-color-popup-curtain: var(--base-modal-modal-curtain-skyller);
2955
- --common-white: var(--common-white-skyller);
2956
- --common-black: var(--common-black-skyller);
2957
- /* Addon */
2958
- --background: var(--base-color-bg);
2959
- --foreground: var(--common-black);
2960
- --primary: var(--ramps-primary-100-skyller);
2961
- --secondary: var(--ramps-secondary-100-skyller);
2962
- --tertiary: var(--ramps-tertiary-100-skyller);
2963
- --info: var(--info-info-100);
2964
- --success: var(--success-success-100);
2965
- --warning: var(--warning-warning-100);
2966
- --error: var(--error-error-100);
2967
- --grey: var(--grey-grey-100);
2968
- --grey2: var(--grey2-grey2-100);
2969
- --primary-foreground: var(--state-color-primary-text-solid);
2970
- --secondary-foreground: var(--state-color-secondary-text-solid);
2971
- --tertiary-foreground: var(--state-color-tertiary-text-solid);
2972
- --info-foreground: var(--state-color-info-text-solid);
2973
- --success-foreground: var(--state-color-success-text-solid);
2974
- --warning-foreground: var(--state-color-warning-text-solid);
2975
- --error-foreground: var(--state-color-error-text-solid);
2976
- --grey-foreground: var(--common-black);
2977
- --grey2-foreground: var(--common-black);
2978
- --surface: var(--base-color-bg);
2979
- --surface-foreground: var(--common-black);
2980
- --base-color-popup-foreground: var(--text-dark);
2981
- /* ------------------------------------------------------------------ */
2982
- /* Transparency Variants — from variable_lasted.css */
2983
- /* ------------------------------------------------------------------ */
2984
- /* Maps --main/other-transparency-* (code) → --transparency-*-skyller */
2985
- /* Primary (main) */
2986
- --main-transparency-primary-8: var(--transparency-primary-8-skyller);
2987
- --main-transparency-primary-12: var(--transparency-primary-12-skyller);
2988
- --main-transparency-primary-16: var(--transparency-primary-16-skyller);
2989
- --main-transparency-primary-24: var(--transparency-primary-24-skyller);
2990
- --main-transparency-primary-32: var(--transparency-primary-32-skyller);
2991
- --main-transparency-primary-48: var(--transparency-primary-48-skyller);
2992
- /* Secondary (main) */
2993
- --main-transparency-secondary-8: var(--transparency-secondary-8-skyller);
2994
- --main-transparency-secondary-12: var(--transparency-secondary-12-skyller);
2995
- --main-transparency-secondary-16: var(--transparency-secondary-16-skyller);
2996
- --main-transparency-secondary-24: var(--transparency-secondary-24-skyller);
2997
- --main-transparency-secondary-32: var(--transparency-secondary-32-skyller);
2998
- --main-transparency-secondary-48: var(--transparency-secondary-48-skyller);
2999
- /* Tertiary (main) */
3000
- --main-transparency-tertiary-8: var(--transparency-tertiary-8-skyller);
3001
- --main-transparency-tertiary-12: var(--transparency-tertiary-12-skyller);
3002
- --main-transparency-tertiary-16: var(--transparency-tertiary-16-skyller);
3003
- --main-transparency-tertiary-24: var(--transparency-tertiary-24-skyller);
3004
- --main-transparency-tertiary-32: var(--transparency-tertiary-32-skyller);
3005
- --main-transparency-tertiary-48: var(--transparency-tertiary-48-skyller);
3006
- /* Info (other) */
3007
- --other-transparency-info-8: var(--transparency-info-8-skyller);
3008
- --other-transparency-info-12: var(--transparency-info-12-skyller);
3009
- --other-transparency-info-16: var(--transparency-info-16-skyller);
3010
- --other-transparency-info-24: var(--transparency-info-24-skyller);
3011
- --other-transparency-info-32: var(--transparency-info-32-skyller);
3012
- --other-transparency-info-48: var(--transparency-info-48-skyller);
3013
- /* Success (other) */
3014
- --other-transparency-success-8: var(--transparency-success-8-skyller);
3015
- --other-transparency-success-12: var(--transparency-success-12-skyller);
3016
- --other-transparency-success-16: var(--transparency-success-16-skyller);
3017
- --other-transparency-success-24: var(--transparency-success-24-skyller);
3018
- --other-transparency-success-32: var(--transparency-success-32-skyller);
3019
- --other-transparency-success-48: var(--transparency-success-48-skyller);
3020
- /* Warning (other) */
3021
- --other-transparency-warning-8: var(--transparency-warning-8-skyller);
3022
- --other-transparency-warning-12: var(--transparency-warning-12-skyller);
3023
- --other-transparency-warning-16: var(--transparency-warning-16-skyller);
3024
- --other-transparency-warning-24: var(--transparency-warning-24-skyller);
3025
- --other-transparency-warning-32: var(--transparency-warning-32-skyller);
3026
- --other-transparency-warning-48: var(--transparency-warning-48-skyller);
3027
- /* Error (other) */
3028
- --other-transparency-error-8: var(--transparency-error-8-skyller);
3029
- --other-transparency-error-12: var(--transparency-error-12-skyller);
3030
- --other-transparency-error-16: var(--transparency-error-16-skyller);
3031
- --other-transparency-error-24: var(--transparency-error-24-skyller);
3032
- --other-transparency-error-32: var(--transparency-error-32-skyller);
3033
- --other-transparency-error-48: var(--transparency-error-48-skyller);
3034
- /* Grey (other) */
3035
- --other-transparency-grey-8: var(--transparency-grey-8-skyller);
3036
- --other-transparency-grey-12: var(--transparency-grey-12-skyller);
3037
- --other-transparency-grey-16: var(--transparency-grey-16-skyller);
3038
- --other-transparency-grey-24: var(--transparency-grey-24-skyller);
3039
- --other-transparency-grey-32: var(--transparency-grey-32-skyller);
3040
- --other-transparency-grey-48: var(--transparency-grey-48-skyller);
3041
- /* Grey2 (other) */
3042
- --other-transparency-grey2-8: var(--transparency-grey2-8-skyller);
3043
- --other-transparency-grey2-12: var(--transparency-grey2-12-skyller);
3044
- --other-transparency-grey2-16: var(--transparency-grey2-16-skyller);
3045
- --other-transparency-grey2-24: var(--transparency-grey2-24-skyller);
3046
- --other-transparency-grey2-32: var(--transparency-grey2-32-skyller);
3047
- --other-transparency-grey2-48: var(--transparency-grey2-48-skyller);
3048
- /* White (other) — note: variable uses transparency-white-8 */
3049
- --other-transparency-white-08: var(--transparency-white-8-skyller);
3050
- --other-transparency-white-12: var(--transparency-white-12-skyller);
3051
- --other-transparency-white-16: var(--transparency-white-16-skyller);
3052
- --other-transparency-white-24: var(--transparency-white-24-skyller);
3053
- --other-transparency-white-32: var(--transparency-white-32-skyller);
3054
- --other-transparency-white-48: var(--transparency-white-48-skyller);
3055
- /* Black (other) */
3056
- --other-transparency-black-08: var(--transparency-black-8-skyller);
3057
- --other-transparency-black-12: var(--transparency-black-12-skyller);
3058
- --other-transparency-black-16: var(--transparency-black-16-skyller);
3059
- --other-transparency-black-24: var(--transparency-black-24-skyller);
3060
- --other-transparency-black-32: var(--transparency-black-32-skyller);
3061
- --other-transparency-black-48: var(--transparency-black-48-skyller);
3062
- /* ------------------------------------------------------------------ */
3063
- /* Typography */
3064
- /* ------------------------------------------------------------------ */
3065
- --h1-family: "Poppins";
3066
- --h2-family: "Poppins";
3067
- --h3-family: "Poppins";
3068
- --h4-family: "Poppins";
3069
- --h5-family: "Poppins";
3070
- --h6-family: "Poppins";
3071
- --subtitle2-family: "Poppins";
3072
- --subtitle3-family: "Poppins";
3073
- --subtitle4-family: "Poppins";
3074
- --subtitle5-family: "Poppins";
3075
- --subtitle6-family: "Poppins";
3076
- --body1-family: "Poppins";
3077
- --body2-family: "Poppins";
3078
- --body3-family: "Poppins";
3079
- --body4-family: "Poppins";
3080
- --small1-family: "Poppins";
3081
- --small2-family: "Poppins";
3082
- --small3-family: "Poppins";
3083
- --small4-family: "Poppins";
3084
- --small5-family: "Poppins";
3085
- --label-label1-family: "Poppins";
3086
- --label-label2-family: "Poppins";
3087
- --button-button-l-family: "Poppins";
3088
- --button-button-ms-family: "Poppins";
3089
- /* --------------------------------------------------------------------------------- */
3090
- /* Action Button Component Tokens */
3091
- /* --------------------------------------------------------------------------------- */
3092
- /* Naming Convention: --[component]-[mode]-[state]-[property] */
3093
- /* Mode: [solid, outline, icon] */
3094
- /* States: [default, hover, pressed, active, active-pressed active-hover disabled] */
3095
- /* --------------------------------------------------------------------------------- */
3096
- /* ------------------------------------------------------------------ */
3097
- /* Solid Mode */
3098
- /* ------------------------------------------------------------------ */
3099
- --action-button-solid-default-bg: var(--function-default-solid);
3100
- --action-button-solid-default-border: var(--function-default-solid);
3101
- --action-button-solid-default-text: var(--function-default-icon);
3102
- --action-button-solid-hover-bg: var(--function-default-hover);
3103
- --action-button-solid-hover-border: var(--function-default-hover);
3104
- --action-button-solid-hover-text: var(--function-default-icon);
3105
- --action-button-solid-pressed-bg: var(--function-default-solid);
3106
- --action-button-solid-pressed-border: var(--function-default-solid);
3107
- --action-button-solid-pressed-text: var(--function-default-icon);
3108
- --action-button-solid-active-bg: var(--function-active-solid);
3109
- --action-button-solid-active-border: var(--function-active-solid);
3110
- --action-button-solid-active-text: var(--function-active-icon);
3111
- --action-button-solid-active-hover-bg: var(--function-active-hover);
3112
- --action-button-solid-active-hover-border: var(--function-active-hover);
3113
- --action-button-solid-active-hover-text: var(--function-active-icon);
3114
- --action-button-solid-active-pressed-bg: var(--function-active-solid);
3115
- --action-button-solid-active-pressed-border: var(--function-active-solid);
3116
- --action-button-solid-active-pressed-text: var(--function-active-icon);
3117
- /* ------------------------------------------------------------------ */
3118
- /* Outline Mode */
3119
- /* ------------------------------------------------------------------ */
3120
- --action-button-outline-default-border: var(--function-default-stroke);
3121
- --action-button-outline-default-text: var(--function-default-outline-icon);
3122
- --action-button-outline-hover-bg: var(--function-default-hover-bg);
3123
- --action-button-outline-hover-border: var(--function-default-hover);
3124
- --action-button-outline-hover-text: var(--function-default-hover);
3125
- --action-button-outline-pressed-bg: var(--function-default-hover-bg);
3126
- --action-button-outline-pressed-border: var(--function-default-stroke);
3127
- --action-button-outline-pressed-text: var(--function-default-outline-icon);
3128
- --action-button-outline-active-border: var(--function-active-stroke);
3129
- --action-button-outline-active-text: var(--function-active-solid);
3130
- --action-button-outline-active-hover-bg: var(--function-active-hover-bg);
3131
- --action-button-outline-active-hover-border: var(--function-active-hover);
3132
- --action-button-outline-active-hover-text: var(--function-active-hover);
3133
- --action-button-outline-active-pressed-bg: var(--function-active-hover-bg);
3134
- --action-button-outline-active-pressed-border: var(--function-active-stroke);
3135
- --action-button-outline-active-pressed-text: var(--function-active-solid);
3136
- /* ------------------------------------------------------------------ */
3137
- /* Icon Mode */
3138
- /* ------------------------------------------------------------------ */
3139
- --action-button-icon-default-text: var(--function-default-outline-icon);
3140
- --action-button-icon-hover-bg: var(--function-default-hover-bg);
3141
- --action-button-icon-hover-text: var(--function-default-hover);
3142
- --action-button-icon-pressed-text: var(--function-default-outline-icon);
3143
- --action-button-icon-active-text: var(--function-active-solid);
3144
- --action-button-icon-active-hover-bg: var(--function-active-hover-bg);
3145
- --action-button-icon-active-hover-text: var(--function-active-hover);
3146
- --action-button-icon-active-pressed-text: var(--function-active-solid);
3147
- }
3148
-
3149
1605
  *, ::before, ::after {
3150
1606
  --tw-border-spacing-x: 0;
3151
1607
  --tw-border-spacing-y: 0;