@gcsa/console-styles 0.1.2 → 0.1.3

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.
@@ -42,7 +42,7 @@
42
42
  --gcsa-font-size-md: 15px;
43
43
  --gcsa-font-size-lg: 16px;
44
44
  --gcsa-font-size-xl: 18px;
45
- --gcsa-font-size-2xl: 22px;
45
+ --gcsa-font-size-2xl: 24px;
46
46
  --gcsa-font-size-3xl: 28px;
47
47
 
48
48
  --gcsa-line-height-tight: 1.35;
@@ -63,7 +63,7 @@
63
63
  /* Figma dark foundation tokens (00 · Cover & Foundations). */
64
64
  --gcsa-color-bg-base: #030407;
65
65
  --gcsa-color-bg-shell: #030407;
66
- --gcsa-color-bg-shell-deep: #040c13;
66
+ --gcsa-color-bg-shell-deep: #030407;
67
67
  --gcsa-color-bg-surface: #121316;
68
68
  --gcsa-color-bg-elevated: #1a1b1f;
69
69
  --gcsa-color-bg-input: #121316;
@@ -420,7 +420,8 @@
420
420
  font-size: 14px;
421
421
  line-height: 1;
422
422
  padding: 0 14px;
423
- height: 36px;
423
+ height: var(--gcsa-control-height-md);
424
+ min-height: var(--gcsa-control-height-md);
424
425
  border: 1px solid transparent;
425
426
  cursor: pointer;
426
427
  transition: background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s;
@@ -433,22 +434,22 @@
433
434
  }
434
435
 
435
436
  .gcsa-btn--sm {
436
- height: var(--gcsa-control-height-sm, 24px);
437
- min-height: var(--gcsa-control-height-sm, 24px);
438
- font-size: 13px;
437
+ height: var(--gcsa-control-height-sm);
438
+ min-height: var(--gcsa-control-height-sm);
439
+ font-size: var(--gcsa-control-font-size-sm);
439
440
  padding: 0 12px;
440
441
  }
441
442
 
442
443
  .gcsa-btn--md {
443
- height: var(--gcsa-control-height-md, 32px);
444
- min-height: var(--gcsa-control-height-md, 32px);
445
- font-size: 14px;
444
+ height: var(--gcsa-control-height-md);
445
+ min-height: var(--gcsa-control-height-md);
446
+ font-size: var(--gcsa-control-font-size-md);
446
447
  padding: 0 14px;
447
448
  }
448
449
 
449
450
  .gcsa-btn--lg {
450
- height: var(--gcsa-control-height-lg, 40px);
451
- min-height: var(--gcsa-control-height-lg, 40px);
451
+ height: var(--gcsa-control-height-lg);
452
+ min-height: var(--gcsa-control-height-lg);
452
453
  font-size: 15px;
453
454
  }
454
455
 
@@ -691,8 +692,10 @@
691
692
 
692
693
  .gcsa-input:not(.gcsa-input-number__input),
693
694
  .gcsa-select {
694
- height: 38px;
695
- padding: 0 12px;
695
+ height: var(--gcsa-control-height-md);
696
+ min-height: var(--gcsa-control-height-md);
697
+ padding: 0 var(--gcsa-control-padding-x-md);
698
+ font-size: var(--gcsa-control-font-size-md);
696
699
  }
697
700
 
698
701
  .gcsa-textarea {
@@ -701,19 +704,19 @@
701
704
  resize: vertical;
702
705
  }
703
706
 
704
- /* ── Control sizes (Ant Design: small 24 / middle 32 / large 40) ── */
707
+ /* ── Control sizes:高度/字号只走 size 档位,勿在组件上写死 px ── */
705
708
  :root,
706
709
  [data-gcsa-theme='light'],
707
710
  [data-gcsa-theme='dark'] {
708
711
  --gcsa-control-height-sm: 24px;
709
- --gcsa-control-height-md: 32px;
712
+ --gcsa-control-height-md: 36px;
710
713
  --gcsa-control-height-lg: 40px;
711
714
  --gcsa-control-padding-x-sm: 7px;
712
- --gcsa-control-padding-x-md: 11px;
715
+ --gcsa-control-padding-x-md: 12px;
713
716
  --gcsa-control-padding-x-lg: 16px;
714
717
  --gcsa-control-font-size-sm: 12px;
715
- --gcsa-control-font-size-md: 14px;
716
- --gcsa-control-font-size-lg: 14px;
718
+ --gcsa-control-font-size-md: 13px;
719
+ --gcsa-control-font-size-lg: 13px;
717
720
  }
718
721
 
719
722
  .gcsa-text-control--sm .gcsa-input:not(.gcsa-input-number__input),
@@ -827,6 +830,19 @@
827
830
  border-color: var(--gcsa-color-destructive);
828
831
  }
829
832
 
833
+ .gcsa-input:disabled,
834
+ .gcsa-textarea:disabled,
835
+ .gcsa-select:disabled,
836
+ .gcsa-select-trigger:disabled,
837
+ .gcsa-select-trigger[data-disabled] {
838
+ opacity: 0.45;
839
+ cursor: not-allowed;
840
+ color: var(--gcsa-color-text-muted);
841
+ background: var(--gcsa-color-bg-elevated);
842
+ border-color: var(--gcsa-color-border-subtle);
843
+ box-shadow: none;
844
+ }
845
+
830
846
  .gcsa-input-group {
831
847
  display: flex;
832
848
  align-items: stretch;
@@ -1717,30 +1733,30 @@
1717
1733
  }
1718
1734
 
