anteriority-ui 1.17.0 → 1.18.1

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.
Files changed (68) hide show
  1. package/.verify-bundle.css +1241 -461
  2. package/.verify-bundle.js +2 -2
  3. package/AnteriorityUI.md +412 -7
  4. package/README.md +32 -5
  5. package/common/hooks/useCopyToClipboard.js +27 -0
  6. package/common/utils/copyToClipboard.js +25 -0
  7. package/common/utils/downloadBlob.js +15 -0
  8. package/index.js +110 -102
  9. package/package.json +5 -2
  10. package/screens/components/CalendarPicker/components/AnchoredCalendar/index.js +64 -0
  11. package/screens/components/CalendarPicker/index.js +8 -1
  12. package/screens/components/Container/index.js +9 -0
  13. package/screens/components/Container/index.module.css +21 -2
  14. package/screens/components/CopyText/index.js +8 -10
  15. package/screens/components/DrawPanel/index.js +1 -0
  16. package/screens/components/DrawPanel/index.module.css +11 -0
  17. package/screens/components/FileDropZone/constants.js +6 -0
  18. package/screens/components/FileDropZone/index.js +149 -0
  19. package/screens/components/FileDropZone/index.module.css +67 -0
  20. package/screens/components/FileDropZone/utils.js +21 -0
  21. package/screens/components/FloatingPanel/constants.js +18 -0
  22. package/screens/components/FloatingPanel/index.js +208 -0
  23. package/screens/components/FloatingPanel/index.module.css +71 -0
  24. package/screens/components/Footer/constants.js +12 -0
  25. package/screens/components/Footer/index.js +78 -0
  26. package/screens/components/Footer/index.module.css +51 -0
  27. package/screens/components/MarkdownContent/CopyButton.js +4 -12
  28. package/screens/components/MediaViewer/components/XlsxViewer/components/ScrollArrow/index.js +50 -0
  29. package/screens/components/MediaViewer/components/XlsxViewer/components/ScrollArrow/index.module.css +48 -0
  30. package/screens/components/MediaViewer/components/XlsxViewer/components/XlsxContextMenu/index.js +197 -0
  31. package/screens/components/MediaViewer/components/XlsxViewer/components/XlsxControlsBar/index.js +206 -0
  32. package/screens/components/MediaViewer/components/XlsxViewer/components/XlsxControlsBar/index.module.css +96 -0
  33. package/screens/components/MediaViewer/components/XlsxViewer/components/XlsxGrid/index.js +573 -0
  34. package/screens/components/MediaViewer/components/XlsxViewer/components/XlsxGrid/index.module.css +148 -0
  35. package/screens/components/MediaViewer/components/XlsxViewer/components/XlsxStatsPanel/index.js +114 -0
  36. package/screens/components/MediaViewer/components/XlsxViewer/components/XlsxStatsPanel/index.module.css +65 -0
  37. package/screens/components/MediaViewer/components/XlsxViewer/components/XlsxValidationPanel/index.js +103 -0
  38. package/screens/components/MediaViewer/components/XlsxViewer/components/XlsxValidationPanel/index.module.css +39 -0
  39. package/screens/components/MediaViewer/components/XlsxViewer/components/index.js +14 -0
  40. package/screens/components/MediaViewer/components/XlsxViewer/index.js +630 -0
  41. package/screens/components/MediaViewer/components/XlsxViewer/index.module.css +39 -0
  42. package/screens/components/MediaViewer/components/XlsxViewer/javascript/engine.js +105 -0
  43. package/screens/components/MediaViewer/components/XlsxViewer/javascript/json.js +127 -0
  44. package/screens/components/MediaViewer/components/XlsxViewer/javascript/model.js +259 -0
  45. package/screens/components/MediaViewer/components/XlsxViewer/javascript/useScrollEdges.js +32 -0
  46. package/screens/components/MediaViewer/components/XlsxViewer/javascript/validation.js +107 -0
  47. package/screens/components/MediaViewer/components/XlsxViewer/utils.js +159 -0
  48. package/screens/components/MediaViewer/components/index.js +3 -1
  49. package/screens/components/MediaViewer/constants.js +199 -1
  50. package/screens/components/MediaViewer/index.js +162 -7
  51. package/screens/components/MediaViewer/index.module.css +18 -0
  52. package/screens/components/MediaViewer/stories/jsonPresets.js +70 -0
  53. package/screens/components/MediaViewer/stories/jsonSample.js +40 -0
  54. package/screens/components/MediaViewer/utils.js +1 -0
  55. package/screens/components/QRCode/constants.js +36 -0
  56. package/screens/components/QRCode/index.js +222 -0
  57. package/screens/components/QRCode/index.module.css +99 -0
  58. package/screens/components/QRCode/utils.js +45 -0
  59. package/screens/components/Radio/constants.js +10 -1
  60. package/screens/components/Radio/index.js +29 -4
  61. package/screens/components/Radio/index.module.css +30 -1
  62. package/screens/components/ScrollBar/utils.js +8 -5
  63. package/screens/components/SummaryCard/index.js +8 -11
  64. package/screens/components/Table/cells.js +50 -1
  65. package/screens/components/Table/index.js +4 -2
  66. package/screens/components/Table/tableA.module.css +1 -1
  67. package/screens/components/Table/tableB.module.css +1 -1
  68. package/skill/anteriority-ui/SKILL.md +237 -219
@@ -3653,6 +3653,13 @@ button.TopBar_searchWrapper {
3653
3653
  font-size: 0.85rem;
3654
3654
  line-height: 1.4;
3655
3655
  }
3656
+ .DrawPanel_markdownBody {
3657
+ overflow-x: auto;
3658
+ }
3659
+ .DrawPanel_markdownBody table {
3660
+ display: table;
3661
+ width: 100%;
3662
+ }
3656
3663
 
3657
3664
  /* dist/screens/components/ErrorState/index.module.css */
