@rhavenside/baseline-ui 1.0.22 → 1.0.23

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.
package/dist/baseline.css CHANGED
@@ -96,15 +96,15 @@
96
96
 
97
97
  :root {
98
98
  --border-width-none: 0;
99
- --border-width-thin: 1px;
100
- --border-width-base: 2px;
101
- --border-width-thick: 4px;
99
+ --border-width-thin: 0.0625rem;
100
+ --border-width-base: 0.125rem;
101
+ --border-width-thick: 0.25rem;
102
102
  --border-radius-none: 0;
103
- --border-radius-sm: 2px;
104
- --border-radius-md: 4px;
105
- --border-radius-lg: 4px;
106
- --border-radius-xl: 4px;
107
- --border-radius-2xl: 4px;
103
+ --border-radius-sm: 0.125rem;
104
+ --border-radius-md: 0.25rem;
105
+ --border-radius-lg: 0.25rem;
106
+ --border-radius-xl: 0.25rem;
107
+ --border-radius-2xl: 0.25rem;
108
108
  --border-radius-full: 9999px;
109
109
  }
110
110
 
@@ -154,8 +154,8 @@
154
154
  --form-input-padding-y-sm: 0.25rem;
155
155
  --form-input-padding-x-lg: 1.5rem;
156
156
  --form-input-padding-y-lg: 1rem;
157
- --form-input-border-width: 1px;
158
- --form-input-border-radius: 4px;
157
+ --form-input-border-width: 0.0625rem;
158
+ --form-input-border-radius: 0.25rem;
159
159
  --form-input-font-size: 1rem;
160
160
  --form-input-font-size-sm: 0.875rem;
161
161
  --form-input-font-size-lg: 1.125rem;
@@ -212,19 +212,19 @@
212
212
  --glass-bg-medium: rgba(255, 255, 255, 0.08);
213
213
  --glass-bg-heavy: rgba(255, 255, 255, 0.12);
214
214
  --glass-bg-etched: rgba(255, 255, 255, 0.15);
215
- --glass-blur-sm: 2px;
216
- --glass-blur-md: 4px;
217
- --glass-blur-lg: 6px;
218
- --glass-blur-xl: 8px;
215
+ --glass-blur-sm: 0.125rem;
216
+ --glass-blur-md: 0.25rem;
217
+ --glass-blur-lg: 0.375rem;
218
+ --glass-blur-xl: 0.5rem;
219
219
  --glass-border-light: rgba(255, 255, 255, 0.1);
220
220
  --glass-border-medium: rgba(255, 255, 255, 0.15);
221
221
  --glass-border-heavy: rgba(255, 255, 255, 0.2);
222
- --glass-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.1);
223
- --glass-shadow-md: 0 2px 4px rgba(0, 0, 0, 0.15);
224
- --glass-shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.2);
222
+ --glass-shadow-sm: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.1);
223
+ --glass-shadow-md: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.15);
224
+ --glass-shadow-lg: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.2);
225
225
  --tech-border-radius-none: 0;
226
- --tech-border-radius-sm: 2px;
227
- --tech-border-radius-md: 4px;
226
+ --tech-border-radius-sm: 0.125rem;
227
+ --tech-border-radius-md: 0.25rem;
228
228
  }
229
229
 
230
230
  *,
@@ -482,8 +482,8 @@ a:hover {
482
482
  color: var(--color-accent-light);
483
483
  }
484
484
  a:focus {
485
- outline: 1px solid var(--color-border-focus);
486
- outline-offset: 2px;
485
+ outline: 0.0625rem solid var(--color-border-focus);
486
+ outline-offset: 0.125rem;
487
487
  }
488
488
 