1719
1735
  :is([data-gcsa-theme='light'], [data-gcsa-theme='dark']) .gcsa-btn {
1720
- height: 40px;
1721
- min-height: 40px;
1736
+ height: var(--gcsa-control-height-md);
1737
+ min-height: var(--gcsa-control-height-md);
1722
1738
  box-sizing: border-box;
1723
1739
  padding-inline: 24px;
1724
1740
  border-radius: 20px;
1725
- font-size: 13px;
1741
+ font-size: var(--gcsa-control-font-size-md);
1726
1742
  letter-spacing: 0;
1727
1743
  }
1728
1744
 
1729
1745
  :is([data-gcsa-theme='light'], [data-gcsa-theme='dark']) .gcsa-btn--sm {
1730
- height: var(--gcsa-control-height-sm, 24px);
1731
- min-height: var(--gcsa-control-height-sm, 24px);
1746
+ height: var(--gcsa-control-height-sm);
1747
+ min-height: var(--gcsa-control-height-sm);
1732
1748
  padding-inline: 16px;
1733
1749
  }
1734
1750
 
1735
1751
  :is([data-gcsa-theme='light'], [data-gcsa-theme='dark']) .gcsa-btn--md {
1736
- height: var(--gcsa-control-height-md, 32px);
1737
- min-height: var(--gcsa-control-height-md, 32px);
1752
+ height: var(--gcsa-control-height-md);
1753
+ min-height: var(--gcsa-control-height-md);
1738
1754
  padding-inline: 16px;
1739
1755
  }
1740
1756
 
1741
1757
  :is([data-gcsa-theme='light'], [data-gcsa-theme='dark']) .gcsa-btn--lg {
1742
- height: var(--gcsa-control-height-lg, 40px);
1743
- min-height: var(--gcsa-control-height-lg, 40px);
1758
+ height: var(--gcsa-control-height-lg);
1759
+ min-height: var(--gcsa-control-height-lg);
1744
1760
  padding-inline: 24px;
1745
1761
  }
1746
1762
 
@@ -1777,7 +1793,7 @@
1777
1793
 
1778
1794
  /* Time inputs use the Figma field typography and preserve their native clock affordance. */
1779
1795
  :is([data-gcsa-theme='light'], [data-gcsa-theme='dark']) .gcsa-time-picker {
1780
- font-size: 14px;
1796
+ font-size: var(--gcsa-control-font-size-md);
1781
1797
  line-height: 16px;
1782
1798
  }
1783
1799
 
@@ -1840,7 +1856,7 @@
1840
1856
  }
1841
1857
 
1842
1858
  :is([data-gcsa-theme='light'], [data-gcsa-theme='dark']) .gcsa-pagination {
1843
- --gcsa-pagination-control-height: 36px;
1859
+ --gcsa-pagination-control-height: var(--gcsa-control-height-md);
1844
1860
  }
1845
1861
 
1846
1862
  :is([data-gcsa-theme='light'], [data-gcsa-theme='dark']) .gcsa-pagination__size,
@@ -1891,16 +1907,14 @@
1891
1907
 
1892
1908
  [data-gcsa-theme='dark'] .gcsa-date-picker__control,
1893
1909
  [data-gcsa-theme='dark'] .gcsa-date-range-picker__control {
1894
- min-height: 40px;
1895
- height: 40px;
1896
1910
  box-sizing: border-box;
1897
- padding-left: 16px;
1911
+ padding-left: var(--gcsa-control-padding-x-lg);
1898
1912
  border-radius: 8px;
1899
1913
  }
1900
1914
 
1901
1915
  [data-gcsa-theme='dark'] .gcsa-date-picker__control > .gcsa-date-picker__input {
1902
- height: 30px;
1903
- min-height: 30px;
1916
+ height: 26px;
1917
+ min-height: 26px;
1904
1918
  box-sizing: border-box;
1905
1919
  padding: 0;
1906
1920
  border: 0 !important;
@@ -1909,6 +1923,29 @@
1909
1923
  box-shadow: none !important;
1910
1924
  }
1911
1925
 
1926
+ [data-gcsa-theme='light'] .gcsa-cascader__trigger {
1927
+ border-color: var(--gcsa-color-border);
1928
+ background: var(--gcsa-color-bg-surface);
1929
+ color: var(--gcsa-color-text-heading);
1930
+ }
1931
+
1932
+ [data-gcsa-theme='light'] .gcsa-cascader__panel {
1933
+ border-color: var(--gcsa-color-border-subtle);
1934
+ background: var(--gcsa-color-bg-elevated, var(--gcsa-color-bg-surface));
1935
+ box-shadow: var(--gcsa-shadow-md);
1936
+ color: var(--gcsa-color-text);
1937
+ }
1938
+
1939
+ [data-gcsa-theme='light'] .gcsa-cascader__option {
1940
+ color: var(--gcsa-color-text-secondary);
1941
+ }
1942
+
1943
+ [data-gcsa-theme='light'] .gcsa-cascader__option:hover:not(:disabled),
1944
+ [data-gcsa-theme='light'] .gcsa-cascader__option--active {
1945
+ color: var(--gcsa-color-primary);
1946
+ background: var(--gcsa-color-primary-muted);
1947
+ }
1948
+
1912
1949
  [data-gcsa-theme='dark'] .gcsa-cascader__trigger {
1913
1950
  border-color: var(--gcsa-color-border);
1914
1951
  background: var(--gcsa-color-bg-input);
@@ -2118,7 +2155,7 @@
2118
2155
  min-width: 0;
2119
2156
  border-right: none;
2120
2157
  background: transparent;
2121
- --gcsa-menu-item-height: 36px;
2158
+ --gcsa-menu-item-height: var(--gcsa-control-height-md);
2122
2159
  --gcsa-menu-item-radius: 4px;
2123
2160
  --gcsa-menu-item-pad-x: 12px;
2124
2161
  --gcsa-menu-icon-size: 16px;
@@ -2441,16 +2478,16 @@
2441
2478
  }