3658
3665
  .ErrorState_errorState {
@@ -4633,6 +4640,28 @@ button.TopBar_searchWrapper {
4633
4640
  .Radio_muiRadioCustom:hover {
4634
4641
  background-color: color-mix(in srgb, currentColor 8%, transparent);
4635
4642
  }
4643
+ .Radio_hasAccent.Mui-checked {
4644
+ color: var(--radio-accent);
4645
+ }
4646
+ .Radio_hasText .MuiFormControlLabel-label {
4647
+ color: var(--radio-text);
4648
+ }
4649
+ .Radio_card {
4650
+ box-sizing: border-box;
4651
+ width: 100%;
4652
+ padding: 2px 12px 2px 4px;
4653
+ border: 1px solid var(--radio-border, #e2e8f0);
4654
+ border-radius: var(--radio-radius, 8px);
4655
+ background: var(--radio-bg, transparent);
4656
+ transition: border-color 0.15s ease, background-color 0.15s ease;
4657
+ }
4658
+ .Radio_card:hover {
4659
+ border-color: var(--radio-accent, #2563eb);
4660
+ }
4661
+ .Radio_card:has(.Mui-checked) {
4662
+ border-color: var(--radio-accent, #2563eb);
4663
+ background: color-mix(in srgb, var(--radio-accent, #2563eb) 8%, var(--radio-bg, transparent));
4664
+ }
4636
4665
 
4637
4666
  /* dist/screens/components/ColorPicker/index.module.css */
4638
4667
  .ColorPicker_root {
@@ -4933,6 +4962,22 @@ button.TopBar_searchWrapper {
4933
4962
  height: 34px;
4934
4963
  }
4935
4964
  }
4965
+ .MediaViewer_localFileBar {
4966
+ display: flex;
4967
+ align-items: center;
4968
+ justify-content: space-between;
4969
+ gap: 8px;
4970
+ margin-bottom: 6px;
4971
+ font-size: 0.8rem;
4972
+ color: var(--media-viewer-text, #334155);
4973
+ }
4974
+ .MediaViewer_localFileName {
4975
+ min-width: 0;
4976
+ overflow: hidden;
4977
+ text-overflow: ellipsis;
4978
+ white-space: nowrap;
4979
+ font-weight: 600;
4980
+ }
4936
4981
 
4937
4982
  /* dist/screens/components/MediaViewer/components/VideoPlayer/components/VideoSeekBar/index.module.css */
4938
4983
  .VideoSeekBar_seekRow {
@@ -5622,195 +5667,804 @@ button.TopBar_searchWrapper {
5622
5667
  }
5623
5668
  }
5624
5669
 
5625
- /* dist/screens/components/CountdownBar/index.module.css */
5626
- .CountdownBar_wrapper {
5627
- margin-top: 8px;
5628
- cursor: pointer;
5629
- }
5630
- .CountdownBar_container {
5631
- box-sizing: border-box;
5632
- width: 100%;
5633
- background-color: var(--countdown-track, #f1f5f9);
5634
- border-radius: 3px;
5635
- overflow: hidden;
5636
- border: 1px solid var(--countdown-border, #e2e8f0);
5637
- }
5638
- .CountdownBar_bar {
5639
- height: 100%;
5640
- border-radius: 3px;
5641
- transition: width 0.05s linear, background-color 0.3s ease;
5670
+ /* dist/screens/components/MediaViewer/components/XlsxViewer/components/ScrollArrow/index.module.css */
5671
+ .ScrollArrow_arrow {
5672
+ width: 32px !important;
5673
+ height: 32px !important;
5674
+ min-width: 32px !important;
5675
+ padding: 0 !important;
5676
+ opacity: 1 !important;
5677
+ color: var(--xlsx-accent, #2563eb) !important;
5678
+ background: var(--xlsx-bg, #ffffff) !important;
5679
+ border: 1.5px solid color-mix(in srgb, var(--xlsx-accent, #2563eb) 45%, var(--xlsx-border, #e2e8f0)) !important;
5680
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
5681
+ transition: background-color 0.15s ease;
5642
5682
  }
5643
- .CountdownBar_overlayContainer {
5644
- position: absolute;
5645
- top: 0;
5646
- left: 0;
5647
- right: 0;
5648
- bottom: 0;
5649
- background-color: rgba(255, 255, 255, 0.4);
5650
- backdrop-filter: blur(5px);
5651
- display: flex;
5652
- flex-direction: column;
5653
- justify-content: center;
5654
- align-items: center;
5655
- z-index: 100;
5656
- border-radius: 4px;
5657
- padding: 0.75rem;
5658
- box-sizing: border-box;
5683
+ .ScrollArrow_arrow:hover {
5684
+ background: color-mix(in srgb, var(--xlsx-accent, #2563eb) 14%, var(--xlsx-bg, #ffffff)) !important;
5659
5685
  }
5660
- .CountdownBar_overlayMessage {
5661
- color: #ff0000;
5662
- font-size: 0.95rem;
5663
- font-weight: 700;
5664
- text-align: center;
5665
- margin: 0 0 1rem 0;
5666
- line-height: 1.4;
5686
+ .ScrollArrow_floating {
5687
+ position: absolute !important;
5688
+ z-index: 6;
5667
5689
  }
5668
-
5669
- /* dist/screens/components/TopBar/components/MobileActionsPanel/index.module.css */
5670
- .MobileActionsPanel_list {
5671
- display: flex;
5672
- flex-direction: column;
5673
- gap: 4px;
5690
+ .ScrollArrow_inline {
5691
+ flex-shrink: 0;
5674
5692
  }
5675
- .MobileActionsPanel_item {
5676
- display: flex;
5677
- align-items: center;
5678
- gap: 12px;
5679
- width: 100%;
5680
- padding: 10px 12px;
5681
- border: none;
5682
- border-radius: 8px;
5683
- background: transparent;
5684
- color: #0f172a;
5685
- font-family: inherit;
5686
- font-size: 0.9rem;
5687
- font-weight: 500;
5688
- text-align: left;
5689
- cursor: pointer;
5690
- transition: background-color 0.15s ease;
5693
+ .ScrollArrow_up {
5694
+ top: 40px;
5695
+ right: 18px;
5691
5696
  }
5692
- .MobileActionsPanel_item:hover {
5693
- background-color: #f1f5f9;
5697
+ .ScrollArrow_down {
5698
+ bottom: 18px;
5699
+ right: 18px;
5694
5700
  }
5695
- .MobileActionsPanel_item:disabled {
5696
- opacity: 0.5;
5697
- cursor: default;
5701
+ .ScrollArrow_left {
5702
+ left: 64px;
5703
+ top: 50%;
5704
+ transform: translateY(-50%);
5698
5705
  }
5699
- .MobileActionsPanel_item:disabled:hover {
5700
- background-color: transparent;
5706
+ .ScrollArrow_right {
5707
+ right: 16px;
5708
+ top: 50%;
5709
+ transform: translateY(-50%);
5701
5710
  }
5702
- .MobileActionsPanel_itemIcon {
5711
+
5712
+ /* dist/screens/components/Resizable/index.module.css */
5713
+ .Resizable_root {
5714
+ position: relative;
5715
+ display: flex;
5716
+ min-width: 0;
5717
+ min-height: 0;
5703
5718
  flex-shrink: 0;
5704
- color: #475569;
5705
5719
  }
5706
- .MobileActionsPanel_itemLabel {
5707
- flex: 1;
5720
+ .Resizable_content {
5721
+ flex: 1 1 auto;
5708
5722
  min-width: 0;
5709
- overflow: hidden;
5710
- text-overflow: ellipsis;
5711
- white-space: nowrap;
5723
+ min-height: 0;
5724
+ overflow: auto;
5712
5725
  }
5713
- .MobileActionsPanel_itemBadge {
5714
- flex-shrink: 0;
5715
- display: inline-flex;
5726
+ .Resizable_handle {
5727
+ position: relative;
5728
+ flex: none;
5729
+ display: flex;
5716
5730
  align-items: center;
5717
5731
  justify-content: center;
5718
- min-width: 18px;
5719
- height: 18px;
5720
- padding: 0 5px;
5721
- border-radius: 999px;
5722
- background-color: #ef4444;
5723
- color: #ffffff;
5724
- font-size: 0.7rem;
5725
- font-weight: 700;
5732
+ background: var(--resizable-handle-bg, transparent);
5733
+ touch-action: none;
5734
+ user-select: none;
5735
+ outline: none;
5726
5736
  }
5727
-
5728
- /* dist/screens/components/TopBar/components/AutoHideShell/index.module.css */
5729
- .AutoHideShell_shell {
5730
- position: relative;
5737
+ .Resizable_handleVertical {
5731
5738
  width: 100%;
5732
- height: 0;
5733
- z-index: var(--topbar-auto-hide-z-index, 1100);
5739
+ cursor: ns-resize;
5734
5740
  }
5735
- .AutoHideShell_trigger {
5741
+ .Resizable_handleHorizontal {
5742
+ height: 100%;
5743
+ cursor: ew-resize;
5744
+ }
5745
+ .Resizable_handle.Resizable_disabled {
5746
+ cursor: default;
5747
+ opacity: 0.5;
5748
+ }
5749
+ .Resizable_line {
5736
5750
  position: absolute;
5737
- top: 0;
5751
+ background: var(--resizable-line, rgba(148, 163, 184, 0.35));
5752
+ pointer-events: none;
5753
+ transition: background-color 0.15s ease;
5754
+ }
5755
+ .Resizable_handleVertical .Resizable_line {
5738
5756
  left: 0;
5739
5757
  right: 0;
5740
- background: transparent;
5758
+ top: 50%;
5759
+ transform: translateY(-50%);
5741
5760
  }
5742
- .AutoHideShell_handle {
5743
- position: absolute;
5761
+ .Resizable_handleHorizontal .Resizable_line {
5744
5762
  top: 0;
5763
+ bottom: 0;
5764
+ left: 50%;
5765
+ transform: translateX(-50%);
5766
+ }
5767
+ .Resizable_grip {
5768
+ position: relative;
5745
5769
  display: flex;
5746
5770
  align-items: center;
5747
5771
  justify-content: center;
5748
- width: 44px;
5749
- height: 18px;
5750
- padding: 0;
5751
- border: 1px solid var(--topbar-border, #e2e8f0);
5752
- border-top: none;
5753
- border-radius: 0 0 10px 10px;
5754
- background-color: var(--topbar-bg, #ffffff);
5755
- color: var(--topbar-icon, #475569);
5756
- box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
5757
- cursor: pointer;
5758
- animation: AutoHideShell_handleIn 0.25s ease 0.1s both;
5759
- transition: color 0.15s ease;
5772
+ box-sizing: border-box;
5773
+ border: 1px solid var(--resizable-grip-border, rgba(148, 163, 184, 0.6));
5774
+ background: var(--resizable-grip-bg, transparent);
5775
+ color: var(--resizable-grip-icon, #94a3b8);
5776
+ transition: border-color 0.15s ease, color 0.15s ease;
5760
5777
  }
5761
- .AutoHideShell_handle:hover,
5762
- .AutoHideShell_handle:focus-visible {
5763
- color: var(--topbar-text, #0f172a);
5778
+ .Resizable_handle:hover .Resizable_line,
5779
+ .Resizable_handle.Resizable_dragging .Resizable_line {
5780
+ background: var(--resizable-line-active, #7c9cff);
5764
5781
  }
5765
- .AutoHideShell_handle:focus-visible {
5766
- outline: 2px solid var(--topbar-accent, #0ea5e9);
5767
- outline-offset: 1px;
5782
+ .Resizable_handle:hover .Resizable_grip,
5783
+ .Resizable_handle.Resizable_dragging .Resizable_grip {
5784
+ border-color: var(--resizable-line-active, #7c9cff);
5785
+ color: var(--resizable-line-active, #7c9cff);
5768
5786
  }
5769
- .AutoHideShell_handleCenter {
5770
- left: calc(50% - 22px);
5787
+ .Resizable_handle:focus-visible .Resizable_grip {
5788
+ outline: 2px solid var(--resizable-line-active, #7c9cff);
5789
+ outline-offset: 2px;
5771
5790
  }
5772
- .AutoHideShell_handleLeft {
5773
- left: 24px;
5791
+ .Resizable_handle.Resizable_disabled:hover .Resizable_line,
5792
+ .Resizable_handle.Resizable_disabled:hover .Resizable_grip {
5793
+ background: var(--resizable-line, rgba(148, 163, 184, 0.35));
5794
+ border-color: var(--resizable-grip-border, rgba(148, 163, 184, 0.6));
5795
+ color: var(--resizable-grip-icon, #94a3b8);
5774
5796
  }
5775
- .AutoHideShell_handleRight {
5776
- right: 24px;
5797
+
5798
+ /* dist/screens/components/MediaViewer/components/XlsxViewer/components/XlsxGrid/index.module.css */
5799
+ .XlsxGrid_focusWrap {
5800
+ position: relative;
5801
+ outline: none;
5802
+ background: var(--xlsx-bg, #ffffff);
5803
+ color: var(--xlsx-text, #334155);
5804
+ font-size: 0.8rem;
5777
5805
  }
5778
- @keyframes AutoHideShell_handleIn {
5779
- from {
5780
- opacity: 0;
5781
- transform: translateY(-100%);
5782
- }
5783
- to {
5784
- opacity: 1;
5785
- transform: translateY(0);
5786
- }
5806
+ .XlsxGrid_heightAnim {
5807
+ transition: height 0.3s cubic-bezier(0.22, 1, 0.36, 1);
5787
5808
  }
5788
5809
  @media (prefers-reduced-motion: reduce) {
5789
- .AutoHideShell_handle {
5790
- animation: none;
5810
+ .XlsxGrid_heightAnim {
5811
+ transition: none;
5791
5812
  }
5792
5813
  }
5793
-
5794
- /* dist/screens/components/Container/index.module.css */
5795
- .Container_containerCard {
5796
- position: relative;
5797
- width: 100%;
5798
- max-width: 1300px;
5799
- background: var(--letter-white, #ffffff);
5800
- backdrop-filter: var(--blur, blur(10px));
5801
- -webkit-backdrop-filter: var(--blur, blur(10px));
5802
- padding: 35px;
5803
- border-radius: 12px;
5804
- box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
5805
- border: 1px solid var(--container-border, rgba(0, 0, 0, 0.08));
5806
- min-height: 550px;
5807
- box-sizing: border-box;
5808
- display: flex;
5809
- flex-direction: column;
5814
+ .XlsxGrid_focusWrap:focus-visible {
5815
+ box-shadow: inset 0 0 0 2px var(--xlsx-accent, #2563eb);
5810
5816
  }
5811
- .Container_hasBgImage::before {
5812
- content: "";
5813
- position: absolute;
5817
+ .XlsxGrid_table {
5818
+ border-collapse: separate;
5819
+ border-spacing: 0;
5820
+ table-layout: fixed;
5821
+ }
5822
+ .XlsxGrid_cell,
5823
+ .XlsxGrid_rowHeader,
5824
+ .XlsxGrid_colHeader,
5825
+ .XlsxGrid_corner {
5826
+ box-sizing: border-box;
5827
+ padding: 0 8px;
5828
+ white-space: nowrap;
5829
+ overflow: hidden;
5830
+ text-overflow: ellipsis;
5831
+ border-right: 1px solid var(--xlsx-border, #e2e8f0);
5832
+ border-bottom: 1px solid var(--xlsx-border, #e2e8f0);
5833
+ }
5834
+ .XlsxGrid_cell {
5835
+ cursor: cell;
5836
+ user-select: none;
5837
+ }
5838
+ .XlsxGrid_cellSelected {
5839
+ background: color-mix(in srgb, var(--xlsx-accent, #2563eb) 14%, transparent);
5840
+ }
5841
+ .XlsxGrid_cellFocus {
5842
+ outline: 2px solid var(--xlsx-accent, #2563eb);
5843
+ outline-offset: -2px;
5844
+ }
5845
+ .XlsxGrid_colHeader,
5846
+ .XlsxGrid_rowHeader,
5847
+ .XlsxGrid_corner {
5848
+ background: var(--xlsx-header-bg, #f1f5f9);
5849
+ font-weight: 600;
5850
+ font-size: 0.72rem;
5851
+ text-align: center;
5852
+ cursor: pointer;
5853
+ user-select: none;
5854
+ }
5855
+ .XlsxGrid_colHeader,
5856
+ .XlsxGrid_corner {
5857
+ position: sticky;
5858
+ top: 0;
5859
+ z-index: 2;
5860
+ }
5861
+ .XlsxGrid_rowHeader,
5862
+ .XlsxGrid_corner {
5863
+ position: sticky;
5864
+ left: 0;
5865
+ }
5866
+ .XlsxGrid_rowHeader {
5867
+ z-index: 1;
5868
+ }
5869
+ .XlsxGrid_corner {
5870
+ z-index: 3;
5871
+ }
5872
+ .XlsxGrid_headerActive {
5873
+ background: color-mix(in srgb, var(--xlsx-accent, #2563eb) 22%, var(--xlsx-header-bg, #f1f5f9));
5874
+ color: var(--xlsx-accent, #2563eb);
5875
+ }
5876
+ .XlsxGrid_spacer {
5877
+ padding: 0;
5878
+ border: 0;
5879
+ }
5880
+ .XlsxGrid_empty {
5881
+ display: flex;
5882
+ align-items: center;
5883
+ justify-content: center;
5884
+ min-height: 120px;
5885
+ font-size: 0.85rem;
5886
+ color: var(--xlsx-text, #334155);
5887
+ background: var(--xlsx-bg, #ffffff);
5888
+ }
5889
+ .XlsxGrid_cellTL {
5890
+ border-top-left-radius: 6px;
5891
+ }
5892
+ .XlsxGrid_cellTR {
5893
+ border-top-right-radius: 6px;
5894
+ }
5895
+ .XlsxGrid_cellBL {
5896
+ border-bottom-left-radius: 6px;
5897
+ }
5898
+ .XlsxGrid_cellBR {
5899
+ border-bottom-right-radius: 6px;
5900
+ }
5901
+ .XlsxGrid_cellEditing {
5902
+ padding: 0;
5903
+ overflow: visible;
5904
+ background: var(--xlsx-bg, #ffffff);
5905
+ outline: 2px solid var(--xlsx-accent, #2563eb);
5906
+ outline-offset: -2px;
5907
+ user-select: text;
5908
+ }
5909
+ .XlsxGrid_editor {
5910
+ width: 100%;
5911
+ height: 100%;
5912
+ box-sizing: border-box;
5913
+ padding: 0 8px;
5914
+ font: inherit;
5915
+ color: var(--xlsx-text, #334155);
5916
+ background: transparent;
5917
+ border: 0;
5918
+ outline: none;
5919
+ }
5920
+ .XlsxGrid_resizableHeader {
5921
+ padding: 0;
5922
+ overflow: hidden;
5923
+ }
5924
+ .XlsxGrid_headerLabel {
5925
+ display: flex;
5926
+ align-items: center;
5927
+ justify-content: center;
5928
+ height: 100%;
5929
+ min-width: 0;
5930
+ }
5931
+
5932
+ /* dist/screens/components/MediaViewer/components/XlsxViewer/components/XlsxControlsBar/index.module.css */
5933
+ .XlsxControlsBar_controlsBar {
5934
+ display: flex;
5935
+ align-items: center;
5936
+ justify-content: space-between;
5937
+ flex-wrap: wrap;
5938
+ gap: 8px;
5939
+ padding: 4px 10px;
5940
+ border-top: 1px solid var(--media-viewer-border, #e2e8f0);
5941
+ }
5942
+ .XlsxControlsBar_tabsScroll {
5943
+ flex: 1 1 140px;
5944
+ min-width: 0;
5945
+ width: auto;
5946
+ }
5947
+ .XlsxControlsBar_tabs {
5948
+ padding-bottom: 6px;
5949
+ }
5950
+ .XlsxControlsBar_tabsInner {
5951
+ display: flex;
5952
+ gap: 2px;
5953
+ width: max-content;
5954
+ }
5955
+ .XlsxControlsBar_tab {
5956
+ flex-shrink: 0;
5957
+ max-width: 180px;
5958
+ padding: 8px 12px;
5959
+ font: inherit;
5960
+ font-size: 0.78rem;
5961
+ font-weight: 600;
5962
+ background: transparent;
5963
+ border: 0;
5964
+ border-bottom: 2px solid transparent;
5965
+ white-space: nowrap;
5966
+ overflow: hidden;
5967
+ text-overflow: ellipsis;
5968
+ cursor: pointer;
5969
+ }
5970
+ .XlsxControlsBar_tab:hover {
5971
+ background-color: rgba(0, 0, 0, 0.04);
5972
+ }
5973
+ .XlsxControlsBar_actions {
5974
+ display: flex;
5975
+ align-items: center;
5976
+ gap: 6px;
5977
+ margin-left: auto;
5978
+ flex-wrap: wrap;
5979
+ justify-content: flex-end;
5980
+ min-width: 0;
5981
+ }
5982
+ .XlsxControlsBar_summary {
5983
+ font-size: 0.74rem;
5984
+ opacity: 0.75;
5985
+ white-space: nowrap;
5986
+ }
5987
+ .XlsxControlsBar_downloadButton {
5988
+ flex-shrink: 0;
5989
+ display: inline-flex;
5990
+ align-items: center;
5991
+ justify-content: center;
5992
+ width: 32px;
5993
+ height: 32px;
5994
+ border-radius: 8px;
5995
+ text-decoration: none;
5996
+ transition: background-color 0.15s ease;
5997
+ }
5998
+ .XlsxControlsBar_downloadButton:hover {
5999
+ background-color: rgba(0, 0, 0, 0.06);
6000
+ }
6001
+ .XlsxControlsBar_tabInput {
6002
+ flex-shrink: 0;
6003
+ width: 120px;
6004
+ padding: 8px 12px;
6005
+ box-sizing: border-box;
6006
+ font: inherit;
6007
+ font-size: 0.78rem;
6008
+ font-weight: 600;
6009
+ background: transparent;
6010
+ border: 0;
6011
+ border-bottom: 2px solid;
6012
+ outline: none;
6013
+ }
6014
+ .XlsxControlsBar_tabInputInvalid {
6015
+ border-bottom-color: #dc2626 !important;
6016
+ color: #dc2626 !important;
6017
+ }
6018
+
6019
+ /* dist/screens/components/FloatingPanel/index.module.css */
6020
+ .FloatingPanel_panel {
6021
+ position: fixed;
6022
+ display: flex;
6023
+ flex-direction: column;
6024
+ box-sizing: border-box;
6025
+ max-width: 90vw;
6026
+ max-height: 90vh;
6027
+ overflow: hidden;
6028
+ color: var(--fp-text, #334155);
6029
+ background: var(--fp-bg, #ffffff);
6030
+ border: 1px solid var(--fp-border, #e2e8f0);
6031
+ border-radius: 12px;
6032
+ box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
6033
+ font-size: 0.82rem;
6034
+ }
6035
+ .FloatingPanel_resizable {
6036
+ resize: both;
6037
+ }
6038
+ .FloatingPanel_header {
6039
+ position: sticky;
6040
+ top: 0;
6041
+ z-index: 1;
6042
+ display: flex;
6043
+ align-items: center;
6044
+ gap: 4px;
6045
+ padding: 4px 6px 4px 12px;
6046
+ min-width: 0;
6047
+ background: var(--fp-header-bg, #f1f5f9);
6048
+ border-bottom: 1px solid var(--fp-border, #e2e8f0);
6049
+ user-select: none;
6050
+ }
6051
+ .FloatingPanel_draggable {
6052
+ cursor: grab;
6053
+ touch-action: none;
6054
+ }
6055
+ .FloatingPanel_draggable:active {
6056
+ cursor: grabbing;
6057
+ }
6058
+ .FloatingPanel_title {
6059
+ font-weight: 700;
6060
+ white-space: nowrap;
6061
+ }
6062
+ .FloatingPanel_subtitle {
6063
+ flex: 1;
6064
+ min-width: 0;
6065
+ overflow: hidden;
6066
+ text-overflow: ellipsis;
6067
+ white-space: nowrap;
6068
+ font-size: 0.74rem;
6069
+ opacity: 0.7;
6070
+ }
6071
+ .FloatingPanel_header > .FloatingPanel_title + button,
6072
+ .FloatingPanel_header > .FloatingPanel_title + button ~ button {
6073
+ flex-shrink: 0;
6074
+ }
6075
+ .FloatingPanel_body {
6076
+ flex: 1;
6077
+ min-height: 0;
6078
+ overflow: auto;
6079
+ padding: 6px 12px;
6080
+ }
6081
+
6082
+ /* dist/screens/components/MediaViewer/components/XlsxViewer/components/XlsxStatsPanel/index.module.css */
6083
+ .XlsxStatsPanel_list {
6084
+ margin: 0;
6085
+ padding: 0;
6086
+ list-style: none;
6087
+ }
6088
+ .XlsxStatsPanel_row {
6089
+ display: flex;
6090
+ align-items: center;
6091
+ gap: 6px;
6092
+ padding: 3px 0;
6093
+ border-bottom: 1px dashed var(--fp-border, #e2e8f0);
6094
+ }
6095
+ .XlsxStatsPanel_row:last-child {
6096
+ border-bottom: 0;
6097
+ }
6098
+ .XlsxStatsPanel_metric {
6099
+ flex: 1;
6100
+ min-width: 0;
6101
+ opacity: 0.8;
6102
+ }
6103
+ .XlsxStatsPanel_value {
6104
+ display: inline-flex;
6105
+ align-items: center;
6106
+ gap: 6px;
6107
+ padding: 2px 6px;
6108
+ font: inherit;
6109
+ font-weight: 700;
6110
+ font-variant-numeric: tabular-nums;
6111
+ color: inherit;
6112
+ background: transparent;
6113
+ border: 0;
6114
+ border-radius: 6px;
6115
+ cursor: copy;
6116
+ }
6117
+ .XlsxStatsPanel_value:hover {
6118
+ background: color-mix(in srgb, var(--fp-accent, #2563eb) 12%, transparent);
6119
+ color: var(--fp-accent, #2563eb);
6120
+ }
6121
+ .XlsxStatsPanel_copyIcon {
6122
+ opacity: 0.35;
6123
+ }
6124
+ .XlsxStatsPanel_empty {
6125
+ margin: 8px 0;
6126
+ opacity: 0.7;
6127
+ }
6128
+ .XlsxStatsPanel_footer {
6129
+ display: flex;
6130
+ flex-direction: column;
6131
+ gap: 4px;
6132
+ padding: 8px 12px 10px;
6133
+ border-top: 1px solid var(--fp-border, #e2e8f0);
6134
+ }
6135
+ .XlsxStatsPanel_notice {
6136
+ font-size: 0.74rem;
6137
+ color: var(--fp-accent, #2563eb);
6138
+ }
6139
+
6140
+ /* dist/screens/components/MediaViewer/components/XlsxViewer/components/XlsxValidationPanel/index.module.css */
6141
+ .XlsxValidationPanel_panel {
6142
+ box-sizing: border-box;
6143
+ width: 320px;
6144
+ max-width: calc(100vw - 16px);
6145
+ padding: 16px 0 14px;
6146
+ border: 1px solid var(--xv-border, #e2e8f0);
6147
+ border-radius: 12px;
6148
+ }
6149
+ .XlsxValidationPanel_title {
6150
+ margin: 0 0 8px;
6151
+ padding: 0 20px;
6152
+ font-size: 1rem;
6153
+ font-weight: 700;
6154
+ }
6155
+ .XlsxValidationPanel_actions {
6156
+ display: flex;
6157
+ align-items: center;
6158
+ gap: 8px;
6159
+ padding: 10px 20px 0;
6160
+ }
6161
+ .XlsxValidationPanel_body {
6162
+ padding: 4px 20px 8px;
6163
+ }
6164
+ .XlsxValidationPanel_field {
6165
+ display: flex;
6166
+ flex-direction: column;
6167
+ gap: 6px;
6168
+ margin-bottom: 14px;
6169
+ }
6170
+ .XlsxValidationPanel_label {
6171
+ font-size: 0.75rem;
6172
+ font-weight: 600;
6173
+ opacity: 0.7;
6174
+ }
6175
+
6176
+ /* dist/screens/components/MediaViewer/components/XlsxViewer/index.module.css */
6177
+ .XlsxViewer_xlsxViewer {
6178
+ border-radius: 10px;
6179
+ overflow: hidden;
6180
+ display: flex;
6181
+ flex-direction: column;
6182
+ width: 100%;
6183
+ }
6184
+ .XlsxViewer_gridArea {
6185
+ position: relative;
6186
+ width: 100%;
6187
+ }
6188
+ .XlsxViewer_loadingOverlay {
6189
+ position: absolute;
6190
+ inset: 0;
6191
+ display: flex;
6192
+ align-items: center;
6193
+ justify-content: center;
6194
+ z-index: 4;
6195
+ }
6196
+ .XlsxViewer_validationNotice {
6197
+ position: absolute;
6198
+ left: 50%;
6199
+ bottom: 12px;
6200
+ transform: translateX(-50%);
6201
+ z-index: 30;
6202
+ max-width: calc(100% - 24px);
6203
+ padding: 8px 14px;
6204
+ font-size: 0.8rem;
6205
+ font-weight: 600;
6206
+ color: #ffffff;
6207
+ background: var(--xlsx-error, #dc2626);
6208
+ border-radius: 8px;
6209
+ box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
6210
+ pointer-events: none;
6211
+ }
6212
+
6213
+ /* dist/screens/components/FileDropZone/index.module.css */
6214
+ .FileDropZone_wrapper {
6215
+ position: relative;
6216
+ }
6217
+ .FileDropZone_input {
6218
+ display: none;
6219
+ }
6220
+ .FileDropZone_zone {
6221
+ display: flex;
6222
+ flex-direction: column;
6223
+ align-items: center;
6224
+ justify-content: center;
6225
+ gap: 10px;
6226
+ min-height: 160px;
6227
+ padding: 24px 16px;
6228
+ box-sizing: border-box;
6229
+ text-align: center;
6230
+ border: 2px dashed var(--fdz-border, #cbd5e1);
6231
+ border-radius: 12px;
6232
+ background: var(--fdz-bg, #f8fafc);
6233
+ color: var(--fdz-text, #475569);
6234
+ cursor: pointer;
6235
+ outline: none;
6236
+ transition:
6237
+ border-color 0.15s ease,
6238
+ background-color 0.15s ease,
6239
+ color 0.15s ease;
6240
+ }
6241
+ .FileDropZone_zone:hover,
6242
+ .FileDropZone_zone:focus-visible {
6243
+ border-color: var(--fdz-accent, #2563eb);
6244
+ color: var(--fdz-accent, #2563eb);
6245
+ }
6246
+ .FileDropZone_zoneActive {
6247
+ border-color: var(--fdz-accent, #2563eb);
6248
+ background: color-mix(in srgb, var(--fdz-accent, #2563eb) 10%, var(--fdz-bg, #f8fafc));
6249
+ color: var(--fdz-accent, #2563eb);
6250
+ }
6251
+ .FileDropZone_zoneDisabled {
6252
+ opacity: 0.55;
6253
+ cursor: not-allowed;
6254
+ }
6255
+ .FileDropZone_label {
6256
+ font-size: 0.85rem;
6257
+ font-weight: 500;
6258
+ max-width: 320px;
6259
+ }
6260
+ .FileDropZone_overlay {
6261
+ position: absolute;
6262
+ inset: 0;
6263
+ z-index: 10;
6264
+ display: flex;
6265
+ flex-direction: column;
6266
+ align-items: center;
6267
+ justify-content: center;
6268
+ gap: 8px;
6269
+ border: 2px dashed var(--fdz-accent, #2563eb);
6270
+ border-radius: 12px;
6271
+ background: color-mix(in srgb, var(--fdz-bg, #f8fafc) 88%, transparent);
6272
+ color: var(--fdz-accent, #2563eb);
6273
+ font-size: 0.85rem;
6274
+ font-weight: 600;
6275
+ pointer-events: none;
6276
+ }
6277
+
6278
+ /* dist/screens/components/CountdownBar/index.module.css */
6279
+ .CountdownBar_wrapper {
6280
+ margin-top: 8px;
6281
+ cursor: pointer;
6282
+ }
6283
+ .CountdownBar_container {
6284
+ box-sizing: border-box;
6285
+ width: 100%;
6286
+ background-color: var(--countdown-track, #f1f5f9);
6287
+ border-radius: 3px;
6288
+ overflow: hidden;
6289
+ border: 1px solid var(--countdown-border, #e2e8f0);
6290
+ }
6291
+ .CountdownBar_bar {
6292
+ height: 100%;
6293
+ border-radius: 3px;
6294
+ transition: width 0.05s linear, background-color 0.3s ease;
6295
+ }
6296
+ .CountdownBar_overlayContainer {
6297
+ position: absolute;
6298
+ top: 0;
6299
+ left: 0;
6300
+ right: 0;
6301
+ bottom: 0;
6302
+ background-color: rgba(255, 255, 255, 0.4);
6303
+ backdrop-filter: blur(5px);
6304
+ display: flex;
6305
+ flex-direction: column;
6306
+ justify-content: center;
6307
+ align-items: center;
6308
+ z-index: 100;
6309
+ border-radius: 4px;
6310
+ padding: 0.75rem;
6311
+ box-sizing: border-box;
6312
+ }
6313
+ .CountdownBar_overlayMessage {
6314
+ color: #ff0000;
6315
+ font-size: 0.95rem;
6316
+ font-weight: 700;
6317
+ text-align: center;
6318
+ margin: 0 0 1rem 0;
6319
+ line-height: 1.4;
6320
+ }
6321
+
6322
+ /* dist/screens/components/TopBar/components/MobileActionsPanel/index.module.css */
6323
+ .MobileActionsPanel_list {
6324
+ display: flex;
6325
+ flex-direction: column;
6326
+ gap: 4px;
6327
+ }
6328
+ .MobileActionsPanel_item {
6329
+ display: flex;
6330
+ align-items: center;
6331
+ gap: 12px;
6332
+ width: 100%;
6333
+ padding: 10px 12px;
6334
+ border: none;
6335
+ border-radius: 8px;
6336
+ background: transparent;
6337
+ color: #0f172a;
6338
+ font-family: inherit;
6339
+ font-size: 0.9rem;
6340
+ font-weight: 500;
6341
+ text-align: left;
6342
+ cursor: pointer;
6343
+ transition: background-color 0.15s ease;
6344
+ }
6345
+ .MobileActionsPanel_item:hover {
6346
+ background-color: #f1f5f9;
6347
+ }
6348
+ .MobileActionsPanel_item:disabled {
6349
+ opacity: 0.5;
6350
+ cursor: default;
6351
+ }
6352
+ .MobileActionsPanel_item:disabled:hover {
6353
+ background-color: transparent;
6354
+ }
6355
+ .MobileActionsPanel_itemIcon {
6356
+ flex-shrink: 0;
6357
+ color: #475569;
6358
+ }
6359
+ .MobileActionsPanel_itemLabel {
6360
+ flex: 1;
6361
+ min-width: 0;
6362
+ overflow: hidden;
6363
+ text-overflow: ellipsis;
6364
+ white-space: nowrap;
6365
+ }
6366
+ .MobileActionsPanel_itemBadge {
6367
+ flex-shrink: 0;
6368
+ display: inline-flex;
6369
+ align-items: center;
6370
+ justify-content: center;
6371
+ min-width: 18px;
6372
+ height: 18px;
6373
+ padding: 0 5px;
6374
+ border-radius: 999px;
6375
+ background-color: #ef4444;
6376
+ color: #ffffff;
6377
+ font-size: 0.7rem;
6378
+ font-weight: 700;
6379
+ }
6380
+
6381
+ /* dist/screens/components/TopBar/components/AutoHideShell/index.module.css */
6382
+ .AutoHideShell_shell {
6383
+ position: relative;
6384
+ width: 100%;
6385
+ height: 0;
6386
+ z-index: var(--topbar-auto-hide-z-index, 1100);
6387
+ }
6388
+ .AutoHideShell_trigger {
6389
+ position: absolute;
6390
+ top: 0;
6391
+ left: 0;
6392
+ right: 0;
6393
+ background: transparent;
6394
+ }
6395
+ .AutoHideShell_handle {
6396
+ position: absolute;
6397
+ top: 0;
6398
+ display: flex;
6399
+ align-items: center;
6400
+ justify-content: center;
6401
+ width: 44px;
6402
+ height: 18px;
6403
+ padding: 0;
6404
+ border: 1px solid var(--topbar-border, #e2e8f0);
6405
+ border-top: none;
6406
+ border-radius: 0 0 10px 10px;
6407
+ background-color: var(--topbar-bg, #ffffff);
6408
+ color: var(--topbar-icon, #475569);
6409
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
6410
+ cursor: pointer;
6411
+ animation: AutoHideShell_handleIn 0.25s ease 0.1s both;
6412
+ transition: color 0.15s ease;
6413
+ }
6414
+ .AutoHideShell_handle:hover,
6415
+ .AutoHideShell_handle:focus-visible {
6416
+ color: var(--topbar-text, #0f172a);
6417
+ }
6418
+ .AutoHideShell_handle:focus-visible {
6419
+ outline: 2px solid var(--topbar-accent, #0ea5e9);
6420
+ outline-offset: 1px;
6421
+ }
6422
+ .AutoHideShell_handleCenter {
6423
+ left: calc(50% - 22px);
6424
+ }
6425
+ .AutoHideShell_handleLeft {
6426
+ left: 24px;
6427
+ }
6428
+ .AutoHideShell_handleRight {
6429
+ right: 24px;
6430
+ }
6431
+ @keyframes AutoHideShell_handleIn {
6432
+ from {
6433
+ opacity: 0;
6434
+ transform: translateY(-100%);
6435
+ }
6436
+ to {
6437
+ opacity: 1;
6438
+ transform: translateY(0);
6439
+ }
6440
+ }
6441
+ @media (prefers-reduced-motion: reduce) {
6442
+ .AutoHideShell_handle {
6443
+ animation: none;
6444
+ }
6445
+ }
6446
+
6447
+ /* dist/screens/components/Container/index.module.css */
6448
+ .Container_containerCard {
6449
+ position: relative;
6450
+ width: 100%;
6451
+ max-width: 1300px;
6452
+ background: var(--letter-white, #ffffff);
6453
+ backdrop-filter: var(--blur, blur(10px));
6454
+ -webkit-backdrop-filter: var(--blur, blur(10px));
6455
+ --container-pad: 35px;
6456
+ padding: var(--container-pad);
6457
+ border-radius: 12px;
6458
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
6459
+ border: 1px solid var(--container-border, rgba(0, 0, 0, 0.08));
6460
+ min-height: 550px;
6461
+ box-sizing: border-box;
6462
+ display: flex;
6463
+ flex-direction: column;
6464
+ }
6465
+ .Container_hasBgImage::before {
6466
+ content: "";
6467
+ position: absolute;
5814
6468
  inset: 0;
5815
6469
  border-radius: inherit;
5816
6470
  background-image: var(--container-bg-image);
@@ -5823,10 +6477,24 @@ button.TopBar_searchWrapper {
5823
6477
  position: relative;
5824
6478
  z-index: 1;
5825
6479
  }
6480
+ .Container_containerCard > .Container_header {
6481
+ box-sizing: border-box;
6482
+ margin: calc(var(--container-pad) * -1) calc(var(--container-pad) * -1) var(--container-pad);
6483
+ padding: 12px var(--container-pad);
6484
+ background: var(--container-header-bg, var(--letter-white, #ffffff));
6485
+ color: var(--container-header-text, inherit);
6486
+ border-bottom: 1px solid var(--container-header-border, rgba(0, 0, 0, 0.08));
6487
+ border-radius: 12px 12px 0 0;
6488
+ }
6489
+ .Container_containerCard > .Container_headerSticky {
6490
+ position: sticky;
6491
+ top: 0;
6492
+ z-index: 10;
6493
+ }
5826
6494
  @media (max-width: 768px) {
5827
6495
  .Container_containerCard {
5828
6496
  max-width: 100%;
5829
- padding: 1.5rem;
6497
+ --container-pad: 1.5rem;
5830
6498
  min-height: auto;
5831
6499
  }
5832
6500
  }
@@ -7183,103 +7851,283 @@ button.TopBar_searchWrapper {
7183
7851
  .Frame_frameCardModal::-webkit-scrollbar {
7184
7852
  display: none;
7185
7853
  }
7186
- .Frame_headerContainer {
7187
- display: flex;
7188
- align-items: center;
7189
- justify-content: center;
7190
- gap: 0.5rem;
7191
- margin: 0 0 1.25rem 0;
7854
+ .Frame_headerContainer {
7855
+ display: flex;
7856
+ align-items: center;
7857
+ justify-content: center;
7858
+ gap: 0.5rem;
7859
+ margin: 0 0 1.25rem 0;
7860
+ }
7861
+ .Frame_frameTitle {
7862
+ font-size: 1.1rem;
7863
+ font-weight: 700;
7864
+ color: #000000;
7865
+ text-align: center;
7866
+ margin: 0;
7867
+ }
7868
+ .Frame_iconContainer {
7869
+ display: flex;
7870
+ align-items: center;
7871
+ justify-content: center;
7872
+ color: var(--frame-icon, #555);
7873
+ }
7874
+ .Frame_description {
7875
+ text-align: center;
7876
+ margin: 0 0 1.25rem 0;
7877
+ font-size: 0.9rem;
7878
+ color: #475569;
7879
+ background-color: var(--frame-description-bg, #f1f5f9);
7880
+ padding: 0.75rem 1rem;
7881
+ border-radius: 6px;
7882
+ line-height: 1.4;
7883
+ }
7884
+ .Frame_errorMessage {
7885
+ color: #ff0000;
7886
+ font-size: 0.85rem;
7887
+ text-align: center;
7888
+ margin: 0 0 1rem 0;
7889
+ font-weight: 700;
7890
+ min-height: 1rem;
7891
+ }
7892
+ .Frame_modalOverlay {
7893
+ position: fixed;
7894
+ top: 0;
7895
+ left: 0;
7896
+ width: 100vw;
7897
+ height: 100vh;
7898
+ background: rgba(0, 0, 0, 0.45);
7899
+ backdrop-filter: blur(4px);
7900
+ z-index: 9999;
7901
+ display: flex;
7902
+ justify-content: center;
7903
+ align-items: center;
7904
+ animation: Frame_modalFadeIn 0.3s ease-out;
7905
+ }
7906
+ @keyframes Frame_modalFadeIn {
7907
+ from {
7908
+ opacity: 0;
7909
+ }
7910
+ to {
7911
+ opacity: 1;
7912
+ }
7913
+ }
7914
+ .Frame_bodyContainer {
7915
+ position: relative;
7916
+ width: 100%;
7917
+ flex: 1;
7918
+ display: flex;
7919
+ flex-direction: column;
7920
+ }
7921
+ .Frame_loadingOverlay {
7922
+ position: absolute;
7923
+ top: 0;
7924
+ left: 0;
7925
+ right: 0;
7926
+ bottom: 0;
7927
+ display: flex;
7928
+ justify-content: center;
7929
+ align-items: center;
7930
+ background-color: #ffffff;
7931
+ z-index: 10;
7932
+ }
7933
+ .Frame_skeletonGroup {
7934
+ width: 100%;
7935
+ display: flex;
7936
+ flex-direction: column;
7937
+ gap: 0.6rem;
7938
+ }
7939
+ .Frame_hiddenContent {
7940
+ visibility: hidden;
7941
+ }
7942
+ .Frame_contentWrapper {
7943
+ display: flex;
7944
+ flex-direction: column;
7945
+ min-height: 0;
7946
+ width: 100%;
7947
+ }
7948
+ .Frame_scrollContent {
7949
+ display: flex;
7950
+ flex-direction: column;
7951
+ }
7952
+
7953
+ /* dist/screens/components/Text/index.module.css */
7954
+ .Text_text {
7955
+ margin: 0;
7956
+ font-family: var(--font-sans);
7957
+ color: var(--text-color, #0f172a);
7958
+ }
7959
+ .Text_h1 {
7960
+ font-size: 2rem;
7961
+ font-weight: 700;
7962
+ line-height: 1.25;
7963
+ }
7964
+ .Text_h2 {
7965
+ font-size: 1.5rem;
7966
+ font-weight: 700;
7967
+ line-height: 1.3;
7968
+ }
7969
+ .Text_h3 {
7970
+ font-size: 1.15rem;
7971
+ font-weight: 600;
7972
+ line-height: 1.35;
7973
+ }
7974
+ .Text_body {
7975
+ font-size: 1rem;
7976
+ font-weight: 400;
7977
+ line-height: 1.5;
7978
+ }
7979
+ .Text_caption {
7980
+ display: inline-block;
7981
+ font-size: 0.8rem;
7982
+ font-weight: 400;
7983
+ line-height: 1.4;
7984
+ color: var(--text-color, #64748b);
7985
+ }
7986
+ .Text_animateFadeIn {
7987
+ animation: Text_fadeIn var(--anim-duration, 800ms) cubic-bezier(0.16, 1, 0.3, 1) forwards;
7988
+ }
7989
+ @keyframes Text_fadeIn {
7990
+ from {
7991
+ opacity: 0;
7992
+ transform: translateY(4px);
7993
+ }
7994
+ to {
7995
+ opacity: 1;
7996
+ transform: translateY(0);
7997
+ }
7998
+ }
7999
+ .Text_animateFadeOut {
8000
+ animation: Text_fadeOut var(--anim-duration, 800ms) cubic-bezier(0.16, 1, 0.3, 1) forwards;
8001
+ }
8002
+ @keyframes Text_fadeOut {
8003
+ from {
8004
+ opacity: 1;
8005
+ transform: translateY(0);
8006
+ }
8007
+ to {
8008
+ opacity: 0;
8009
+ transform: translateY(-4px);
8010
+ }
8011
+ }
8012
+ .Text_animateTyping {
8013
+ border-right: 2px solid currentColor;
8014
+ white-space: nowrap;
8015
+ overflow: hidden;
8016
+ display: inline-block;
8017
+ animation: Text_blinkCursor 0.75s step-end infinite;
7192
8018
  }
7193
- .Frame_frameTitle {
7194
- font-size: 1.1rem;
7195
- font-weight: 700;
7196
- color: #000000;
7197
- text-align: center;
7198
- margin: 0;
8019
+ @keyframes Text_blinkCursor {
8020
+ from, to {
8021
+ border-color: transparent;
8022
+ }
8023
+ 50% {
8024
+ border-color: currentColor;
8025
+ }
7199
8026
  }
7200
- .Frame_iconContainer {
7201
- display: flex;
7202
- align-items: center;
7203
- justify-content: center;
7204
- color: var(--frame-icon, #555);
8027
+ .Text_animateRiseAndFade {
8028
+ display: inline-block;
8029
+ animation: Text_riseAndFade var(--rise-duration, 1000ms) cubic-bezier(0.16, 1, 0.3, 1) var(--rise-delay, 400ms) forwards;
7205
8030
  }
7206
- .Frame_description {
7207
- text-align: center;
7208
- margin: 0 0 1.25rem 0;
7209
- font-size: 0.9rem;
7210
- color: #475569;
7211
- background-color: var(--frame-description-bg, #f1f5f9);
7212
- padding: 0.75rem 1rem;
7213
- border-radius: 6px;
7214
- line-height: 1.4;
8031
+ @keyframes Text_riseAndFade {
8032
+ 0% {
8033
+ opacity: 1;
8034
+ transform: translateY(0);
8035
+ }
8036
+ 100% {
8037
+ opacity: 0;
8038
+ transform: translateY(-40px);
8039
+ }
7215
8040
  }
7216
- .Frame_errorMessage {
7217
- color: #ff0000;
7218
- font-size: 0.85rem;
7219
- text-align: center;
7220
- margin: 0 0 1rem 0;
7221
- font-weight: 700;
7222
- min-height: 1rem;
8041
+ .Text_letterFadeContainer {
8042
+ display: inline-block;
7223
8043
  }
7224
- .Frame_modalOverlay {
7225
- position: fixed;
7226
- top: 0;
7227
- left: 0;
7228
- width: 100vw;
7229
- height: 100vh;
7230
- background: rgba(0, 0, 0, 0.45);
7231
- backdrop-filter: blur(4px);
7232
- z-index: 9999;
7233
- display: flex;
7234
- justify-content: center;
7235
- align-items: center;
7236
- animation: Frame_modalFadeIn 0.3s ease-out;
8044
+ .Text_letterFadeIn {
8045
+ display: inline-block;
8046
+ opacity: 0;
8047
+ animation: Text_letterFadeInKeyframes ease-in-out forwards;
7237
8048
  }
7238
- @keyframes Frame_modalFadeIn {
8049
+ @keyframes Text_letterFadeInKeyframes {
7239
8050
  from {
7240
8051
  opacity: 0;
8052
+ transform: translateY(2px);
7241
8053
  }
7242
8054
  to {
7243
8055
  opacity: 1;
8056
+ transform: translateY(0);
7244
8057
  }
7245
8058
  }
7246
- .Frame_bodyContainer {
7247
- position: relative;
7248
- width: 100%;
7249
- flex: 1;
8059
+ .Text_letterFadeOut {
8060
+ display: inline-block;
8061
+ opacity: 1;
8062
+ animation: Text_letterFadeOutKeyframes ease-in-out forwards;
8063
+ }
8064
+ @keyframes Text_letterFadeOutKeyframes {
8065
+ from {
8066
+ opacity: 1;
8067
+ transform: translateY(0);
8068
+ }
8069
+ to {
8070
+ opacity: 0;
8071
+ transform: translateY(-2px);
8072
+ }
8073
+ }
8074
+ .Text_markdown {
8075
+ display: block;
8076
+ }
8077
+ .Text_markdownWithIcon {
7250
8078
  display: flex;
7251
- flex-direction: column;
8079
+ align-items: flex-start;
7252
8080
  }
7253
- .Frame_loadingOverlay {
7254
- position: absolute;
7255
- top: 0;
7256
- left: 0;
7257
- right: 0;
7258
- bottom: 0;
8081
+ .Text_markdownBody {
8082
+ min-width: 0;
8083
+ flex: 1;
8084
+ }
8085
+
8086
+ /* dist/screens/components/Footer/index.module.css */
8087
+ .Footer_footer {
8088
+ box-sizing: border-box;
7259
8089
  display: flex;
7260
- justify-content: center;
7261
8090
  align-items: center;
7262
- background-color: #ffffff;
8091
+ justify-content: space-between;
8092
+ gap: 16px;
8093
+ width: 100%;
8094
+ min-height: var(--footer-height, 64px);
8095
+ padding: var(--footer-padding, 0 24px);
8096
+ background: var(--footer-bg, #ffffff);
8097
+ color: var(--footer-text, #0f172a);
8098
+ border-top: 1px solid var(--footer-border, #e2e8f0);
8099
+ font-family: var(--font-sans, sans-serif);
8100
+ font-size: 0.9rem;
8101
+ }
8102
+ .Footer_sticky {
8103
+ position: sticky;
8104
+ bottom: 0;
7263
8105
  z-index: 10;
7264
8106
  }
7265
- .Frame_skeletonGroup {
7266
- width: 100%;
8107
+ .Footer_zone {
7267
8108
  display: flex;
7268
- flex-direction: column;
7269
- gap: 0.6rem;
8109
+ align-items: center;
8110
+ gap: 8px;
8111
+ min-width: 0;
7270
8112
  }
7271
- .Frame_hiddenContent {
7272
- visibility: hidden;
8113
+ .Footer_center {
8114
+ flex: 1;
8115
+ justify-content: center;
7273
8116
  }
7274
- .Frame_contentWrapper {
7275
- display: flex;
7276
- flex-direction: column;
7277
- min-height: 0;
7278
- width: 100%;
8117
+ .Footer_right {
8118
+ justify-content: flex-end;
8119
+ flex-wrap: wrap;
7279
8120
  }
7280
- .Frame_scrollContent {
7281
- display: flex;
7282
- flex-direction: column;
8121
+ @media (max-width: 480px) {
8122
+ .Footer_footer {
8123
+ flex-direction: column;
8124
+ align-items: stretch;
8125
+ padding: 12px 16px;
8126
+ min-height: auto;
8127
+ }
8128
+ .Footer_right {
8129
+ justify-content: center;
8130
+ }
7283
8131
  }
7284
8132
 
7285
8133
  /* dist/screens/components/HoursPicker/index.module.css */
@@ -7753,104 +8601,18 @@ button.TopBar_searchWrapper {
7753
8601
  color: #475569;
7754
8602
  text-align: left;
7755
8603
  }
7756
- .InfoTooltip_popoverBody p {
7757
- margin: 0;
7758
- }
7759
- @keyframes InfoTooltip_slideUpFade {
7760
- from {
7761
- opacity: 0;
7762
- transform: translateX(-50%) translateY(10px);
7763
- }
7764
- to {
7765
- opacity: 1;
7766
- transform: translateX(-50%) translateY(0);
7767
- }
7768
- }
7769
-
7770
- /* dist/screens/components/Resizable/index.module.css */
7771
- .Resizable_root {
7772
- position: relative;
7773
- display: flex;
7774
- min-width: 0;
7775
- min-height: 0;
7776
- flex-shrink: 0;
7777
- }
7778
- .Resizable_content {
7779
- flex: 1 1 auto;
7780
- min-width: 0;
7781
- min-height: 0;
7782
- overflow: auto;
7783
- }
7784
- .Resizable_handle {
7785
- position: relative;
7786
- flex: none;
7787
- display: flex;
7788
- align-items: center;
7789
- justify-content: center;
7790
- background: var(--resizable-handle-bg, transparent);
7791
- touch-action: none;
7792
- user-select: none;
7793
- outline: none;
7794
- }
7795
- .Resizable_handleVertical {
7796
- width: 100%;
7797
- cursor: ns-resize;
7798
- }
7799
- .Resizable_handleHorizontal {
7800
- height: 100%;
7801
- cursor: ew-resize;
7802
- }
7803
- .Resizable_handle.Resizable_disabled {
7804
- cursor: default;
7805
- opacity: 0.5;
7806
- }
7807
- .Resizable_line {
7808
- position: absolute;
7809
- background: var(--resizable-line, rgba(148, 163, 184, 0.35));
7810
- pointer-events: none;
7811
- transition: background-color 0.15s ease;
7812
- }
7813
- .Resizable_handleVertical .Resizable_line {
7814
- left: 0;
7815
- right: 0;
7816
- top: 50%;
7817
- transform: translateY(-50%);
7818
- }
7819
- .Resizable_handleHorizontal .Resizable_line {
7820
- top: 0;
7821
- bottom: 0;
7822
- left: 50%;
7823
- transform: translateX(-50%);
7824
- }
7825
- .Resizable_grip {
7826
- position: relative;
7827
- display: flex;
7828
- align-items: center;
7829
- justify-content: center;
7830
- box-sizing: border-box;
7831
- border: 1px solid var(--resizable-grip-border, rgba(148, 163, 184, 0.6));
7832
- background: var(--resizable-grip-bg, transparent);
7833
- color: var(--resizable-grip-icon, #94a3b8);
7834
- transition: border-color 0.15s ease, color 0.15s ease;
7835
- }
7836
- .Resizable_handle:hover .Resizable_line,
7837
- .Resizable_handle.Resizable_dragging .Resizable_line {
7838
- background: var(--resizable-line-active, #7c9cff);
7839
- }
7840
- .Resizable_handle:hover .Resizable_grip,
7841
- .Resizable_handle.Resizable_dragging .Resizable_grip {
7842
- border-color: var(--resizable-line-active, #7c9cff);
7843
- color: var(--resizable-line-active, #7c9cff);
7844
- }
7845
- .Resizable_handle:focus-visible .Resizable_grip {
7846
- outline: 2px solid var(--resizable-line-active, #7c9cff);
7847
- outline-offset: 2px;
7848
- }
7849
- .Resizable_handle.Resizable_disabled:hover .Resizable_line,
7850
- .Resizable_handle.Resizable_disabled:hover .Resizable_grip {
7851
- background: var(--resizable-line, rgba(148, 163, 184, 0.35));
7852
- border-color: var(--resizable-grip-border, rgba(148, 163, 184, 0.6));
7853
- color: var(--resizable-grip-icon, #94a3b8);
8604
+ .InfoTooltip_popoverBody p {
8605
+ margin: 0;
8606
+ }
8607
+ @keyframes InfoTooltip_slideUpFade {
8608
+ from {
8609
+ opacity: 0;
8610
+ transform: translateX(-50%) translateY(10px);
8611
+ }
8612
+ to {
8613
+ opacity: 1;
8614
+ transform: translateX(-50%) translateY(0);
8615
+ }
7854
8616
  }
7855
8617
 
7856
8618
  /* dist/screens/components/ChatComposer/components/ComposerToolbar/index.module.css */
@@ -8777,6 +9539,157 @@ button.TopBar_searchWrapper {
8777
9539
  }
8778
9540
  }
8779
9541
 
9542
+ /* dist/screens/components/QRCode/index.module.css */
9543
+ .QRCode_wrapper {
9544
+ display: inline-flex;
9545
+ flex-direction: column;
9546
+ align-items: center;
9547
+ gap: 10px;
9548
+ max-width: 100%;
9549
+ }
9550
+ .QRCode_frame {
9551
+ position: relative;
9552
+ line-height: 0;
9553
+ border: var(--qr-border-width, 1px) solid var(--qr-border, #d1d5db);
9554
+ border-radius: var(--qr-radius, 12px);
9555
+ padding: var(--qr-padding, 12px);
9556
+ background: var(--qr-frame-bg, #ffffff);
9557
+ overflow: hidden;
9558
+ max-width: 100%;
9559
+ }
9560
+ .QRCode_svg {
9561
+ display: block;
9562
+ max-width: 100%;
9563
+ height: auto;
9564
+ }
9565
+ .QRCode_error {
9566
+ font-size: 13px;
9567
+ color: var(--qr-error, #b91c1c);
9568
+ }
9569
+ .QRCode_actions {
9570
+ display: flex;
9571
+ gap: 8px;
9572
+ }
9573
+ .QRCode_svg {
9574
+ transition: filter var(--qr-anim-duration, 300ms) ease, opacity var(--qr-anim-duration, 300ms) ease;
9575
+ }
9576
+ .QRCode_blurred {
9577
+ filter: blur(var(--qr-blur, 8px));
9578
+ pointer-events: none;
9579
+ user-select: none;
9580
+ }
9581
+ .QRCode_hidden {
9582
+ opacity: 0;
9583
+ }
9584
+ .QRCode_loadingLayer {
9585
+ position: absolute !important;
9586
+ inset: 0;
9587
+ }
9588
+ .QRCode_overlay {
9589
+ position: absolute;
9590
+ inset: 0;
9591
+ display: flex;
9592
+ align-items: center;
9593
+ justify-content: center;
9594
+ text-align: center;
9595
+ padding: 8px;
9596
+ line-height: 1.3;
9597
+ font-size: 14px;
9598
+ color: var(--qr-overlay-text, #111827);
9599
+ }
9600
+ .QRCode_enter_scale {
9601
+ animation: QRCode_qrInScale var(--qr-anim-duration, 300ms) cubic-bezier(0.22, 1, 0.36, 1) both;
9602
+ }
9603
+ .QRCode_exit_scale {
9604
+ animation: QRCode_qrOutScale var(--qr-anim-duration, 300ms) ease-in both;
9605
+ }
9606
+ .QRCode_enter_fade {
9607
+ animation: QRCode_qrInFade var(--qr-anim-duration, 300ms) ease-out both;
9608
+ }
9609
+ .QRCode_exit_fade {
9610
+ animation: QRCode_qrOutFade var(--qr-anim-duration, 300ms) ease-in both;
9611
+ }
9612
+ .QRCode_enter_slide {
9613
+ animation: QRCode_qrInSlide var(--qr-anim-duration, 300ms) cubic-bezier(0.22, 1, 0.36, 1) both;
9614
+ }
9615
+ .QRCode_exit_slide {
9616
+ animation: QRCode_qrOutSlide var(--qr-anim-duration, 300ms) ease-in both;
9617
+ }
9618
+ @keyframes QRCode_qrInScale {
9619
+ from {
9620
+ opacity: 0;
9621
+ transform: scale(0.85);
9622
+ }
9623
+ to {
9624
+ opacity: 1;
9625
+ transform: scale(1);
9626
+ }
9627
+ }
9628
+ @keyframes QRCode_qrOutScale {
9629
+ from {
9630
+ opacity: 1;
9631
+ transform: scale(1);
9632
+ }
9633
+ to {
9634
+ opacity: 0;
9635
+ transform: scale(0.85);
9636
+ }
9637
+ }
9638
+ @keyframes QRCode_qrInFade {
9639
+ from {
9640
+ opacity: 0;
9641
+ }
9642
+ to {
9643
+ opacity: 1;
9644
+ }
9645
+ }
9646
+ @keyframes QRCode_qrOutFade {
9647
+ from {
9648
+ opacity: 1;
9649
+ }
9650
+ to {
9651
+ opacity: 0;
9652
+ }
9653
+ }
9654
+ @keyframes QRCode_qrInSlide {
9655
+ from {
9656
+ opacity: 0;
9657
+ transform: translateY(16px);
9658
+ }
9659
+ to {
9660
+ opacity: 1;
9661
+ transform: translateY(0);
9662
+ }
9663
+ }
9664
+ @keyframes QRCode_qrOutSlide {
9665
+ from {
9666
+ opacity: 1;
9667
+ transform: translateY(0);
9668
+ }
9669
+ to {
9670
+ opacity: 0;
9671
+ transform: translateY(16px);
9672
+ }
9673
+ }
9674
+ @media (prefers-reduced-motion: reduce) {
9675
+ .QRCode_wrapper,
9676
+ .QRCode_svg {
9677
+ animation: none !important;
9678
+ transition: none !important;
9679
+ }
9680
+ }
9681
+ .QRCode_logoNode {
9682
+ display: flex;
9683
+ align-items: center;
9684
+ justify-content: center;
9685
+ overflow: hidden;
9686
+ line-height: 1;
9687
+ }
9688
+ .QRCode_logoNode > svg {
9689
+ width: 100%;
9690
+ height: 100%;
9691
+ }
9692
+
8780
9693
  /* dist/screens/components/RenderJsonSchema/index.module.css */
8781
9694
  .RenderJsonSchema_root {
8782
9695
  display: flex;
@@ -8948,7 +9861,7 @@ button.TopBar_searchWrapper {
8948
9861
  width: 100%;
8949
9862
  overflow: hidden;
8950
9863
  background: var(--tableA-surface, white);
8951
- border-radius: 12px;
9864
+ border-radius: 6px;
8952
9865
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
8953
9866
  border: 1px solid var(--tableA-border, #e2e8f0);
8954
9867
  }
@@ -9124,7 +10037,7 @@ button.TopBar_searchWrapper {
9124
10037
  .tableB_tableContainer {
9125
10038
  width: 100%;
9126
10039
  overflow: hidden;
9127
- border-radius: 12px;
10040
+ border-radius: 6px;
9128
10041
  background-color: var(--tableB-surface, #ffffff);
9129
10042
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
9130
10043
  border: 1px solid var(--tableB-border, #e5e7eb);
@@ -9422,139 +10335,6 @@ button.TopBar_searchWrapper {
9422
10335
  min-width: 80px;
9423
10336
  }
9424
10337
 
9425
- /* dist/screens/components/Text/index.module.css */
9426
- .Text_text {
9427
- margin: 0;
9428
- font-family: var(--font-sans);
9429
- color: var(--text-color, #0f172a);
9430
- }
9431
- .Text_h1 {
9432
- font-size: 2rem;
9433
- font-weight: 700;
9434
- line-height: 1.25;
9435
- }
9436
- .Text_h2 {
9437
- font-size: 1.5rem;
9438
- font-weight: 700;
9439
- line-height: 1.3;
9440
- }
9441
- .Text_h3 {
9442
- font-size: 1.15rem;
9443
- font-weight: 600;
9444
- line-height: 1.35;
9445
- }
9446
- .Text_body {
9447
- font-size: 1rem;
9448
- font-weight: 400;
9449
- line-height: 1.5;
9450
- }
9451
- .Text_caption {
9452
- display: inline-block;
9453
- font-size: 0.8rem;
9454
- font-weight: 400;
9455
- line-height: 1.4;
9456
- color: var(--text-color, #64748b);
9457
- }
9458
- .Text_animateFadeIn {
9459
- animation: Text_fadeIn var(--anim-duration, 800ms) cubic-bezier(0.16, 1, 0.3, 1) forwards;
9460
- }
9461
- @keyframes Text_fadeIn {
9462
- from {
9463
- opacity: 0;
9464
- transform: translateY(4px);
9465
- }
9466
- to {
9467
- opacity: 1;
9468
- transform: translateY(0);
9469
- }
9470
- }
9471
- .Text_animateFadeOut {
9472
- animation: Text_fadeOut var(--anim-duration, 800ms) cubic-bezier(0.16, 1, 0.3, 1) forwards;
9473
- }
9474
- @keyframes Text_fadeOut {
9475
- from {
9476
- opacity: 1;
9477
- transform: translateY(0);
9478
- }
9479
- to {
9480
- opacity: 0;
9481
- transform: translateY(-4px);
9482
- }
9483
- }
9484
- .Text_animateTyping {
9485
- border-right: 2px solid currentColor;
9486
- white-space: nowrap;
9487
- overflow: hidden;
9488
- display: inline-block;
9489
- animation: Text_blinkCursor 0.75s step-end infinite;
9490
- }
9491
- @keyframes Text_blinkCursor {
9492
- from, to {
9493
- border-color: transparent;
9494
- }
9495
- 50% {
9496
- border-color: currentColor;
9497
- }
9498
- }
9499
- .Text_animateRiseAndFade {
9500
- display: inline-block;
9501
- animation: Text_riseAndFade var(--rise-duration, 1000ms) cubic-bezier(0.16, 1, 0.3, 1) var(--rise-delay, 400ms) forwards;
9502
- }
9503
- @keyframes Text_riseAndFade {
9504
- 0% {
9505
- opacity: 1;
9506
- transform: translateY(0);
9507
- }
9508
- 100% {
9509
- opacity: 0;
9510
- transform: translateY(-40px);
9511
- }
9512
- }
9513
- .Text_letterFadeContainer {
9514
- display: inline-block;
9515
- }
9516
- .Text_letterFadeIn {
9517
- display: inline-block;
9518
- opacity: 0;
9519
- animation: Text_letterFadeInKeyframes ease-in-out forwards;
9520
- }
9521
- @keyframes Text_letterFadeInKeyframes {
9522
- from {
9523
- opacity: 0;
9524
- transform: translateY(2px);
9525
- }
9526
- to {
9527
- opacity: 1;
9528
- transform: translateY(0);
9529
- }
9530
- }
9531
- .Text_letterFadeOut {
9532
- display: inline-block;
9533
- opacity: 1;
9534
- animation: Text_letterFadeOutKeyframes ease-in-out forwards;
9535
- }
9536
- @keyframes Text_letterFadeOutKeyframes {
9537
- from {
9538
- opacity: 1;
9539
- transform: translateY(0);
9540
- }
9541
- to {
9542
- opacity: 0;
9543
- transform: translateY(-2px);
9544
- }
9545
- }
9546
- .Text_markdown {
9547
- display: block;
9548
- }
9549
- .Text_markdownWithIcon {
9550
- display: flex;
9551
- align-items: flex-start;
9552
- }
9553
- .Text_markdownBody {
9554
- min-width: 0;
9555
- flex: 1;
9556
- }
9557
-
9558
10338
  /* dist/screens/components/UserEditPopover/index.module.css */
9559
10339
  .UserEditPopover_popoverPaper {
9560
10340
  padding: 16px;