489
489
  ul, ol {
@@ -500,7 +500,7 @@ img {
500
500
 
501
501
  hr {
502
502
  border: 0;
503
- border-top: 1px solid var(--color-border);
503
+ border-top: 0.0625rem solid var(--color-border);
504
504
  margin: var(--spacing-lg) 0;
505
505
  }
506
506
 
@@ -510,7 +510,7 @@ code {
510
510
  background: var(--glass-bg-light);
511
511
  backdrop-filter: blur(var(--glass-blur-sm));
512
512
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
513
- border: 1px solid var(--glass-border-light);
513
+ border: 0.0625rem solid var(--glass-border-light);
514
514
  padding: 0.125em 0.25em;
515
515
  border-radius: var(--tech-border-radius-sm);
516
516
  color: var(--color-text);
@@ -522,7 +522,7 @@ pre {
522
522
  background: var(--glass-bg-medium);
523
523
  backdrop-filter: blur(var(--glass-blur-md));
524
524
  -webkit-backdrop-filter: blur(var(--glass-blur-md));
525
- border: 1px solid var(--glass-border-medium);
525
+ border: 0.0625rem solid var(--glass-border-medium);
526
526
  padding: var(--spacing-md);
527
527
  border-radius: var(--tech-border-radius-md);
528
528
  overflow-x: auto;
@@ -590,27 +590,27 @@ textarea {
590
590
  }
591
591
  @media (min-width: 640px) {
592
592
  .bl-container {
593
- max-width: 640px;
593
+ max-width: 40rem;
594
594
  }
595
595
  }
596
596
  @media (min-width: 768px) {
597
597
  .bl-container {
598
- max-width: 768px;
598
+ max-width: 48rem;
599
599
  }
600
600
  }
601
601
  @media (min-width: 1024px) {
602
602
  .bl-container {
603
- max-width: 1024px;
603
+ max-width: 64rem;
604
604
  }
605
605
  }
606
606
  @media (min-width: 1280px) {
607
607
  .bl-container {
608
- max-width: 1280px;
608
+ max-width: 80rem;
609
609
  }
610
610
  }
611
611
  @media (min-width: 1536px) {
612
612
  .bl-container {
613
- max-width: 1536px;
613
+ max-width: 96rem;
614
614
  }
615
615
  }
616
616
 
@@ -2761,10 +2761,10 @@ textarea {
2761
2761
 
2762
2762
  .bl-sr-only {
2763
2763
  position: absolute;
2764
- width: 1px;
2765
- height: 1px;
2764
+ width: 0.0625rem;
2765
+ height: 0.0625rem;
2766
2766
  padding: 0;
2767
- margin: -1px;
2767
+ margin: -0.0625rem;
2768
2768
  overflow: hidden;
2769
2769
  clip: rect(0, 0, 0, 0);
2770
2770
  white-space: nowrap;
@@ -2784,7 +2784,7 @@ textarea {
2784
2784
 
2785
2785
  .bl-skip-link {
2786
2786
  position: absolute;
2787
- top: -40px;
2787
+ top: -2.5rem;
2788
2788
  left: 0;
2789
2789
  z-index: var(--z-index-tooltip);
2790
2790
  padding: var(--spacing-sm) var(--spacing-md);
@@ -2795,8 +2795,8 @@ textarea {
2795
2795
  }
2796
2796
  .bl-skip-link:focus {
2797
2797
  top: var(--spacing-sm);
2798
- outline: 2px solid var(--color-border-focus);
2799
- outline-offset: 2px;
2798
+ outline: 0.125rem solid var(--color-border-focus);
2799
+ outline-offset: 0.125rem;
2800
2800
  }
2801
2801
 
2802
2802
  .bl-focus-visible:focus-visible {
@@ -2809,7 +2809,7 @@ textarea {
2809
2809
  border-color: currentColor !important;
2810
2810
  }
2811
2811
  .bl-skip-link {
2812
- border: 2px solid currentColor;
2812
+ border: 0.125rem solid currentColor;
2813
2813
  }
2814
2814
  }
2815
2815
  @media (prefers-reduced-motion: reduce) {
@@ -2837,7 +2837,7 @@ textarea {
2837
2837
  vertical-align: middle;
2838
2838
  cursor: pointer;
2839
2839
  user-select: none;
2840
- border: 1px solid var(--glass-border-medium);
2840
+ border: 0.0625rem solid var(--glass-border-medium);
2841
2841
  border-radius: var(--tech-border-radius-sm);
2842
2842
  background: var(--glass-bg-medium);
2843
2843
  backdrop-filter: blur(var(--glass-blur-md));
@@ -2846,8 +2846,8 @@ textarea {
2846
2846
  color: var(--color-text);
2847
2847
  }
2848
2848
  .bl-btn:focus {
2849
- outline: 1px solid var(--color-border-focus);
2850
- outline-offset: 2px;
2849
+ outline: 0.0625rem solid var(--color-border-focus);
2850
+ outline-offset: 0.125rem;
2851
2851
  }
2852
2852
  .bl-btn:disabled, .bl-btn.bl-disabled {
2853
2853
  opacity: 0.6;
@@ -2875,8 +2875,8 @@ textarea {
2875
2875
  border-color: var(--color-accent-dark);
2876
2876
  }
2877
2877
  .bl-btn-primary:active:not(:disabled):not(.bl-disabled) {
2878
- transform: translateY(1px);
2879
- box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
2878
+ transform: translateY(0.0625rem);
2879
+ box-shadow: inset 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.2);
2880
2880
  }
2881
2881
 
2882
2882
  .bl-btn-secondary {
@@ -3034,7 +3034,7 @@ textarea {
3034
3034
  line-height: var(--form-input-line-height);
3035
3035
  color: var(--color-text);
3036
3036
  background: var(--glass-bg-light);
3037
- border: 1px solid var(--glass-border-medium);
3037
+ border: 0.0625rem solid var(--glass-border-medium);
3038
3038
  border-radius: var(--tech-border-radius-sm);
3039
3039
  backdrop-filter: blur(var(--glass-blur-md));
3040
3040
  -webkit-backdrop-filter: blur(var(--glass-blur-md));
@@ -3049,7 +3049,7 @@ textarea {
3049
3049
  .bl-input:focus,
3050
3050
  .bl-textarea:focus {
3051
3051
  outline: none;
3052
- border-width: 2px;
3052
+ border-width: 0.125rem;
3053
3053
  border-color: var(--color-accent);
3054
3054
  background: var(--glass-bg-medium);
3055
3055
  }
@@ -3070,7 +3070,7 @@ textarea {
3070
3070
  line-height: var(--form-input-line-height);
3071
3071
  color: var(--color-text);
3072
3072
  background: var(--glass-bg-medium);
3073
- border: 1px solid var(--glass-border-medium);
3073
+ border: 0.0625rem solid var(--glass-border-medium);
3074
3074
  border-radius: var(--tech-border-radius-md);
3075
3075
  backdrop-filter: blur(var(--glass-blur-lg));
3076
3076
  -webkit-backdrop-filter: blur(var(--glass-blur-lg));
@@ -3090,7 +3090,7 @@ textarea {
3090
3090
  border-width: 2px;
3091
3091
  border-color: var(--color-accent);
3092
3092
  background-color: var(--glass-bg-medium);
3093
- box-shadow: var(--glass-shadow-md), 0 0 0 1px var(--color-accent);
3093
+ box-shadow: var(--glass-shadow-md), 0 0 0 0.0625rem var(--color-accent);
3094
3094
  }
3095
3095
  .bl-select:hover {
3096
3096
  background-color: var(--glass-bg-heavy);
@@ -3122,7 +3122,7 @@ textarea {
3122
3122
  line-height: var(--form-input-line-height);
3123
3123
  color: var(--color-text);
3124
3124
  background: var(--glass-bg-medium);
3125
- border: 1px solid var(--glass-border-medium);
3125
+ border: 0.0625rem solid var(--glass-border-medium);
3126
3126
  border-radius: var(--tech-border-radius-md);
3127
3127
  backdrop-filter: blur(var(--glass-blur-lg));
3128
3128
  -webkit-backdrop-filter: blur(var(--glass-blur-lg));
@@ -3147,7 +3147,7 @@ textarea {
3147
3147
  outline: none;
3148
3148
  border-width: 2px;
3149
3149
  border-color: var(--color-accent);
3150
- box-shadow: var(--glass-shadow-md), 0 0 0 1px var(--color-accent);
3150
+ box-shadow: var(--glass-shadow-md), 0 0 0 0.0625rem var(--color-accent);
3151
3151
  }
3152
3152
  .bl-select-dropdown .bl-select-toggle:hover {
3153
3153
  background-color: var(--glass-bg-heavy);
@@ -3175,11 +3175,11 @@ textarea {
3175
3175
  background: var(--glass-bg-medium);
3176
3176
  backdrop-filter: blur(var(--glass-blur-lg));
3177
3177
  -webkit-backdrop-filter: blur(var(--glass-blur-lg));
3178
- border: 1px solid var(--glass-border-medium);
3178
+ border: 0.0625rem solid var(--glass-border-medium);
3179
3179
  border-radius: var(--tech-border-radius-md);
3180
3180
  overflow: hidden;
3181
3181
  overflow-y: auto;
3182
- max-height: 300px;
3182
+ max-height: 18.75rem;
3183
3183
  box-shadow: var(--glass-shadow-lg);
3184
3184
  }
3185
3185
  .bl-select-dropdown .bl-select-menu.bl-show {
@@ -3227,27 +3227,27 @@ textarea {
3227
3227
  .bl-input-error,
3228
3228
  .bl-select-error,
3229
3229
  .bl-textarea-error {
3230
- border-bottom: 2px solid var(--color-error);
3230
+ border-bottom: 0.125rem solid var(--color-error);
3231
3231
  }
3232
3232
  .bl-input-error:focus,
3233
3233
  .bl-select-error:focus,
3234
3234
  .bl-textarea-error:focus {
3235
3235
  border-width: 2px;
3236
3236
  border-color: var(--color-error);
3237
- border-bottom-width: 2px;
3237
+ border-bottom-width: 0.125rem;
3238
3238
  }
3239
3239
 
3240
3240
  .bl-input-success,
3241
3241
  .bl-select-success,
3242
3242
  .bl-textarea-success {
3243
- border-bottom: 2px solid var(--color-success);
3243
+ border-bottom: 0.125rem solid var(--color-success);
3244
3244
  }
3245
3245
  .bl-input-success:focus,
3246
3246
  .bl-select-success:focus,
3247
3247
  .bl-textarea-success:focus {
3248
3248
  border-width: 2px;
3249
3249
  border-color: var(--color-success);
3250
- border-bottom-width: 2px;
3250
+ border-bottom-width: 0.125rem;
3251
3251
  }
3252
3252
 
3253
3253
  .bl-input-sm,
@@ -3330,7 +3330,7 @@ textarea {
3330
3330
  right: 0;
3331
3331
  bottom: 0;
3332
3332
  background: var(--glass-bg-medium);
3333
- border: 1px solid var(--glass-border-medium);
3333
+ border: 0.0625rem solid var(--glass-border-medium);
3334
3334
  border-radius: var(--border-radius-full);
3335
3335
  backdrop-filter: blur(var(--glass-blur-sm));
3336
3336
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
@@ -3356,7 +3356,7 @@ textarea {
3356
3356
  padding: var(--form-file-input-padding);
3357
3357
  font-size: var(--form-file-input-font-size);
3358
3358
  color: var(--color-text);
3359
- border: 1px dashed var(--glass-border-medium);
3359
+ border: 0.0625rem dashed var(--glass-border-medium);
3360
3360
  border-radius: var(--tech-border-radius-sm);
3361
3361
  background: var(--glass-bg-light);
3362
3362
  backdrop-filter: blur(var(--glass-blur-md));
@@ -3387,7 +3387,7 @@ textarea {
3387
3387
  height: var(--form-range-thumb-size);
3388
3388
  border-radius: var(--tech-border-radius-sm);
3389
3389
  background: var(--form-range-thumb-bg);
3390
- border: 1px solid var(--glass-border-medium);
3390
+ border: 0.0625rem solid var(--glass-border-medium);
3391
3391
  cursor: pointer;
3392
3392
  }
3393
3393
  .bl-range::-moz-range-thumb {
@@ -3395,7 +3395,7 @@ textarea {
3395
3395
  height: var(--form-range-thumb-size);
3396
3396
  border-radius: var(--tech-border-radius-sm);
3397
3397
  background: var(--form-range-thumb-bg);
3398
- border: 1px solid var(--glass-border-medium);
3398
+ border: 0.0625rem solid var(--glass-border-medium);
3399
3399
  cursor: pointer;
3400
3400
  }
3401
3401
 
@@ -3413,7 +3413,7 @@ textarea {
3413
3413
  .bl-input-group .bl-select:not(:first-child) {
3414
3414
  border-top-left-radius: 0;
3415
3415
  border-bottom-left-radius: 0;
3416
- margin-left: -1px;
3416
+ margin-left: -0.0625rem;
3417
3417
  }
3418
3418
  .bl-input-group .bl-input:not(:last-child),
3419
3419
  .bl-input-group .bl-select:not(:last-child) {
@@ -3427,22 +3427,22 @@ textarea {
3427
3427
  background: var(--glass-bg-medium);
3428
3428
  backdrop-filter: blur(var(--glass-blur-md));
3429
3429
  -webkit-backdrop-filter: blur(var(--glass-blur-md));
3430
- border: 1px solid var(--glass-border-medium);
3430
+ border: 0.0625rem solid var(--glass-border-medium);
3431
3431
  border-radius: var(--tech-border-radius-md);
3432
3432
  overflow: hidden;
3433
3433
  transition: var(--transition-base);
3434
3434
  position: relative;
3435
3435
  }
3436
3436
  .bl-card.bl-card-accent-left {
3437
- border-left: 4px solid var(--color-accent);
3437
+ border-left: 0.25rem solid var(--color-accent);
3438
3438
  }
3439
3439
  .bl-card.bl-card-accent-right {
3440
- border-right: 4px solid var(--color-accent);
3440
+ border-right: 0.25rem solid var(--color-accent);
3441
3441
  }
3442
3442
 
3443
3443
  .bl-card-header {
3444
3444
  padding: var(--spacing-md);
3445
- border-bottom: 1px solid var(--glass-border-light);
3445
+ border-bottom: 0.0625rem solid var(--glass-border-light);
3446
3446
  background: var(--glass-bg-light);
3447
3447
  backdrop-filter: blur(var(--glass-blur-sm));
3448
3448
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
@@ -3469,7 +3469,7 @@ textarea {
3469
3469
 
3470
3470
  .bl-card-footer {
3471
3471
  padding: var(--spacing-md);
3472
- border-top: 1px solid var(--glass-border-light);
3472
+ border-top: 0.0625rem solid var(--glass-border-light);
3473
3473
  background: var(--glass-bg-light);
3474
3474
  backdrop-filter: blur(var(--glass-blur-sm));
3475
3475
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
@@ -3503,8 +3503,8 @@ textarea {
3503
3503
  position: relative;
3504
3504
  padding: var(--spacing-md);
3505
3505
  margin-bottom: var(--spacing-md);
3506
- border: 1px solid var(--glass-border-medium);
3507
- border-left-width: 2px;
3506
+ border: 0.0625rem solid var(--glass-border-medium);
3507
+ border-left-width: 0.125rem;
3508
3508
  border-radius: var(--tech-border-radius-md);
3509
3509
  background: var(--glass-bg-medium);
3510
3510
  backdrop-filter: blur(var(--glass-blur-md));
@@ -3593,7 +3593,7 @@ textarea {
3593
3593
  white-space: nowrap;
3594
3594
  vertical-align: baseline;
3595
3595
  border-radius: var(--tech-border-radius-sm);
3596
- border: 1px solid var(--glass-border-medium);
3596
+ border: 0.0625rem solid var(--glass-border-medium);
3597
3597
  }
3598
3598
 
3599
3599
  .bl-badge-label {
@@ -3604,7 +3604,7 @@ textarea {
3604
3604
  backdrop-filter: blur(var(--glass-blur-sm));
3605
3605
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
3606
3606
  color: var(--color-text-muted);
3607
- border-right: 1px solid var(--glass-border-medium);
3607
+ border-right: 0.0625rem solid var(--glass-border-medium);
3608
3608
  flex-shrink: 0;
3609
3609
  }
3610
3610
 
@@ -3706,24 +3706,24 @@ textarea {
3706
3706
  .bl-modal-dialog {
3707
3707
  position: relative;
3708
3708
  width: 100%;
3709
- max-width: 500px;
3709
+ max-width: 31.25rem;
3710
3710
  margin: 0;
3711
3711
  pointer-events: none;
3712
3712
  z-index: 10;
3713
3713
  }
3714
3714
  @media (min-width: 576px) {
3715
3715
  .bl-modal-dialog {
3716
- max-width: 500px;
3716
+ max-width: 31.25rem;
3717
3717
  }
3718
3718
  }
3719
3719
  @media (min-width: 768px) {
3720
3720
  .bl-modal-dialog {
3721
- max-width: 600px;
3721
+ max-width: 37.5rem;
3722
3722
  }
3723
3723
  }
3724
3724
  @media (min-width: 1024px) {
3725
3725
  .bl-modal-dialog {
3726
- max-width: 800px;
3726
+ max-width: 50rem;
3727
3727
  }
3728
3728
  }
3729
3729
  .bl-modal.bl-modal-open.bl-modal-top-left .bl-modal-dialog {
@@ -3790,7 +3790,7 @@ textarea {
3790
3790
  background: var(--glass-bg-medium);
3791
3791
  backdrop-filter: blur(var(--glass-blur-xl));
3792
3792
  -webkit-backdrop-filter: blur(var(--glass-blur-xl));
3793
- border: 1px solid var(--glass-border-medium);
3793
+ border: 0.0625rem solid var(--glass-border-medium);
3794
3794
  border-radius: var(--tech-border-radius-md);
3795
3795
  outline: 0;
3796
3796
  }
@@ -3800,7 +3800,7 @@ textarea {
3800
3800
  align-items: flex-start;
3801
3801
  justify-content: space-between;
3802
3802
  padding: var(--spacing-md);
3803
- border-bottom: 1px solid var(--glass-border-light);
3803
+ border-bottom: 0.0625rem solid var(--glass-border-light);
3804
3804
  background: var(--glass-bg-light);
3805
3805
  backdrop-filter: blur(var(--glass-blur-sm));
3806
3806
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
@@ -3849,7 +3849,7 @@ textarea {
3849
3849
  align-items: center;
3850
3850
  justify-content: flex-end;
3851
3851
  padding: var(--spacing-md);
3852
- border-top: 1px solid var(--glass-border-light);
3852
+ border-top: 0.0625rem solid var(--glass-border-light);
3853
3853
  background: var(--glass-bg-light);
3854
3854
  backdrop-filter: blur(var(--glass-blur-sm));
3855
3855
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
@@ -3860,19 +3860,19 @@ textarea {
3860
3860
 
3861
3861
  @media (min-width: 576px) {
3862
3862
  .bl-modal-sm .bl-modal-dialog {
3863
- max-width: 300px;
3863
+ max-width: 18.75rem;
3864
3864
  }
3865
3865
  }
3866
3866
 
3867
3867
  @media (min-width: 1024px) {
3868
3868
  .bl-modal-lg .bl-modal-dialog {
3869
- max-width: 1000px;
3869
+ max-width: 62.5rem;
3870
3870
  }
3871
3871
  }
3872
3872
 
3873
3873
  @media (min-width: 1024px) {
3874
3874
  .bl-modal-xl .bl-modal-dialog {
3875
- max-width: 1200px;
3875
+ max-width: 75rem;
3876
3876
  }
3877
3877
  }
3878
3878
 
@@ -4159,11 +4159,11 @@ textarea {
4159
4159
  background: var(--glass-bg-medium);
4160
4160
  backdrop-filter: blur(var(--glass-blur-lg));
4161
4161
  -webkit-backdrop-filter: blur(var(--glass-blur-lg));
4162
- border: 1px solid var(--glass-border-medium);
4162
+ border: 0.0625rem solid var(--glass-border-medium);
4163
4163
  border-radius: var(--tech-border-radius-md);
4164
4164
  overflow: hidden;
4165
4165
  overflow-y: auto;
4166
- max-height: 300px;
4166
+ max-height: 18.75rem;
4167
4167
  box-shadow: var(--glass-shadow-lg);
4168
4168
  }
4169
4169
  .bl-dropdown-menu.bl-show {
@@ -4214,7 +4214,7 @@ textarea {
4214
4214
  height: 0;
4215
4215
  margin: var(--spacing-xs) 0;
4216
4216
  overflow: hidden;
4217
- border-top: 1px solid var(--glass-border-light);
4217
+ border-top: 0.0625rem solid var(--glass-border-light);
4218
4218
  }
4219
4219
 
4220
4220
  .bl-dropdown-header {
@@ -4259,14 +4259,14 @@ textarea {
4259
4259
  background: var(--glass-bg-medium);
4260
4260
  }
4261
4261
  .bl-nav-link:focus {
4262
- outline: 1px solid var(--color-border-focus);
4263
- outline-offset: -2px;
4262
+ outline: 0.0625rem solid var(--color-border-focus);
4263
+ outline-offset: -0.125rem;
4264
4264
  }
4265
4265
  .bl-nav-link.bl-active {
4266
4266
  color: var(--color-text);
4267
4267
  font-weight: var(--font-weight-semibold);
4268
4268
  background: var(--glass-bg-heavy);
4269
- border-bottom: 2px solid var(--color-accent);
4269
+ border-bottom: 0.125rem solid var(--color-accent);
4270
4270
  }
4271
4271
  .bl-nav-link.bl-disabled {
4272
4272
  color: var(--color-text-muted);
@@ -4289,13 +4289,13 @@ textarea {
4289
4289
  }
4290
4290
 
4291
4291
  .bl-nav-tabs {
4292
- border-bottom: 1px solid var(--glass-border-light);
4292
+ border-bottom: 0.0625rem solid var(--glass-border-light);
4293
4293
  background: transparent;
4294
4294
  padding: 0;
4295
4295
  }
4296
4296
  .bl-nav-tabs .bl-nav-link {
4297
- margin-bottom: -1px;
4298
- border: 1px solid transparent;
4297
+ margin-bottom: -0.0625rem;
4298
+ border: 0.0625rem solid transparent;
4299
4299
  border-top-left-radius: var(--tech-border-radius-sm);
4300
4300
  border-top-right-radius: var(--tech-border-radius-sm);
4301
4301
  background: transparent;
@@ -4309,7 +4309,7 @@ textarea {
4309
4309
  color: var(--color-text);
4310
4310
  background: var(--glass-bg-medium);
4311
4311
  border-color: var(--glass-border-medium) var(--glass-border-medium) transparent;
4312
- border-bottom: 2px solid var(--color-accent);
4312
+ border-bottom: 0.125rem solid var(--color-accent);
4313
4313
  }
4314
4314
 
4315
4315
  .bl-nav-pills .bl-nav-link {
@@ -4318,7 +4318,7 @@ textarea {
4318
4318
  .bl-nav-pills .bl-nav-link.bl-active {
4319
4319
  color: var(--color-text);
4320
4320
  background: var(--glass-bg-heavy);
4321
- border-bottom: 2px solid var(--color-accent);
4321
+ border-bottom: 0.125rem solid var(--color-accent);
4322
4322
  }
4323
4323
 
4324
4324
  .bl-breadcrumb {
@@ -4382,12 +4382,12 @@ textarea {
4382
4382
  position: relative;
4383
4383
  display: block;
4384
4384
  padding: var(--spacing-sm) var(--spacing-md);
4385
- margin-left: -1px;
4385
+ margin-left: -0.0625rem;
4386
4386
  line-height: var(--line-height-base);
4387
4387
  color: var(--color-text);
4388
4388
  text-decoration: none;
4389
4389
  background: var(--glass-bg-light);
4390
- border: 1px solid var(--glass-border-medium);
4390
+ border: 0.0625rem solid var(--glass-border-medium);
4391
4391
  backdrop-filter: blur(var(--glass-blur-sm));
4392
4392
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
4393
4393
  transition: var(--transition-base);
@@ -4401,8 +4401,8 @@ textarea {
4401
4401
  }
4402
4402
  .bl-page-link:focus {
4403
4403
  z-index: 2;
4404
- outline: 1px solid var(--color-border-focus);
4405
- outline-offset: -2px;
4404
+ outline: 0.0625rem solid var(--color-border-focus);
4405
+ outline-offset: -0.125rem;
4406
4406
  }
4407
4407
 
4408
4408
  .bl-table {
@@ -4414,16 +4414,16 @@ textarea {
4414
4414
  background: var(--glass-bg-medium);
4415
4415
  backdrop-filter: blur(var(--glass-blur-md));
4416
4416
  -webkit-backdrop-filter: blur(var(--glass-blur-md));
4417
- border: 1px solid var(--glass-border-medium);
4417
+ border: 0.0625rem solid var(--glass-border-medium);
4418
4418
  border-radius: var(--tech-border-radius-md);
4419
4419
  overflow: hidden;
4420
4420
  }
4421
4421
  .bl-table > :not(caption) > * > * {
4422
4422
  padding: var(--spacing-sm) var(--spacing-md);
4423
4423
  background-color: transparent;
4424
- border-bottom-width: 1px;
4424
+ border-bottom-width: 0.0625rem;
4425
4425
  border-bottom-color: var(--glass-border-light);
4426
- border-right-width: 1px;
4426
+ border-right-width: 0.0625rem;
4427
4427
  border-right-color: var(--glass-border-light);
4428
4428
  box-shadow: inset 0 0 0 9999px transparent;
4429
4429
  }
@@ -4437,7 +4437,7 @@ textarea {
4437
4437
  vertical-align: bottom;
4438
4438
  }
4439
4439
  .bl-table > :not(:first-child) {
4440
- border-top: 1px solid var(--glass-border-light);
4440
+ border-top: 0.0625rem solid var(--glass-border-light);
4441
4441
  }
4442
4442
 
4443
4443
  .bl-table-caption {
@@ -4465,13 +4465,13 @@ textarea {
4465
4465
  }
4466
4466
 
4467
4467
  .bl-table-bordered {
4468
- border: 1px solid var(--glass-border-medium);
4468
+ border: 0.0625rem solid var(--glass-border-medium);
4469
4469
  }
4470
4470
  .bl-table-bordered > :not(caption) > * {
4471
- border-width: 1px 0;
4471
+ border-width: 0.0625rem 0;
4472
4472
  }
4473
4473
  .bl-table-bordered > :not(caption) > * > * {
4474
- border-width: 0 1px;
4474
+ border-width: 0 0.0625rem;
4475
4475
  border-color: var(--glass-border-light);
4476
4476
  }
4477
4477
 
@@ -4565,7 +4565,7 @@ textarea {
4565
4565
  position: absolute;
4566
4566
  z-index: var(--z-index-tooltip);
4567
4567
  display: none;
4568
- max-width: 200px;
4568
+ max-width: 12.5rem;
4569
4569
  padding: var(--spacing-xs) var(--spacing-sm);
4570
4570
  font-size: var(--font-size-xs);
4571
4571
  font-family: var(--font-family-mono);
@@ -4577,7 +4577,7 @@ textarea {
4577
4577
  background: var(--glass-bg-medium);
4578
4578
  backdrop-filter: blur(var(--glass-blur-md));
4579
4579
  -webkit-backdrop-filter: blur(var(--glass-blur-md));
4580
- border: 1px solid var(--glass-border-medium);
4580
+ border: 0.0625rem solid var(--glass-border-medium);
4581
4581
  border-radius: var(--tech-border-radius-sm);
4582
4582
  opacity: 0;
4583
4583
  transition: var(--transition-opacity);
@@ -4599,9 +4599,9 @@ textarea {
4599
4599
  left: 50%;
4600
4600
  width: 0;
4601
4601
  height: 0;
4602
- margin-left: -6px;
4602
+ margin-left: -0.375rem;
4603
4603
  content: "";
4604
- border-width: 6px 6px 0 6px;
4604
+ border-width: 0.375rem 0.375rem 0 0.375rem;
4605
4605
  border-style: solid;
4606
4606
  border-color: var(--glass-bg-medium) transparent transparent transparent;
4607
4607
  clip-path: polygon(0 0, 100% 0, 80% 100%, 20% 100%);
@@ -4619,9 +4619,9 @@ textarea {
4619
4619
  left: 50%;
4620
4620
  width: 0;
4621
4621
  height: 0;
4622
- margin-left: -6px;
4622
+ margin-left: -0.375rem;
4623
4623
  content: "";
4624
- border-width: 0 6px 6px 6px;
4624
+ border-width: 0 0.375rem 0.375rem 0.375rem;
4625
4625
  border-style: solid;
4626
4626
  border-color: transparent transparent var(--glass-bg-medium) transparent;
4627
4627
  clip-path: polygon(20% 0, 80% 0, 100% 100%, 0 100%);
@@ -4639,9 +4639,9 @@ textarea {
4639
4639
  left: 100%;
4640
4640
  width: 0;
4641
4641
  height: 0;
4642
- margin-top: -6px;
4642
+ margin-top: -0.375rem;
4643
4643
  content: "";
4644
- border-width: 6px 0 6px 6px;
4644
+ border-width: 0.375rem 0 0.375rem 0.375rem;
4645
4645
  border-style: solid;
4646
4646
  border-color: transparent transparent transparent var(--glass-bg-medium);
4647
4647
  clip-path: polygon(0 20%, 0 80%, 100% 100%, 100% 0);
@@ -4659,9 +4659,9 @@ textarea {
4659
4659
  right: 100%;
4660
4660
  width: 0;
4661
4661
  height: 0;
4662
- margin-top: -6px;
4662
+ margin-top: -0.375rem;
4663
4663
  content: "";
4664
- border-width: 6px 6px 6px 0;
4664
+ border-width: 0.375rem 0.375rem 0.375rem 0;
4665
4665
  border-style: solid;
4666
4666
  border-color: transparent var(--glass-bg-medium) transparent transparent;
4667
4667
  clip-path: polygon(0 0, 0 100%, 100% 80%, 100% 20%);
@@ -4674,7 +4674,7 @@ textarea {
4674
4674
  background: var(--glass-bg-light);
4675
4675
  backdrop-filter: blur(var(--glass-blur-sm));
4676
4676
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
4677
- border: 1px solid var(--glass-border-medium);
4677
+ border: 0.0625rem solid var(--glass-border-medium);
4678
4678
  border-radius: var(--tech-border-radius-sm);
4679
4679
  }
4680
4680
 
@@ -4739,10 +4739,10 @@ textarea {
4739
4739
  .bl-spinner::before {
4740
4740
  content: "";
4741
4741
  position: absolute;
4742
- top: 2px;
4743
- left: 2px;
4744
- right: 2px;
4745
- bottom: 2px;
4742
+ top: 0.125rem;
4743
+ left: 0.125rem;
4744
+ right: 0.125rem;
4745
+ bottom: 0.125rem;
4746
4746
  background: var(--color-accent);
4747
4747
  opacity: 0.3;
4748
4748
  border-radius: var(--tech-border-radius-sm);
@@ -4835,7 +4835,7 @@ textarea {
4835
4835
  background: var(--glass-bg-medium);
4836
4836
  backdrop-filter: blur(var(--glass-blur-md));
4837
4837
  -webkit-backdrop-filter: blur(var(--glass-blur-md));
4838
- border: 1px solid var(--glass-border-medium);
4838
+ border: 0.0625rem solid var(--glass-border-medium);
4839
4839
  border-radius: var(--tech-border-radius-sm);
4840
4840
  color: var(--color-text);
4841
4841
  cursor: pointer;
@@ -4846,8 +4846,8 @@ textarea {
4846
4846
  border-color: var(--glass-border-heavy);
4847
4847
  }
4848
4848
  .bl-sidebar-toggle:focus {
4849
- outline: 1px solid var(--color-border-focus);
4850
- outline-offset: 2px;
4849
+ outline: 0.0625rem solid var(--color-border-focus);
4850
+ outline-offset: 0.125rem;
4851
4851
  }
4852
4852
  @media (min-width: 768px) {
4853
4853
  .bl-sidebar-toggle {
@@ -4860,14 +4860,14 @@ textarea {
4860
4860
  top: 0;
4861
4861
  left: 0;
4862
4862
  z-index: var(--z-index-sidebar);
4863
- width: 280px;
4863
+ width: 17.5rem;
4864
4864
  height: 100vh;
4865
4865
  display: flex;
4866
4866
  flex-direction: column;
4867
4867
  background: var(--glass-bg-medium);
4868
4868
  backdrop-filter: blur(var(--glass-blur-lg));
4869
4869
  -webkit-backdrop-filter: blur(var(--glass-blur-lg));
4870
- border-right: 1px solid var(--glass-border-medium);
4870
+ border-right: 0.0625rem solid var(--glass-border-medium);
4871
4871
  box-shadow: var(--glass-shadow-lg);
4872
4872
  transform: translateX(-100%);
4873
4873
  transition: transform var(--transition-duration-slow) var(--transition-ease-out);
@@ -4875,20 +4875,20 @@ textarea {
4875
4875
  }
4876
4876
  @media (max-width: 767.98px) {
4877
4877
  .bl-sidebar {
4878
- width: min(85%, 320px);
4878
+ width: min(85%, 20rem);
4879
4879
  max-width: 90vw;
4880
4880
  }
4881
4881
  }
4882
4882
  .bl-sidebar::-webkit-scrollbar {
4883
- width: 6px;
4883
+ width: 0.375rem;
4884
4884
  }
4885
4885
  .bl-sidebar::-webkit-scrollbar-track {
4886
4886
  background: transparent;
4887
4887
  }
4888
4888
  .bl-sidebar::-webkit-scrollbar-thumb {
4889
4889
  background: var(--glass-bg-medium);
4890
- border-radius: 3px;
4891
- border: 1px solid var(--glass-border-light);
4890
+ border-radius: 0.1875rem;
4891
+ border: 0.0625rem solid var(--glass-border-light);
4892
4892
  }
4893
4893
  .bl-sidebar::-webkit-scrollbar-thumb:hover {
4894
4894
  background: var(--glass-bg-heavy);
@@ -4905,8 +4905,8 @@ textarea {
4905
4905
  height: auto;
4906
4906
  min-height: 100vh;
4907
4907
  box-shadow: none;
4908
- border-right: 1px solid var(--glass-border-medium);
4909
- width: 280px;
4908
+ border-right: 0.0625rem solid var(--glass-border-medium);
4909
+ width: 17.5rem;
4910
4910
  }
4911
4911
  }
4912
4912
  .bl-sidebar.bl-sidebar-open {
@@ -4914,7 +4914,7 @@ textarea {
4914
4914
  }
4915
4915
  @media (min-width: 768px) {
4916
4916
  .bl-sidebar.bl-sidebar-collapsed {
4917
- width: 64px;
4917
+ width: 4rem;
4918
4918
  }
4919
4919
  .bl-sidebar.bl-sidebar-collapsed .bl-sidebar-header h3,
4920
4920
  .bl-sidebar.bl-sidebar-collapsed .bl-sidebar-nav .bl-nav-link span:not(.bl-icon),
@@ -4935,7 +4935,7 @@ textarea {
4935
4935
  left: auto;
4936
4936
  right: 0;
4937
4937
  border-right: none;
4938
- border-left: 1px solid var(--glass-border-medium);
4938
+ border-left: 0.0625rem solid var(--glass-border-medium);
4939
4939
  transform: translateX(100%);
4940
4940
  }
4941
4941
  .bl-sidebar.bl-sidebar-right.bl-sidebar-open {
@@ -4997,7 +4997,7 @@ textarea {
4997
4997
  align-items: center;
4998
4998
  justify-content: space-between;
4999
4999
  padding: var(--spacing-lg) var(--spacing-md);
5000
- border-bottom: 1px solid var(--glass-border-medium);
5000
+ border-bottom: 0.0625rem solid var(--glass-border-medium);
5001
5001
  background: var(--glass-bg-light);
5002
5002
  backdrop-filter: blur(var(--glass-blur-sm));
5003
5003
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
@@ -5022,11 +5022,11 @@ textarea {
5022
5022
  display: inline-flex;
5023
5023
  align-items: center;
5024
5024
  justify-content: center;
5025
- width: 32px;
5026
- height: 32px;
5025
+ width: 2rem;
5026
+ height: 2rem;
5027
5027
  padding: 0;
5028
5028
  background: transparent;
5029
- border: 1px solid transparent;
5029
+ border: 0.0625rem solid transparent;
5030
5030
  border-radius: var(--tech-border-radius-sm);
5031
5031
  color: var(--color-text);
5032
5032
  cursor: pointer;
@@ -5039,8 +5039,8 @@ textarea {
5039
5039
  border-color: var(--glass-border-medium);
5040
5040
  }
5041
5041
  .bl-sidebar-close:focus {
5042
- outline: 1px solid var(--color-border-focus);
5043
- outline-offset: 2px;
5042
+ outline: 0.0625rem solid var(--color-border-focus);
5043
+ outline-offset: 0.125rem;
5044
5044
  }
5045
5045
  @media (min-width: 768px) {
5046
5046
  .bl-sidebar-close {
@@ -5063,15 +5063,15 @@ textarea {
5063
5063
  }
5064
5064
  }
5065
5065
  .bl-sidebar-nav::-webkit-scrollbar {
5066
- width: 6px;
5066
+ width: 0.375rem;
5067
5067
  }
5068
5068
  .bl-sidebar-nav::-webkit-scrollbar-track {
5069
5069
  background: transparent;
5070
5070
  }
5071
5071
  .bl-sidebar-nav::-webkit-scrollbar-thumb {
5072
5072
  background: var(--glass-bg-medium);
5073
- border-radius: 3px;
5074
- border: 1px solid var(--glass-border-light);
5073
+ border-radius: 0.1875rem;
5074
+ border: 0.0625rem solid var(--glass-border-light);
5075
5075
  }
5076
5076
  .bl-sidebar-nav::-webkit-scrollbar-thumb:hover {
5077
5077
  background: var(--glass-bg-heavy);
@@ -5099,12 +5099,12 @@ textarea {
5099
5099
  line-height: var(--line-height-base);
5100
5100
  color: var(--color-text);
5101
5101
  text-decoration: none;
5102
- min-height: 40px;
5102
+ min-height: 2.5rem;
5103
5103
  }
5104
5104
  @media (max-width: 767.98px) {
5105
5105
  .bl-sidebar-nav .bl-nav-link {
5106
5106
  padding: var(--spacing-md);
5107
- min-height: 44px;
5107
+ min-height: 2.75rem;
5108
5108
  }
5109
5109
  }
5110
5110
  .bl-sidebar-nav .bl-nav-link span:not(.bl-icon) {
@@ -5113,27 +5113,27 @@ textarea {
5113
5113
  }
5114
5114
  .bl-sidebar-nav .bl-nav-link .bl-icon {
5115
5115
  flex-shrink: 0;
5116
- width: 18px;
5117
- height: 18px;
5116
+ width: 1.125rem;
5117
+ height: 1.125rem;
5118
5118
  color: var(--color-text-muted);
5119
5119
  transition: var(--transition-base);
5120
5120
  }
5121
5121
  .bl-sidebar-nav .bl-nav-link:hover {
5122
5122
  background: var(--glass-bg-light);
5123
5123
  color: var(--color-text);
5124
- transform: translateX(2px);
5124
+ transform: translateX(0.125rem);
5125
5125
  }
5126
5126
  .bl-sidebar-nav .bl-nav-link:hover .bl-icon {
5127
5127
  color: var(--color-text);
5128
5128
  }
5129
5129
  .bl-sidebar-nav .bl-nav-link:active {
5130
- transform: translateX(1px);
5130
+ transform: translateX(0.0625rem);
5131
5131
  }
5132
5132
  .bl-sidebar-nav .bl-nav-link.bl-active {
5133
5133
  background: var(--glass-bg-medium);
5134
5134
  color: var(--color-text);
5135
5135
  font-weight: var(--font-weight-medium);
5136
- padding-left: calc(var(--spacing-md) - 3px);
5136
+ padding-left: calc(var(--spacing-md) - 0.1875rem);
5137
5137
  transform: translateX(0);
5138
5138
  }
5139
5139
  .bl-sidebar-nav .bl-nav-link.bl-active::before {
@@ -5142,7 +5142,7 @@ textarea {
5142
5142
  left: 0;
5143
5143
  top: 0;
5144
5144
  bottom: 0;
5145
- width: 3px;
5145
+ width: 0.1875rem;
5146
5146
  background: var(--color-accent);
5147
5147
  border-radius: 0 var(--tech-border-radius-sm) var(--tech-border-radius-sm) 0;
5148
5148
  }
@@ -5154,8 +5154,8 @@ textarea {
5154
5154
  transform: translateX(0);
5155
5155
  }
5156
5156
  .bl-sidebar-nav .bl-nav-link:focus {
5157
- outline: 1px solid var(--color-border-focus);
5158
- outline-offset: -2px;
5157
+ outline: 0.0625rem solid var(--color-border-focus);
5158
+ outline-offset: -0.125rem;
5159
5159
  }
5160
5160
 
5161
5161
  .bl-nav-group {
@@ -5169,7 +5169,7 @@ textarea {
5169
5169
  }
5170
5170
  .bl-nav-group + .bl-nav-group {
5171
5171
  padding-top: var(--spacing-md);
5172
- border-top: 1px solid var(--glass-border-light);
5172
+ border-top: 0.0625rem solid var(--glass-border-light);
5173
5173
  margin-top: var(--spacing-lg);
5174
5174
  }
5175
5175
 
@@ -5188,7 +5188,7 @@ textarea {
5188
5188
 
5189
5189
  .bl-sidebar-footer {
5190
5190
  padding: var(--spacing-md);
5191
- border-top: 1px solid var(--glass-border-medium);
5191
+ border-top: 0.0625rem solid var(--glass-border-medium);
5192
5192
  background: var(--glass-bg-light);
5193
5193
  backdrop-filter: blur(var(--glass-blur-sm));
5194
5194
  -webkit-backdrop-filter: blur(var(--glass-blur-sm));
@@ -5244,7 +5244,7 @@ textarea {
5244
5244
  background: var(--glass-bg-medium);
5245
5245
  backdrop-filter: blur(var(--glass-blur-md));
5246
5246
  -webkit-backdrop-filter: blur(var(--glass-blur-md));
5247
- border: 1px solid var(--glass-border-medium);
5247
+ border: 0.0625rem solid var(--glass-border-medium);
5248
5248
  border-radius: var(--tech-border-radius-sm);
5249
5249
  overflow: hidden;
5250
5250
  transition: var(--transition-base);
@@ -5273,8 +5273,8 @@ textarea {
5273
5273
  background: var(--glass-bg-light);
5274
5274
  }
5275
5275
  .bl-accordion-header:focus {
5276
- outline: 1px solid var(--color-border-focus);
5277
- outline-offset: -2px;
5276
+ outline: 0.0625rem solid var(--color-border-focus);
5277
+ outline-offset: -0.125rem;
5278
5278
  }
5279
5279
  .bl-accordion-header span:first-child {
5280
5280
  flex: 1;
@@ -5284,8 +5284,8 @@ textarea {
5284
5284
  display: inline-flex;
5285
5285
  align-items: center;
5286
5286
  justify-content: center;
5287
- width: 20px;
5288
- height: 20px;
5287
+ width: 1.25rem;
5288
+ height: 1.25rem;
5289
5289
  margin-left: var(--spacing-sm);
5290
5290
  transition: transform var(--transition-duration-base) var(--transition-ease-in-out);
5291
5291
  flex-shrink: 0;
@@ -5308,7 +5308,7 @@ textarea {
5308
5308
  .bl-accordion-item.bl-accordion-open .bl-accordion-body {
5309
5309
  max-height: 2000px;
5310
5310
  padding: var(--spacing-md);
5311
- border-top: 1px solid var(--glass-border-light);
5311
+ border-top: 0.0625rem solid var(--glass-border-light);
5312
5312
  }
5313
5313
 
5314
5314
  .bl-accordion-flush .bl-accordion-item {
@@ -5370,7 +5370,7 @@ textarea {
5370
5370
  display: flex;
5371
5371
  flex-direction: column;
5372
5372
  gap: var(--spacing-sm);
5373
- max-width: 400px;
5373
+ max-width: 25rem;
5374
5374
  width: 100%;
5375
5375
  }
5376
5376
  @media (max-width: 575.98px) {
@@ -5388,12 +5388,12 @@ textarea {
5388
5388
  background: var(--glass-bg-medium);
5389
5389
  backdrop-filter: blur(var(--glass-blur-lg));
5390
5390
  -webkit-backdrop-filter: blur(var(--glass-blur-lg));
5391
- border: 1px solid var(--glass-border-medium);
5391
+ border: 0.0625rem solid var(--glass-border-medium);
5392
5392
  border-radius: var(--tech-border-radius-md);
5393
5393
  box-shadow: var(--glass-shadow-lg);
5394
5394
  color: var(--color-text);
5395
5395
  pointer-events: all;
5396
- min-width: 300px;
5396
+ min-width: 18.75rem;
5397
5397
  max-width: 100%;
5398
5398
  animation: bl-toast-slide-in var(--transition-duration-base) var(--transition-ease-out);
5399
5399
  }
@@ -5432,8 +5432,8 @@ textarea {
5432
5432
  display: inline-flex;
5433
5433
  align-items: center;
5434
5434
  justify-content: center;
5435
- width: 24px;
5436
- height: 24px;
5435
+ width: 1.5rem;
5436
+ height: 1.5rem;
5437
5437
  padding: 0;
5438
5438
  background: transparent;
5439
5439
  border: none;
@@ -5450,33 +5450,33 @@ textarea {
5450
5450
  color: var(--color-text);
5451
5451
  }
5452
5452
  .bl-toast-close:focus {
5453
- outline: 1px solid var(--color-border-focus);
5454
- outline-offset: 2px;
5453
+ outline: 0.0625rem solid var(--color-border-focus);
5454
+ outline-offset: 0.125rem;
5455
5455
  }
5456
5456
 
5457
5457
  .bl-toast-success {
5458
- border-left: 4px solid var(--color-success);
5458
+ border-left: 0.25rem solid var(--color-success);
5459
5459
  }
5460
5460
  .bl-toast-success .bl-toast-title {
5461
5461
  color: var(--color-success);
5462
5462
  }
5463
5463
 
5464
5464
  .bl-toast-error {
5465
- border-left: 4px solid var(--color-error);
5465
+ border-left: 0.25rem solid var(--color-error);
5466
5466
  }
5467
5467
  .bl-toast-error .bl-toast-title {
5468
5468
  color: var(--color-error);
5469
5469
  }
5470
5470
 
5471
5471
  .bl-toast-warning {
5472
- border-left: 4px solid var(--color-warning);
5472
+ border-left: 0.25rem solid var(--color-warning);
5473
5473
  }
5474
5474
  .bl-toast-warning .bl-toast-title {
5475
5475
  color: var(--color-warning);
5476
5476
  }
5477
5477
 
5478
5478
  .bl-toast-info {
5479
- border-left: 4px solid var(--color-info);
5479
+ border-left: 0.25rem solid var(--color-info);
5480
5480
  }
5481
5481
  .bl-toast-info .bl-toast-title {
5482
5482
  color: var(--color-info);
@@ -5486,8 +5486,8 @@ textarea {
5486
5486
  display: inline-flex;
5487
5487
  align-items: center;
5488
5488
  justify-content: center;
5489
- width: 24px;
5490
- height: 24px;
5489
+ width: 1.5rem;
5490
+ height: 1.5rem;
5491
5491
  flex-shrink: 0;
5492
5492
  font-size: 1.25rem;
5493
5493
  }
@@ -5495,7 +5495,7 @@ textarea {
5495
5495
  @keyframes bl-toast-slide-in {
5496
5496
  from {
5497
5497
  opacity: 0;
5498
- transform: translateY(-20px);
5498
+ transform: translateY(-1.25rem);
5499
5499
  }
5500
5500
  to {
5501
5501
  opacity: 1;
@@ -5509,7 +5509,7 @@ textarea {
5509
5509
  }
5510
5510
  to {
5511
5511
  opacity: 0;
5512
- transform: translateY(-20px);
5512
+ transform: translateY(-1.25rem);
5513
5513
  }
5514
5514
  }
5515
5515
  .bl-toast-container.bl-toast-bottom-left .bl-toast,
@@ -5526,7 +5526,7 @@ textarea {
5526
5526
  @keyframes bl-toast-slide-in-bottom {
5527
5527
  from {
5528
5528
  opacity: 0;
5529
- transform: translateY(20px);
5529
+ transform: translateY(1.25rem);
5530
5530
  }
5531
5531
  to {
5532
5532
  opacity: 1;
@@ -5540,13 +5540,13 @@ textarea {
5540
5540
  }
5541
5541
  to {
5542
5542
  opacity: 0;
5543
- transform: translateY(20px);
5543
+ transform: translateY(1.25rem);
5544
5544
  }
5545
5545
  }
5546
5546
  .bl-divider {
5547
5547
  display: block;
5548
5548
  width: 100%;
5549
- height: 1px;
5549
+ height: 0.0625rem;
5550
5550
  margin: var(--spacing-md) 0;
5551
5551
  background: var(--glass-border-medium);
5552
5552
  border: none;
@@ -5565,7 +5565,7 @@ textarea {
5565
5565
  .bl-divider-text::before, .bl-divider-text::after {
5566
5566
  content: "";
5567
5567
  flex: 1;
5568
- height: 1px;
5568
+ height: 0.0625rem;
5569
5569
  background: var(--glass-border-medium);
5570
5570
  opacity: 0.5;
5571
5571
  }
@@ -5578,7 +5578,7 @@ textarea {
5578
5578
 
5579
5579
  .bl-divider-vertical {
5580
5580
  display: inline-block;
5581
- width: 1px;
5581
+ width: 0.0625rem;
5582
5582
  height: 100%;
5583
5583
  min-height: 1rem;
5584
5584
  margin: 0 var(--spacing-md);
@@ -5601,34 +5601,34 @@ textarea {
5601
5601
  }
5602
5602
 
5603
5603
  .bl-divider-thick {
5604
- height: 2px;
5604
+ height: 0.125rem;
5605
5605
  }
5606
5606
  .bl-divider-thick.bl-divider-vertical {
5607
- width: 2px;
5607
+ width: 0.125rem;
5608
5608
  height: 100%;
5609
5609
  }
5610
5610
 
5611
5611
  .bl-divider-dashed {
5612
5612
  background: none;
5613
- border-top: 1px dashed var(--glass-border-medium);
5613
+ border-top: 0.0625rem dashed var(--glass-border-medium);
5614
5614
  opacity: 0.5;
5615
5615
  }
5616
5616
  .bl-divider-dashed.bl-divider-vertical {
5617
5617
  border-top: none;
5618
- border-left: 1px dashed var(--glass-border-medium);
5618
+ border-left: 0.0625rem dashed var(--glass-border-medium);
5619
5619
  }
5620
5620
 
5621
5621
  .bl-avatar {
5622
5622
  display: inline-flex;
5623
5623
  align-items: center;
5624
5624
  justify-content: center;
5625
- width: 40px;
5626
- height: 40px;
5625
+ width: 2.5rem;
5626
+ height: 2.5rem;
5627
5627
  border-radius: 50%;
5628
5628
  background: var(--glass-bg-medium);
5629
5629
  backdrop-filter: blur(var(--glass-blur-md));
5630
5630
  -webkit-backdrop-filter: blur(var(--glass-blur-md));
5631
- border: 1px solid var(--glass-border-medium);
5631
+ border: 0.0625rem solid var(--glass-border-medium);
5632
5632
  overflow: hidden;
5633
5633
  flex-shrink: 0;
5634
5634
  position: relative;
@@ -5655,8 +5655,8 @@ img ~ .bl-avatar::before {
5655
5655
  }
5656
5656
 
5657
5657
  .bl-avatar-sm {
5658
- width: 32px;
5659
- height: 32px;
5658
+ width: 2rem;
5659
+ height: 2rem;
5660
5660
  font-size: var(--font-size-sm);
5661
5661
  }
5662
5662
  .bl-avatar-sm::before {
@@ -5664,8 +5664,8 @@ img ~ .bl-avatar::before {
5664
5664
  }
5665
5665
 
5666
5666
  .bl-avatar-md {
5667
- width: 40px;
5668
- height: 40px;
5667
+ width: 2.5rem;
5668
+ height: 2.5rem;
5669
5669
  font-size: var(--font-size-base);
5670
5670
  }
5671
5671
  .bl-avatar-md::before {
@@ -5673,8 +5673,8 @@ img ~ .bl-avatar::before {
5673
5673
  }
5674
5674
 
5675
5675
  .bl-avatar-lg {
5676
- width: 56px;
5677
- height: 56px;
5676
+ width: 3.5rem;
5677
+ height: 3.5rem;
5678
5678
  font-size: var(--font-size-lg);
5679
5679
  }
5680
5680
  .bl-avatar-lg::before {
@@ -5682,8 +5682,8 @@ img ~ .bl-avatar::before {
5682
5682
  }
5683
5683
 
5684
5684
  .bl-avatar-xl {
5685
- width: 80px;
5686
- height: 80px;
5685
+ width: 5rem;
5686
+ height: 5rem;
5687
5687
  font-size: var(--font-size-xl);
5688
5688
  }
5689
5689
  .bl-avatar-xl::before {
@@ -5694,21 +5694,21 @@ img ~ .bl-avatar::before {
5694
5694
  position: absolute;
5695
5695
  bottom: 0;
5696
5696
  right: 0;
5697
- width: 12px;
5698
- height: 12px;
5697
+ width: 0.75rem;
5698
+ height: 0.75rem;
5699
5699
  border-radius: 50%;
5700
- border: 2px solid var(--color-bg);
5700
+ border: 0.125rem solid var(--color-bg);
5701
5701
  background: var(--color-success);
5702
5702
  }
5703
5703
  .bl-avatar-status.bl-avatar-status-sm {
5704
- width: 10px;
5705
- height: 10px;
5706
- border-width: 1.5px;
5704
+ width: 0.625rem;
5705
+ height: 0.625rem;
5706
+ border-width: 0.09375rem;
5707
5707
  }
5708
5708
  .bl-avatar-status.bl-avatar-status-lg {
5709
- width: 14px;
5710
- height: 14px;
5711
- border-width: 2.5px;
5709
+ width: 0.875rem;
5710
+ height: 0.875rem;
5711
+ border-width: 0.15625rem;
5712
5712
  }
5713
5713
 
5714
5714
  .bl-avatar-status-online {