2442
2479
  }
2443
2480
 
2444
- /* Empty */
2481
+ /* Empty — Figma 2174:3336 */
2445
2482
  .gcsa-empty {
2446
2483
  display: flex;
2447
2484
  flex-direction: column;
2448
2485
  align-items: center;
2449
2486
  box-sizing: border-box;
2450
- padding: 48px 24px;
2487
+ padding: 41px 25px;
2451
2488
  border: 1px solid var(--gcsa-color-border-subtle);
2452
2489
  border-radius: 12px;
2453
- background: var(--gcsa-color-bg-elevated);
2490
+ background: var(--gcsa-color-bg-surface);
2454
2491
  text-align: center;
2455
2492
  color: var(--gcsa-color-text-muted);
2456
2493
  }
@@ -2459,30 +2496,31 @@
2459
2496
  display: inline-flex;
2460
2497
  align-items: center;
2461
2498
  justify-content: center;
2462
- width: 48px;
2463
- height: 48px;
2499
+ width: 66px;
2500
+ height: 66px;
2501
+ margin-bottom: 0;
2464
2502
  color: var(--gcsa-color-primary);
2465
2503
  }
2466
2504
 
2467
2505
  .gcsa-empty__icon .gcsa-icon,
2468
2506
  .gcsa-empty__icon .gcsa-icon svg {
2469
- width: 29px;
2470
- height: 36px;
2507
+ width: 66px;
2508
+ height: 66px;
2471
2509
  }
2472
2510
 
2473
2511
  .gcsa-empty__title {
2474
2512
  margin: 12px 0 0;
2475
- color: var(--gcsa-color-text);
2513
+ color: rgba(255, 255, 255, 0.6);
2476
2514
  font-family: var(--gcsa-font-body);
2477
- font-size: 16px;
2515
+ font-size: 14px;
2478
2516
  font-weight: 400;
2479
2517
  line-height: 24px;
2480
2518
  }
2481
2519
 
2482
2520
  .gcsa-empty__desc {
2483
2521
  margin: 4px 0 0;
2484
- color: color-mix(in srgb, var(--gcsa-color-text) 30%, transparent);
2485
- font-size: 14px;
2522
+ color: rgba(255, 255, 255, 0.3);
2523
+ font-size: 12px;
2486
2524
  line-height: 22.4px;
2487
2525
  }
2488
2526
 
@@ -2492,8 +2530,40 @@
2492
2530
  margin-top: 8px;
2493
2531
  }
2494
2532
 
2495
- .gcsa-empty__action .gcsa-btn {
2533
+ /* Figma 2174:3336:soft primary outline pill(压过 dark primary 实心样式) */
2534
+ .gcsa-empty__action .gcsa-btn,
2535
+ .gcsa-empty__action .gcsa-btn--primary,
2536
+ .gcsa-empty__action .gcsa-btn--secondary,
2537
+ .gcsa-empty__action .gcsa-btn--ghost,
2538
+ [data-gcsa-theme='dark'] .gcsa-empty__action .gcsa-btn,
2539
+ [data-gcsa-theme='dark'] .gcsa-empty__action .gcsa-btn--primary,
2540
+ [data-gcsa-theme='dark'] .gcsa-empty__action .gcsa-btn--secondary,
2541
+ [data-gcsa-theme='dark'] .gcsa-empty__action .gcsa-btn--ghost,
2542
+ [data-gcsa-theme='light'] .gcsa-empty__action .gcsa-btn,
2543
+ [data-gcsa-theme='light'] .gcsa-empty__action .gcsa-btn--primary {
2544
+ height: 32px;
2545
+ min-height: 32px;
2546
+ padding-inline: 13px;
2496
2547
  border-radius: 20px;
2548
+ border-color: rgba(0, 187, 204, 0.32);
2549
+ background: rgba(0, 187, 204, 0.08);
2550
+ box-shadow: none;
2551
+ color: var(--gcsa-color-primary);
2552
+ font-size: 13px;
2553
+ font-weight: 600;
2554
+ line-height: 13px;
2555
+ }
2556
+
2557
+ .gcsa-empty__action .gcsa-btn:hover:not(:disabled),
2558
+ .gcsa-empty__action .gcsa-btn--primary:hover:not(:disabled),
2559
+ [data-gcsa-theme='dark'] .gcsa-empty__action .gcsa-btn:hover:not(:disabled),
2560
+ [data-gcsa-theme='dark'] .gcsa-empty__action .gcsa-btn--primary:hover:not(:disabled),
2561
+ [data-gcsa-theme='light'] .gcsa-empty__action .gcsa-btn:hover:not(:disabled),
2562
+ [data-gcsa-theme='light'] .gcsa-empty__action .gcsa-btn--primary:hover:not(:disabled) {
2563
+ border-color: rgba(0, 187, 204, 0.48);
2564
+ background: rgba(0, 187, 204, 0.14);
2565
+ box-shadow: none;
2566
+ color: var(--gcsa-color-primary);
2497
2567
  }
2498
2568
 
2499
2569
  /* Chat */
@@ -3132,7 +3202,7 @@
3132
3202
  box-sizing: border-box;
3133
3203
  overflow: hidden;
3134
3204
  border-radius: inherit;
3135
- background: color-mix(in srgb, var(--gcsa-color-text-heading, #000205) 62%, transparent);
3205
+ background: color-mix(in srgb, var(--gcsa-color-bg-base) 62%, transparent);
3136
3206
  transition: opacity 0.25s ease;
3137
3207
  opacity: 1;
3138
3208
  }
@@ -3140,7 +3210,7 @@
3140
3210
  .gcsa-loading-mask--fullscreen {
3141
3211
  position: fixed;
3142
3212
  border-radius: 0;
3143
- background: #000205;
3213
+ background: var(--gcsa-color-bg-base);
3144
3214
  }
3145
3215
 
3146
3216
  .gcsa-loading-spinner {
@@ -3885,17 +3955,19 @@
3885
3955
  display: inline-flex;
3886
3956
  align-items: center;
3887
3957
  justify-content: center;
3888
- min-height: 40px;
3889
- padding: 10px 16px;
3958
+ min-width: 96px;
3959
+ height: 24px;
3960
+ min-height: 24px;
3961
+ padding: 0 16px;
3890
3962
  margin-bottom: -1px;
3891
3963
  border: none;
3892
3964
  border-bottom: 2px solid transparent;
3893
3965
  background: transparent;
3894
3966
  color: var(--gcsa-color-text-secondary);
3895
3967
  font: inherit;
3896
- font-size: 14px;
3968
+ font-size: 13px;
3897
3969
  font-weight: 500;
3898
- line-height: 1.4;
3970
+ line-height: 16px;
3899
3971
  cursor: pointer;
3900
3972
  white-space: nowrap;
3901
3973
  transition:
@@ -3945,7 +4017,7 @@
3945
4017
  }
3946
4018
 
3947
4019
  .gcsa-tabs--soft .gcsa-tabs__trigger {
3948
- min-height: 36px;
4020
+ min-height: var(--gcsa-control-height-md);
3949
4021
  padding: 8px 14px;
3950
4022
  margin-bottom: 0;
3951
4023
  border: 1px solid transparent;
@@ -4041,16 +4113,19 @@
4041
4113
  }
4042
4114
 
4043
4115
  .gcsa-statistic__label {
4044
- font-size: 11px;
4045
- letter-spacing: 0.1em;
4046
- text-transform: uppercase;
4047
- color: var(--gcsa-color-text-muted);
4116
+ font-size: 12px;
4117
+ letter-spacing: 0;
4118
+ text-transform: none;
4119
+ color: var(--gcsa-color-text-secondary);
4120
+ font-weight: 600;
4048
4121
  }
4049
4122
 
4050
4123
  .gcsa-statistic__value {
4051
- margin-top: 6px;
4052
- font-family: var(--gcsa-font-brand);
4053
- font-size: 28px;
4124
+ margin-top: 4px;
4125
+ font-family: var(--gcsa-font-body);
4126
+ font-size: 24px;
4127
+ font-weight: 600;
4128
+ line-height: 1.2;
4054
4129
  color: var(--gcsa-color-primary);
4055
4130
  }
4056
4131
 
@@ -4326,7 +4401,7 @@
4326
4401
  .gcsa-checkbox__label,
4327
4402
  .gcsa-switch__label {
4328
4403
  color: var(--gcsa-color-text);
4329
- font-size: 14px;
4404
+ font-size: 13px;
4330
4405
  line-height: 1.4;
4331
4406
  }
4332
4407
 
@@ -4334,7 +4409,7 @@
4334
4409
  width: 18px;
4335
4410
  height: 18px;
4336
4411
  flex-shrink: 0;
4337
- border: 1px solid var(--gcsa-color-border-strong);
4412
+ border: 1px solid var(--gcsa-color-border);
4338
4413
  border-radius: 4px;
4339
4414
  background: var(--gcsa-color-bg-input);
4340
4415
  display: grid;
@@ -4348,7 +4423,8 @@
4348
4423
  .gcsa-checkbox__indicator {
4349
4424
  display: grid;
4350
4425
  place-items: center;
4351
- color: var(--gcsa-color-primary);
4426
+ /* Figma checked:主色底 + 白勾(两主题一致) */
4427
+ color: #ffffff;
4352
4428
  opacity: 0;
4353
4429
  transform: scale(0.85);
4354
4430
  transition:
@@ -4358,7 +4434,7 @@
4358
4434
 
4359
4435
  .gcsa-checkbox__box[data-state='checked'],
4360
4436
  .gcsa-checkbox__box[data-checked] {
4361
- background: var(--gcsa-color-primary-muted);
4437
+ background: var(--gcsa-color-primary);
4362
4438
  border-color: var(--gcsa-color-primary);
4363
4439
  }
4364
4440
 
@@ -4454,15 +4530,16 @@
4454
4530
  width: 100%;
4455
4531
  max-width: 100%;
4456
4532
  min-width: 0;
4457
- height: 38px;
4458
- min-height: 38px;
4459
- padding: 0 10px 0 12px;
4533
+ height: var(--gcsa-control-height-md);
4534
+ min-height: var(--gcsa-control-height-md);
4535
+ padding: 0 10px 0 var(--gcsa-control-padding-x-md);
4460
4536
  border: 1px solid var(--gcsa-color-border-subtle);
4461
4537
  border-radius: var(--gcsa-radius-sm);
4462
4538
  background: var(--gcsa-color-bg-input);
4463
4539
  color: var(--gcsa-color-text);
4464
4540
  cursor: pointer;
4465
4541
  font: inherit;
4542
+ font-size: var(--gcsa-control-font-size-md);
4466
4543
  text-align: left;
4467
4544
  outline: none;
4468
4545
  transition:
@@ -4889,7 +4966,7 @@
4889
4966
 
4890
4967
  .gcsa-radio__label {
4891
4968
  color: var(--gcsa-color-text);
4892
- font-size: 14px;
4969
+ font-size: 13px;
4893
4970
  line-height: 1.4;
4894
4971
  }
4895
4972
 
@@ -4907,9 +4984,12 @@
4907
4984
  width: 100%;
4908
4985
  max-width: 200px;
4909
4986
  min-width: 0;
4987
+ height: var(--gcsa-control-height-md);
4988
+ min-height: var(--gcsa-control-height-md);
4910
4989
  border: 1px solid var(--gcsa-color-border-subtle);
4911
4990
  border-radius: var(--gcsa-radius-sm);
4912
4991
  background: var(--gcsa-color-bg-input);
4992
+ font-size: var(--gcsa-control-font-size-md);
4913
4993
  overflow: hidden;
4914
4994
  transition:
4915
4995
  border-color var(--gcsa-motion-fast) ease,
@@ -5024,11 +5104,14 @@
5024
5104
  align-items: center;
5025
5105
  gap: 4px;
5026
5106
  width: 100%;
5027
- min-height: 38px;
5028
- padding: 0 4px 0 12px;
5107
+ min-height: var(--gcsa-control-height-md);
5108
+ height: var(--gcsa-control-height-md);
5109
+ box-sizing: border-box;
5110
+ padding: 0 4px 0 var(--gcsa-control-padding-x-md);
5029
5111
  border: 1px solid var(--gcsa-color-border-subtle);
5030
5112
  border-radius: var(--gcsa-radius-sm);
5031
5113
  background: var(--gcsa-color-bg-input);
5114
+ font-size: var(--gcsa-control-font-size-md);
5032
5115
  transition:
5033
5116
  border-color var(--gcsa-motion-fast) ease,
5034
5117
  box-shadow var(--gcsa-motion-fast) ease;
@@ -5667,7 +5750,7 @@ button.gcsa-steps__trigger { cursor: pointer; }
5667
5750
  @media (max-width: 640px) { .gcsa-steps:not(.gcsa-steps--vertical) { overflow-x: auto; padding-bottom: 4px; } .gcsa-steps:not(.gcsa-steps--vertical) .gcsa-steps__item { min-width: 150px; } }
5668
5751
 
5669
5752
  /* Cascader */
5670
- .gcsa-cascader__trigger { display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-width: 180px; height: 40px; min-height: 40px; box-sizing: border-box; padding: 0 12px 0 16px; border: 1px solid var(--gcsa-color-border); border-radius: 8px; color: var(--gcsa-color-text-heading); background: var(--gcsa-color-bg-surface); font: inherit; line-height: 16px; text-align: start; cursor: pointer; transition: border-color var(--gcsa-motion-fast) var(--gcsa-ease-out), box-shadow var(--gcsa-motion-fast) var(--gcsa-ease-out); }
5753
+ .gcsa-cascader__trigger { display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-width: 180px; height: var(--gcsa-control-height-md); min-height: var(--gcsa-control-height-md); box-sizing: border-box; padding: 0 12px 0 var(--gcsa-control-padding-x-lg); border: 1px solid var(--gcsa-color-border); border-radius: 8px; color: var(--gcsa-color-text-heading); background: var(--gcsa-color-bg-surface); font: inherit; font-size: var(--gcsa-control-font-size-md); line-height: 16px; text-align: start; cursor: pointer; transition: border-color var(--gcsa-motion-fast) var(--gcsa-ease-out), box-shadow var(--gcsa-motion-fast) var(--gcsa-ease-out); }
5671
5754
  .gcsa-cascader__trigger:hover:not(:disabled) { border-color: var(--gcsa-color-primary); }
5672
5755
  .gcsa-cascader__trigger[data-state='open'], .gcsa-cascader__trigger[aria-expanded='true'] { border-color: var(--gcsa-color-border-strong); box-shadow: 0 0 0 3px var(--gcsa-color-primary-muted); }
5673
5756
  .gcsa-cascader__trigger:disabled { opacity: 0.5; cursor: not-allowed; }
@@ -5676,10 +5759,10 @@ button.gcsa-steps__trigger { cursor: pointer; }
5676
5759
  .gcsa-cascader__value[data-placeholder] { color: var(--gcsa-color-text-muted); }
5677
5760
  .gcsa-cascader__trigger > .gcsa-icon { flex: 0 0 16px; color: var(--gcsa-color-text-muted); transition: transform var(--gcsa-motion-fast) var(--gcsa-ease-out); }
5678
5761
  .gcsa-cascader__trigger[data-state='open'] > .gcsa-icon, .gcsa-cascader__trigger[aria-expanded='true'] > .gcsa-icon { transform: rotate(180deg); }
5679
- .gcsa-popover:has(.gcsa-cascader__panel) { min-width: 0; max-width: none; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: visible; }
5762
+ .gcsa-popover:has(.gcsa-cascader__panel) { min-width: 0; max-width: none; width: max-content; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: visible; }
5680
5763
  .gcsa-popover:has(.gcsa-cascader__panel) > .gcsa-popover__body { padding: 0; }
5681
- .gcsa-cascader__panel { display: flex; width: max-content; min-width: 0; max-width: min(720px, calc(100vw - 32px)); max-height: 320px; overflow: auto; padding: 6px 4px; border: 1px solid var(--gcsa-color-border-subtle); border-radius: 8px; background: var(--gcsa-color-bg-surface); box-shadow: var(--gcsa-shadow-md); }
5682
- .gcsa-cascader__column { flex: 0 0 180px; min-width: 180px; padding: 0 4px; border-inline-end: 1px solid var(--gcsa-color-border-subtle); }
5764
+ .gcsa-cascader__panel { display: flex; width: max-content; min-width: var(--reference-width, 180px); max-width: min(720px, var(--available-width, calc(100vw - 32px))); max-height: 320px; overflow: auto; padding: 6px 4px; border: 1px solid var(--gcsa-color-border-subtle); border-radius: 8px; background: var(--gcsa-color-bg-surface); box-shadow: var(--gcsa-shadow-md); color: var(--gcsa-color-text); }
5765
+ .gcsa-cascader__column { flex: 1 0 180px; min-width: 180px; padding: 0 4px; border-inline-end: 1px solid var(--gcsa-color-border-subtle); }
5683
5766
  .gcsa-cascader__column:last-child { border-inline-end: 0; }
5684
5767
  .gcsa-cascader__option { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 32px; gap: 10px; padding: 0 12px; border: 0; border-radius: 4px; color: var(--gcsa-color-text-secondary); background: transparent; font: inherit; font-size: 13px; line-height: 16px; text-align: start; cursor: pointer; transition: color var(--gcsa-motion-fast) var(--gcsa-ease-out), background var(--gcsa-motion-fast) var(--gcsa-ease-out); }
5685
5768
  .gcsa-cascader__option:hover:not(:disabled), .gcsa-cascader__option--active { color: var(--gcsa-color-primary); background: var(--gcsa-color-primary-muted); }
@@ -5697,10 +5780,11 @@ button.gcsa-steps__trigger { cursor: pointer; }
5697
5780
  .gcsa-transfer__search .gcsa-input { min-height: 32px; height: 32px; font-size: 12px; }
5698
5781
  .gcsa-transfer__list { flex: 1; min-height: 200px; max-height: 260px; overflow: auto; padding: 4px 6px 8px; }
5699
5782
  .gcsa-transfer__item { display: flex; align-items: center; width: 100%; min-height: 36px; gap: 8px; padding: 6px 8px; border: 0; border-radius: 5px; color: var(--gcsa-color-text-secondary); background: transparent; text-align: start; cursor: pointer; }
5700
- .gcsa-transfer__item:hover:not(:disabled), .gcsa-transfer__item--selected { color: var(--gcsa-color-primary); background: var(--gcsa-color-primary-muted); }
5701
- .gcsa-transfer__item:disabled { opacity: 0.45; cursor: not-allowed; }
5702
- .gcsa-transfer__check { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; flex: 0 0 16px; border: 1px solid var(--gcsa-color-border-strong); border-radius: 4px; color: var(--gcsa-color-text-on-surface); background: var(--gcsa-color-primary); font-size: 11px; line-height: 1; }
5703
- .gcsa-transfer__item:not(.gcsa-transfer__item--selected) .gcsa-transfer__check { color: transparent; background: transparent; }
5783
+ .gcsa-transfer__item:hover:not([aria-disabled='true']), .gcsa-transfer__item--selected { color: var(--gcsa-color-primary); background: var(--gcsa-color-primary-muted); }
5784
+ .gcsa-transfer__item[aria-disabled='true'] { opacity: 0.45; cursor: not-allowed; }
5785
+ .gcsa-transfer__check-wrap { display: inline-flex; flex: 0 0 auto; }
5786
+ .gcsa-transfer__item .gcsa-checkbox { min-height: 0; padding: 0; gap: 0; }
5787
+ .gcsa-transfer__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
5704
5788
  .gcsa-transfer__actions { display: flex; flex: 0 0 auto; flex-direction: column; gap: 8px; }
5705
5789
  .gcsa-transfer__action { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; border: 1px solid var(--gcsa-color-border-subtle); border-radius: 6px; color: var(--gcsa-color-text-secondary); background: var(--gcsa-color-bg-surface); font-size: 22px; line-height: 1; cursor: pointer; }
5706
5790
  .gcsa-transfer__action:hover:not(:disabled) { color: var(--gcsa-color-primary); border-color: var(--gcsa-color-primary); background: var(--gcsa-color-primary-muted); }
@@ -5735,14 +5819,15 @@ button.gcsa-steps__trigger { cursor: pointer; }
5735
5819
  flex-direction: column;
5736
5820
  align-items: center;
5737
5821
  justify-content: center;
5738
- gap: 8px;
5822
+ gap: 6px;
5739
5823
  box-sizing: border-box;
5740
5824
  width: 100%;
5741
- min-height: 123px;
5742
- padding: 17px 13px;
5743
- border: 1px dashed var(--gcsa-color-border-strong);
5744
- border-radius: 4px;
5745
- background: var(--gcsa-color-primary-muted);
5825
+ min-height: 96px;
5826
+ height: auto;
5827
+ padding: 16px 12px;
5828
+ border: 1px dashed var(--gcsa-color-border);
5829
+ border-radius: 8px;
5830
+ background: var(--gcsa-color-bg-base);
5746
5831
  cursor: pointer;
5747
5832
  transition: border-color var(--gcsa-motion-fast) ease, background var(--gcsa-motion-fast) ease;
5748
5833
  }
@@ -5750,36 +5835,37 @@ button.gcsa-steps__trigger { cursor: pointer; }
5750
5835
  .gcsa-upload__dropzone:hover,
5751
5836
  .gcsa-upload--dragging .gcsa-upload__dropzone {
5752
5837
  border-color: var(--gcsa-color-primary);
5753
- background: var(--gcsa-color-primary-muted-strong);
5838
+ background: var(--gcsa-color-primary-muted);
5754
5839
  }
5755
5840
 
5756
5841
  .gcsa-upload__icon {
5757
5842
  display: inline-flex;
5758
5843
  align-items: center;
5759
5844
  justify-content: center;
5760
- width: 32px;
5761
- height: 32px;
5845
+ width: 40px;
5846
+ height: 40px;
5762
5847
  color: var(--gcsa-color-primary);
5763
5848
  }
5764
5849
 
5765
5850
  .gcsa-upload__icon .gcsa-icon,
5766
5851
  .gcsa-upload__icon .gcsa-icon svg {
5767
- width: 23px;
5768
- height: 23px;
5852
+ width: 40px;
5853
+ height: 40px;
5769
5854
  }
5770
5855
 
5771
5856
  .gcsa-upload__title {
5772
5857
  color: var(--gcsa-color-text);
5773
- font-size: 16px;
5774
- line-height: 24px;
5858
+ font-size: 13px;
5859
+ font-weight: 600;
5860
+ line-height: 1.2;
5775
5861
  text-align: center;
5776
5862
  }
5777
5863
 
5778
5864
  .gcsa-upload__hint {
5779
5865
  margin: 0;
5780
- color: color-mix(in srgb, var(--gcsa-color-text) 30%, transparent);
5781
- font-size: 14px;
5782
- line-height: 16.8px;
5866
+ color: var(--gcsa-color-text-secondary);
5867
+ font-size: 12px;
5868
+ line-height: 1.2;
5783
5869
  text-align: center;
5784
5870
  }
5785
5871
 
@@ -6724,27 +6810,28 @@ button.gcsa-steps__trigger { cursor: pointer; }
6724
6810
  }
6725
6811
 
6726
6812
  [data-gcsa-theme='dark'] .gcsa-btn {
6727
- height: 40px;
6813
+ height: var(--gcsa-control-height-md);
6814
+ min-height: var(--gcsa-control-height-md);
6728
6815
  padding-inline: 16px;
6729
6816
  border-radius: 20px;
6730
- font-size: 13px;
6817
+ font-size: var(--gcsa-control-font-size-md);
6731
6818
  }
6732
6819
 
6733
6820
  [data-gcsa-theme='dark'] .gcsa-btn--sm {
6734
- height: var(--gcsa-control-height-sm, 24px);
6735
- min-height: var(--gcsa-control-height-sm, 24px);
6821
+ height: var(--gcsa-control-height-sm);
6822
+ min-height: var(--gcsa-control-height-sm);
6736
6823
  padding-inline: 12px;
6737
6824
  }
6738
6825
 
6739
6826
  [data-gcsa-theme='dark'] .gcsa-btn--md {
6740
- height: var(--gcsa-control-height-md, 32px);
6741
- min-height: var(--gcsa-control-height-md, 32px);
6827
+ height: var(--gcsa-control-height-md);
6828
+ min-height: var(--gcsa-control-height-md);
6742
6829
  padding-inline: 16px;
6743
6830
  }
6744
6831
 
6745
6832
  [data-gcsa-theme='dark'] .gcsa-btn--lg {
6746
- height: var(--gcsa-control-height-lg, 40px);
6747
- min-height: var(--gcsa-control-height-lg, 40px);
6833
+ height: var(--gcsa-control-height-lg);
6834
+ min-height: var(--gcsa-control-height-lg);
6748
6835
  padding-inline: 20px;
6749
6836
  }
6750
6837
 
@@ -6846,15 +6933,13 @@ button.gcsa-steps__trigger { cursor: pointer; }
6846
6933
  [data-gcsa-theme='dark'] .gcsa-table td { color: var(--gcsa-color-text); }
6847
6934
 
6848
6935
  [data-gcsa-theme='dark'] .gcsa-date-picker__control {
6849
- height: 40px;
6850
- min-height: 40px;
6851
6936
  box-sizing: border-box;
6852
- padding-left: 16px;
6937
+ padding-left: var(--gcsa-control-padding-x-lg);
6853
6938
  }
6854
6939
 
6855
6940
  [data-gcsa-theme='dark'] .gcsa-date-picker__control > .gcsa-date-picker__input {
6856
- height: 30px;
6857
- min-height: 30px;
6941
+ height: 26px;
6942
+ min-height: 26px;
6858
6943
  box-sizing: border-box;
6859
6944
  padding: 0;
6860
6945
  border: 0 !important;
@@ -6953,32 +7038,33 @@ button.gcsa-steps__trigger { cursor: pointer; }
6953
7038
  }
6954
7039
 
6955
7040
  [data-gcsa-theme='light'] .gcsa-btn {
6956
- height: 40px;
7041
+ height: var(--gcsa-control-height-md);
7042
+ min-height: var(--gcsa-control-height-md);
6957
7043
  padding: 0 16px;
6958
7044
  gap: 8px;
6959
7045
  border-radius: 20px;
6960
- font-size: 13px;
7046
+ font-size: var(--gcsa-control-font-size-md);
6961
7047
  font-weight: 600;
6962
7048
  letter-spacing: 0;
6963
7049
  }
6964
7050
 
6965
7051
  [data-gcsa-theme='light'] .gcsa-btn--sm {
6966
- height: var(--gcsa-control-height-sm, 24px);
6967
- min-height: var(--gcsa-control-height-sm, 24px);
7052
+ height: var(--gcsa-control-height-sm);
7053
+ min-height: var(--gcsa-control-height-sm);
6968
7054
  padding-inline: 16px;
6969
- font-size: 13px;
7055
+ font-size: var(--gcsa-control-font-size-sm);
6970
7056
  }
6971
7057
 
6972
7058
  [data-gcsa-theme='light'] .gcsa-btn--md {
6973
- height: var(--gcsa-control-height-md, 32px);
6974
- min-height: var(--gcsa-control-height-md, 32px);
7059
+ height: var(--gcsa-control-height-md);
7060
+ min-height: var(--gcsa-control-height-md);
6975
7061
  padding-inline: 16px;
6976
- font-size: 13px;
7062
+ font-size: var(--gcsa-control-font-size-md);
6977
7063
  }
6978
7064
 
6979
7065
  [data-gcsa-theme='light'] .gcsa-btn--lg {
6980
- height: var(--gcsa-control-height-lg, 40px);
6981
- min-height: var(--gcsa-control-height-lg, 40px);
7066
+ height: var(--gcsa-control-height-lg);
7067
+ min-height: var(--gcsa-control-height-lg);
6982
7068
  padding-inline: 24px;
6983
7069
  font-size: 14px;
6984
7070
  }
@@ -7156,7 +7242,7 @@ button.gcsa-steps__trigger { cursor: pointer; }
7156
7242
  min-height: 128px;
7157
7243
  box-sizing: border-box;
7158
7244
  padding: 41px 25px;
7159
- background: #ffffff;
7245
+ background: var(--gcsa-color-bg-surface);
7160
7246
  border-color: rgba(3, 4, 7, 0.08);
7161
7247
  border-radius: 12px;
7162
7248
  }
@@ -7170,15 +7256,17 @@ button.gcsa-steps__trigger { cursor: pointer; }
7170
7256
 
7171
7257
  [data-gcsa-theme='light'] .gcsa-empty__title {
7172
7258
  margin: 12px 0 0;
7259
+ color: rgba(15, 23, 42, 0.6);
7173
7260
  font-family: var(--gcsa-font-body);
7174
- font-size: 16px;
7261
+ font-size: 14px;
7175
7262
  font-weight: 400;
7176
7263
  line-height: 24px;
7177
7264
  }
7178
7265
 
7179
7266
  [data-gcsa-theme='light'] .gcsa-empty__desc {
7180
7267
  margin-top: 4px;
7181
- font-size: 14px;
7268
+ color: rgba(15, 23, 42, 0.3);
7269
+ font-size: 12px;
7182
7270
  line-height: 22.4px;
7183
7271
  }
7184
7272
 
@@ -7283,37 +7371,31 @@ button.gcsa-steps__trigger { cursor: pointer; }
7283
7371
  }
7284
7372
 
7285
7373
  [data-gcsa-theme='light'] .gcsa-input-number {
7286
- height: 40px;
7287
- min-height: 40px;
7288
7374
  box-sizing: border-box;
7289
7375
  border-color: var(--gcsa-color-border);
7290
7376
  border-radius: 8px;
7291
7377
  }
7292
7378
 
7293
7379
  :is([data-gcsa-theme='light'], [data-gcsa-theme='dark']) .gcsa-input-number {
7294
- height: 40px;
7295
- min-height: 40px;
7296
7380
  box-sizing: border-box;
7297
7381
  }
7298
7382
 
7299
7383
  [data-gcsa-theme='light'] .gcsa-input-number__btn {
7300
- min-height: 38px;
7384
+ min-height: 34px;
7301
7385
  background: #ffffff;
7302
7386
  }
7303
7387
 
7304
7388
  [data-gcsa-theme='light'] .gcsa-date-picker__control {
7305
- height: 40px;
7306
- min-height: 40px;
7307
7389
  box-sizing: border-box;
7308
- padding-left: 16px;
7390
+ padding-left: var(--gcsa-control-padding-x-lg);
7309
7391
  border-color: var(--gcsa-color-border);
7310
7392
  border-radius: 8px;
7311
7393
  background: #ffffff;
7312
7394
  }
7313
7395
 
7314
7396
  [data-gcsa-theme='light'] .gcsa-date-picker__control > .gcsa-date-picker__input {
7315
- height: 30px;
7316
- min-height: 30px;
7397
+ height: 26px;
7398
+ min-height: 26px;
7317
7399
  box-sizing: border-box;
7318
7400
  padding: 0;
7319
7401
  border: 0 !important;
@@ -7448,24 +7530,24 @@ button.gcsa-steps__trigger { cursor: pointer; }
7448
7530
  }
7449
7531
 
7450
7532
  [data-gcsa-theme='dark'] .gcsa-upload__dropzone {
7451
- background: rgba(0, 187, 204, 0.08);
7452
- border-color: rgba(0, 187, 204, 0.32);
7533
+ background: var(--gcsa-color-bg-base);
7534
+ border-color: var(--gcsa-color-border);
7453
7535
  }
7454
7536
 
7455
7537
  [data-gcsa-theme='dark'] .gcsa-upload__dropzone:hover,
7456
7538
  [data-gcsa-theme='dark'] .gcsa-upload--dragging .gcsa-upload__dropzone {
7457
- background: rgba(0, 187, 204, 0.14);
7458
7539
  border-color: var(--gcsa-color-primary);
7540
+ background: var(--gcsa-color-primary-muted);
7459
7541
  }
7460
7542
 
7461
7543
  [data-gcsa-theme='light'] .gcsa-upload__dropzone {
7462
- background: rgba(0, 187, 204, 0.08);
7463
- border-color: rgba(0, 187, 204, 0.32);
7544
+ background: var(--gcsa-color-bg-elevated);
7545
+ border-color: var(--gcsa-color-border);
7464
7546
  }
7465
7547
 
7466
7548
  [data-gcsa-theme='light'] .gcsa-upload__dropzone:hover,
7467
7549
  [data-gcsa-theme='light'] .gcsa-upload--dragging .gcsa-upload__dropzone {
7468
- background: rgba(0, 187, 204, 0.14);
7550
+ background: var(--gcsa-color-primary-muted);
7469
7551
  border-color: var(--gcsa-color-primary);
7470
7552
  }
7471
7553
 
@@ -7527,13 +7609,14 @@ button.gcsa-steps__trigger { cursor: pointer; }
7527
7609
  align-items: center;
7528
7610
  gap: 4px;
7529
7611
  width: 100%;
7530
- min-height: 40px;
7531
- height: 40px;
7612
+ min-height: var(--gcsa-control-height-md);
7613
+ height: var(--gcsa-control-height-md);
7532
7614
  box-sizing: border-box;
7533
- padding: 0 4px 0 16px;
7615
+ padding: 0 4px 0 var(--gcsa-control-padding-x-lg);
7534
7616
  border: 1px solid var(--gcsa-color-border);
7535
7617
  border-radius: 8px;
7536
7618
  background: var(--gcsa-color-bg-input);
7619
+ font-size: var(--gcsa-control-font-size-md);
7537
7620
  transition:
7538
7621
  border-color var(--gcsa-motion-fast) ease,
7539
7622
  box-shadow var(--gcsa-motion-fast) ease;