@hearthscale/app-ui 0.1.0 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +21 -2
- package/dist/CLASSES.md +283 -216
- package/dist/TOKENS.md +138 -21
- package/dist/chunks/chunk-E3RFTBRS.js +332 -0
- package/dist/editor.d.ts +32 -0
- package/dist/editor.js +69 -0
- package/dist/index.d.ts +317 -11
- package/dist/index.js +1087 -377
- package/dist/markdown.d.ts +25 -0
- package/dist/markdown.js +365 -0
- package/dist/ui.css +2434 -564
- package/package.json +28 -3
package/dist/ui.css
CHANGED
|
@@ -577,6 +577,7 @@
|
|
|
577
577
|
font: inherit;
|
|
578
578
|
text-align: left;
|
|
579
579
|
cursor: pointer;
|
|
580
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
580
581
|
}
|
|
581
582
|
.hs-link-row:hover {
|
|
582
583
|
background: var(--hov);
|
|
@@ -656,7 +657,7 @@
|
|
|
656
657
|
background: var(--gloss);
|
|
657
658
|
box-shadow: var(--gloss-edge);
|
|
658
659
|
}
|
|
659
|
-
.hs-frame-grain {
|
|
660
|
+
.hs-frame-grain, .hs-dashboard::after {
|
|
660
661
|
position: absolute;
|
|
661
662
|
inset: 0;
|
|
662
663
|
pointer-events: none;
|
|
@@ -821,40 +822,10 @@
|
|
|
821
822
|
color: var(--mut);
|
|
822
823
|
}
|
|
823
824
|
.hs-picker {
|
|
824
|
-
display: flex;
|
|
825
|
-
height: min(calc(var(--space) * 86.5), 60vh);
|
|
826
|
-
margin: calc(var(--space) * -1);
|
|
827
|
-
}
|
|
828
|
-
.hs-picker-rail {
|
|
829
|
-
display: flex;
|
|
830
|
-
flex-direction: column;
|
|
831
|
-
gap: var(--space);
|
|
832
|
-
flex: none;
|
|
833
|
-
width: calc(var(--space) * 11);
|
|
834
|
-
padding: var(--space);
|
|
835
|
-
background: var(--hov);
|
|
836
|
-
}
|
|
837
|
-
.hs-picker-rail-item {
|
|
838
|
-
position: relative;
|
|
839
|
-
display: grid;
|
|
840
|
-
place-items: center;
|
|
841
|
-
width: calc(var(--space) * 9);
|
|
842
|
-
height: calc(var(--space) * 8);
|
|
843
|
-
border: 0;
|
|
844
|
-
border-radius: var(--r-ctl);
|
|
845
|
-
background: transparent;
|
|
846
|
-
color: var(--mut);
|
|
847
|
-
cursor: pointer;
|
|
848
|
-
}
|
|
849
|
-
.hs-picker-rail-item:hover, .hs-picker-rail-item[data-active='true'] {
|
|
850
|
-
background: var(--act);
|
|
851
|
-
color: var(--text);
|
|
852
|
-
}
|
|
853
|
-
.hs-picker-main {
|
|
854
825
|
display: flex;
|
|
855
826
|
flex-direction: column;
|
|
856
|
-
|
|
857
|
-
|
|
827
|
+
max-height: min(calc(var(--space) * 86.5), 60vh);
|
|
828
|
+
margin: calc(var(--space) * -1);
|
|
858
829
|
}
|
|
859
830
|
.hs-picker-search {
|
|
860
831
|
padding: calc(var(--space) * 2) calc(var(--space) * 2) var(--space);
|
|
@@ -865,15 +836,6 @@
|
|
|
865
836
|
padding: var(--space);
|
|
866
837
|
overflow: hidden auto;
|
|
867
838
|
}
|
|
868
|
-
.hs-picker-section {
|
|
869
|
-
display: flex;
|
|
870
|
-
flex-direction: column;
|
|
871
|
-
}
|
|
872
|
-
.hs-picker-heading {
|
|
873
|
-
padding: calc(var(--space) * 2) calc(var(--space) * 2) var(--space);
|
|
874
|
-
font-size: var(--fs-cap);
|
|
875
|
-
color: var(--dim);
|
|
876
|
-
}
|
|
877
839
|
.hs-picker-row {
|
|
878
840
|
display: flex;
|
|
879
841
|
align-items: center;
|
|
@@ -892,16 +854,36 @@
|
|
|
892
854
|
background: var(--hov);
|
|
893
855
|
outline: none;
|
|
894
856
|
}
|
|
895
|
-
.hs-picker-row[data-state='absent'], .hs-picker-row[data-state='unavailable'] {
|
|
857
|
+
.hs-picker-row[data-state='absent'], .hs-picker-row[data-state='downloading'], .hs-picker-row[data-state='unavailable'] {
|
|
896
858
|
color: var(--dim);
|
|
897
859
|
cursor: default;
|
|
898
860
|
}
|
|
861
|
+
.hs-picker-row[data-download='true'] {
|
|
862
|
+
cursor: pointer;
|
|
863
|
+
}
|
|
864
|
+
.hs-picker-row-action {
|
|
865
|
+
display: inline-flex;
|
|
866
|
+
align-items: center;
|
|
867
|
+
gap: var(--space);
|
|
868
|
+
flex: none;
|
|
869
|
+
padding: calc(var(--space) * 0.75) calc(var(--space) * 2);
|
|
870
|
+
border-radius: var(--r-pill);
|
|
871
|
+
background: var(--hov);
|
|
872
|
+
font-size: var(--fs-cap);
|
|
873
|
+
color: var(--text);
|
|
874
|
+
}
|
|
875
|
+
.hs-picker-row-check {
|
|
876
|
+
display: grid;
|
|
877
|
+
place-items: center;
|
|
878
|
+
flex: none;
|
|
879
|
+
width: calc(var(--space) * 3.25);
|
|
880
|
+
}
|
|
899
881
|
.hs-picker-row-text {
|
|
900
882
|
display: flex;
|
|
901
883
|
flex-direction: column;
|
|
902
|
-
gap: calc(var(--space) * 0.5);
|
|
903
884
|
flex: 1;
|
|
904
885
|
min-width: 0;
|
|
886
|
+
line-height: 1.3;
|
|
905
887
|
}
|
|
906
888
|
.hs-picker-row-name {
|
|
907
889
|
overflow: hidden;
|
|
@@ -1042,7 +1024,7 @@
|
|
|
1042
1024
|
min-height: 0;
|
|
1043
1025
|
display: flex;
|
|
1044
1026
|
flex-direction: column;
|
|
1045
|
-
padding:
|
|
1027
|
+
padding: var(--pad-sidebar) 0 calc(var(--space) * 3) var(--pad-sidebar);
|
|
1046
1028
|
}
|
|
1047
1029
|
.hs-nav-scroll {
|
|
1048
1030
|
flex: 1;
|
|
@@ -1051,7 +1033,34 @@
|
|
|
1051
1033
|
display: flex;
|
|
1052
1034
|
flex-direction: column;
|
|
1053
1035
|
gap: calc(var(--space) * 0.5);
|
|
1054
|
-
padding-right: var(--
|
|
1036
|
+
padding-right: var(--pad-sidebar);
|
|
1037
|
+
}
|
|
1038
|
+
.hs-overlay-scroll {
|
|
1039
|
+
position: relative;
|
|
1040
|
+
flex: 1;
|
|
1041
|
+
min-height: 0;
|
|
1042
|
+
display: flex;
|
|
1043
|
+
flex-direction: column;
|
|
1044
|
+
}
|
|
1045
|
+
.hs-shell .hs-overlay-scroll > :first-child::-webkit-scrollbar {
|
|
1046
|
+
display: none;
|
|
1047
|
+
}
|
|
1048
|
+
.hs-overlay-thumb {
|
|
1049
|
+
position: absolute;
|
|
1050
|
+
top: 0;
|
|
1051
|
+
right: 0;
|
|
1052
|
+
width: calc(var(--scroll-size) - var(--space) * 1.5);
|
|
1053
|
+
min-height: calc(var(--space) * 6);
|
|
1054
|
+
margin: calc(var(--space) * 0.75);
|
|
1055
|
+
border-radius: var(--r-pill);
|
|
1056
|
+
background: var(--scroll);
|
|
1057
|
+
touch-action: none;
|
|
1058
|
+
}
|
|
1059
|
+
.hs-overlay-thumb:hover, .hs-overlay-thumb[data-drag='true'] {
|
|
1060
|
+
background: var(--scrollhov);
|
|
1061
|
+
}
|
|
1062
|
+
.hs-overlay-thumb[data-shown='false'] {
|
|
1063
|
+
display: none;
|
|
1055
1064
|
}
|
|
1056
1065
|
.hs-docs-nav-scroll {
|
|
1057
1066
|
padding-bottom: calc(var(--space) * 19);
|
|
@@ -1063,7 +1072,7 @@
|
|
|
1063
1072
|
align-items: center;
|
|
1064
1073
|
gap: calc(var(--space) * 1.75);
|
|
1065
1074
|
height: var(--h-ctl);
|
|
1066
|
-
margin: 0 var(--
|
|
1075
|
+
margin: 0 var(--pad-sidebar) calc(var(--space) * 2) 0;
|
|
1067
1076
|
padding: 0 calc(var(--space) * 2.5);
|
|
1068
1077
|
border: var(--bw) solid var(--tipline);
|
|
1069
1078
|
box-sizing: border-box;
|
|
@@ -1084,6 +1093,7 @@
|
|
|
1084
1093
|
.hs-docs-folder-chevron {
|
|
1085
1094
|
display: inline-flex;
|
|
1086
1095
|
color: var(--dim);
|
|
1096
|
+
transition: transform var(--dur) var(--ease-out);
|
|
1087
1097
|
}
|
|
1088
1098
|
.hs-docs-folder-chevron[data-open='false'] {
|
|
1089
1099
|
transform: rotate(-90deg);
|
|
@@ -1198,6 +1208,7 @@
|
|
|
1198
1208
|
border-radius: var(--r-pill);
|
|
1199
1209
|
background: var(--dim);
|
|
1200
1210
|
opacity: 0.6;
|
|
1211
|
+
transition: width var(--dur) var(--ease-out), background var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
1201
1212
|
}
|
|
1202
1213
|
.hs-turn-rail-line[data-bright='true'] {
|
|
1203
1214
|
background: var(--text);
|
|
@@ -1269,6 +1280,17 @@
|
|
|
1269
1280
|
.hs-transcript-spacer {
|
|
1270
1281
|
flex: none;
|
|
1271
1282
|
}
|
|
1283
|
+
.hs-transcript-rows {
|
|
1284
|
+
position: relative;
|
|
1285
|
+
flex: none;
|
|
1286
|
+
width: 100%;
|
|
1287
|
+
}
|
|
1288
|
+
.hs-transcript-row {
|
|
1289
|
+
position: absolute;
|
|
1290
|
+
top: 0;
|
|
1291
|
+
left: 0;
|
|
1292
|
+
width: 100%;
|
|
1293
|
+
}
|
|
1272
1294
|
.hs-chat-fade {
|
|
1273
1295
|
position: absolute;
|
|
1274
1296
|
top: 0;
|
|
@@ -1466,6 +1488,13 @@
|
|
|
1466
1488
|
color: var(--mut);
|
|
1467
1489
|
cursor: pointer;
|
|
1468
1490
|
}
|
|
1491
|
+
.hs-composer-tool[data-state='listening'] {
|
|
1492
|
+
color: var(--bad);
|
|
1493
|
+
}
|
|
1494
|
+
.hs-composer-tool[data-state='opening'], .hs-composer-tool[data-state='transcribing'] {
|
|
1495
|
+
color: var(--dim);
|
|
1496
|
+
cursor: progress;
|
|
1497
|
+
}
|
|
1469
1498
|
.hs-composer-stop, .hs-composer-send {
|
|
1470
1499
|
display: grid;
|
|
1471
1500
|
place-items: center;
|
|
@@ -1634,6 +1663,7 @@
|
|
|
1634
1663
|
background: var(--scrim);
|
|
1635
1664
|
color: var(--scrim-ink);
|
|
1636
1665
|
opacity: 0;
|
|
1666
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
1637
1667
|
}
|
|
1638
1668
|
.hs-shelf-tile:hover .hs-shelf-remove, .hs-shelf-remove:focus-visible {
|
|
1639
1669
|
opacity: 1;
|
|
@@ -1963,6 +1993,36 @@
|
|
|
1963
1993
|
overflow-wrap: anywhere;
|
|
1964
1994
|
color: var(--text);
|
|
1965
1995
|
}
|
|
1996
|
+
.hs-ask-change {
|
|
1997
|
+
display: flex;
|
|
1998
|
+
flex-direction: column;
|
|
1999
|
+
gap: calc(var(--space) * 1.5);
|
|
2000
|
+
}
|
|
2001
|
+
.hs-ask-hunk {
|
|
2002
|
+
display: flex;
|
|
2003
|
+
flex-direction: column;
|
|
2004
|
+
}
|
|
2005
|
+
.hs-ask-line {
|
|
2006
|
+
display: flex;
|
|
2007
|
+
}
|
|
2008
|
+
.hs-ask-line[data-kind='add'] {
|
|
2009
|
+
background: var(--diff-add);
|
|
2010
|
+
}
|
|
2011
|
+
.hs-ask-line[data-kind='del'] {
|
|
2012
|
+
background: var(--diff-del);
|
|
2013
|
+
}
|
|
2014
|
+
.hs-ask-sign {
|
|
2015
|
+
flex: none;
|
|
2016
|
+
width: calc(var(--space) * 4);
|
|
2017
|
+
text-align: center;
|
|
2018
|
+
user-select: none;
|
|
2019
|
+
}
|
|
2020
|
+
.hs-ask-line[data-kind='add'] .hs-ask-sign {
|
|
2021
|
+
color: var(--ok);
|
|
2022
|
+
}
|
|
2023
|
+
.hs-ask-line[data-kind='del'] .hs-ask-sign {
|
|
2024
|
+
color: var(--bad);
|
|
2025
|
+
}
|
|
1966
2026
|
.hs-ask-tools {
|
|
1967
2027
|
display: flex;
|
|
1968
2028
|
flex-direction: column;
|
|
@@ -2171,11 +2231,24 @@
|
|
|
2171
2231
|
.hs-slot-layer {
|
|
2172
2232
|
position: absolute;
|
|
2173
2233
|
inset: 0;
|
|
2174
|
-
z-index: 2;
|
|
2175
2234
|
pointer-events: none;
|
|
2176
2235
|
}
|
|
2177
2236
|
.hs-slot {
|
|
2178
2237
|
position: absolute;
|
|
2238
|
+
z-index: 2;
|
|
2239
|
+
}
|
|
2240
|
+
.hs-slot-layer[data-animate='true'] > .hs-slot {
|
|
2241
|
+
transition: left var(--dur-slow) var(--ease-out), top var(--dur-slow) var(--ease-out), right var(--dur-slow) var(--ease-out), bottom var(--dur-slow) var(--ease-out);
|
|
2242
|
+
}
|
|
2243
|
+
.hs-main-view[data-covered='true'] {
|
|
2244
|
+
isolation: isolate;
|
|
2245
|
+
background: var(--win);
|
|
2246
|
+
}
|
|
2247
|
+
.hs-main-view[data-covered='true'] > .hs-view-frame {
|
|
2248
|
+
background: transparent;
|
|
2249
|
+
}
|
|
2250
|
+
.hs-main-view[data-covered='true'] .hs-slot:is([data-kind='chat'], [data-kind='composer'], [data-kind='model']) {
|
|
2251
|
+
z-index: -1;
|
|
2179
2252
|
}
|
|
2180
2253
|
.hs-slot-part {
|
|
2181
2254
|
position: absolute;
|
|
@@ -2193,6 +2266,11 @@
|
|
|
2193
2266
|
.hs-slot[data-kind='terminal'] > .hs-slot-part {
|
|
2194
2267
|
top: 0;
|
|
2195
2268
|
}
|
|
2269
|
+
.hs-slot[data-kind='model'] > .hs-slot-part {
|
|
2270
|
+
top: 0;
|
|
2271
|
+
flex-direction: row;
|
|
2272
|
+
align-items: center;
|
|
2273
|
+
}
|
|
2196
2274
|
.hs-chat[data-layout='composer'] {
|
|
2197
2275
|
position: relative;
|
|
2198
2276
|
inset: auto;
|
|
@@ -2206,8 +2284,8 @@
|
|
|
2206
2284
|
border: var(--bw) solid var(--line);
|
|
2207
2285
|
border-radius: var(--r-sm);
|
|
2208
2286
|
background: var(--hov);
|
|
2209
|
-
font-family: var(--font-
|
|
2210
|
-
font-size: var(--fs-
|
|
2287
|
+
font-family: var(--font-app);
|
|
2288
|
+
font-size: var(--fs-cap);
|
|
2211
2289
|
line-height: 1;
|
|
2212
2290
|
color: var(--mut);
|
|
2213
2291
|
}
|
|
@@ -2249,7 +2327,6 @@
|
|
|
2249
2327
|
}
|
|
2250
2328
|
.hs-meter[data-variant='ring'] svg {
|
|
2251
2329
|
display: block;
|
|
2252
|
-
transform: rotate(-90deg);
|
|
2253
2330
|
}
|
|
2254
2331
|
.hs-meter[data-variant='ring'] .hs-meter-track, .hs-meter[data-variant='ring'] .hs-meter-fill {
|
|
2255
2332
|
fill: none;
|
|
@@ -2264,6 +2341,7 @@
|
|
|
2264
2341
|
.hs-meter[data-variant='ring'] .hs-meter-fill {
|
|
2265
2342
|
stroke: var(--mut);
|
|
2266
2343
|
stroke-linecap: round;
|
|
2344
|
+
transition: stroke-dashoffset var(--dur-slow) var(--ease-out);
|
|
2267
2345
|
}
|
|
2268
2346
|
.hs-meter[data-variant='ring'][data-tone='bad'] .hs-meter-fill {
|
|
2269
2347
|
stroke: var(--bad);
|
|
@@ -2547,6 +2625,7 @@
|
|
|
2547
2625
|
color: var(--dim);
|
|
2548
2626
|
font-variant-numeric: tabular-nums;
|
|
2549
2627
|
opacity: 0;
|
|
2628
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
2550
2629
|
}
|
|
2551
2630
|
.hs-work-line:hover .hs-work-time {
|
|
2552
2631
|
opacity: 1;
|
|
@@ -2557,6 +2636,7 @@
|
|
|
2557
2636
|
flex: none;
|
|
2558
2637
|
color: var(--dim);
|
|
2559
2638
|
opacity: 0.7;
|
|
2639
|
+
transition: transform var(--dur-slow) var(--ease-out);
|
|
2560
2640
|
}
|
|
2561
2641
|
.hs-work-chevron[data-open='true'] {
|
|
2562
2642
|
transform: rotate(90deg);
|
|
@@ -2742,10 +2822,13 @@
|
|
|
2742
2822
|
align-items: center;
|
|
2743
2823
|
gap: calc(var(--space) * 1.5);
|
|
2744
2824
|
}
|
|
2745
|
-
.hs-fork-origin, .hs-tail-mark {
|
|
2825
|
+
.hs-fork-origin, .hs-tail-mark, .hs-level-mark {
|
|
2746
2826
|
display: flex;
|
|
2747
2827
|
margin: var(--space) 0;
|
|
2748
2828
|
}
|
|
2829
|
+
.hs-level-mark[data-level='bypass'] .hs-thread-mark-text {
|
|
2830
|
+
color: var(--bad);
|
|
2831
|
+
}
|
|
2749
2832
|
.hs-compaction {
|
|
2750
2833
|
display: flex;
|
|
2751
2834
|
flex-direction: column;
|
|
@@ -2912,6 +2995,7 @@
|
|
|
2912
2995
|
display: flex;
|
|
2913
2996
|
gap: var(--space);
|
|
2914
2997
|
opacity: 0;
|
|
2998
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
2915
2999
|
}
|
|
2916
3000
|
.hs-chat-image:hover .hs-media-actions, .hs-chat-image:focus-within .hs-media-actions {
|
|
2917
3001
|
opacity: 1;
|
|
@@ -3000,9 +3084,64 @@
|
|
|
3000
3084
|
background: var(--hov);
|
|
3001
3085
|
color: var(--text);
|
|
3002
3086
|
}
|
|
3087
|
+
.hs-media-text {
|
|
3088
|
+
display: flex;
|
|
3089
|
+
flex-direction: column;
|
|
3090
|
+
width: min(100%, 36rem);
|
|
3091
|
+
border-radius: var(--r-card);
|
|
3092
|
+
background: var(--tipbg);
|
|
3093
|
+
border: var(--bw) solid var(--tipline);
|
|
3094
|
+
box-sizing: border-box;
|
|
3095
|
+
overflow: hidden;
|
|
3096
|
+
}
|
|
3097
|
+
.hs-media-text-head {
|
|
3098
|
+
display: flex;
|
|
3099
|
+
align-items: center;
|
|
3100
|
+
gap: calc(var(--space) * 2);
|
|
3101
|
+
padding: calc(var(--space) * 1.5) calc(var(--space) * 2) calc(var(--space) * 1.5) calc(var(--space) * 2.5);
|
|
3102
|
+
color: var(--mut);
|
|
3103
|
+
}
|
|
3104
|
+
.hs-media-text-name {
|
|
3105
|
+
flex: 1;
|
|
3106
|
+
min-width: 0;
|
|
3107
|
+
overflow: hidden;
|
|
3108
|
+
text-overflow: ellipsis;
|
|
3109
|
+
white-space: nowrap;
|
|
3110
|
+
font-size: var(--fs-body);
|
|
3111
|
+
color: var(--text);
|
|
3112
|
+
}
|
|
3113
|
+
.hs-media-text-save {
|
|
3114
|
+
display: grid;
|
|
3115
|
+
place-items: center;
|
|
3116
|
+
width: calc(var(--space) * 6.5);
|
|
3117
|
+
height: calc(var(--space) * 6.5);
|
|
3118
|
+
flex: none;
|
|
3119
|
+
border-radius: var(--r-ctl);
|
|
3120
|
+
color: var(--mut);
|
|
3121
|
+
cursor: pointer;
|
|
3122
|
+
}
|
|
3123
|
+
.hs-media-text-save:hover {
|
|
3124
|
+
background: var(--hov);
|
|
3125
|
+
color: var(--text);
|
|
3126
|
+
}
|
|
3127
|
+
.hs-media-text-body {
|
|
3128
|
+
max-height: 16rem;
|
|
3129
|
+
padding: 0 calc(var(--space) * 2.5) calc(var(--space) * 2);
|
|
3130
|
+
font-size: var(--fs-body);
|
|
3131
|
+
line-height: 1.5;
|
|
3132
|
+
white-space: pre-wrap;
|
|
3133
|
+
overflow-wrap: anywhere;
|
|
3134
|
+
color: var(--text);
|
|
3135
|
+
}
|
|
3003
3136
|
.hs-md-link {
|
|
3004
3137
|
cursor: pointer;
|
|
3005
3138
|
}
|
|
3139
|
+
.hs-md[data-streaming='blocks'] > * {
|
|
3140
|
+
transition: opacity var(--dur-arrive) var(--ease-out);
|
|
3141
|
+
@starting-style {
|
|
3142
|
+
opacity: 0;
|
|
3143
|
+
}
|
|
3144
|
+
}
|
|
3006
3145
|
.hs-md-picture {
|
|
3007
3146
|
display: block;
|
|
3008
3147
|
max-width: min(100%, 30rem);
|
|
@@ -3055,6 +3194,7 @@
|
|
|
3055
3194
|
height: 100%;
|
|
3056
3195
|
border-radius: inherit;
|
|
3057
3196
|
background: var(--mut);
|
|
3197
|
+
transition: width var(--dur-slow) var(--ease-out);
|
|
3058
3198
|
}
|
|
3059
3199
|
.hs-chip[data-tone] {
|
|
3060
3200
|
display: inline-flex;
|
|
@@ -3525,6 +3665,11 @@
|
|
|
3525
3665
|
background: var(--hov);
|
|
3526
3666
|
color: var(--text);
|
|
3527
3667
|
}
|
|
3668
|
+
.hs-chip[data-sel] {
|
|
3669
|
+
display: inline-flex;
|
|
3670
|
+
align-items: center;
|
|
3671
|
+
gap: calc(var(--space) * 1.25);
|
|
3672
|
+
}
|
|
3528
3673
|
.hs-chip[data-sel='true'] {
|
|
3529
3674
|
background: var(--hov);
|
|
3530
3675
|
border-color: var(--tipline);
|
|
@@ -3588,6 +3733,55 @@
|
|
|
3588
3733
|
width: 0;
|
|
3589
3734
|
overflow: hidden;
|
|
3590
3735
|
}
|
|
3736
|
+
.hs-tour {
|
|
3737
|
+
position: fixed;
|
|
3738
|
+
inset: 0;
|
|
3739
|
+
z-index: 80;
|
|
3740
|
+
}
|
|
3741
|
+
.hs-tour-part {
|
|
3742
|
+
position: fixed;
|
|
3743
|
+
border-radius: var(--r-card);
|
|
3744
|
+
box-shadow: var(--scrim-tour);
|
|
3745
|
+
pointer-events: none;
|
|
3746
|
+
transition: top var(--dur-slow) var(--ease-out), left var(--dur-slow) var(--ease-out), width var(--dur-slow) var(--ease-out), height var(--dur-slow) var(--ease-out);
|
|
3747
|
+
}
|
|
3748
|
+
.hs-tour-card {
|
|
3749
|
+
position: fixed;
|
|
3750
|
+
display: flex;
|
|
3751
|
+
flex-direction: column;
|
|
3752
|
+
gap: var(--gap-stack);
|
|
3753
|
+
width: calc(var(--space) * 80);
|
|
3754
|
+
padding: var(--pad-card);
|
|
3755
|
+
box-sizing: border-box;
|
|
3756
|
+
border: var(--bw) solid var(--tipline);
|
|
3757
|
+
border-radius: var(--r-tile);
|
|
3758
|
+
background: var(--plate-menu);
|
|
3759
|
+
box-shadow: var(--gloss-edge), var(--shadow-modal);
|
|
3760
|
+
backdrop-filter: var(--blur-overlay);
|
|
3761
|
+
-webkit-backdrop-filter: var(--blur-overlay);
|
|
3762
|
+
}
|
|
3763
|
+
.hs-tour-card[data-placed='false'] {
|
|
3764
|
+
visibility: hidden;
|
|
3765
|
+
}
|
|
3766
|
+
.hs-tour-title {
|
|
3767
|
+
font-size: var(--fs-md);
|
|
3768
|
+
font-weight: var(--fw-strong);
|
|
3769
|
+
color: var(--text);
|
|
3770
|
+
}
|
|
3771
|
+
.hs-tour-text {
|
|
3772
|
+
font-size: var(--fs-body);
|
|
3773
|
+
line-height: var(--lh-body);
|
|
3774
|
+
color: var(--mut);
|
|
3775
|
+
}
|
|
3776
|
+
.hs-tour-actions {
|
|
3777
|
+
display: flex;
|
|
3778
|
+
align-items: center;
|
|
3779
|
+
gap: var(--gap-inline);
|
|
3780
|
+
margin-top: var(--space);
|
|
3781
|
+
}
|
|
3782
|
+
.hs-tour-fill {
|
|
3783
|
+
flex: 1;
|
|
3784
|
+
}
|
|
3591
3785
|
.hs-confirm {
|
|
3592
3786
|
inset: 0;
|
|
3593
3787
|
z-index: 70;
|
|
@@ -3943,6 +4137,12 @@
|
|
|
3943
4137
|
inset: 0;
|
|
3944
4138
|
border-radius: 0;
|
|
3945
4139
|
}
|
|
4140
|
+
.hs-view-frame:is([data-mode='overlay'], [data-mode='popover']) {
|
|
4141
|
+
position: absolute;
|
|
4142
|
+
inset: 0;
|
|
4143
|
+
border-radius: 0;
|
|
4144
|
+
background: transparent;
|
|
4145
|
+
}
|
|
3946
4146
|
.hs-view-frame[data-mode='modal'] {
|
|
3947
4147
|
flex: 1;
|
|
3948
4148
|
min-height: 0;
|
|
@@ -3988,6 +4188,7 @@
|
|
|
3988
4188
|
width: 100%;
|
|
3989
4189
|
border: 0;
|
|
3990
4190
|
background: transparent;
|
|
4191
|
+
color-scheme: light dark;
|
|
3991
4192
|
}
|
|
3992
4193
|
.hs-view-sheet {
|
|
3993
4194
|
position: absolute;
|
|
@@ -4033,12 +4234,6 @@
|
|
|
4033
4234
|
width: 0;
|
|
4034
4235
|
height: 0;
|
|
4035
4236
|
}
|
|
4036
|
-
.hs-menu-position::before {
|
|
4037
|
-
content: '';
|
|
4038
|
-
position: absolute;
|
|
4039
|
-
inset: calc(var(--space) * -3);
|
|
4040
|
-
z-index: -1;
|
|
4041
|
-
}
|
|
4042
4237
|
.hs-menu-position > .hs-menu-surface {
|
|
4043
4238
|
overflow-y: auto;
|
|
4044
4239
|
overscroll-behavior: contain;
|
|
@@ -4080,7 +4275,7 @@
|
|
|
4080
4275
|
padding: calc(var(--space) * 0.5) calc(var(--space) * 1.5);
|
|
4081
4276
|
border-radius: var(--r-pill);
|
|
4082
4277
|
background: var(--hov);
|
|
4083
|
-
font-size: var(--fs-
|
|
4278
|
+
font-size: var(--fs-cap);
|
|
4084
4279
|
color: var(--mut);
|
|
4085
4280
|
}
|
|
4086
4281
|
.hs-menu-chip {
|
|
@@ -4115,6 +4310,7 @@
|
|
|
4115
4310
|
flex-direction: row;
|
|
4116
4311
|
gap: calc(var(--space) * 2);
|
|
4117
4312
|
padding: calc(var(--space) * 2) calc(var(--space) * 2.75);
|
|
4313
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
4118
4314
|
}
|
|
4119
4315
|
html.hs-view .hs-tooltip {
|
|
4120
4316
|
background: var(--plate-menu);
|
|
@@ -4308,7 +4504,7 @@
|
|
|
4308
4504
|
display: flex;
|
|
4309
4505
|
flex-direction: column;
|
|
4310
4506
|
gap: calc(var(--space) * 1.25);
|
|
4311
|
-
padding-right: var(--
|
|
4507
|
+
padding-right: var(--pad-sidebar);
|
|
4312
4508
|
padding-bottom: calc(var(--space) * 19);
|
|
4313
4509
|
-webkit-mask-image: linear-gradient( 180deg, #000 calc(100% - var(--space) * 19), transparent calc(100% - var(--space) * 3.5) );
|
|
4314
4510
|
mask-image: linear-gradient( 180deg, #000 calc(100% - var(--space) * 19), transparent calc(100% - var(--space) * 3.5) );
|
|
@@ -4442,15 +4638,47 @@
|
|
|
4442
4638
|
height: var(--h-lane);
|
|
4443
4639
|
cursor: pointer;
|
|
4444
4640
|
color: var(--capt);
|
|
4641
|
+
transition: color var(--dur) var(--ease-out);
|
|
4445
4642
|
}
|
|
4446
4643
|
.hs-caption-button:hover {
|
|
4447
4644
|
color: var(--text);
|
|
4448
4645
|
background: var(--hov);
|
|
4449
4646
|
}
|
|
4450
4647
|
.hs-caption-button[data-danger='true']:hover {
|
|
4451
|
-
color:
|
|
4648
|
+
color: var(--capt-close-ink);
|
|
4452
4649
|
background: var(--capt-close);
|
|
4453
4650
|
}
|
|
4651
|
+
.hs-server-picture, .hs-apps-picture {
|
|
4652
|
+
position: relative;
|
|
4653
|
+
width: 100%;
|
|
4654
|
+
height: 100%;
|
|
4655
|
+
color: var(--picture-ink);
|
|
4656
|
+
}
|
|
4657
|
+
.hs-apps-picture {
|
|
4658
|
+
overflow: hidden;
|
|
4659
|
+
}
|
|
4660
|
+
.hs-picture-mesh {
|
|
4661
|
+
position: absolute;
|
|
4662
|
+
inset: 0;
|
|
4663
|
+
}
|
|
4664
|
+
.hs-heatmap-picture {
|
|
4665
|
+
width: 100%;
|
|
4666
|
+
height: 100%;
|
|
4667
|
+
}
|
|
4668
|
+
.hs-picture-tile {
|
|
4669
|
+
display: grid;
|
|
4670
|
+
place-items: center;
|
|
4671
|
+
border: var(--bw) solid var(--picture-rim);
|
|
4672
|
+
border-radius: var(--r-icon);
|
|
4673
|
+
background: var(--picture-film);
|
|
4674
|
+
box-shadow: var(--picture-gloss);
|
|
4675
|
+
backdrop-filter: var(--blur-film);
|
|
4676
|
+
-webkit-backdrop-filter: var(--blur-film);
|
|
4677
|
+
}
|
|
4678
|
+
.hs-picture-line {
|
|
4679
|
+
height: var(--bw);
|
|
4680
|
+
background: var(--picture-line);
|
|
4681
|
+
}
|
|
4454
4682
|
.hs-caption-glyph {
|
|
4455
4683
|
flex: 1;
|
|
4456
4684
|
display: grid;
|
|
@@ -4461,6 +4689,16 @@
|
|
|
4461
4689
|
.hs-caption-glyph[data-hovered='true'] {
|
|
4462
4690
|
color: var(--text);
|
|
4463
4691
|
}
|
|
4692
|
+
.hs-caption-rule {
|
|
4693
|
+
position: absolute;
|
|
4694
|
+
top: calc((var(--h-lane) - var(--h-lane-rule)) / 2);
|
|
4695
|
+
left: calc(var(--gap-tile) / -2);
|
|
4696
|
+
width: var(--bw);
|
|
4697
|
+
height: var(--h-lane-rule);
|
|
4698
|
+
background: var(--tipline);
|
|
4699
|
+
opacity: var(--lane-rule-alpha);
|
|
4700
|
+
transform: translateX(-50%);
|
|
4701
|
+
}
|
|
4464
4702
|
.hs-sheet-button[data-strong='true'] {
|
|
4465
4703
|
font-weight: var(--fw-semi);
|
|
4466
4704
|
}
|
|
@@ -4524,17 +4762,27 @@
|
|
|
4524
4762
|
width: calc(var(--space) * 16.5);
|
|
4525
4763
|
height: calc(var(--space) * 16.5);
|
|
4526
4764
|
border-radius: var(--r-round);
|
|
4527
|
-
box-shadow:
|
|
4765
|
+
box-shadow: var(--shadow-orb), var(--shadow-orb-lift);
|
|
4528
4766
|
cursor: pointer;
|
|
4529
4767
|
flex: none;
|
|
4530
4768
|
}
|
|
4531
4769
|
.hs-orb[data-sel='true'] {
|
|
4532
|
-
box-shadow:
|
|
4770
|
+
box-shadow: var(--shadow-orb), 0 0 0 5px var(--card);
|
|
4533
4771
|
cursor: auto;
|
|
4534
4772
|
}
|
|
4535
|
-
.hs-
|
|
4773
|
+
.hs-orb[data-sel='true']::after {
|
|
4774
|
+
content: '';
|
|
4536
4775
|
position: absolute;
|
|
4537
|
-
|
|
4776
|
+
inset: calc(var(--space) * -1.75);
|
|
4777
|
+
padding: calc(var(--space) * 0.5);
|
|
4778
|
+
border-radius: var(--r-round);
|
|
4779
|
+
background: var(--mark-grad);
|
|
4780
|
+
mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
|
|
4781
|
+
pointer-events: none;
|
|
4782
|
+
}
|
|
4783
|
+
.hs-colourway-check, .hs-colourway-custom-check {
|
|
4784
|
+
position: absolute;
|
|
4785
|
+
right: calc(var(--space) * -0.75);
|
|
4538
4786
|
bottom: calc(var(--space) * -0.75);
|
|
4539
4787
|
display: grid;
|
|
4540
4788
|
place-items: center;
|
|
@@ -4596,7 +4844,7 @@
|
|
|
4596
4844
|
margin-left: calc(var(--space) * -0.75);
|
|
4597
4845
|
border-radius: var(--r-pill);
|
|
4598
4846
|
background: var(--win);
|
|
4599
|
-
box-shadow:
|
|
4847
|
+
box-shadow: var(--ring-marker);
|
|
4600
4848
|
}
|
|
4601
4849
|
.hs-colour-editor {
|
|
4602
4850
|
display: flex;
|
|
@@ -4851,7 +5099,7 @@
|
|
|
4851
5099
|
inset: 0;
|
|
4852
5100
|
z-index: 1;
|
|
4853
5101
|
border: 0;
|
|
4854
|
-
background:
|
|
5102
|
+
background: var(--page-ground);
|
|
4855
5103
|
visibility: hidden;
|
|
4856
5104
|
}
|
|
4857
5105
|
.hs-tab-page[data-placed='true'] {
|
|
@@ -4861,6 +5109,16 @@
|
|
|
4861
5109
|
z-index: auto;
|
|
4862
5110
|
pointer-events: none;
|
|
4863
5111
|
}
|
|
5112
|
+
.hs-page-failed {
|
|
5113
|
+
position: absolute;
|
|
5114
|
+
inset: 0;
|
|
5115
|
+
z-index: 1;
|
|
5116
|
+
background: var(--win);
|
|
5117
|
+
}
|
|
5118
|
+
.hs-page-failed[data-covered='true'] {
|
|
5119
|
+
z-index: auto;
|
|
5120
|
+
pointer-events: none;
|
|
5121
|
+
}
|
|
4864
5122
|
.hs-main-view[data-web='true'] > .hs-view-frame {
|
|
4865
5123
|
background: transparent;
|
|
4866
5124
|
}
|
|
@@ -4923,8 +5181,6 @@
|
|
|
4923
5181
|
left: 0;
|
|
4924
5182
|
top: calc(var(--space) * 7.5);
|
|
4925
5183
|
z-index: 40;
|
|
4926
|
-
padding: calc(var(--space) * 2.5);
|
|
4927
|
-
margin: calc(var(--space) * -2.5);
|
|
4928
5184
|
}
|
|
4929
5185
|
.hs-document-refusal {
|
|
4930
5186
|
flex: 1;
|
|
@@ -5123,6 +5379,17 @@
|
|
|
5123
5379
|
height: 1em;
|
|
5124
5380
|
line-height: 1;
|
|
5125
5381
|
}
|
|
5382
|
+
.hs-icon:is(.hs-glyph-side-wide, .hs-glyph-side-narrow) {
|
|
5383
|
+
background: currentColor;
|
|
5384
|
+
}
|
|
5385
|
+
.hs-icon.hs-glyph-side-wide {
|
|
5386
|
+
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0.67 0.67 18.67 18.67'%3E%3Cpath fill-rule='evenodd' d='M3 3.5h14v13H3v-13Zm5.2 1.7v9.6h7.1V5.2H8.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
|
|
5387
|
+
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0.67 0.67 18.67 18.67'%3E%3Cpath fill-rule='evenodd' d='M3 3.5h14v13H3v-13Zm5.2 1.7v9.6h7.1V5.2H8.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
|
|
5388
|
+
}
|
|
5389
|
+
.hs-icon.hs-glyph-side-narrow {
|
|
5390
|
+
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0.67 0.67 18.67 18.67'%3E%3Cpath fill-rule='evenodd' d='M3 3.5h14v13H3v-13Zm3.2 1.7v9.6h9.1V5.2H6.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
|
|
5391
|
+
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0.67 0.67 18.67 18.67'%3E%3Cpath fill-rule='evenodd' d='M3 3.5h14v13H3v-13Zm3.2 1.7v9.6h9.1V5.2H6.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
|
|
5392
|
+
}
|
|
5126
5393
|
.hs-shell[data-theme='dark'] .hs-light-only, .hs-shell[data-theme='light'] .hs-dark-only {
|
|
5127
5394
|
display: none;
|
|
5128
5395
|
}
|
|
@@ -5143,6 +5410,7 @@
|
|
|
5143
5410
|
text-decoration: none;
|
|
5144
5411
|
cursor: pointer;
|
|
5145
5412
|
user-select: none;
|
|
5413
|
+
transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
5146
5414
|
}
|
|
5147
5415
|
.hs-button[data-size='md'] {
|
|
5148
5416
|
height: var(--h-ctl-md);
|
|
@@ -5182,6 +5450,16 @@
|
|
|
5182
5450
|
background: var(--hov);
|
|
5183
5451
|
color: var(--text);
|
|
5184
5452
|
}
|
|
5453
|
+
.hs-button:is( [data-variant='secondary'], [data-variant='danger'], [data-variant='ghost'] ):active:not(:disabled) {
|
|
5454
|
+
background: var(--press);
|
|
5455
|
+
}
|
|
5456
|
+
.hs-button:focus-visible {
|
|
5457
|
+
outline: none;
|
|
5458
|
+
box-shadow: var(--focus);
|
|
5459
|
+
}
|
|
5460
|
+
.hs-button:is([data-variant='secondary'], [data-variant='danger']):focus-visible {
|
|
5461
|
+
box-shadow: var(--gloss-edge), var(--focus);
|
|
5462
|
+
}
|
|
5185
5463
|
.hs-button[data-variant='primary'] {
|
|
5186
5464
|
position: relative;
|
|
5187
5465
|
overflow: hidden;
|
|
@@ -5190,9 +5468,18 @@
|
|
|
5190
5468
|
background: var(--accent-sheen), var(--accent-grad);
|
|
5191
5469
|
box-shadow: var(--accent-bevel), var(--accent-glow);
|
|
5192
5470
|
}
|
|
5471
|
+
.hs-button[data-variant='primary']:disabled {
|
|
5472
|
+
box-shadow: var(--accent-bevel);
|
|
5473
|
+
}
|
|
5193
5474
|
.hs-button[data-variant='primary']:hover:not(:disabled) {
|
|
5194
5475
|
filter: brightness(1.05);
|
|
5195
5476
|
}
|
|
5477
|
+
.hs-button[data-variant='primary']:active:not(:disabled) {
|
|
5478
|
+
filter: brightness(0.95);
|
|
5479
|
+
}
|
|
5480
|
+
.hs-button[data-variant='primary']:focus-visible {
|
|
5481
|
+
box-shadow: var(--accent-bevel), var(--accent-glow), var(--focus);
|
|
5482
|
+
}
|
|
5196
5483
|
.hs-button[data-variant='primary']::before {
|
|
5197
5484
|
content: '';
|
|
5198
5485
|
position: absolute;
|
|
@@ -5231,6 +5518,14 @@
|
|
|
5231
5518
|
background: var(--hov);
|
|
5232
5519
|
color: var(--text);
|
|
5233
5520
|
}
|
|
5521
|
+
.hs-icon-button:active:not(:disabled) {
|
|
5522
|
+
background: var(--press);
|
|
5523
|
+
color: var(--text);
|
|
5524
|
+
}
|
|
5525
|
+
.hs-icon-button:focus-visible {
|
|
5526
|
+
outline: none;
|
|
5527
|
+
box-shadow: var(--focus);
|
|
5528
|
+
}
|
|
5234
5529
|
.hs-icon-button:disabled {
|
|
5235
5530
|
opacity: 0.4;
|
|
5236
5531
|
cursor: default;
|
|
@@ -5293,6 +5588,16 @@
|
|
|
5293
5588
|
padding: calc(var(--space) * 4.5) calc(var(--space) * 5) calc(var(--space) * 1.5);
|
|
5294
5589
|
font-size: var(--fs-md);
|
|
5295
5590
|
}
|
|
5591
|
+
.hs-report-exact {
|
|
5592
|
+
display: flex;
|
|
5593
|
+
flex-direction: column;
|
|
5594
|
+
align-items: flex-start;
|
|
5595
|
+
gap: calc(var(--space) * 2);
|
|
5596
|
+
margin: calc(var(--space) * 3) 0;
|
|
5597
|
+
}
|
|
5598
|
+
.hs-report-exact > :not(button) {
|
|
5599
|
+
align-self: stretch;
|
|
5600
|
+
}
|
|
5296
5601
|
.hs-notice {
|
|
5297
5602
|
display: inline-flex;
|
|
5298
5603
|
flex-wrap: wrap;
|
|
@@ -5304,6 +5609,44 @@
|
|
|
5304
5609
|
font-size: var(--fs-row);
|
|
5305
5610
|
color: var(--mut);
|
|
5306
5611
|
}
|
|
5612
|
+
html.hs-view-window-page, html.hs-view-window-page > body {
|
|
5613
|
+
margin: 0;
|
|
5614
|
+
overflow: hidden;
|
|
5615
|
+
background: transparent;
|
|
5616
|
+
}
|
|
5617
|
+
.hs-shell.hs-view-window {
|
|
5618
|
+
position: fixed;
|
|
5619
|
+
inset: 0;
|
|
5620
|
+
background: transparent;
|
|
5621
|
+
}
|
|
5622
|
+
.hs-shell.hs-overlay-page {
|
|
5623
|
+
padding: calc(var(--space) * 3);
|
|
5624
|
+
background: transparent;
|
|
5625
|
+
}
|
|
5626
|
+
.hs-overlay-note {
|
|
5627
|
+
display: flex;
|
|
5628
|
+
flex-direction: column;
|
|
5629
|
+
gap: var(--space);
|
|
5630
|
+
padding: calc(var(--space) * 2.75) calc(var(--space) * 3.5);
|
|
5631
|
+
border: var(--bw) solid var(--line);
|
|
5632
|
+
border-radius: var(--r-card);
|
|
5633
|
+
background: var(--win);
|
|
5634
|
+
box-shadow: var(--shadow-pop);
|
|
5635
|
+
color: var(--text);
|
|
5636
|
+
font-size: var(--fs-row);
|
|
5637
|
+
cursor: default;
|
|
5638
|
+
user-select: none;
|
|
5639
|
+
}
|
|
5640
|
+
.hs-overlay-note-title {
|
|
5641
|
+
font-weight: var(--fw-semi);
|
|
5642
|
+
}
|
|
5643
|
+
.hs-overlay-note-text {
|
|
5644
|
+
max-height: calc(var(--space) * 60);
|
|
5645
|
+
overflow: hidden;
|
|
5646
|
+
line-height: var(--lh-body);
|
|
5647
|
+
white-space: pre-wrap;
|
|
5648
|
+
overflow-wrap: anywhere;
|
|
5649
|
+
}
|
|
5307
5650
|
.hs-chart, .hs-diagram {
|
|
5308
5651
|
margin-bottom: calc(var(--space) * 3.5);
|
|
5309
5652
|
padding: calc(var(--space) * 3) calc(var(--space) * 3.5);
|
|
@@ -5583,20 +5926,19 @@
|
|
|
5583
5926
|
justify-content: center;
|
|
5584
5927
|
flex: none;
|
|
5585
5928
|
overflow: hidden;
|
|
5586
|
-
border-radius: var(--r-
|
|
5929
|
+
border-radius: var(--r-icon);
|
|
5587
5930
|
color: var(--mut);
|
|
5588
|
-
background: var(--hov);
|
|
5589
5931
|
font-size: 0.8em;
|
|
5590
5932
|
}
|
|
5591
|
-
.hs-model-avatar:has(img) {
|
|
5592
|
-
background: var(--avatar-plate);
|
|
5593
|
-
}
|
|
5594
5933
|
.hs-model-avatar img {
|
|
5595
5934
|
display: block;
|
|
5596
5935
|
width: 100%;
|
|
5597
5936
|
height: 100%;
|
|
5598
5937
|
object-fit: contain;
|
|
5599
5938
|
}
|
|
5939
|
+
.hs-model-avatar:has(> .hs-model-avatar-initial) {
|
|
5940
|
+
background: var(--hov);
|
|
5941
|
+
}
|
|
5600
5942
|
.hs-model-avatar-initial {
|
|
5601
5943
|
text-transform: uppercase;
|
|
5602
5944
|
}
|
|
@@ -5748,6 +6090,7 @@
|
|
|
5748
6090
|
flex: none;
|
|
5749
6091
|
}
|
|
5750
6092
|
.hs-settings-card {
|
|
6093
|
+
--hov: var(--hov-plate);
|
|
5751
6094
|
display: flex;
|
|
5752
6095
|
flex-direction: column;
|
|
5753
6096
|
min-width: 0;
|
|
@@ -5760,6 +6103,9 @@
|
|
|
5760
6103
|
border: 0;
|
|
5761
6104
|
border-radius: 0;
|
|
5762
6105
|
}
|
|
6106
|
+
.hs-settings-card .hs-link-row:hover {
|
|
6107
|
+
background: var(--hov);
|
|
6108
|
+
}
|
|
5763
6109
|
.hs-settings-card > .hs-setrow:first-child {
|
|
5764
6110
|
border-top-left-radius: calc(var(--r-card) - var(--bw));
|
|
5765
6111
|
border-top-right-radius: calc(var(--r-card) - var(--bw));
|
|
@@ -6009,11 +6355,17 @@
|
|
|
6009
6355
|
.hs-docs-prose a.hs-docs-anchor {
|
|
6010
6356
|
display: inline-flex;
|
|
6011
6357
|
align-items: center;
|
|
6012
|
-
|
|
6358
|
+
width: 0;
|
|
6359
|
+
overflow: visible;
|
|
6013
6360
|
color: var(--dim);
|
|
6014
6361
|
opacity: 0;
|
|
6015
6362
|
vertical-align: middle;
|
|
6016
6363
|
text-decoration: none;
|
|
6364
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
6365
|
+
}
|
|
6366
|
+
.hs-docs-prose a.hs-docs-anchor > :is(svg, .hs-mask) {
|
|
6367
|
+
flex: none;
|
|
6368
|
+
margin-left: calc(var(--space) * 2);
|
|
6017
6369
|
}
|
|
6018
6370
|
.hs-docs-heading:hover .hs-docs-anchor, .hs-docs-prose a.hs-docs-anchor:focus-visible {
|
|
6019
6371
|
opacity: 1;
|
|
@@ -6149,13 +6501,14 @@
|
|
|
6149
6501
|
background: var(--hov);
|
|
6150
6502
|
color: var(--mut);
|
|
6151
6503
|
cursor: pointer;
|
|
6504
|
+
transition: opacity var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
6152
6505
|
}
|
|
6153
6506
|
.hs-docs-code-body > .hs-docs-code-copy {
|
|
6154
6507
|
position: absolute;
|
|
6155
6508
|
top: calc(var(--space) * 2);
|
|
6156
6509
|
right: calc(var(--space) * 2);
|
|
6157
6510
|
opacity: 0;
|
|
6158
|
-
backdrop-filter: blur
|
|
6511
|
+
backdrop-filter: var(--blur-copy);
|
|
6159
6512
|
}
|
|
6160
6513
|
.hs-docs-code-body:hover > .hs-docs-code-copy, .hs-docs-code-copy:focus-visible, .hs-docs-code-copy[data-copied='true'] {
|
|
6161
6514
|
opacity: 1;
|
|
@@ -6199,6 +6552,10 @@
|
|
|
6199
6552
|
.hs-docs-callout[data-type='idea'] {
|
|
6200
6553
|
--callout: var(--accent);
|
|
6201
6554
|
}
|
|
6555
|
+
.hs-docs-callout[data-type='idea'] .hs-docs-callout-rail {
|
|
6556
|
+
background: var(--mark-grad);
|
|
6557
|
+
opacity: 0.5;
|
|
6558
|
+
}
|
|
6202
6559
|
.hs-docs-callout-icon {
|
|
6203
6560
|
flex: none;
|
|
6204
6561
|
display: inline-flex;
|
|
@@ -6237,6 +6594,7 @@
|
|
|
6237
6594
|
background: var(--card);
|
|
6238
6595
|
color: var(--text);
|
|
6239
6596
|
text-decoration: none;
|
|
6597
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
6240
6598
|
}
|
|
6241
6599
|
.hs-docs-prose a.hs-docs-card {
|
|
6242
6600
|
color: var(--text);
|
|
@@ -6368,6 +6726,7 @@
|
|
|
6368
6726
|
}
|
|
6369
6727
|
.hs-docs-accordion summary svg {
|
|
6370
6728
|
color: var(--dim);
|
|
6729
|
+
transition: transform var(--dur) var(--ease-out);
|
|
6371
6730
|
}
|
|
6372
6731
|
.hs-docs-accordion[open] summary svg {
|
|
6373
6732
|
transform: rotate(90deg);
|
|
@@ -6405,6 +6764,7 @@
|
|
|
6405
6764
|
color: var(--text);
|
|
6406
6765
|
font-size: var(--fs-docs-note);
|
|
6407
6766
|
text-decoration: none;
|
|
6767
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
6408
6768
|
}
|
|
6409
6769
|
.hs-docs-pager-card:hover {
|
|
6410
6770
|
background: var(--btnhov);
|
|
@@ -6460,10 +6820,8 @@
|
|
|
6460
6820
|
.hs-market-hero:not([data-plate])::before {
|
|
6461
6821
|
background: radial-gradient(50% 70% at 22% 28%, var(--market-blob-1), transparent 70%), radial-gradient(45% 65% at 78% 18%, var(--market-blob-2), transparent 70%), radial-gradient(40% 55% at 62% 55%, var(--market-blob-3), transparent 70%), radial-gradient(50% 60% at 38% 60%, var(--market-blob-4), transparent 70%), linear-gradient(180deg, var(--market-wash-top), var(--market-wash-foot));
|
|
6462
6822
|
}
|
|
6463
|
-
.hs-market-hero[data-plate]::before, .hs-market-tile-plate {
|
|
6464
|
-
background: radial-gradient( 120% 90% at 80% 10%, oklch(0.85 0.12 calc(var(--hue) + 60) / 0.9), transparent 60% ), linear-gradient(160deg, oklch(0.72 0.13 var(--hue)), oklch(0.5 0.15 calc(var(--hue) + 40)));
|
|
6465
|
-
}
|
|
6466
6823
|
.hs-market-hero[data-plate]::before {
|
|
6824
|
+
background: radial-gradient( 120% 90% at 80% 10%, oklch(0.85 0.12 calc(var(--hue) + 60) / 0.9), transparent 60% ), linear-gradient(160deg, oklch(0.72 0.13 var(--hue)), oklch(0.5 0.15 calc(var(--hue) + 40)));
|
|
6467
6825
|
filter: brightness(var(--market-hero-brightness));
|
|
6468
6826
|
}
|
|
6469
6827
|
.hs-market-hero[data-plate] .hs-market-title, .hs-market-hero[data-plate] .hs-market-lead {
|
|
@@ -6473,6 +6831,13 @@
|
|
|
6473
6831
|
display: flex;
|
|
6474
6832
|
flex-direction: column;
|
|
6475
6833
|
gap: calc(var(--space) * 4.5);
|
|
6834
|
+
animation: hsMarketSettle calc(var(--dur) * 2) var(--ease-out);
|
|
6835
|
+
}
|
|
6836
|
+
@keyframes hsMarketSettle {
|
|
6837
|
+
from {
|
|
6838
|
+
opacity: 0;
|
|
6839
|
+
translate: 0 calc(var(--space) * 2);
|
|
6840
|
+
}
|
|
6476
6841
|
}
|
|
6477
6842
|
.hs-market-title {
|
|
6478
6843
|
margin: 0;
|
|
@@ -6530,6 +6895,7 @@
|
|
|
6530
6895
|
grid-template-columns: 0fr;
|
|
6531
6896
|
margin-right: 0;
|
|
6532
6897
|
opacity: 0;
|
|
6898
|
+
transition: grid-template-columns var(--dur) var(--ease-out), margin var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
6533
6899
|
}
|
|
6534
6900
|
.hs-market-menu-slot[data-shown] {
|
|
6535
6901
|
grid-template-columns: 1fr;
|
|
@@ -6540,6 +6906,7 @@
|
|
|
6540
6906
|
min-width: 0;
|
|
6541
6907
|
overflow: hidden;
|
|
6542
6908
|
white-space: nowrap;
|
|
6909
|
+
transition: padding var(--dur) var(--ease-out), border-width var(--dur) var(--ease-out), background-color var(--dur) var(--ease-out);
|
|
6543
6910
|
}
|
|
6544
6911
|
.hs-market-menu-slot:not([data-shown]) > .hs-market-menu-button {
|
|
6545
6912
|
padding: 0;
|
|
@@ -6562,6 +6929,7 @@
|
|
|
6562
6929
|
font: inherit;
|
|
6563
6930
|
color: var(--text);
|
|
6564
6931
|
cursor: pointer;
|
|
6932
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
6565
6933
|
}
|
|
6566
6934
|
.hs-market-menu-button > span {
|
|
6567
6935
|
color: var(--mut);
|
|
@@ -6601,8 +6969,6 @@
|
|
|
6601
6969
|
width: calc(var(--space) * 55);
|
|
6602
6970
|
}
|
|
6603
6971
|
.hs-market-toolbar .hs-chip {
|
|
6604
|
-
display: inline-flex;
|
|
6605
|
-
align-items: center;
|
|
6606
6972
|
height: var(--h-ctl);
|
|
6607
6973
|
padding: 0 calc(var(--space) * 2.25);
|
|
6608
6974
|
box-sizing: border-box;
|
|
@@ -6663,137 +7029,152 @@
|
|
|
6663
7029
|
display: none;
|
|
6664
7030
|
}
|
|
6665
7031
|
}
|
|
6666
|
-
.hs-market-
|
|
6667
|
-
|
|
6668
|
-
|
|
6669
|
-
|
|
6670
|
-
|
|
7032
|
+
.hs-market-feature {
|
|
7033
|
+
position: relative;
|
|
7034
|
+
overflow: hidden;
|
|
7035
|
+
border-radius: var(--r-card);
|
|
7036
|
+
isolation: isolate;
|
|
7037
|
+
box-shadow: var(--shadow-pop);
|
|
6671
7038
|
}
|
|
6672
|
-
.hs-market-
|
|
7039
|
+
.hs-market-feature-track {
|
|
7040
|
+
display: flex;
|
|
7041
|
+
overflow-x: auto;
|
|
7042
|
+
clip-path: inset(0 round var(--r-card));
|
|
7043
|
+
scroll-snap-type: x mandatory;
|
|
7044
|
+
overscroll-behavior-x: contain;
|
|
7045
|
+
}
|
|
7046
|
+
.hs-market-feature-track::-webkit-scrollbar {
|
|
7047
|
+
display: none;
|
|
7048
|
+
}
|
|
7049
|
+
.hs-market-feature-card {
|
|
6673
7050
|
position: relative;
|
|
6674
7051
|
display: flex;
|
|
6675
|
-
flex
|
|
6676
|
-
|
|
7052
|
+
flex: 0 0 100%;
|
|
7053
|
+
align-items: flex-end;
|
|
7054
|
+
aspect-ratio: var(--market-cover-ratio);
|
|
7055
|
+
min-height: calc(var(--space) * 100);
|
|
6677
7056
|
padding: 0;
|
|
6678
7057
|
overflow: hidden;
|
|
6679
|
-
border:
|
|
6680
|
-
border-radius: var(--r-card);
|
|
7058
|
+
border: 0;
|
|
6681
7059
|
background: var(--card);
|
|
6682
7060
|
font: inherit;
|
|
6683
7061
|
text-align: left;
|
|
6684
7062
|
text-decoration: none;
|
|
7063
|
+
scroll-snap-align: start;
|
|
6685
7064
|
isolation: isolate;
|
|
6686
7065
|
}
|
|
6687
|
-
.hs-shell .hs-market-
|
|
7066
|
+
.hs-shell .hs-market-feature-card, .hs-shell .hs-market-row {
|
|
6688
7067
|
color: var(--text);
|
|
6689
7068
|
cursor: pointer;
|
|
6690
7069
|
}
|
|
6691
|
-
.hs-market-
|
|
6692
|
-
|
|
6693
|
-
}
|
|
6694
|
-
.hs-market-tile:first-child {
|
|
6695
|
-
grid-row: span 2;
|
|
6696
|
-
}
|
|
6697
|
-
.hs-market-tile:nth-child(2):last-child {
|
|
6698
|
-
grid-row: span 2;
|
|
6699
|
-
}
|
|
6700
|
-
.hs-market-tile:only-child {
|
|
6701
|
-
grid-column: 1 / -1;
|
|
6702
|
-
}
|
|
6703
|
-
@media (width < 860px) {
|
|
6704
|
-
.hs-market-tiles {
|
|
6705
|
-
grid-template-columns: 1fr;
|
|
6706
|
-
grid-auto-rows: calc(var(--space) * 70);
|
|
6707
|
-
}
|
|
6708
|
-
.hs-market-tile:first-child, .hs-market-tile:nth-child(2):last-child {
|
|
6709
|
-
grid-row: auto;
|
|
6710
|
-
}
|
|
6711
|
-
.hs-market-tile:first-child .hs-market-tile-copy strong {
|
|
6712
|
-
font-size: var(--fs-market-tile);
|
|
6713
|
-
}
|
|
6714
|
-
.hs-market-tile:first-child .hs-market-tile-plate .hs-market-logo {
|
|
6715
|
-
translate: 0 calc(var(--space) * 9);
|
|
6716
|
-
scale: 0.7;
|
|
6717
|
-
}
|
|
7070
|
+
.hs-shell .hs-market-feature-card {
|
|
7071
|
+
color: var(--scrim-ink);
|
|
6718
7072
|
}
|
|
6719
|
-
.hs-market-
|
|
7073
|
+
.hs-market-feature-cover {
|
|
6720
7074
|
position: absolute;
|
|
6721
7075
|
inset: 0;
|
|
6722
7076
|
z-index: -1;
|
|
6723
7077
|
width: 100%;
|
|
6724
7078
|
height: 100%;
|
|
6725
7079
|
object-fit: cover;
|
|
6726
|
-
|
|
7080
|
+
transition: scale calc(var(--dur) * 4) var(--ease-out);
|
|
6727
7081
|
}
|
|
6728
|
-
.hs-market-
|
|
6729
|
-
|
|
6730
|
-
place-items: center;
|
|
7082
|
+
.hs-market-feature-card:hover .hs-market-feature-cover {
|
|
7083
|
+
scale: 1.02;
|
|
6731
7084
|
}
|
|
6732
|
-
.hs-market-
|
|
6733
|
-
|
|
6734
|
-
|
|
7085
|
+
.hs-market-feature-band {
|
|
7086
|
+
position: relative;
|
|
7087
|
+
display: flex;
|
|
7088
|
+
align-items: center;
|
|
7089
|
+
gap: calc(var(--space) * 5);
|
|
7090
|
+
width: 100%;
|
|
7091
|
+
padding: calc(var(--space) * 20) calc(var(--space) * 9) calc(var(--space) * 13);
|
|
6735
7092
|
}
|
|
6736
|
-
.hs-market-
|
|
6737
|
-
|
|
6738
|
-
|
|
7093
|
+
.hs-market-feature-band::before {
|
|
7094
|
+
content: '';
|
|
7095
|
+
position: absolute;
|
|
7096
|
+
inset: 0;
|
|
7097
|
+
z-index: -1;
|
|
7098
|
+
background: var(--scrim-feature);
|
|
7099
|
+
backdrop-filter: var(--blur-overlay);
|
|
7100
|
+
-webkit-backdrop-filter: var(--blur-overlay);
|
|
7101
|
+
mask-image: linear-gradient(to bottom, transparent, #000 60%);
|
|
7102
|
+
-webkit-mask-image: linear-gradient(to bottom, transparent, #000 60%);
|
|
6739
7103
|
}
|
|
6740
|
-
.hs-market-
|
|
6741
|
-
|
|
7104
|
+
.hs-market-feature-band .hs-market-logo {
|
|
7105
|
+
flex: none;
|
|
7106
|
+
box-shadow: var(--shadow-feature-logo);
|
|
6742
7107
|
}
|
|
6743
|
-
.hs-market-
|
|
7108
|
+
.hs-market-feature-copy {
|
|
6744
7109
|
display: flex;
|
|
7110
|
+
flex: 1;
|
|
6745
7111
|
flex-direction: column;
|
|
6746
|
-
gap: var(--space);
|
|
6747
|
-
|
|
6748
|
-
background: linear-gradient(to bottom, rgb(0 0 0 / 0.32), transparent);
|
|
6749
|
-
color: #fff;
|
|
6750
|
-
}
|
|
6751
|
-
.hs-market-tile-kind {
|
|
6752
|
-
font-size: var(--fs-sm);
|
|
6753
|
-
opacity: 0.8;
|
|
7112
|
+
gap: calc(var(--space) * 1.5);
|
|
7113
|
+
min-width: 0;
|
|
6754
7114
|
}
|
|
6755
|
-
.hs-market-
|
|
6756
|
-
font-size: var(--fs-market-
|
|
6757
|
-
line-height: 1.
|
|
7115
|
+
.hs-market-feature-copy strong {
|
|
7116
|
+
font-size: var(--fs-market-feature);
|
|
7117
|
+
line-height: 1.05;
|
|
6758
7118
|
font-weight: var(--fw-semi);
|
|
6759
7119
|
letter-spacing: -0.02em;
|
|
6760
7120
|
}
|
|
6761
|
-
.hs-market-
|
|
7121
|
+
.hs-market-feature-copy > span {
|
|
6762
7122
|
display: -webkit-box;
|
|
6763
7123
|
-webkit-box-orient: vertical;
|
|
6764
7124
|
-webkit-line-clamp: 2;
|
|
6765
|
-
max-width:
|
|
7125
|
+
max-width: 56ch;
|
|
6766
7126
|
overflow: hidden;
|
|
6767
|
-
font-size: var(--fs-
|
|
7127
|
+
font-size: var(--fs-market-line);
|
|
7128
|
+
line-height: 1.35;
|
|
6768
7129
|
opacity: 0.9;
|
|
6769
7130
|
}
|
|
6770
|
-
.hs-market-
|
|
6771
|
-
|
|
7131
|
+
.hs-market-feature .hs-market-view {
|
|
7132
|
+
padding: calc(var(--space) * 2.25) calc(var(--space) * 5.5);
|
|
7133
|
+
font-size: var(--fs-md);
|
|
6772
7134
|
}
|
|
6773
|
-
.hs-market-
|
|
7135
|
+
.hs-market-feature-dots {
|
|
7136
|
+
position: absolute;
|
|
7137
|
+
bottom: calc(var(--space) * 4);
|
|
7138
|
+
left: 50%;
|
|
6774
7139
|
display: flex;
|
|
6775
7140
|
align-items: center;
|
|
6776
|
-
gap: calc(var(--space) *
|
|
6777
|
-
padding: calc(var(--space) *
|
|
6778
|
-
|
|
6779
|
-
|
|
6780
|
-
|
|
6781
|
-
|
|
6782
|
-
|
|
6783
|
-
}
|
|
6784
|
-
.hs-market-
|
|
6785
|
-
|
|
6786
|
-
|
|
6787
|
-
|
|
6788
|
-
|
|
6789
|
-
|
|
6790
|
-
|
|
7141
|
+
gap: calc(var(--space) * 2);
|
|
7142
|
+
padding: calc(var(--space) * 2) calc(var(--space) * 3);
|
|
7143
|
+
border-radius: var(--r-pill);
|
|
7144
|
+
background: var(--glass-on-dark);
|
|
7145
|
+
backdrop-filter: var(--blur-glass);
|
|
7146
|
+
-webkit-backdrop-filter: var(--blur-glass);
|
|
7147
|
+
translate: -50% 0;
|
|
7148
|
+
}
|
|
7149
|
+
.hs-market-feature-dots button {
|
|
7150
|
+
width: calc(var(--space) * 1.75);
|
|
7151
|
+
height: calc(var(--space) * 1.75);
|
|
7152
|
+
padding: 0;
|
|
7153
|
+
border: 0;
|
|
7154
|
+
border-radius: var(--r-pill);
|
|
7155
|
+
background: var(--scrim-ink);
|
|
7156
|
+
opacity: 0.4;
|
|
7157
|
+
cursor: pointer;
|
|
7158
|
+
transition: width var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
6791
7159
|
}
|
|
6792
|
-
.hs-market-
|
|
6793
|
-
|
|
7160
|
+
.hs-market-feature-dots button[aria-current] {
|
|
7161
|
+
width: calc(var(--space) * 5);
|
|
7162
|
+
opacity: 1;
|
|
6794
7163
|
}
|
|
6795
|
-
|
|
6796
|
-
|
|
7164
|
+
@media (width < 760px) {
|
|
7165
|
+
.hs-market-feature-card {
|
|
7166
|
+
aspect-ratio: 4 / 5;
|
|
7167
|
+
}
|
|
7168
|
+
.hs-market-feature-band {
|
|
7169
|
+
flex-wrap: wrap;
|
|
7170
|
+
padding: calc(var(--space) * 16) calc(var(--space) * 5) calc(var(--space) * 13);
|
|
7171
|
+
}
|
|
7172
|
+
.hs-market-feature-band .hs-market-logo {
|
|
7173
|
+
display: none;
|
|
7174
|
+
}
|
|
7175
|
+
.hs-market-feature-copy {
|
|
7176
|
+
flex-basis: 100%;
|
|
7177
|
+
}
|
|
6797
7178
|
}
|
|
6798
7179
|
.hs-market-view {
|
|
6799
7180
|
flex: none;
|
|
@@ -6828,6 +7209,7 @@
|
|
|
6828
7209
|
font: inherit;
|
|
6829
7210
|
text-align: left;
|
|
6830
7211
|
text-decoration: none;
|
|
7212
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
6831
7213
|
}
|
|
6832
7214
|
.hs-market-row:hover {
|
|
6833
7215
|
background: var(--hov);
|
|
@@ -6889,18 +7271,16 @@
|
|
|
6889
7271
|
@supports (color: color-mix(in lab, red, red)) {
|
|
6890
7272
|
background: color-mix(in srgb, var(--card) 55%, transparent);
|
|
6891
7273
|
}
|
|
6892
|
-
box-shadow:
|
|
7274
|
+
box-shadow: var(--shadow-logo);
|
|
6893
7275
|
color: var(--mut);
|
|
6894
|
-
|
|
6895
|
-
.hs-shell[data-theme='dark'] .hs-market-logo {
|
|
6896
|
-
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), inset 0 0 0 1px rgba(255, 255, 255, 0.12), inset 0 -1px 0 rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3), 0 0.3em 0.9em rgba(0, 0, 0, 0.32);
|
|
7276
|
+
transition: transform calc(var(--dur) * 3) var(--ease-out);
|
|
6897
7277
|
}
|
|
6898
7278
|
.hs-market-logo::after {
|
|
6899
7279
|
content: '';
|
|
6900
7280
|
position: absolute;
|
|
6901
7281
|
inset: 0;
|
|
6902
7282
|
border-radius: inherit;
|
|
6903
|
-
background:
|
|
7283
|
+
background: var(--gloss-logo);
|
|
6904
7284
|
pointer-events: none;
|
|
6905
7285
|
}
|
|
6906
7286
|
.hs-market-banner-body > .hs-market-logo:hover {
|
|
@@ -6908,8 +7288,7 @@
|
|
|
6908
7288
|
}
|
|
6909
7289
|
.hs-market-logo img {
|
|
6910
7290
|
display: block;
|
|
6911
|
-
|
|
6912
|
-
height: 100%;
|
|
7291
|
+
border-radius: var(--r-icon);
|
|
6913
7292
|
object-fit: cover;
|
|
6914
7293
|
}
|
|
6915
7294
|
.hs-app-icon {
|
|
@@ -6958,6 +7337,7 @@
|
|
|
6958
7337
|
mask-composite: intersect;
|
|
6959
7338
|
-webkit-mask-composite: source-in;
|
|
6960
7339
|
pointer-events: none;
|
|
7340
|
+
transition: opacity calc(var(--dur) * 4) var(--ease-out);
|
|
6961
7341
|
}
|
|
6962
7342
|
.hs-market-banner-art[data-shown] {
|
|
6963
7343
|
opacity: 1;
|
|
@@ -7128,31 +7508,27 @@
|
|
|
7128
7508
|
height: calc(var(--space) * 65);
|
|
7129
7509
|
}
|
|
7130
7510
|
}
|
|
7131
|
-
.hs-shell .hs-market-
|
|
7511
|
+
.hs-shell .hs-market-turn {
|
|
7132
7512
|
position: absolute;
|
|
7133
|
-
top:
|
|
7513
|
+
top: 50%;
|
|
7134
7514
|
display: grid;
|
|
7135
7515
|
place-items: center;
|
|
7136
7516
|
width: calc(var(--space) * 10);
|
|
7137
7517
|
height: calc(var(--space) * 10);
|
|
7138
7518
|
padding: 0;
|
|
7139
|
-
|
|
7519
|
+
translate: 0 -50%;
|
|
7140
7520
|
opacity: 0;
|
|
7521
|
+
cursor: pointer;
|
|
7522
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
7141
7523
|
}
|
|
7142
|
-
.hs-market-shots-wrap:hover .hs-market-
|
|
7524
|
+
.hs-market-shots-wrap:hover .hs-market-turn, .hs-market-feature:hover .hs-market-turn, .hs-market-turn:focus-visible {
|
|
7143
7525
|
opacity: 1;
|
|
7144
7526
|
}
|
|
7145
|
-
.hs-market-
|
|
7146
|
-
left: calc(var(--space) *
|
|
7147
|
-
}
|
|
7148
|
-
.hs-market-shots-arrow[data-side='start'] svg {
|
|
7149
|
-
rotate: 90deg;
|
|
7150
|
-
}
|
|
7151
|
-
.hs-market-shots-arrow[data-side='end'] {
|
|
7152
|
-
right: calc(var(--space) * 3);
|
|
7527
|
+
.hs-market-turn[data-side='start'] {
|
|
7528
|
+
left: calc(var(--space) * 4);
|
|
7153
7529
|
}
|
|
7154
|
-
.hs-market-
|
|
7155
|
-
|
|
7530
|
+
.hs-market-turn[data-side='end'] {
|
|
7531
|
+
right: calc(var(--space) * 4);
|
|
7156
7532
|
}
|
|
7157
7533
|
.hs-market-part {
|
|
7158
7534
|
display: flex;
|
|
@@ -7323,6 +7699,46 @@
|
|
|
7323
7699
|
.hs-shell .hs-market-get:hover {
|
|
7324
7700
|
color: var(--mut);
|
|
7325
7701
|
}
|
|
7702
|
+
.hs-market-rate {
|
|
7703
|
+
display: inline-flex;
|
|
7704
|
+
align-self: flex-start;
|
|
7705
|
+
align-items: center;
|
|
7706
|
+
gap: var(--space);
|
|
7707
|
+
}
|
|
7708
|
+
.hs-shell .hs-market-rate-star {
|
|
7709
|
+
display: grid;
|
|
7710
|
+
place-items: center;
|
|
7711
|
+
width: var(--h-ctl-md);
|
|
7712
|
+
height: var(--h-ctl-md);
|
|
7713
|
+
padding: 0;
|
|
7714
|
+
border: 0;
|
|
7715
|
+
border-radius: var(--r-sm);
|
|
7716
|
+
background: transparent;
|
|
7717
|
+
color: var(--dim);
|
|
7718
|
+
cursor: pointer;
|
|
7719
|
+
}
|
|
7720
|
+
.hs-shell .hs-market-rate-star:hover:not(:disabled), .hs-shell .hs-market-rate-star[data-lit='true'] {
|
|
7721
|
+
color: var(--text);
|
|
7722
|
+
}
|
|
7723
|
+
.hs-shell .hs-market-rate-star:disabled {
|
|
7724
|
+
cursor: default;
|
|
7725
|
+
}
|
|
7726
|
+
.hs-shell .hs-market-rate-in {
|
|
7727
|
+
display: inline-flex;
|
|
7728
|
+
align-items: center;
|
|
7729
|
+
align-self: flex-start;
|
|
7730
|
+
height: var(--h-ctl-md);
|
|
7731
|
+
padding: 0 calc(var(--space) * 4);
|
|
7732
|
+
font-size: var(--fs-md);
|
|
7733
|
+
font-weight: var(--fw-med);
|
|
7734
|
+
color: var(--text);
|
|
7735
|
+
text-decoration: none;
|
|
7736
|
+
}
|
|
7737
|
+
.hs-market-rate-failed {
|
|
7738
|
+
margin-left: calc(var(--space) * 2);
|
|
7739
|
+
font-size: var(--fs-sm);
|
|
7740
|
+
color: var(--dim);
|
|
7741
|
+
}
|
|
7326
7742
|
.hs-market-scroll {
|
|
7327
7743
|
flex: 1;
|
|
7328
7744
|
min-height: 0;
|
|
@@ -7350,22 +7766,23 @@
|
|
|
7350
7766
|
}
|
|
7351
7767
|
}
|
|
7352
7768
|
@container market-page (width < 860px) {
|
|
7353
|
-
.hs-market-
|
|
7354
|
-
|
|
7355
|
-
grid-auto-rows: calc(var(--space) * 70);
|
|
7769
|
+
.hs-market-shots img {
|
|
7770
|
+
height: calc(var(--space) * 65);
|
|
7356
7771
|
}
|
|
7357
|
-
|
|
7358
|
-
|
|
7772
|
+
}
|
|
7773
|
+
@container market-page (width < 760px) {
|
|
7774
|
+
.hs-market-feature-card {
|
|
7775
|
+
aspect-ratio: 4 / 5;
|
|
7359
7776
|
}
|
|
7360
|
-
.hs-market-
|
|
7361
|
-
|
|
7777
|
+
.hs-market-feature-band {
|
|
7778
|
+
flex-wrap: wrap;
|
|
7779
|
+
padding: calc(var(--space) * 16) calc(var(--space) * 5) calc(var(--space) * 13);
|
|
7362
7780
|
}
|
|
7363
|
-
.hs-market-
|
|
7364
|
-
|
|
7365
|
-
scale: 0.7;
|
|
7781
|
+
.hs-market-feature-band .hs-market-logo {
|
|
7782
|
+
display: none;
|
|
7366
7783
|
}
|
|
7367
|
-
.hs-market-
|
|
7368
|
-
|
|
7784
|
+
.hs-market-feature-copy {
|
|
7785
|
+
flex-basis: 100%;
|
|
7369
7786
|
}
|
|
7370
7787
|
}
|
|
7371
7788
|
@container market-page (width < 700px) {
|
|
@@ -7449,11 +7866,6 @@
|
|
|
7449
7866
|
font-size: var(--fs-body);
|
|
7450
7867
|
color: var(--mut);
|
|
7451
7868
|
}
|
|
7452
|
-
.hs-market-consent {
|
|
7453
|
-
display: flex;
|
|
7454
|
-
flex-direction: column;
|
|
7455
|
-
gap: calc(var(--space) * 1.5);
|
|
7456
|
-
}
|
|
7457
7869
|
.hs-market-recommend {
|
|
7458
7870
|
display: flex;
|
|
7459
7871
|
align-items: center;
|
|
@@ -7485,6 +7897,7 @@
|
|
|
7485
7897
|
font-size: var(--fs-lead);
|
|
7486
7898
|
font-weight: var(--fw-med);
|
|
7487
7899
|
cursor: pointer;
|
|
7900
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
7488
7901
|
}
|
|
7489
7902
|
.hs-shell .hs-signin-method:hover {
|
|
7490
7903
|
background: var(--btnhov);
|
|
@@ -8176,8 +8589,9 @@
|
|
|
8176
8589
|
}
|
|
8177
8590
|
.hs-installer-fill {
|
|
8178
8591
|
height: 100%;
|
|
8179
|
-
background:
|
|
8180
|
-
box-shadow:
|
|
8592
|
+
background: var(--gloss-fill), linear-gradient(90deg, var(--mark-lo), var(--mark-hi));
|
|
8593
|
+
box-shadow: var(--gloss-fill-edge);
|
|
8594
|
+
transition: clip-path var(--dur) var(--ease-out);
|
|
8181
8595
|
}
|
|
8182
8596
|
.hs-installer-rows {
|
|
8183
8597
|
display: flex;
|
|
@@ -8214,7 +8628,7 @@
|
|
|
8214
8628
|
border-radius: var(--r-round);
|
|
8215
8629
|
}
|
|
8216
8630
|
.hs-installer-stage[data-state='current'] .hs-installer-dot {
|
|
8217
|
-
background: var(--
|
|
8631
|
+
background: var(--mark-grad);
|
|
8218
8632
|
box-shadow: 0 0 8px var(--accent);
|
|
8219
8633
|
@supports (color: color-mix(in lab, red, red)) {
|
|
8220
8634
|
box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 55%, transparent);
|
|
@@ -8318,25 +8732,13 @@
|
|
|
8318
8732
|
}
|
|
8319
8733
|
.hs-nav-column > .hs-settings-search {
|
|
8320
8734
|
flex: none;
|
|
8321
|
-
margin: 0 var(--
|
|
8735
|
+
margin: 0 var(--pad-sidebar) calc(var(--space) * 2) 0;
|
|
8322
8736
|
}
|
|
8323
8737
|
.hs-fact-lines {
|
|
8324
8738
|
display: flex;
|
|
8325
8739
|
flex-direction: column;
|
|
8326
8740
|
gap: var(--space);
|
|
8327
8741
|
}
|
|
8328
|
-
.hs-app-state[data-tone='ok'] {
|
|
8329
|
-
color: var(--ok);
|
|
8330
|
-
}
|
|
8331
|
-
.hs-app-state[data-tone='mut'] {
|
|
8332
|
-
color: var(--mut);
|
|
8333
|
-
}
|
|
8334
|
-
.hs-app-state[data-tone='warn'] {
|
|
8335
|
-
color: var(--warn);
|
|
8336
|
-
}
|
|
8337
|
-
.hs-app-state[data-tone='bad'] {
|
|
8338
|
-
color: var(--bad);
|
|
8339
|
-
}
|
|
8340
8742
|
.hs-app-review {
|
|
8341
8743
|
margin: calc(var(--space) * 1.5) 0 0;
|
|
8342
8744
|
padding-left: calc(var(--space) * 4.5);
|
|
@@ -8349,15 +8751,15 @@
|
|
|
8349
8751
|
gap: var(--gap-stack);
|
|
8350
8752
|
}
|
|
8351
8753
|
.hs-segmented {
|
|
8352
|
-
display:
|
|
8754
|
+
display: grid;
|
|
8755
|
+
grid-auto-flow: column;
|
|
8756
|
+
grid-auto-columns: 1fr;
|
|
8353
8757
|
gap: var(--gap-label);
|
|
8354
8758
|
padding: var(--gap-label);
|
|
8355
8759
|
border: var(--bw) solid var(--cardb);
|
|
8356
8760
|
border-radius: var(--r-ctl);
|
|
8357
8761
|
}
|
|
8358
8762
|
.hs-segmented-option {
|
|
8359
|
-
flex: 1;
|
|
8360
|
-
min-width: 0;
|
|
8361
8763
|
height: calc(var(--h-ctl) - 2 * var(--gap-label) - 2 * var(--bw));
|
|
8362
8764
|
padding: var(--pad-ctl);
|
|
8363
8765
|
border: var(--bw) solid transparent;
|
|
@@ -8368,6 +8770,7 @@
|
|
|
8368
8770
|
font-size: var(--fs-body);
|
|
8369
8771
|
white-space: nowrap;
|
|
8370
8772
|
cursor: pointer;
|
|
8773
|
+
transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
8371
8774
|
}
|
|
8372
8775
|
.hs-segmented-option:hover:not(:disabled) {
|
|
8373
8776
|
color: var(--text);
|
|
@@ -8481,400 +8884,1519 @@
|
|
|
8481
8884
|
font-size: var(--fs-md);
|
|
8482
8885
|
color: var(--text);
|
|
8483
8886
|
}
|
|
8484
|
-
.hs-
|
|
8485
|
-
flex: none;
|
|
8486
|
-
width: var(--w-rail);
|
|
8487
|
-
height: 100%;
|
|
8488
|
-
box-sizing: border-box;
|
|
8489
|
-
padding: 0 0 var(--edge);
|
|
8490
|
-
gap: var(--gap-rail);
|
|
8491
|
-
}
|
|
8492
|
-
.hs-rail-top {
|
|
8493
|
-
flex: none;
|
|
8494
|
-
display: grid;
|
|
8495
|
-
place-items: center;
|
|
8496
|
-
align-self: stretch;
|
|
8497
|
-
height: var(--h-lane);
|
|
8498
|
-
-webkit-app-region: drag;
|
|
8499
|
-
}
|
|
8500
|
-
.hs-rail .hs-sidebar-rail-item, .hs-rail .hs-sidebar-rail-market {
|
|
8501
|
-
width: var(--icon-ctl-rail);
|
|
8502
|
-
height: var(--icon-ctl-rail);
|
|
8503
|
-
margin: 0;
|
|
8504
|
-
}
|
|
8505
|
-
.hs-rail-plate {
|
|
8887
|
+
.hs-dashboard {
|
|
8506
8888
|
position: relative;
|
|
8507
|
-
|
|
8508
|
-
|
|
8509
|
-
|
|
8510
|
-
-webkit-user-drag: none;
|
|
8511
|
-
}
|
|
8512
|
-
.hs-rail-plate[data-settle='true'] {
|
|
8513
|
-
transition: transform var(--dur) var(--ease-out);
|
|
8514
|
-
}
|
|
8515
|
-
.hs-rail-plate[data-lifted='true'] {
|
|
8516
|
-
z-index: 1;
|
|
8517
|
-
background: var(--hov);
|
|
8518
|
-
box-shadow: var(--gloss-edge), var(--shadow-drag);
|
|
8889
|
+
min-height: 100dvh;
|
|
8890
|
+
background: var(--fadeL);
|
|
8891
|
+
background-attachment: fixed;
|
|
8519
8892
|
}
|
|
8520
|
-
.hs-
|
|
8521
|
-
|
|
8893
|
+
.hs-dashboard::after {
|
|
8894
|
+
content: '';
|
|
8895
|
+
position: fixed;
|
|
8522
8896
|
}
|
|
8523
|
-
.hs-
|
|
8524
|
-
|
|
8525
|
-
flex: none;
|
|
8897
|
+
.hs-world-map-hi {
|
|
8898
|
+
stop-color: var(--mark-hi);
|
|
8526
8899
|
}
|
|
8527
|
-
.hs-
|
|
8528
|
-
|
|
8900
|
+
.hs-world-map-lo {
|
|
8901
|
+
stop-color: var(--mark-lo);
|
|
8529
8902
|
}
|
|
8530
|
-
.hs-
|
|
8531
|
-
position:
|
|
8532
|
-
top:
|
|
8533
|
-
|
|
8534
|
-
|
|
8535
|
-
height: calc(var(--space) * 1.5);
|
|
8536
|
-
border-radius: var(--r-round);
|
|
8537
|
-
background: var(--accent);
|
|
8903
|
+
.hs-dashboard-bar {
|
|
8904
|
+
position: sticky;
|
|
8905
|
+
top: 0;
|
|
8906
|
+
z-index: 50;
|
|
8907
|
+
padding: calc(var(--space) * 3);
|
|
8538
8908
|
}
|
|
8539
|
-
.hs-
|
|
8540
|
-
|
|
8541
|
-
bottom: calc(100% + var(--gap-rail));
|
|
8542
|
-
left: calc(-1 * (var(--pad-ladder) + var(--bw)));
|
|
8543
|
-
z-index: 20;
|
|
8544
|
-
display: flex;
|
|
8545
|
-
flex-direction: column;
|
|
8546
|
-
gap: var(--gap-ladder);
|
|
8547
|
-
padding: var(--pad-ladder);
|
|
8909
|
+
.hs-dashboard-plate, .hs-bento-tile, .hs-figure {
|
|
8910
|
+
border: var(--bw) solid var(--tipline);
|
|
8548
8911
|
border-radius: var(--r-card);
|
|
8549
8912
|
background: var(--tipbg);
|
|
8550
|
-
border: var(--bw) solid var(--tipline);
|
|
8551
8913
|
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
8552
8914
|
backdrop-filter: var(--blur-overlay);
|
|
8553
8915
|
-webkit-backdrop-filter: var(--blur-overlay);
|
|
8554
|
-
animation: hsLadderIn var(--dur) var(--ease-out);
|
|
8555
|
-
}
|
|
8556
|
-
@keyframes hsLadderIn {
|
|
8557
|
-
from {
|
|
8558
|
-
opacity: 0;
|
|
8559
|
-
}
|
|
8560
8916
|
}
|
|
8561
|
-
.hs-
|
|
8917
|
+
.hs-dashboard-plate {
|
|
8562
8918
|
position: relative;
|
|
8563
|
-
|
|
8564
|
-
|
|
8919
|
+
display: grid;
|
|
8920
|
+
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
|
|
8921
|
+
align-items: center;
|
|
8922
|
+
max-width: calc(var(--space) * 310);
|
|
8923
|
+
min-height: calc(var(--space) * 14);
|
|
8924
|
+
margin: 0 auto;
|
|
8925
|
+
padding: 0 calc(var(--space) * 2.5) 0 var(--space);
|
|
8565
8926
|
}
|
|
8566
|
-
|
|
8567
|
-
|
|
8568
|
-
|
|
8569
|
-
|
|
8570
|
-
|
|
8927
|
+
.hs-shell .hs-dashboard-brand {
|
|
8928
|
+
justify-self: start;
|
|
8929
|
+
display: inline-flex;
|
|
8930
|
+
color: var(--text);
|
|
8931
|
+
text-decoration: none;
|
|
8571
8932
|
}
|
|
8572
|
-
.hs-
|
|
8573
|
-
|
|
8574
|
-
|
|
8575
|
-
|
|
8933
|
+
.hs-dashboard-nav {
|
|
8934
|
+
display: flex;
|
|
8935
|
+
align-items: center;
|
|
8936
|
+
gap: var(--gap-inline);
|
|
8576
8937
|
}
|
|
8577
|
-
.hs-
|
|
8578
|
-
|
|
8938
|
+
.hs-shell .hs-dashboard-link {
|
|
8939
|
+
display: inline-flex;
|
|
8940
|
+
align-items: center;
|
|
8941
|
+
gap: calc(var(--space) * 1.75);
|
|
8942
|
+
padding: calc(var(--space) * 1.75) calc(var(--space) * 3.25);
|
|
8943
|
+
border: var(--bw) solid transparent;
|
|
8944
|
+
border-radius: var(--r-ctl);
|
|
8945
|
+
font-size: var(--fs-md);
|
|
8946
|
+
font-weight: var(--fw-med);
|
|
8947
|
+
white-space: nowrap;
|
|
8948
|
+
color: var(--mut);
|
|
8949
|
+
text-decoration: none;
|
|
8950
|
+
transition: color var(--dur) var(--ease-out), background-color var(--dur) var(--ease-out);
|
|
8579
8951
|
}
|
|
8580
|
-
.hs-
|
|
8581
|
-
|
|
8952
|
+
.hs-shell .hs-dashboard-link:hover {
|
|
8953
|
+
color: var(--text);
|
|
8954
|
+
background: var(--hov);
|
|
8955
|
+
box-shadow: var(--gloss-edge);
|
|
8582
8956
|
}
|
|
8583
|
-
.hs-
|
|
8584
|
-
|
|
8585
|
-
|
|
8586
|
-
|
|
8957
|
+
.hs-shell .hs-dashboard-link[aria-current='page'] {
|
|
8958
|
+
color: var(--text);
|
|
8959
|
+
background: var(--hov);
|
|
8960
|
+
border-color: var(--tipline);
|
|
8961
|
+
box-shadow: var(--gloss-edge);
|
|
8587
8962
|
}
|
|
8588
|
-
.hs-
|
|
8589
|
-
|
|
8590
|
-
min-height: 0;
|
|
8591
|
-
height: auto;
|
|
8963
|
+
.hs-shell .hs-dashboard-link[aria-current='page']:hover {
|
|
8964
|
+
background: var(--btnhov);
|
|
8592
8965
|
}
|
|
8593
|
-
.hs-
|
|
8966
|
+
.hs-dashboard-link > .hs-glyph {
|
|
8594
8967
|
flex: none;
|
|
8595
|
-
display: flex;
|
|
8596
|
-
align-items: center;
|
|
8597
|
-
gap: var(--gap-label);
|
|
8598
|
-
height: var(--h-lane-low);
|
|
8599
|
-
min-width: 0;
|
|
8600
|
-
box-sizing: border-box;
|
|
8601
8968
|
}
|
|
8602
|
-
.hs-
|
|
8603
|
-
|
|
8604
|
-
-
|
|
8969
|
+
.hs-dashboard-link:focus-visible {
|
|
8970
|
+
outline: none;
|
|
8971
|
+
box-shadow: var(--focus);
|
|
8605
8972
|
}
|
|
8606
|
-
.hs-
|
|
8607
|
-
|
|
8973
|
+
.hs-dashboard-menu, .hs-dashboard-menu-toggle {
|
|
8974
|
+
display: none;
|
|
8608
8975
|
}
|
|
8609
|
-
.hs-
|
|
8610
|
-
|
|
8976
|
+
.hs-dashboard-main {
|
|
8977
|
+
max-width: calc(var(--space) * 316);
|
|
8978
|
+
margin: 0 auto;
|
|
8979
|
+
padding: calc(var(--space) * 5) calc(var(--space) * 3) calc(var(--space) * 16);
|
|
8611
8980
|
}
|
|
8612
|
-
.hs-
|
|
8981
|
+
.hs-dashboard-title {
|
|
8982
|
+
margin: calc(var(--space) * 2) 0 calc(var(--space) * 5);
|
|
8983
|
+
font-size: var(--fs-page);
|
|
8984
|
+
font-weight: var(--fw-semi);
|
|
8985
|
+
letter-spacing: -0.02em;
|
|
8986
|
+
line-height: 1.1;
|
|
8987
|
+
color: var(--text);
|
|
8988
|
+
}
|
|
8989
|
+
.hs-dashboard-main[data-centered='true'] {
|
|
8613
8990
|
display: flex;
|
|
8991
|
+
flex-direction: column;
|
|
8614
8992
|
align-items: center;
|
|
8615
|
-
|
|
8616
|
-
|
|
8617
|
-
min-
|
|
8618
|
-
|
|
8619
|
-
|
|
8620
|
-
user-select: none;
|
|
8621
|
-
}
|
|
8622
|
-
.hs-lane-crumb > .hs-toolbar-mark {
|
|
8623
|
-
flex: none;
|
|
8624
|
-
}
|
|
8625
|
-
.hs-lane-crumb > .hs-breadcrumb-separator {
|
|
8626
|
-
flex: none;
|
|
8627
|
-
padding: 0 var(--gap-label);
|
|
8993
|
+
justify-content: center;
|
|
8994
|
+
gap: calc(var(--space) * 3);
|
|
8995
|
+
min-height: calc(100dvh - var(--space) * 20);
|
|
8996
|
+
padding-top: 0;
|
|
8997
|
+
text-align: center;
|
|
8628
8998
|
}
|
|
8629
|
-
.hs-
|
|
8630
|
-
|
|
8631
|
-
min-width: 0;
|
|
8632
|
-
overflow: hidden;
|
|
8633
|
-
text-overflow: ellipsis;
|
|
8999
|
+
.hs-dashboard-main[data-centered='true'] > .hs-dashboard-title {
|
|
9000
|
+
margin: 0;
|
|
8634
9001
|
}
|
|
8635
|
-
.hs-
|
|
8636
|
-
|
|
9002
|
+
.hs-dashboard-note {
|
|
9003
|
+
margin: 0;
|
|
9004
|
+
max-width: calc(var(--space) * 140);
|
|
9005
|
+
font-size: var(--fs-lead);
|
|
9006
|
+
line-height: var(--lh-body);
|
|
9007
|
+
color: var(--mut);
|
|
9008
|
+
text-wrap: pretty;
|
|
8637
9009
|
}
|
|
8638
|
-
.hs-
|
|
8639
|
-
|
|
8640
|
-
|
|
8641
|
-
height: var(--h-ctl);
|
|
8642
|
-
padding: 0 var(--grab-inset);
|
|
8643
|
-
border: none;
|
|
8644
|
-
outline: none;
|
|
8645
|
-
background: transparent;
|
|
8646
|
-
font: inherit;
|
|
9010
|
+
.hs-dashboard-said {
|
|
9011
|
+
margin: 0;
|
|
9012
|
+
font-size: var(--fs-md);
|
|
8647
9013
|
color: var(--text);
|
|
8648
9014
|
}
|
|
8649
|
-
.hs-
|
|
8650
|
-
|
|
8651
|
-
font-weight: var(--fw-strong);
|
|
9015
|
+
.hs-dashboard-said[data-ok='false'] {
|
|
9016
|
+
color: var(--bad);
|
|
8652
9017
|
}
|
|
8653
|
-
.hs-
|
|
8654
|
-
|
|
9018
|
+
.hs-dashboard-actions {
|
|
9019
|
+
display: flex;
|
|
9020
|
+
flex-wrap: wrap;
|
|
9021
|
+
justify-content: flex-end;
|
|
9022
|
+
gap: calc(var(--space) * 1.5);
|
|
8655
9023
|
}
|
|
8656
|
-
.hs-
|
|
8657
|
-
|
|
9024
|
+
.hs-dashboard-actions form {
|
|
9025
|
+
display: contents;
|
|
8658
9026
|
}
|
|
8659
|
-
.hs-
|
|
8660
|
-
|
|
9027
|
+
.hs-dashboard-listing {
|
|
9028
|
+
display: flex;
|
|
8661
9029
|
align-items: center;
|
|
8662
|
-
|
|
9030
|
+
gap: calc(var(--space) * 2.5);
|
|
8663
9031
|
}
|
|
8664
|
-
.hs-
|
|
8665
|
-
|
|
8666
|
-
|
|
8667
|
-
transition: flex-grow var(--dur) var(--ease-out);
|
|
9032
|
+
.hs-dashboard-listing-name {
|
|
9033
|
+
display: flex;
|
|
9034
|
+
flex-direction: column;
|
|
8668
9035
|
}
|
|
8669
|
-
.hs-
|
|
8670
|
-
|
|
9036
|
+
.hs-dashboard-listing small {
|
|
9037
|
+
color: var(--mut);
|
|
9038
|
+
font-size: var(--fs-sm);
|
|
8671
9039
|
}
|
|
8672
|
-
.hs-
|
|
9040
|
+
.hs-bento {
|
|
8673
9041
|
display: grid;
|
|
8674
|
-
|
|
8675
|
-
|
|
9042
|
+
grid-template-columns: repeat(12, minmax(0, 1fr));
|
|
9043
|
+
grid-auto-flow: row dense;
|
|
9044
|
+
gap: calc(var(--space) * 4);
|
|
8676
9045
|
}
|
|
8677
|
-
.hs-
|
|
8678
|
-
|
|
9046
|
+
.hs-bento-tile {
|
|
9047
|
+
grid-column: span 12;
|
|
9048
|
+
display: flex;
|
|
9049
|
+
flex-direction: column;
|
|
9050
|
+
gap: calc(var(--space) * 4);
|
|
8679
9051
|
min-width: 0;
|
|
8680
|
-
|
|
9052
|
+
padding: calc(var(--space) * 5);
|
|
8681
9053
|
}
|
|
8682
|
-
.hs-
|
|
8683
|
-
|
|
9054
|
+
.hs-bento-tile[data-span='4'] {
|
|
9055
|
+
grid-column: span 4;
|
|
8684
9056
|
}
|
|
8685
|
-
.hs-
|
|
8686
|
-
|
|
9057
|
+
.hs-bento-tile[data-span='5'] {
|
|
9058
|
+
grid-column: span 5;
|
|
8687
9059
|
}
|
|
8688
|
-
.hs-
|
|
8689
|
-
|
|
8690
|
-
left: 0;
|
|
8691
|
-
top: 0;
|
|
8692
|
-
z-index: 4;
|
|
8693
|
-
display: flex;
|
|
8694
|
-
flex-direction: column;
|
|
8695
|
-
gap: var(--gap-stack);
|
|
8696
|
-
width: var(--tabcard-w);
|
|
8697
|
-
box-sizing: border-box;
|
|
8698
|
-
margin-top: var(--gap-tile);
|
|
8699
|
-
padding: var(--gap-stack);
|
|
8700
|
-
border-radius: var(--r-card);
|
|
8701
|
-
background: var(--tipbg);
|
|
8702
|
-
border: var(--bw) solid var(--tipline);
|
|
8703
|
-
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
8704
|
-
backdrop-filter: var(--blur-overlay);
|
|
8705
|
-
-webkit-backdrop-filter: var(--blur-overlay);
|
|
8706
|
-
opacity: 0;
|
|
8707
|
-
pointer-events: none;
|
|
8708
|
-
transition: transform var(--dur) var(--ease-out);
|
|
9060
|
+
.hs-bento-tile[data-span='6'] {
|
|
9061
|
+
grid-column: span 6;
|
|
8709
9062
|
}
|
|
8710
|
-
.hs-
|
|
8711
|
-
|
|
9063
|
+
.hs-bento-tile[data-span='7'] {
|
|
9064
|
+
grid-column: span 7;
|
|
8712
9065
|
}
|
|
8713
|
-
.hs-
|
|
8714
|
-
|
|
9066
|
+
.hs-bento-tile[data-span='8'] {
|
|
9067
|
+
grid-column: span 8;
|
|
8715
9068
|
}
|
|
8716
|
-
.hs-
|
|
8717
|
-
|
|
8718
|
-
|
|
9069
|
+
.hs-bento-tile[data-tall='true'] {
|
|
9070
|
+
grid-row: span 2;
|
|
9071
|
+
}
|
|
9072
|
+
.hs-bento-title {
|
|
9073
|
+
margin: 0;
|
|
9074
|
+
font-size: var(--fs-lead);
|
|
8719
9075
|
font-weight: var(--fw-semi);
|
|
9076
|
+
letter-spacing: -0.01em;
|
|
9077
|
+
line-height: 1.3;
|
|
8720
9078
|
color: var(--text);
|
|
8721
|
-
white-space: nowrap;
|
|
8722
|
-
overflow: hidden;
|
|
8723
|
-
text-overflow: ellipsis;
|
|
8724
9079
|
}
|
|
8725
|
-
.hs-
|
|
8726
|
-
|
|
8727
|
-
|
|
8728
|
-
|
|
9080
|
+
.hs-bento-body {
|
|
9081
|
+
flex: 1;
|
|
9082
|
+
display: flex;
|
|
9083
|
+
flex-direction: column;
|
|
9084
|
+
min-width: 0;
|
|
9085
|
+
}
|
|
9086
|
+
.hs-bento-body:has(> .hs-data-table) {
|
|
9087
|
+
overflow-x: auto;
|
|
9088
|
+
}
|
|
9089
|
+
.hs-bento-tile[data-aside='true'] > .hs-bento-body {
|
|
9090
|
+
display: grid;
|
|
9091
|
+
grid-template-columns: minmax(0, 5fr) minmax(0, 3fr);
|
|
9092
|
+
align-items: start;
|
|
9093
|
+
gap: calc(var(--space) * 8);
|
|
9094
|
+
}
|
|
9095
|
+
.hs-bento-aside {
|
|
9096
|
+
align-self: stretch;
|
|
9097
|
+
min-width: 0;
|
|
9098
|
+
contain: size;
|
|
9099
|
+
overflow: hidden auto;
|
|
9100
|
+
padding-bottom: calc(var(--space) * 8);
|
|
9101
|
+
-webkit-mask-image: linear-gradient(180deg, #000 calc(100% - var(--space) * 8), transparent);
|
|
9102
|
+
mask-image: linear-gradient(180deg, #000 calc(100% - var(--space) * 8), transparent);
|
|
9103
|
+
}
|
|
9104
|
+
.hs-figures {
|
|
9105
|
+
grid-column: 1 / -1;
|
|
9106
|
+
display: grid;
|
|
9107
|
+
grid-template-columns: repeat(auto-fit, minmax(calc(var(--space) * 40), 1fr));
|
|
9108
|
+
gap: calc(var(--space) * 4);
|
|
9109
|
+
}
|
|
9110
|
+
.hs-figure {
|
|
9111
|
+
position: relative;
|
|
9112
|
+
display: flex;
|
|
9113
|
+
flex-direction: column;
|
|
9114
|
+
justify-content: space-between;
|
|
9115
|
+
gap: calc(var(--space) * 3);
|
|
9116
|
+
min-width: 0;
|
|
9117
|
+
padding: calc(var(--space) * 4.5) calc(var(--space) * 5);
|
|
9118
|
+
}
|
|
9119
|
+
.hs-figure:hover {
|
|
9120
|
+
z-index: 1;
|
|
9121
|
+
}
|
|
9122
|
+
.hs-figure-label {
|
|
9123
|
+
font-size: var(--fs-md);
|
|
9124
|
+
line-height: 1.35;
|
|
9125
|
+
color: var(--mut);
|
|
9126
|
+
}
|
|
9127
|
+
.hs-figure-value {
|
|
9128
|
+
font-size: var(--fs-figure);
|
|
9129
|
+
font-weight: var(--fw-semi);
|
|
9130
|
+
font-variant-numeric: tabular-nums;
|
|
9131
|
+
letter-spacing: -0.03em;
|
|
9132
|
+
line-height: 1;
|
|
9133
|
+
color: var(--text);
|
|
9134
|
+
}
|
|
9135
|
+
.hs-bento-body > .hs-figures {
|
|
9136
|
+
grid-template-columns: minmax(0, 1fr);
|
|
9137
|
+
gap: 0;
|
|
9138
|
+
}
|
|
9139
|
+
.hs-bento-body .hs-figure {
|
|
9140
|
+
flex-direction: row;
|
|
9141
|
+
align-items: baseline;
|
|
9142
|
+
padding: calc(var(--space) * 3.5) 0;
|
|
9143
|
+
border: 0;
|
|
9144
|
+
border-top: var(--bw) solid var(--tipline);
|
|
9145
|
+
border-radius: 0;
|
|
9146
|
+
background: none;
|
|
9147
|
+
box-shadow: none;
|
|
9148
|
+
backdrop-filter: none;
|
|
9149
|
+
-webkit-backdrop-filter: none;
|
|
9150
|
+
}
|
|
9151
|
+
.hs-bento-body .hs-figure:first-child {
|
|
9152
|
+
padding-top: 0;
|
|
9153
|
+
border-top: 0;
|
|
9154
|
+
}
|
|
9155
|
+
.hs-figure > .hs-tip {
|
|
9156
|
+
top: calc(100% + var(--space));
|
|
9157
|
+
left: 0;
|
|
9158
|
+
width: max-content;
|
|
9159
|
+
max-width: min(calc(var(--space) * 70), 100%);
|
|
9160
|
+
white-space: normal;
|
|
9161
|
+
}
|
|
9162
|
+
.hs-figure:first-child > .hs-tip {
|
|
9163
|
+
max-width: calc(var(--space) * 70);
|
|
9164
|
+
}
|
|
9165
|
+
.hs-dashboard .hs-tooltip {
|
|
9166
|
+
background: var(--win);
|
|
9167
|
+
}
|
|
9168
|
+
.hs-bar-series {
|
|
9169
|
+
flex: 1;
|
|
9170
|
+
display: flex;
|
|
9171
|
+
flex-direction: column;
|
|
9172
|
+
gap: calc(var(--space) * 1.5);
|
|
9173
|
+
margin: 0;
|
|
9174
|
+
overflow-x: clip;
|
|
9175
|
+
font-size: var(--fs-sm);
|
|
9176
|
+
font-variant-numeric: tabular-nums;
|
|
9177
|
+
color: var(--dim);
|
|
9178
|
+
}
|
|
9179
|
+
.hs-bar-series-plot {
|
|
9180
|
+
flex: 1;
|
|
9181
|
+
display: flex;
|
|
9182
|
+
gap: calc(var(--space) * 0.75);
|
|
9183
|
+
min-height: calc(var(--space) * 36);
|
|
9184
|
+
border-bottom: var(--bw) solid var(--tipline);
|
|
9185
|
+
}
|
|
9186
|
+
.hs-bar-series-bar {
|
|
9187
|
+
position: relative;
|
|
9188
|
+
flex: 1;
|
|
9189
|
+
display: flex;
|
|
9190
|
+
align-items: flex-end;
|
|
9191
|
+
min-width: 0;
|
|
9192
|
+
border-radius: var(--r-sm) var(--r-sm) 0 0;
|
|
9193
|
+
}
|
|
9194
|
+
.hs-bar-series-bar > .hs-tip {
|
|
9195
|
+
bottom: calc(100% + var(--space));
|
|
9196
|
+
left: 50%;
|
|
9197
|
+
transform: translateX(-50%);
|
|
9198
|
+
}
|
|
9199
|
+
.hs-bar-series-bar:nth-child(-n + 5) > .hs-tip {
|
|
9200
|
+
left: 0;
|
|
9201
|
+
transform: none;
|
|
9202
|
+
}
|
|
9203
|
+
.hs-bar-series-bar:nth-last-child(-n + 5) > .hs-tip {
|
|
9204
|
+
left: auto;
|
|
9205
|
+
right: 0;
|
|
9206
|
+
transform: none;
|
|
9207
|
+
}
|
|
9208
|
+
.hs-bar-series-bar:hover {
|
|
9209
|
+
background: var(--hov);
|
|
9210
|
+
}
|
|
9211
|
+
.hs-bar-series-fill {
|
|
9212
|
+
width: 100%;
|
|
9213
|
+
border-radius: var(--r-sm) var(--r-sm) 0 0;
|
|
9214
|
+
background: var(--mark-grad);
|
|
9215
|
+
box-shadow: var(--gloss-edge);
|
|
9216
|
+
}
|
|
9217
|
+
.hs-bar-series-axis {
|
|
9218
|
+
display: flex;
|
|
9219
|
+
justify-content: space-between;
|
|
9220
|
+
}
|
|
9221
|
+
.hs-data-table {
|
|
9222
|
+
width: 100%;
|
|
9223
|
+
border-collapse: collapse;
|
|
9224
|
+
font-size: var(--fs-body);
|
|
9225
|
+
color: var(--text);
|
|
9226
|
+
}
|
|
9227
|
+
.hs-data-table th {
|
|
9228
|
+
padding: 0 calc(var(--space) * 3) calc(var(--space) * 2.5);
|
|
9229
|
+
font-size: var(--fs-sm);
|
|
9230
|
+
font-weight: 400;
|
|
9231
|
+
color: var(--mut);
|
|
9232
|
+
text-align: left;
|
|
9233
|
+
vertical-align: bottom;
|
|
9234
|
+
}
|
|
9235
|
+
.hs-data-table td {
|
|
9236
|
+
padding: calc(var(--space) * 2.25) calc(var(--space) * 3);
|
|
9237
|
+
border-top: var(--bw) solid var(--tipline);
|
|
9238
|
+
overflow-wrap: break-word;
|
|
9239
|
+
}
|
|
9240
|
+
.hs-data-table :is(th, td):first-child {
|
|
9241
|
+
padding-left: 0;
|
|
9242
|
+
}
|
|
9243
|
+
.hs-data-table :is(th, td):last-child {
|
|
9244
|
+
padding-right: 0;
|
|
9245
|
+
}
|
|
9246
|
+
.hs-data-table :is(th, td)[data-numeric='true'] {
|
|
9247
|
+
text-align: right;
|
|
9248
|
+
font-variant-numeric: tabular-nums;
|
|
9249
|
+
white-space: nowrap;
|
|
9250
|
+
}
|
|
9251
|
+
.hs-data-table-empty {
|
|
9252
|
+
color: var(--mut);
|
|
9253
|
+
}
|
|
9254
|
+
.hs-world-map {
|
|
9255
|
+
display: flex;
|
|
9256
|
+
flex-direction: column;
|
|
9257
|
+
gap: calc(var(--space) * 3);
|
|
9258
|
+
min-width: 0;
|
|
9259
|
+
margin: 0;
|
|
9260
|
+
}
|
|
9261
|
+
.hs-world-map-plot {
|
|
9262
|
+
display: block;
|
|
9263
|
+
width: 100%;
|
|
9264
|
+
height: auto;
|
|
9265
|
+
}
|
|
9266
|
+
.hs-world-map-country {
|
|
9267
|
+
stroke: var(--tipline);
|
|
9268
|
+
stroke-width: 0.5;
|
|
9269
|
+
stroke-linejoin: round;
|
|
9270
|
+
}
|
|
9271
|
+
.hs-world-map-country:not([data-counted='true']) {
|
|
9272
|
+
fill: var(--hov);
|
|
9273
|
+
}
|
|
9274
|
+
.hs-world-map-country[data-counted='true'] {
|
|
9275
|
+
fill-opacity: calc(var(--map-floor) + (1 - var(--map-floor)) * var(--share));
|
|
9276
|
+
}
|
|
9277
|
+
.hs-world-map-scale {
|
|
9278
|
+
display: flex;
|
|
9279
|
+
align-items: center;
|
|
9280
|
+
gap: var(--gap-stack);
|
|
9281
|
+
font-size: var(--fs-sm);
|
|
9282
|
+
font-variant-numeric: tabular-nums;
|
|
9283
|
+
color: var(--dim);
|
|
9284
|
+
}
|
|
9285
|
+
.hs-world-map-ramp {
|
|
9286
|
+
flex: none;
|
|
9287
|
+
width: calc(var(--space) * 30);
|
|
9288
|
+
height: calc(var(--space) * 2);
|
|
9289
|
+
border-radius: var(--r-pill);
|
|
9290
|
+
background: var(--mark-grad);
|
|
9291
|
+
-webkit-mask-image: linear-gradient( 90deg, rgb(0 0 0 / calc(var(--map-floor) + (1 - var(--map-floor)) * var(--share))), #000 );
|
|
9292
|
+
mask-image: linear-gradient( 90deg, rgb(0 0 0 / calc(var(--map-floor) + (1 - var(--map-floor)) * var(--share))), #000 );
|
|
9293
|
+
}
|
|
9294
|
+
@media (width < 1100px) {
|
|
9295
|
+
.hs-bento-tile[data-span='4'], .hs-bento-tile[data-span='5'], .hs-bento-tile[data-span='6'], .hs-bento-tile[data-span='7'] {
|
|
9296
|
+
grid-column: span 6;
|
|
9297
|
+
}
|
|
9298
|
+
.hs-bento-tile[data-span='8'] {
|
|
9299
|
+
grid-column: span 12;
|
|
9300
|
+
}
|
|
9301
|
+
.hs-bento-tile[data-aside='true'] > .hs-bento-body {
|
|
9302
|
+
grid-template-columns: minmax(0, 1fr);
|
|
9303
|
+
}
|
|
9304
|
+
.hs-bento-aside {
|
|
9305
|
+
contain: none;
|
|
9306
|
+
padding-bottom: 0;
|
|
9307
|
+
-webkit-mask-image: none;
|
|
9308
|
+
mask-image: none;
|
|
9309
|
+
}
|
|
9310
|
+
.hs-dashboard-plate {
|
|
9311
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
9312
|
+
}
|
|
9313
|
+
.hs-dashboard-menu-toggle {
|
|
9314
|
+
display: block;
|
|
9315
|
+
position: absolute;
|
|
9316
|
+
width: 1px;
|
|
9317
|
+
height: 1px;
|
|
9318
|
+
opacity: 0;
|
|
9319
|
+
pointer-events: none;
|
|
9320
|
+
}
|
|
9321
|
+
.hs-dashboard-menu {
|
|
9322
|
+
display: grid;
|
|
9323
|
+
place-items: center;
|
|
9324
|
+
width: calc(var(--space) * 11);
|
|
9325
|
+
height: calc(var(--space) * 11);
|
|
9326
|
+
border-radius: var(--r-ctl);
|
|
9327
|
+
color: var(--text);
|
|
9328
|
+
cursor: pointer;
|
|
9329
|
+
}
|
|
9330
|
+
.hs-dashboard-menu-toggle:focus-visible + .hs-dashboard-menu {
|
|
9331
|
+
box-shadow: var(--focus);
|
|
9332
|
+
}
|
|
9333
|
+
.hs-dashboard-menu-close, .hs-dashboard-menu-toggle:checked + .hs-dashboard-menu > .hs-dashboard-menu-open {
|
|
9334
|
+
display: none;
|
|
9335
|
+
}
|
|
9336
|
+
.hs-dashboard-menu-toggle:checked + .hs-dashboard-menu > .hs-dashboard-menu-close {
|
|
9337
|
+
display: grid;
|
|
9338
|
+
}
|
|
9339
|
+
.hs-dashboard-nav {
|
|
9340
|
+
display: none;
|
|
9341
|
+
grid-column: 1 / -1;
|
|
9342
|
+
flex-direction: column;
|
|
9343
|
+
align-items: stretch;
|
|
9344
|
+
gap: var(--space);
|
|
9345
|
+
padding: var(--space) 0 calc(var(--space) * 2.5) var(--space);
|
|
9346
|
+
border-top: var(--bw) solid var(--tipline);
|
|
9347
|
+
}
|
|
9348
|
+
.hs-dashboard-menu-toggle:checked ~ .hs-dashboard-nav {
|
|
9349
|
+
display: flex;
|
|
9350
|
+
}
|
|
9351
|
+
.hs-shell .hs-dashboard-link {
|
|
9352
|
+
padding: calc(var(--space) * 2.75) calc(var(--space) * 3);
|
|
9353
|
+
font-size: var(--fs-lead);
|
|
9354
|
+
}
|
|
9355
|
+
}
|
|
9356
|
+
@media (width < 720px) {
|
|
9357
|
+
.hs-bento-tile, .hs-bento-tile[data-span] {
|
|
9358
|
+
grid-column: 1 / -1;
|
|
9359
|
+
}
|
|
9360
|
+
.hs-bento-tile[data-tall='true'] {
|
|
9361
|
+
grid-row: auto;
|
|
9362
|
+
}
|
|
9363
|
+
.hs-figures {
|
|
9364
|
+
grid-template-columns: repeat(auto-fit, minmax(calc(var(--space) * 38), 1fr));
|
|
9365
|
+
}
|
|
9366
|
+
.hs-dashboard-bar {
|
|
9367
|
+
padding: calc(var(--space) * 2.5);
|
|
9368
|
+
}
|
|
9369
|
+
.hs-dashboard-main {
|
|
9370
|
+
padding: calc(var(--space) * 3) calc(var(--space) * 2.5) calc(var(--space) * 12);
|
|
9371
|
+
}
|
|
9372
|
+
.hs-bento-tile, .hs-figure {
|
|
9373
|
+
padding: calc(var(--space) * 4);
|
|
9374
|
+
}
|
|
9375
|
+
}
|
|
9376
|
+
.hs-sidebar-rail.hs-rail {
|
|
9377
|
+
flex: none;
|
|
9378
|
+
width: var(--w-rail);
|
|
9379
|
+
height: 100%;
|
|
9380
|
+
box-sizing: border-box;
|
|
9381
|
+
padding: 0 0 var(--edge);
|
|
9382
|
+
gap: var(--gap-rail);
|
|
9383
|
+
}
|
|
9384
|
+
.hs-rail-top {
|
|
9385
|
+
flex: none;
|
|
9386
|
+
display: grid;
|
|
9387
|
+
place-items: center;
|
|
9388
|
+
align-self: stretch;
|
|
9389
|
+
height: var(--h-lane);
|
|
9390
|
+
-webkit-app-region: drag;
|
|
9391
|
+
}
|
|
9392
|
+
.hs-rail .hs-sidebar-rail-item, .hs-rail .hs-sidebar-rail-market {
|
|
9393
|
+
width: var(--icon-ctl-rail);
|
|
9394
|
+
height: var(--icon-ctl-rail);
|
|
9395
|
+
margin: 0;
|
|
9396
|
+
}
|
|
9397
|
+
.hs-rail-plate {
|
|
9398
|
+
position: relative;
|
|
9399
|
+
touch-action: none;
|
|
9400
|
+
}
|
|
9401
|
+
.hs-rail-plate-bypass {
|
|
9402
|
+
position: absolute;
|
|
9403
|
+
right: 0;
|
|
9404
|
+
bottom: 0;
|
|
9405
|
+
display: grid;
|
|
9406
|
+
place-items: center;
|
|
9407
|
+
border-radius: var(--r-round);
|
|
9408
|
+
background: var(--bg);
|
|
9409
|
+
color: var(--bad);
|
|
9410
|
+
pointer-events: none;
|
|
9411
|
+
}
|
|
9412
|
+
.hs-rail-plate img {
|
|
9413
|
+
-webkit-user-drag: none;
|
|
9414
|
+
}
|
|
9415
|
+
.hs-rail-plate[data-slide='true'] {
|
|
9416
|
+
transition: transform var(--dur) var(--ease-out);
|
|
9417
|
+
}
|
|
9418
|
+
.hs-rail-plate[data-lifted='true'] {
|
|
9419
|
+
z-index: 1;
|
|
9420
|
+
background: var(--hov);
|
|
9421
|
+
box-shadow: var(--gloss-edge), var(--shadow-drag);
|
|
9422
|
+
}
|
|
9423
|
+
.hs-rail[data-lifting='true'], .hs-rail[data-lifting='true'] * {
|
|
9424
|
+
cursor: grabbing;
|
|
9425
|
+
}
|
|
9426
|
+
.hs-ladder {
|
|
9427
|
+
--fan-size: var(--icon-ctl-rail);
|
|
9428
|
+
--fan-gap: var(--gap-rail);
|
|
9429
|
+
--fan-arrow-at: calc(var(--space) * 1.25);
|
|
9430
|
+
--fan-dot-x: var(--space);
|
|
9431
|
+
--fan-dot-y: calc(var(--space) * 1.75);
|
|
9432
|
+
}
|
|
9433
|
+
.hs-ladder-rung {
|
|
9434
|
+
color: var(--text);
|
|
9435
|
+
}
|
|
9436
|
+
.hs-ladder-rung[data-solid='true'] {
|
|
9437
|
+
background: var(--accent-grad);
|
|
9438
|
+
color: var(--accent-ink);
|
|
9439
|
+
box-shadow: var(--accent-shadow);
|
|
9440
|
+
}
|
|
9441
|
+
.hs-ladder-rung[data-pressed='true'] {
|
|
9442
|
+
cursor: default;
|
|
9443
|
+
}
|
|
9444
|
+
.hs-ladder-rung[data-pressed='true'] :is(svg, .hs-mask) {
|
|
9445
|
+
opacity: var(--rung-pressed-alpha);
|
|
9446
|
+
}
|
|
9447
|
+
.hs-workspace-tile {
|
|
9448
|
+
position: absolute;
|
|
9449
|
+
display: flex;
|
|
9450
|
+
flex-direction: column;
|
|
9451
|
+
}
|
|
9452
|
+
.hs-workspace-tile > .hs-tile-panel {
|
|
9453
|
+
flex: 1 1 0;
|
|
9454
|
+
min-height: 0;
|
|
9455
|
+
height: auto;
|
|
9456
|
+
}
|
|
9457
|
+
.hs-lane {
|
|
9458
|
+
flex: none;
|
|
9459
|
+
display: flex;
|
|
9460
|
+
align-items: center;
|
|
9461
|
+
gap: var(--gap-label);
|
|
9462
|
+
height: var(--h-lane-low);
|
|
9463
|
+
min-width: 0;
|
|
9464
|
+
box-sizing: border-box;
|
|
9465
|
+
}
|
|
9466
|
+
.hs-lane[data-row='top'] {
|
|
9467
|
+
height: var(--h-lane);
|
|
9468
|
+
-webkit-app-region: drag;
|
|
9469
|
+
}
|
|
9470
|
+
.hs-lane[data-row='top'] :is(.hs-lane-crumb, .hs-lane-tab, .hs-lane-tabs-arrow, .hs-lane-plus, .hs-lane-fan) {
|
|
9471
|
+
-webkit-app-region: no-drag;
|
|
9472
|
+
}
|
|
9473
|
+
.hs-lane[data-caption='true'] {
|
|
9474
|
+
padding-right: max( 0px, calc( 100vw - env(titlebar-area-x, 0px) - env(titlebar-area-width, 100vw) - var(--edge) + var(--gap-tile) ) );
|
|
9475
|
+
}
|
|
9476
|
+
.hs-lane-crumb {
|
|
9477
|
+
position: relative;
|
|
9478
|
+
overflow: hidden;
|
|
9479
|
+
display: flex;
|
|
9480
|
+
align-items: center;
|
|
9481
|
+
gap: var(--gap-inline);
|
|
9482
|
+
flex: 0 1 auto;
|
|
9483
|
+
min-width: 0;
|
|
9484
|
+
height: 100%;
|
|
9485
|
+
padding: 0 var(--gap-inline);
|
|
9486
|
+
user-select: none;
|
|
9487
|
+
}
|
|
9488
|
+
.hs-lane-crumb > .hs-toolbar-mark {
|
|
9489
|
+
flex: none;
|
|
9490
|
+
}
|
|
9491
|
+
.hs-lane-crumb > .hs-breadcrumb-separator {
|
|
9492
|
+
flex: none;
|
|
9493
|
+
padding: 0 var(--gap-label);
|
|
9494
|
+
}
|
|
9495
|
+
.hs-lane-crumb-app {
|
|
9496
|
+
flex: 0 1 auto;
|
|
9497
|
+
min-width: 0;
|
|
9498
|
+
overflow: hidden;
|
|
9499
|
+
}
|
|
9500
|
+
.hs-lane-crumb > .hs-lane-crumb-title {
|
|
9501
|
+
flex: 0 1000 auto;
|
|
9502
|
+
text-overflow: clip;
|
|
9503
|
+
}
|
|
9504
|
+
.hs-lane-crumb[data-fit='app'] > :is(.hs-breadcrumb-separator, .hs-lane-crumb-title), .hs-lane-crumb[data-fit='mark'] > :is(.hs-lane-crumb-app, .hs-breadcrumb-separator, .hs-lane-crumb-title) {
|
|
9505
|
+
position: absolute;
|
|
9506
|
+
visibility: hidden;
|
|
9507
|
+
pointer-events: none;
|
|
9508
|
+
}
|
|
9509
|
+
.hs-lane-crumb > .hs-tab-close {
|
|
9510
|
+
display: none;
|
|
9511
|
+
}
|
|
9512
|
+
.hs-lane-crumb:is(:hover, :focus-visible) > .hs-tab-close {
|
|
9513
|
+
display: grid;
|
|
9514
|
+
}
|
|
9515
|
+
.hs-lane-crumb:focus-visible {
|
|
9516
|
+
outline: none;
|
|
9517
|
+
border-radius: var(--r-ctl);
|
|
9518
|
+
box-shadow: var(--focus);
|
|
9519
|
+
}
|
|
9520
|
+
.hs-lane-title-field {
|
|
9521
|
+
flex: 1 1 auto;
|
|
9522
|
+
min-width: 0;
|
|
9523
|
+
height: var(--h-ctl);
|
|
9524
|
+
padding: 0 var(--grab-inset);
|
|
9525
|
+
border: none;
|
|
9526
|
+
outline: none;
|
|
9527
|
+
background: transparent;
|
|
9528
|
+
font: inherit;
|
|
9529
|
+
color: var(--text);
|
|
9530
|
+
}
|
|
9531
|
+
.hs-lane-crumb > .hs-lane-title-field {
|
|
9532
|
+
font-size: var(--fs-lead);
|
|
9533
|
+
font-weight: var(--fw-strong);
|
|
9534
|
+
}
|
|
9535
|
+
.hs-lane-plus {
|
|
9536
|
+
width: var(--h-tab);
|
|
9537
|
+
height: var(--h-tab);
|
|
9538
|
+
opacity: var(--lane-plus-alpha);
|
|
9539
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9540
|
+
}
|
|
9541
|
+
.hs-lane:hover .hs-lane-plus, .hs-lane:has(:focus-visible) .hs-lane-plus {
|
|
9542
|
+
opacity: 1;
|
|
9543
|
+
}
|
|
9544
|
+
.hs-lane-fan {
|
|
9545
|
+
--fan-size: var(--h-tab);
|
|
9546
|
+
--fan-gap: var(--gap-label);
|
|
9547
|
+
--fan-arrow-at: calc(var(--space) * 0.5);
|
|
9548
|
+
}
|
|
9549
|
+
.hs-lane-fan > .hs-lane-button[data-open='true'] {
|
|
9550
|
+
background: var(--hov);
|
|
9551
|
+
box-shadow: var(--gloss-edge);
|
|
9552
|
+
color: var(--text);
|
|
9553
|
+
}
|
|
9554
|
+
.hs-lane :is(.hs-lane-tab, .hs-lane-crumb) img {
|
|
9555
|
+
-webkit-user-drag: none;
|
|
9556
|
+
}
|
|
9557
|
+
.hs-lane .hs-lane-tabs-wrap {
|
|
9558
|
+
position: relative;
|
|
9559
|
+
display: flex;
|
|
9560
|
+
flex: 0 1 var(--strip-w);
|
|
9561
|
+
align-self: stretch;
|
|
9562
|
+
min-width: 0;
|
|
9563
|
+
}
|
|
9564
|
+
.hs-lane .hs-lane-tabs {
|
|
9565
|
+
flex: 1 1 0;
|
|
9566
|
+
align-items: center;
|
|
9567
|
+
padding-top: 0;
|
|
9568
|
+
scroll-snap-type: x mandatory;
|
|
9569
|
+
scroll-padding-inline: var(--lane-arrow-w);
|
|
9570
|
+
}
|
|
9571
|
+
.hs-shell .hs-lane .hs-lane-tabs::-webkit-scrollbar {
|
|
9572
|
+
display: none;
|
|
9573
|
+
}
|
|
9574
|
+
.hs-lane .hs-lane-tabs[data-fade='l'] {
|
|
9575
|
+
-webkit-mask-image: linear-gradient( 90deg, transparent var(--lane-arrow-w), #000 calc(var(--lane-arrow-w) + var(--space) * 2) );
|
|
9576
|
+
mask-image: linear-gradient( 90deg, transparent var(--lane-arrow-w), #000 calc(var(--lane-arrow-w) + var(--space) * 2) );
|
|
9577
|
+
}
|
|
9578
|
+
.hs-lane .hs-lane-tabs[data-fade='r'] {
|
|
9579
|
+
-webkit-mask-image: linear-gradient( 90deg, #000 calc(100% - var(--lane-arrow-w) - var(--space) * 2), transparent calc(100% - var(--lane-arrow-w)) );
|
|
9580
|
+
mask-image: linear-gradient( 90deg, #000 calc(100% - var(--lane-arrow-w) - var(--space) * 2), transparent calc(100% - var(--lane-arrow-w)) );
|
|
9581
|
+
}
|
|
9582
|
+
.hs-lane .hs-lane-tabs[data-fade='lr'] {
|
|
9583
|
+
-webkit-mask-image: linear-gradient( 90deg, transparent var(--lane-arrow-w), #000 calc(var(--lane-arrow-w) + var(--space) * 2), #000 calc(100% - var(--lane-arrow-w) - var(--space) * 2), transparent calc(100% - var(--lane-arrow-w)) );
|
|
9584
|
+
mask-image: linear-gradient( 90deg, transparent var(--lane-arrow-w), #000 calc(var(--lane-arrow-w) + var(--space) * 2), #000 calc(100% - var(--lane-arrow-w) - var(--space) * 2), transparent calc(100% - var(--lane-arrow-w)) );
|
|
9585
|
+
}
|
|
9586
|
+
.hs-lane-tabs-arrow {
|
|
9587
|
+
position: absolute;
|
|
9588
|
+
top: 0;
|
|
9589
|
+
bottom: 0;
|
|
9590
|
+
display: grid;
|
|
9591
|
+
place-items: center;
|
|
9592
|
+
width: var(--lane-arrow-w);
|
|
9593
|
+
height: var(--lane-arrow-w);
|
|
9594
|
+
margin: auto 0;
|
|
9595
|
+
border-radius: var(--r-ctl);
|
|
9596
|
+
cursor: pointer;
|
|
9597
|
+
}
|
|
9598
|
+
.hs-lane-tabs-arrow[data-side='start'] {
|
|
9599
|
+
left: 0;
|
|
9600
|
+
}
|
|
9601
|
+
.hs-lane-tabs-arrow[data-side='end'] {
|
|
9602
|
+
right: 0;
|
|
9603
|
+
}
|
|
9604
|
+
.hs-lane .hs-lane-tab {
|
|
9605
|
+
flex: 0 1 var(--tab-w);
|
|
9606
|
+
min-width: min-content;
|
|
9607
|
+
scroll-snap-align: start;
|
|
9608
|
+
transition: background var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
9609
|
+
}
|
|
9610
|
+
.hs-lane .hs-lane-tab[data-sel='false']:not(:hover) {
|
|
9611
|
+
color: var(--tab-rest-ink);
|
|
9612
|
+
}
|
|
9613
|
+
.hs-lane .hs-lane-tab-mark img {
|
|
9614
|
+
transition: filter var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
9615
|
+
}
|
|
9616
|
+
.hs-lane .hs-lane-tab[data-sel='false']:not(:hover) .hs-lane-tab-mark img {
|
|
9617
|
+
filter: grayscale(1);
|
|
9618
|
+
opacity: var(--tab-rest-alpha);
|
|
9619
|
+
}
|
|
9620
|
+
.hs-lane .hs-lane-tab[data-fit='full'] {
|
|
9621
|
+
min-width: var(--tab-whole);
|
|
9622
|
+
}
|
|
9623
|
+
.hs-lane .hs-lane-tab[data-fit='full'][data-sel='true'] {
|
|
9624
|
+
min-width: var(--tab-open);
|
|
9625
|
+
}
|
|
9626
|
+
.hs-lane .hs-lane-tab[data-fit='cut'] {
|
|
9627
|
+
min-width: min(var(--tab-w), calc(var(--tab-bare) + var(--tab-text-min)));
|
|
9628
|
+
}
|
|
9629
|
+
.hs-lane .hs-lane-tab[data-fit='mark'] {
|
|
9630
|
+
position: relative;
|
|
9631
|
+
flex: none;
|
|
9632
|
+
overflow: hidden;
|
|
9633
|
+
}
|
|
9634
|
+
.hs-lane:has(> .hs-lane-fan[data-open='true']) .hs-lane-tab:not([data-fit='mark']) {
|
|
9635
|
+
min-width: var(--tab-bare);
|
|
9636
|
+
}
|
|
9637
|
+
.hs-lane-tab[data-fit='mark'] > .hs-tab-label {
|
|
9638
|
+
position: absolute;
|
|
9639
|
+
visibility: hidden;
|
|
9640
|
+
pointer-events: none;
|
|
9641
|
+
}
|
|
9642
|
+
.hs-lane-probe {
|
|
9643
|
+
position: absolute;
|
|
9644
|
+
width: var(--tab-text-min);
|
|
9645
|
+
height: 0;
|
|
9646
|
+
visibility: hidden;
|
|
9647
|
+
pointer-events: none;
|
|
9648
|
+
}
|
|
9649
|
+
.hs-lane-tab-mark {
|
|
9650
|
+
display: grid;
|
|
9651
|
+
place-items: center;
|
|
9652
|
+
flex: none;
|
|
9653
|
+
}
|
|
9654
|
+
.hs-lane-tab > .hs-tab-label {
|
|
9655
|
+
flex: 1 1 0;
|
|
9656
|
+
min-width: 0;
|
|
9657
|
+
contain: inline-size;
|
|
9658
|
+
}
|
|
9659
|
+
.hs-lane-tab > .hs-tab-close {
|
|
9660
|
+
display: none;
|
|
9661
|
+
}
|
|
9662
|
+
.hs-lane-tab[data-hover='true'] > .hs-tab-close {
|
|
9663
|
+
display: grid;
|
|
9664
|
+
}
|
|
9665
|
+
.hs-lane-tab[data-fit='mark'] > .hs-tab-close {
|
|
9666
|
+
position: absolute;
|
|
9667
|
+
top: calc(var(--space) * 0.5);
|
|
9668
|
+
right: calc(var(--space) * 0.5);
|
|
9669
|
+
width: calc(var(--space) * 3.5);
|
|
9670
|
+
height: calc(var(--space) * 3.5);
|
|
9671
|
+
border-radius: var(--r-round);
|
|
9672
|
+
background: var(--card);
|
|
9673
|
+
box-shadow: var(--gloss-edge);
|
|
9674
|
+
}
|
|
9675
|
+
.hs-lane :is(.hs-tab-label, .hs-lane-crumb-app, .hs-lane-crumb-title)[data-cut] {
|
|
9676
|
+
-webkit-mask-image: linear-gradient(90deg, #000 calc(100% - var(--tab-fade)), transparent);
|
|
9677
|
+
mask-image: linear-gradient(90deg, #000 calc(100% - var(--tab-fade)), transparent);
|
|
9678
|
+
}
|
|
9679
|
+
.hs-tab-card {
|
|
9680
|
+
position: absolute;
|
|
9681
|
+
left: 0;
|
|
9682
|
+
top: 0;
|
|
9683
|
+
z-index: 4;
|
|
9684
|
+
display: flex;
|
|
9685
|
+
flex-direction: column;
|
|
9686
|
+
gap: var(--gap-stack);
|
|
9687
|
+
width: var(--tabcard-w);
|
|
9688
|
+
box-sizing: border-box;
|
|
9689
|
+
margin-top: var(--gap-tile);
|
|
9690
|
+
padding: var(--gap-stack);
|
|
9691
|
+
border-radius: var(--r-card);
|
|
9692
|
+
background: var(--tipbg);
|
|
9693
|
+
border: var(--bw) solid var(--tipline);
|
|
9694
|
+
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
9695
|
+
backdrop-filter: var(--blur-overlay);
|
|
9696
|
+
-webkit-backdrop-filter: var(--blur-overlay);
|
|
9697
|
+
opacity: 0;
|
|
9698
|
+
pointer-events: none;
|
|
9699
|
+
transition: transform var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
9700
|
+
}
|
|
9701
|
+
.hs-tab-card[data-glide='off'] {
|
|
9702
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9703
|
+
}
|
|
9704
|
+
.hs-tab-card[data-open='true'] {
|
|
9705
|
+
opacity: 1;
|
|
9706
|
+
}
|
|
9707
|
+
.hs-tab-card-title {
|
|
9708
|
+
padding: 0 var(--grab-inset);
|
|
9709
|
+
font-size: var(--fs-sm);
|
|
9710
|
+
font-weight: var(--fw-semi);
|
|
9711
|
+
color: var(--text);
|
|
9712
|
+
white-space: nowrap;
|
|
9713
|
+
overflow: hidden;
|
|
9714
|
+
text-overflow: ellipsis;
|
|
9715
|
+
}
|
|
9716
|
+
.hs-tab-card-preview {
|
|
9717
|
+
position: relative;
|
|
9718
|
+
aspect-ratio: 16 / 9;
|
|
9719
|
+
border-radius: var(--r-sm);
|
|
8729
9720
|
background: var(--card);
|
|
8730
9721
|
overflow: hidden;
|
|
8731
9722
|
}
|
|
8732
|
-
.hs-tab-card-preview > img {
|
|
8733
|
-
position: absolute;
|
|
8734
|
-
inset: 0;
|
|
8735
|
-
width: 100%;
|
|
8736
|
-
height: 100%;
|
|
8737
|
-
object-fit: cover;
|
|
8738
|
-
object-position: top left;
|
|
9723
|
+
.hs-tab-card-preview > img {
|
|
9724
|
+
position: absolute;
|
|
9725
|
+
inset: 0;
|
|
9726
|
+
width: 100%;
|
|
9727
|
+
height: 100%;
|
|
9728
|
+
object-fit: cover;
|
|
9729
|
+
object-position: top left;
|
|
9730
|
+
}
|
|
9731
|
+
.hs-lane-tab[data-leaving] {
|
|
9732
|
+
pointer-events: none;
|
|
9733
|
+
}
|
|
9734
|
+
.hs-workspace {
|
|
9735
|
+
position: relative;
|
|
9736
|
+
flex: 1;
|
|
9737
|
+
min-width: 0;
|
|
9738
|
+
min-height: 0;
|
|
9739
|
+
margin: 0 var(--edge) var(--edge) 0;
|
|
9740
|
+
isolation: isolate;
|
|
9741
|
+
}
|
|
9742
|
+
.hs-workspace[data-drag='row'], .hs-workspace[data-drag='row'] * {
|
|
9743
|
+
cursor: ew-resize;
|
|
9744
|
+
user-select: none;
|
|
9745
|
+
}
|
|
9746
|
+
.hs-workspace[data-drag='column'], .hs-workspace[data-drag='column'] * {
|
|
9747
|
+
cursor: ns-resize;
|
|
9748
|
+
user-select: none;
|
|
9749
|
+
}
|
|
9750
|
+
.hs-workspace[data-drag='tab'], .hs-workspace[data-drag='tab'] * {
|
|
9751
|
+
cursor: grabbing;
|
|
9752
|
+
user-select: none;
|
|
9753
|
+
}
|
|
9754
|
+
.hs-workspace-measure {
|
|
9755
|
+
position: absolute;
|
|
9756
|
+
left: 0;
|
|
9757
|
+
top: 0;
|
|
9758
|
+
visibility: hidden;
|
|
9759
|
+
pointer-events: none;
|
|
9760
|
+
}
|
|
9761
|
+
.hs-workspace-measure > span {
|
|
9762
|
+
position: absolute;
|
|
9763
|
+
display: block;
|
|
9764
|
+
width: 0;
|
|
9765
|
+
height: 0;
|
|
9766
|
+
}
|
|
9767
|
+
.hs-workspace-measure > [data-m='gap'] {
|
|
9768
|
+
width: var(--gap-tile);
|
|
9769
|
+
}
|
|
9770
|
+
.hs-workspace-measure > [data-m='grab'] {
|
|
9771
|
+
width: var(--grab-inset);
|
|
9772
|
+
}
|
|
9773
|
+
.hs-workspace-measure > [data-m='min-width'] {
|
|
9774
|
+
width: var(--w-tile-min);
|
|
9775
|
+
}
|
|
9776
|
+
.hs-workspace-measure > [data-m='min-height'] {
|
|
9777
|
+
height: var(--h-tile-min);
|
|
9778
|
+
}
|
|
9779
|
+
.hs-workspace-measure > [data-m='lane'] {
|
|
9780
|
+
height: var(--h-lane);
|
|
9781
|
+
}
|
|
9782
|
+
.hs-workspace-measure > [data-m='lane-low'] {
|
|
9783
|
+
height: var(--h-lane-low);
|
|
9784
|
+
}
|
|
9785
|
+
.hs-workspace-measure > [data-m='rule'] {
|
|
9786
|
+
height: var(--h-lane-rule);
|
|
9787
|
+
}
|
|
9788
|
+
.hs-workspace-measure > [data-m='border'] {
|
|
9789
|
+
width: var(--bw);
|
|
9790
|
+
}
|
|
9791
|
+
.hs-workspace-measure > [data-m='card'] {
|
|
9792
|
+
width: var(--tabcard-w);
|
|
9793
|
+
}
|
|
9794
|
+
.hs-lane-rule {
|
|
9795
|
+
position: absolute;
|
|
9796
|
+
width: var(--bw);
|
|
9797
|
+
height: var(--h-lane-rule);
|
|
9798
|
+
background: var(--tipline);
|
|
9799
|
+
opacity: var(--lane-rule-alpha);
|
|
9800
|
+
transform: translateX(-50%);
|
|
9801
|
+
pointer-events: none;
|
|
9802
|
+
}
|
|
9803
|
+
.hs-divider {
|
|
9804
|
+
position: absolute;
|
|
9805
|
+
z-index: 2;
|
|
9806
|
+
outline: none;
|
|
9807
|
+
touch-action: none;
|
|
9808
|
+
}
|
|
9809
|
+
.hs-divider[data-axis='row'] {
|
|
9810
|
+
cursor: ew-resize;
|
|
9811
|
+
}
|
|
9812
|
+
.hs-divider[data-axis='column'] {
|
|
9813
|
+
cursor: ns-resize;
|
|
9814
|
+
}
|
|
9815
|
+
.hs-divider:focus-visible {
|
|
9816
|
+
border-radius: var(--r-sm);
|
|
9817
|
+
box-shadow: var(--focus);
|
|
9818
|
+
}
|
|
9819
|
+
.hs-tile-drop {
|
|
9820
|
+
position: absolute;
|
|
9821
|
+
z-index: 3;
|
|
9822
|
+
box-sizing: border-box;
|
|
9823
|
+
border: var(--drop-border);
|
|
9824
|
+
border-radius: var(--r-tile);
|
|
9825
|
+
background: var(--scrim-soft);
|
|
9826
|
+
pointer-events: none;
|
|
9827
|
+
transition: left var(--dur) var(--ease-out), top var(--dur) var(--ease-out), width var(--dur) var(--ease-out), height var(--dur) var(--ease-out);
|
|
9828
|
+
}
|
|
9829
|
+
.hs-surfaces {
|
|
9830
|
+
position: absolute;
|
|
9831
|
+
inset: 0;
|
|
9832
|
+
z-index: 1;
|
|
9833
|
+
overflow: hidden;
|
|
9834
|
+
pointer-events: none;
|
|
9835
|
+
}
|
|
9836
|
+
.hs-surface {
|
|
9837
|
+
position: absolute;
|
|
9838
|
+
left: 0;
|
|
9839
|
+
top: 0;
|
|
9840
|
+
width: 1280px;
|
|
9841
|
+
height: 800px;
|
|
9842
|
+
display: flex;
|
|
9843
|
+
border-radius: calc(var(--r-tile) - var(--bw));
|
|
9844
|
+
overflow: hidden;
|
|
9845
|
+
visibility: hidden;
|
|
9846
|
+
content-visibility: hidden;
|
|
9847
|
+
}
|
|
9848
|
+
.hs-surface > * {
|
|
9849
|
+
flex: 1;
|
|
9850
|
+
min-width: 0;
|
|
9851
|
+
min-height: 0;
|
|
9852
|
+
}
|
|
9853
|
+
.hs-surface[data-state='live'] {
|
|
9854
|
+
visibility: visible;
|
|
9855
|
+
content-visibility: visible;
|
|
9856
|
+
pointer-events: auto;
|
|
8739
9857
|
}
|
|
8740
|
-
.hs-
|
|
9858
|
+
.hs-surface:has(webview[data-awake='true']) {
|
|
9859
|
+
content-visibility: visible;
|
|
9860
|
+
}
|
|
9861
|
+
.hs-surface:not([data-state='live']):has(webview[data-awake='true']) {
|
|
9862
|
+
opacity: 0;
|
|
9863
|
+
}
|
|
9864
|
+
.hs-surfaces[data-drag='true'] .hs-surface, .hs-surfaces[data-drag='true'] .hs-surface :is(webview, iframe) {
|
|
8741
9865
|
pointer-events: none;
|
|
8742
9866
|
}
|
|
8743
|
-
.hs-
|
|
9867
|
+
.hs-surface[data-clip='run'] {
|
|
9868
|
+
transition: clip-path var(--dur-slow) var(--ease-out);
|
|
9869
|
+
}
|
|
9870
|
+
.hs-fan {
|
|
9871
|
+
--fan-step: calc(var(--fan-size) + var(--fan-gap));
|
|
8744
9872
|
position: relative;
|
|
8745
|
-
flex:
|
|
8746
|
-
|
|
8747
|
-
|
|
8748
|
-
|
|
8749
|
-
isolation: isolate;
|
|
9873
|
+
flex: none;
|
|
9874
|
+
width: var(--fan-size);
|
|
9875
|
+
height: var(--fan-size);
|
|
9876
|
+
transition: width var(--dur-slow) var(--ease-out), height var(--dur-slow) var(--ease-out);
|
|
8750
9877
|
}
|
|
8751
|
-
.hs-
|
|
8752
|
-
|
|
8753
|
-
user-select: none;
|
|
9878
|
+
.hs-fan[data-axis='row'][data-open='true'] {
|
|
9879
|
+
width: calc(var(--fan-n) * var(--fan-step) - var(--fan-gap));
|
|
8754
9880
|
}
|
|
8755
|
-
.hs-
|
|
8756
|
-
|
|
8757
|
-
user-select: none;
|
|
9881
|
+
.hs-fan[data-axis='column'][data-open='true'] {
|
|
9882
|
+
height: calc(var(--fan-n) * var(--fan-step) - var(--fan-gap));
|
|
8758
9883
|
}
|
|
8759
|
-
.hs-
|
|
8760
|
-
|
|
8761
|
-
|
|
9884
|
+
.hs-fan-arrow {
|
|
9885
|
+
position: absolute;
|
|
9886
|
+
display: grid;
|
|
9887
|
+
place-items: center;
|
|
9888
|
+
color: var(--dim);
|
|
9889
|
+
pointer-events: none;
|
|
9890
|
+
transition: opacity var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
8762
9891
|
}
|
|
8763
|
-
.hs-
|
|
9892
|
+
.hs-fan[data-axis='row'] > .hs-fan-arrow {
|
|
9893
|
+
right: calc(var(--fan-size) - var(--fan-arrow-at));
|
|
9894
|
+
top: 50%;
|
|
9895
|
+
translate: 50% -50%;
|
|
9896
|
+
}
|
|
9897
|
+
.hs-fan[data-axis='column'] > .hs-fan-arrow {
|
|
9898
|
+
bottom: calc(var(--fan-size) - var(--fan-arrow-at));
|
|
9899
|
+
left: 50%;
|
|
9900
|
+
translate: -50% 50%;
|
|
9901
|
+
}
|
|
9902
|
+
.hs-fan[data-open='true'] > :is(.hs-fan-arrow, .hs-fan-dot) {
|
|
9903
|
+
opacity: 0;
|
|
9904
|
+
}
|
|
9905
|
+
.hs-fan-dot, .hs-fan-item-dot {
|
|
8764
9906
|
position: absolute;
|
|
8765
|
-
|
|
8766
|
-
|
|
8767
|
-
|
|
9907
|
+
z-index: 1;
|
|
9908
|
+
width: calc(var(--space) * 1.25);
|
|
9909
|
+
height: calc(var(--space) * 1.25);
|
|
9910
|
+
border-radius: var(--r-round);
|
|
9911
|
+
background: var(--accent-grad);
|
|
9912
|
+
right: calc(var(--fan-size) / 2 - var(--fan-dot-x));
|
|
9913
|
+
bottom: calc(var(--fan-size) / 2 + var(--fan-dot-y));
|
|
9914
|
+
translate: 50% 50%;
|
|
8768
9915
|
pointer-events: none;
|
|
9916
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
8769
9917
|
}
|
|
8770
|
-
.hs-
|
|
9918
|
+
.hs-fan > .hs-fan-item {
|
|
8771
9919
|
position: absolute;
|
|
8772
|
-
|
|
8773
|
-
|
|
8774
|
-
|
|
9920
|
+
right: 0;
|
|
9921
|
+
bottom: 0;
|
|
9922
|
+
width: var(--fan-size);
|
|
9923
|
+
height: var(--fan-size);
|
|
9924
|
+
scale: var(--fan-tuck);
|
|
9925
|
+
opacity: 0;
|
|
9926
|
+
filter: var(--blur-fan);
|
|
9927
|
+
pointer-events: none;
|
|
9928
|
+
transition: translate var(--dur-slow) var(--ease-out), scale var(--dur-slow) var(--ease-out), opacity var(--dur-slow) var(--ease-out), filter var(--dur-slow) var(--ease-out);
|
|
8775
9929
|
}
|
|
8776
|
-
.hs-
|
|
8777
|
-
|
|
9930
|
+
.hs-fan > .hs-fan-item:last-child {
|
|
9931
|
+
scale: 1;
|
|
9932
|
+
opacity: 1;
|
|
9933
|
+
filter: none;
|
|
8778
9934
|
}
|
|
8779
|
-
.hs-
|
|
8780
|
-
|
|
9935
|
+
.hs-fan[data-open='false'] > .hs-fan-item {
|
|
9936
|
+
background: none;
|
|
9937
|
+
box-shadow: none;
|
|
8781
9938
|
}
|
|
8782
|
-
.hs-
|
|
8783
|
-
|
|
9939
|
+
.hs-fan[data-open='true'] > .hs-fan-item {
|
|
9940
|
+
scale: 1;
|
|
9941
|
+
opacity: 1;
|
|
9942
|
+
filter: none;
|
|
9943
|
+
pointer-events: auto;
|
|
9944
|
+
transition-delay: calc(var(--fan-k) * var(--dur-stagger));
|
|
9945
|
+
}
|
|
9946
|
+
.hs-fan[data-open='true'] > .hs-fan-item:hover {
|
|
9947
|
+
transition: translate var(--dur-slow) var(--ease-out), scale var(--dur-slow) var(--ease-out), opacity var(--dur-slow) var(--ease-out), filter var(--dur-slow) var(--ease-out), background-color var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
9948
|
+
transition-delay: 0s;
|
|
9949
|
+
}
|
|
9950
|
+
.hs-fan[data-axis='row'][data-open='true'] > .hs-fan-item {
|
|
9951
|
+
translate: calc(-1 * var(--fan-k) * var(--fan-step)) 0;
|
|
9952
|
+
}
|
|
9953
|
+
.hs-fan[data-axis='column'][data-open='true'] > .hs-fan-item {
|
|
9954
|
+
translate: 0 calc(-1 * var(--fan-k) * var(--fan-step));
|
|
9955
|
+
}
|
|
9956
|
+
[data-swatch='rose'] {
|
|
9957
|
+
--swatch: var(--swatch-rose);
|
|
9958
|
+
--swatch-tint: var(--swatch-rose-tint);
|
|
9959
|
+
--swatch-ink: var(--swatch-rose-ink);
|
|
9960
|
+
}
|
|
9961
|
+
[data-swatch='ember'] {
|
|
9962
|
+
--swatch: var(--swatch-ember);
|
|
9963
|
+
--swatch-tint: var(--swatch-ember-tint);
|
|
9964
|
+
--swatch-ink: var(--swatch-ember-ink);
|
|
9965
|
+
}
|
|
9966
|
+
[data-swatch='amber'] {
|
|
9967
|
+
--swatch: var(--swatch-amber);
|
|
9968
|
+
--swatch-tint: var(--swatch-amber-tint);
|
|
9969
|
+
--swatch-ink: var(--swatch-amber-ink);
|
|
9970
|
+
}
|
|
9971
|
+
[data-swatch='sun'] {
|
|
9972
|
+
--swatch: var(--swatch-sun);
|
|
9973
|
+
--swatch-tint: var(--swatch-sun-tint);
|
|
9974
|
+
--swatch-ink: var(--swatch-sun-ink);
|
|
9975
|
+
}
|
|
9976
|
+
[data-swatch='lime'] {
|
|
9977
|
+
--swatch: var(--swatch-lime);
|
|
9978
|
+
--swatch-tint: var(--swatch-lime-tint);
|
|
9979
|
+
--swatch-ink: var(--swatch-lime-ink);
|
|
9980
|
+
}
|
|
9981
|
+
[data-swatch='moss'] {
|
|
9982
|
+
--swatch: var(--swatch-moss);
|
|
9983
|
+
--swatch-tint: var(--swatch-moss-tint);
|
|
9984
|
+
--swatch-ink: var(--swatch-moss-ink);
|
|
9985
|
+
}
|
|
9986
|
+
[data-swatch='jade'] {
|
|
9987
|
+
--swatch: var(--swatch-jade);
|
|
9988
|
+
--swatch-tint: var(--swatch-jade-tint);
|
|
9989
|
+
--swatch-ink: var(--swatch-jade-ink);
|
|
9990
|
+
}
|
|
9991
|
+
[data-swatch='sky'] {
|
|
9992
|
+
--swatch: var(--swatch-sky);
|
|
9993
|
+
--swatch-tint: var(--swatch-sky-tint);
|
|
9994
|
+
--swatch-ink: var(--swatch-sky-ink);
|
|
9995
|
+
}
|
|
9996
|
+
[data-swatch='ocean'] {
|
|
9997
|
+
--swatch: var(--swatch-ocean);
|
|
9998
|
+
--swatch-tint: var(--swatch-ocean-tint);
|
|
9999
|
+
--swatch-ink: var(--swatch-ocean-ink);
|
|
10000
|
+
}
|
|
10001
|
+
[data-swatch='indigo'] {
|
|
10002
|
+
--swatch: var(--swatch-indigo);
|
|
10003
|
+
--swatch-tint: var(--swatch-indigo-tint);
|
|
10004
|
+
--swatch-ink: var(--swatch-indigo-ink);
|
|
10005
|
+
}
|
|
10006
|
+
[data-swatch='violet'] {
|
|
10007
|
+
--swatch: var(--swatch-violet);
|
|
10008
|
+
--swatch-tint: var(--swatch-violet-tint);
|
|
10009
|
+
--swatch-ink: var(--swatch-violet-ink);
|
|
10010
|
+
}
|
|
10011
|
+
[data-swatch='plum'] {
|
|
10012
|
+
--swatch: var(--swatch-plum);
|
|
10013
|
+
--swatch-tint: var(--swatch-plum-tint);
|
|
10014
|
+
--swatch-ink: var(--swatch-plum-ink);
|
|
10015
|
+
}
|
|
10016
|
+
[data-swatch='slate'] {
|
|
10017
|
+
--swatch: var(--swatch-slate);
|
|
10018
|
+
--swatch-tint: var(--swatch-slate-tint);
|
|
10019
|
+
--swatch-ink: var(--swatch-slate-ink);
|
|
10020
|
+
}
|
|
10021
|
+
.hs-tinted {
|
|
10022
|
+
border-radius: var(--r-sm);
|
|
10023
|
+
background: var(--swatch-tint);
|
|
10024
|
+
color: var(--swatch-ink);
|
|
8784
10025
|
}
|
|
8785
|
-
.hs-
|
|
8786
|
-
|
|
10026
|
+
.hs-tinted[data-selected='true'] {
|
|
10027
|
+
background: var(--swatch);
|
|
10028
|
+
color: var(--swatch-fill-ink);
|
|
8787
10029
|
}
|
|
8788
|
-
.hs-
|
|
8789
|
-
|
|
10030
|
+
.hs-swatch-dot {
|
|
10031
|
+
flex: none;
|
|
10032
|
+
width: calc(var(--space) * 2);
|
|
10033
|
+
height: calc(var(--space) * 2);
|
|
10034
|
+
border-radius: var(--r-round);
|
|
10035
|
+
background: var(--swatch);
|
|
10036
|
+
}
|
|
10037
|
+
.hs-swatch-picker {
|
|
10038
|
+
display: flex;
|
|
10039
|
+
flex-wrap: wrap;
|
|
10040
|
+
gap: calc(var(--space) * 1.5);
|
|
10041
|
+
}
|
|
10042
|
+
.hs-swatch-choice {
|
|
10043
|
+
width: calc(var(--space) * 5.5);
|
|
10044
|
+
height: calc(var(--space) * 5.5);
|
|
10045
|
+
padding: 0;
|
|
10046
|
+
border: none;
|
|
10047
|
+
border-radius: var(--r-round);
|
|
10048
|
+
background: var(--swatch);
|
|
10049
|
+
box-shadow: var(--shadow-swatch);
|
|
10050
|
+
cursor: pointer;
|
|
10051
|
+
}
|
|
10052
|
+
.hs-swatch-choice[aria-checked='true'] {
|
|
10053
|
+
box-shadow: 0 0 0 calc(var(--bw) * 2) var(--win), 0 0 0 calc(var(--bw) * 4) var(--swatch);
|
|
10054
|
+
}
|
|
10055
|
+
.hs-swatch-choice:focus-visible {
|
|
10056
|
+
outline: none;
|
|
10057
|
+
box-shadow: 0 0 0 calc(var(--bw) * 2) var(--win), var(--focus);
|
|
10058
|
+
}
|
|
10059
|
+
.hs-slider {
|
|
10060
|
+
display: flex;
|
|
10061
|
+
align-items: center;
|
|
10062
|
+
gap: var(--gap-row);
|
|
10063
|
+
min-width: 0;
|
|
10064
|
+
font-size: var(--fs-sm);
|
|
10065
|
+
color: var(--text);
|
|
10066
|
+
}
|
|
10067
|
+
.hs-slider > .hs-range {
|
|
10068
|
+
flex: 1;
|
|
10069
|
+
min-width: calc(var(--space) * 20);
|
|
10070
|
+
width: auto;
|
|
10071
|
+
}
|
|
10072
|
+
.hs-slider > .hs-range:disabled {
|
|
10073
|
+
opacity: var(--press-fade);
|
|
10074
|
+
}
|
|
10075
|
+
.hs-slider > .hs-range:disabled::-webkit-slider-thumb {
|
|
10076
|
+
cursor: default;
|
|
10077
|
+
}
|
|
10078
|
+
.hs-slider-value {
|
|
10079
|
+
flex: none;
|
|
10080
|
+
min-width: calc(var(--space) * 9);
|
|
10081
|
+
text-align: right;
|
|
10082
|
+
font-variant-numeric: tabular-nums;
|
|
10083
|
+
color: var(--mut);
|
|
10084
|
+
}
|
|
10085
|
+
.hs-popover {
|
|
10086
|
+
position: absolute;
|
|
10087
|
+
z-index: 40;
|
|
10088
|
+
box-sizing: border-box;
|
|
10089
|
+
padding: calc(var(--space) * 3);
|
|
10090
|
+
border: var(--bw) solid var(--tipline);
|
|
10091
|
+
border-radius: var(--r-card);
|
|
10092
|
+
background: var(--plate-menu);
|
|
10093
|
+
backdrop-filter: var(--blur-surface);
|
|
10094
|
+
-webkit-backdrop-filter: var(--blur-surface);
|
|
10095
|
+
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
10096
|
+
color: var(--text);
|
|
10097
|
+
overflow: auto;
|
|
10098
|
+
overscroll-behavior: contain;
|
|
10099
|
+
outline: none;
|
|
10100
|
+
animation: hsPop var(--dur) var(--ease-out);
|
|
10101
|
+
}
|
|
10102
|
+
.hs-toast-place {
|
|
10103
|
+
position: fixed;
|
|
10104
|
+
z-index: 50;
|
|
10105
|
+
left: 50%;
|
|
10106
|
+
bottom: calc(var(--space) * 4);
|
|
10107
|
+
transform: translateX(-50%);
|
|
10108
|
+
max-width: calc(100vw - var(--space) * 8);
|
|
10109
|
+
}
|
|
10110
|
+
.hs-toast-place[data-above='true'] {
|
|
10111
|
+
display: flex;
|
|
10112
|
+
justify-content: center;
|
|
10113
|
+
transform: none;
|
|
10114
|
+
max-width: none;
|
|
10115
|
+
}
|
|
10116
|
+
.hs-toast-place[data-above='true'] > .hs-toast {
|
|
10117
|
+
min-width: 0;
|
|
10118
|
+
max-width: 100%;
|
|
10119
|
+
}
|
|
10120
|
+
.hs-toast {
|
|
10121
|
+
display: flex;
|
|
10122
|
+
align-items: center;
|
|
10123
|
+
gap: calc(var(--space) * 2);
|
|
10124
|
+
padding: calc(var(--space) * 1.5) calc(var(--space) * 1.5) calc(var(--space) * 1.5) calc(var(--space) * 3.5);
|
|
10125
|
+
border: var(--bw) solid var(--tipline);
|
|
10126
|
+
border-radius: var(--r-card);
|
|
10127
|
+
background: var(--plate-menu);
|
|
10128
|
+
backdrop-filter: var(--blur-surface);
|
|
10129
|
+
-webkit-backdrop-filter: var(--blur-surface);
|
|
10130
|
+
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
10131
|
+
font-size: var(--fs-sm);
|
|
10132
|
+
color: var(--text);
|
|
10133
|
+
animation: hsToast var(--dur) var(--ease-out);
|
|
10134
|
+
}
|
|
10135
|
+
.hs-toast-text {
|
|
10136
|
+
flex: 1;
|
|
10137
|
+
min-width: 0;
|
|
10138
|
+
}
|
|
10139
|
+
@keyframes hsToast {
|
|
10140
|
+
from {
|
|
10141
|
+
opacity: 0;
|
|
10142
|
+
transform: translateY(calc(var(--space) * 2));
|
|
10143
|
+
}
|
|
10144
|
+
}
|
|
10145
|
+
.hs-picker-field {
|
|
10146
|
+
display: inline-flex;
|
|
10147
|
+
align-items: center;
|
|
10148
|
+
width: auto;
|
|
10149
|
+
min-width: calc(var(--space) * 30);
|
|
10150
|
+
text-align: left;
|
|
10151
|
+
font-variant-numeric: tabular-nums;
|
|
10152
|
+
cursor: pointer;
|
|
10153
|
+
}
|
|
10154
|
+
.hs-picker-field[data-empty='true'] {
|
|
10155
|
+
color: var(--dim);
|
|
10156
|
+
}
|
|
10157
|
+
.hs-picker-field:disabled {
|
|
10158
|
+
opacity: var(--press-fade);
|
|
10159
|
+
cursor: default;
|
|
10160
|
+
}
|
|
10161
|
+
.hs-date-grid {
|
|
10162
|
+
display: flex;
|
|
10163
|
+
flex-direction: column;
|
|
10164
|
+
gap: var(--space);
|
|
10165
|
+
width: max-content;
|
|
10166
|
+
font-size: var(--fs-sm);
|
|
10167
|
+
}
|
|
10168
|
+
.hs-date-grid-head {
|
|
10169
|
+
display: flex;
|
|
10170
|
+
align-items: center;
|
|
10171
|
+
gap: var(--space);
|
|
10172
|
+
}
|
|
10173
|
+
.hs-date-grid-month {
|
|
10174
|
+
flex: 1;
|
|
10175
|
+
padding-left: var(--space);
|
|
10176
|
+
font-weight: var(--fw-semi);
|
|
10177
|
+
}
|
|
10178
|
+
.hs-date-grid-days {
|
|
10179
|
+
display: grid;
|
|
10180
|
+
grid-template-columns: repeat(7, calc(var(--space) * 8));
|
|
10181
|
+
grid-auto-rows: calc(var(--space) * 8);
|
|
10182
|
+
}
|
|
10183
|
+
.hs-date-grid-row {
|
|
10184
|
+
display: contents;
|
|
10185
|
+
}
|
|
10186
|
+
.hs-date-grid-weekday {
|
|
10187
|
+
display: grid;
|
|
10188
|
+
place-items: center;
|
|
10189
|
+
font-size: var(--fs-cap);
|
|
10190
|
+
color: var(--dim);
|
|
10191
|
+
}
|
|
10192
|
+
.hs-date-grid-day {
|
|
10193
|
+
display: grid;
|
|
10194
|
+
place-items: center;
|
|
10195
|
+
padding: 0;
|
|
10196
|
+
border: none;
|
|
10197
|
+
border-radius: var(--r-round);
|
|
10198
|
+
background: none;
|
|
10199
|
+
font: inherit;
|
|
10200
|
+
font-variant-numeric: tabular-nums;
|
|
10201
|
+
color: var(--text);
|
|
10202
|
+
cursor: pointer;
|
|
10203
|
+
}
|
|
10204
|
+
.hs-date-grid-day:hover {
|
|
10205
|
+
background: var(--hov);
|
|
10206
|
+
}
|
|
10207
|
+
.hs-date-grid-day[data-outside='true'] {
|
|
10208
|
+
color: var(--dim);
|
|
10209
|
+
}
|
|
10210
|
+
.hs-date-grid-day[data-today='true'] {
|
|
10211
|
+
color: var(--accent);
|
|
10212
|
+
font-weight: var(--fw-semi);
|
|
10213
|
+
}
|
|
10214
|
+
.hs-date-grid-day[aria-selected='true'] {
|
|
10215
|
+
background: var(--selection);
|
|
10216
|
+
color: var(--selection-ink);
|
|
10217
|
+
font-weight: var(--fw-semi);
|
|
10218
|
+
}
|
|
10219
|
+
.hs-date-grid-day:disabled {
|
|
10220
|
+
color: var(--dim);
|
|
10221
|
+
opacity: var(--press-fade);
|
|
10222
|
+
cursor: default;
|
|
10223
|
+
}
|
|
10224
|
+
.hs-date-grid-day:disabled:hover {
|
|
10225
|
+
background: none;
|
|
10226
|
+
}
|
|
10227
|
+
.hs-date-grid-day:focus-visible {
|
|
10228
|
+
outline: none;
|
|
10229
|
+
box-shadow: var(--focus);
|
|
10230
|
+
}
|
|
10231
|
+
.hs-person-mark {
|
|
10232
|
+
flex: none;
|
|
10233
|
+
display: inline-grid;
|
|
10234
|
+
place-items: center;
|
|
10235
|
+
overflow: hidden;
|
|
10236
|
+
width: calc(var(--space) * 6);
|
|
10237
|
+
height: calc(var(--space) * 6);
|
|
10238
|
+
border-radius: var(--r-round);
|
|
10239
|
+
background: var(--swatch-tint);
|
|
10240
|
+
color: var(--swatch-ink);
|
|
10241
|
+
font-size: var(--fs-cap);
|
|
10242
|
+
font-weight: var(--fw-semi);
|
|
10243
|
+
line-height: 1;
|
|
10244
|
+
user-select: none;
|
|
10245
|
+
}
|
|
10246
|
+
.hs-person-mark[data-size='sm'] {
|
|
10247
|
+
width: calc(var(--space) * 5);
|
|
10248
|
+
height: calc(var(--space) * 5);
|
|
10249
|
+
font-size: var(--fs-mono-xs);
|
|
10250
|
+
}
|
|
10251
|
+
.hs-person-mark[data-size='lg'] {
|
|
10252
|
+
width: calc(var(--space) * 10);
|
|
10253
|
+
height: calc(var(--space) * 10);
|
|
10254
|
+
font-size: var(--fs-body);
|
|
10255
|
+
}
|
|
10256
|
+
.hs-person-mark img {
|
|
10257
|
+
width: 100%;
|
|
10258
|
+
height: 100%;
|
|
10259
|
+
object-fit: cover;
|
|
10260
|
+
}
|
|
10261
|
+
.hs-virtual-list {
|
|
10262
|
+
overflow-y: auto;
|
|
10263
|
+
overscroll-behavior: contain;
|
|
8790
10264
|
}
|
|
8791
|
-
.hs-
|
|
8792
|
-
|
|
10265
|
+
.hs-virtual-list-rows {
|
|
10266
|
+
position: relative;
|
|
10267
|
+
width: 100%;
|
|
8793
10268
|
}
|
|
8794
|
-
.hs-
|
|
8795
|
-
|
|
10269
|
+
.hs-virtual-list-row {
|
|
10270
|
+
position: absolute;
|
|
10271
|
+
top: 0;
|
|
10272
|
+
left: 0;
|
|
10273
|
+
width: 100%;
|
|
8796
10274
|
}
|
|
8797
|
-
.hs-
|
|
8798
|
-
|
|
10275
|
+
.hs-picture-compare {
|
|
10276
|
+
position: relative;
|
|
10277
|
+
overflow: hidden;
|
|
10278
|
+
border-radius: var(--r-card);
|
|
10279
|
+
user-select: none;
|
|
10280
|
+
touch-action: none;
|
|
8799
10281
|
}
|
|
8800
|
-
.hs-
|
|
8801
|
-
|
|
10282
|
+
.hs-picture-compare img {
|
|
10283
|
+
display: block;
|
|
10284
|
+
width: 100%;
|
|
10285
|
+
height: auto;
|
|
10286
|
+
pointer-events: none;
|
|
8802
10287
|
}
|
|
8803
|
-
.hs-
|
|
10288
|
+
.hs-picture-compare-after {
|
|
8804
10289
|
position: absolute;
|
|
8805
|
-
|
|
8806
|
-
height: var(--h-lane-rule);
|
|
8807
|
-
background: var(--tipline);
|
|
8808
|
-
opacity: var(--lane-rule-alpha);
|
|
8809
|
-
transform: translateX(-50%);
|
|
8810
|
-
pointer-events: none;
|
|
10290
|
+
inset: 0;
|
|
8811
10291
|
}
|
|
8812
|
-
.hs-
|
|
10292
|
+
.hs-picture-compare-after img {
|
|
10293
|
+
height: 100%;
|
|
10294
|
+
object-fit: cover;
|
|
10295
|
+
}
|
|
10296
|
+
.hs-picture-compare-handle {
|
|
8813
10297
|
position: absolute;
|
|
8814
|
-
|
|
10298
|
+
top: 0;
|
|
10299
|
+
bottom: 0;
|
|
10300
|
+
width: calc(var(--space) * 6);
|
|
10301
|
+
margin-left: calc(var(--space) * -3);
|
|
10302
|
+
display: grid;
|
|
10303
|
+
place-items: center;
|
|
10304
|
+
cursor: ew-resize;
|
|
8815
10305
|
outline: none;
|
|
8816
|
-
touch-action: none;
|
|
8817
10306
|
}
|
|
8818
|
-
.hs-
|
|
8819
|
-
|
|
10307
|
+
.hs-picture-compare-handle::before {
|
|
10308
|
+
content: '';
|
|
10309
|
+
position: absolute;
|
|
10310
|
+
top: 0;
|
|
10311
|
+
bottom: 0;
|
|
10312
|
+
left: 50%;
|
|
10313
|
+
width: calc(var(--bw) * 2);
|
|
10314
|
+
margin-left: calc(var(--bw) * -1);
|
|
10315
|
+
background: var(--picture-ink);
|
|
10316
|
+
box-shadow: var(--shadow-thumb);
|
|
8820
10317
|
}
|
|
8821
|
-
.hs-
|
|
8822
|
-
|
|
10318
|
+
.hs-picture-compare-knob {
|
|
10319
|
+
position: relative;
|
|
10320
|
+
width: calc(var(--space) * 5);
|
|
10321
|
+
height: calc(var(--space) * 5);
|
|
10322
|
+
border-radius: var(--r-round);
|
|
10323
|
+
background: var(--picture-ink);
|
|
10324
|
+
box-shadow: var(--shadow-thumb);
|
|
8823
10325
|
}
|
|
8824
|
-
.hs-
|
|
8825
|
-
border-radius: var(--r-sm);
|
|
10326
|
+
.hs-picture-compare-handle:focus-visible .hs-picture-compare-knob {
|
|
8826
10327
|
box-shadow: var(--focus);
|
|
8827
10328
|
}
|
|
8828
|
-
.hs-
|
|
10329
|
+
.hs-picture-compare-name {
|
|
8829
10330
|
position: absolute;
|
|
8830
|
-
|
|
8831
|
-
|
|
8832
|
-
border: var(--
|
|
8833
|
-
|
|
8834
|
-
|
|
10331
|
+
top: calc(var(--space) * 2);
|
|
10332
|
+
padding: calc(var(--space) * 0.5) calc(var(--space) * 1.5);
|
|
10333
|
+
border-radius: var(--r-pill);
|
|
10334
|
+
background: var(--scrim);
|
|
10335
|
+
color: var(--scrim-ink);
|
|
10336
|
+
font-size: var(--fs-cap);
|
|
8835
10337
|
pointer-events: none;
|
|
8836
10338
|
}
|
|
8837
|
-
.hs-
|
|
8838
|
-
|
|
8839
|
-
inset: 0;
|
|
8840
|
-
z-index: 1;
|
|
8841
|
-
overflow: hidden;
|
|
8842
|
-
pointer-events: none;
|
|
10339
|
+
.hs-picture-compare-name[data-side='before'] {
|
|
10340
|
+
left: calc(var(--space) * 2);
|
|
8843
10341
|
}
|
|
8844
|
-
.hs-
|
|
8845
|
-
|
|
8846
|
-
|
|
8847
|
-
|
|
8848
|
-
|
|
8849
|
-
|
|
10342
|
+
.hs-picture-compare-name[data-side='after'] {
|
|
10343
|
+
right: calc(var(--space) * 2);
|
|
10344
|
+
}
|
|
10345
|
+
.hs-rich-text {
|
|
10346
|
+
outline: none;
|
|
10347
|
+
font-size: var(--fs-body);
|
|
10348
|
+
line-height: var(--lh-body);
|
|
10349
|
+
color: var(--text);
|
|
10350
|
+
overflow-wrap: anywhere;
|
|
10351
|
+
}
|
|
10352
|
+
.hs-rich-text [data-model] {
|
|
10353
|
+
color: var(--mut);
|
|
10354
|
+
}
|
|
10355
|
+
.hs-rich-text pre {
|
|
10356
|
+
margin: calc(var(--space) * 2.5) 0;
|
|
10357
|
+
padding: calc(var(--space) * 3);
|
|
10358
|
+
border-radius: var(--r-card);
|
|
10359
|
+
background: var(--card);
|
|
10360
|
+
overflow-x: auto;
|
|
10361
|
+
}
|
|
10362
|
+
.hs-rich-text pre code {
|
|
10363
|
+
padding: 0;
|
|
10364
|
+
background: none;
|
|
10365
|
+
}
|
|
10366
|
+
.hs-rich-text ul[data-type='taskList'] {
|
|
10367
|
+
padding-left: 0;
|
|
10368
|
+
list-style: none;
|
|
10369
|
+
}
|
|
10370
|
+
.hs-rich-text ul[data-type='taskList'] > li {
|
|
8850
10371
|
display: flex;
|
|
8851
|
-
|
|
8852
|
-
|
|
8853
|
-
visibility: hidden;
|
|
8854
|
-
content-visibility: hidden;
|
|
10372
|
+
align-items: flex-start;
|
|
10373
|
+
gap: calc(var(--space) * 2);
|
|
8855
10374
|
}
|
|
8856
|
-
.hs-
|
|
8857
|
-
flex:
|
|
8858
|
-
|
|
8859
|
-
|
|
10375
|
+
.hs-rich-text ul[data-type='taskList'] > li > label {
|
|
10376
|
+
flex: none;
|
|
10377
|
+
display: flex;
|
|
10378
|
+
align-items: center;
|
|
10379
|
+
height: calc(1em * var(--lh-body));
|
|
8860
10380
|
}
|
|
8861
|
-
.hs-
|
|
8862
|
-
|
|
8863
|
-
|
|
8864
|
-
pointer-events: auto;
|
|
10381
|
+
.hs-rich-text ul[data-type='taskList'] > li > label input {
|
|
10382
|
+
margin: 0;
|
|
10383
|
+
accent-color: var(--accent);
|
|
8865
10384
|
}
|
|
8866
|
-
.hs-
|
|
8867
|
-
|
|
10385
|
+
.hs-rich-text ul[data-type='taskList'] > li > div {
|
|
10386
|
+
flex: 1;
|
|
10387
|
+
min-width: 0;
|
|
8868
10388
|
}
|
|
8869
|
-
.hs-
|
|
8870
|
-
|
|
10389
|
+
.hs-rich-text li[data-checked='true'] > div {
|
|
10390
|
+
color: var(--dim);
|
|
10391
|
+
text-decoration: line-through;
|
|
8871
10392
|
}
|
|
8872
|
-
.hs-
|
|
10393
|
+
.hs-rich-text .is-editor-empty:first-child::before {
|
|
10394
|
+
content: attr(data-placeholder);
|
|
10395
|
+
float: left;
|
|
10396
|
+
height: 0;
|
|
10397
|
+
color: var(--dim);
|
|
8873
10398
|
pointer-events: none;
|
|
8874
10399
|
}
|
|
8875
|
-
.hs-surface[data-clip='run'] {
|
|
8876
|
-
transition: clip-path var(--dur-slow) var(--ease-out);
|
|
8877
|
-
}
|
|
8878
10400
|
}
|
|
8879
10401
|
@layer hs.base, hs.theme, hs.colourway, hs.guard;
|
|
8880
10402
|
@font-face {
|
|
@@ -8971,6 +10493,14 @@
|
|
|
8971
10493
|
@supports (color: color-mix(in lab, red, red)) {
|
|
8972
10494
|
--plate: color-mix(in srgb, var(--card) 60%, var(--win));
|
|
8973
10495
|
}
|
|
10496
|
+
--hov-plate: var(--text);
|
|
10497
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10498
|
+
--hov-plate: color-mix(in srgb, var(--text) 7%, var(--plate));
|
|
10499
|
+
}
|
|
10500
|
+
--press: var(--text);
|
|
10501
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10502
|
+
--press: color-mix(in srgb, var(--text) 14%, transparent);
|
|
10503
|
+
}
|
|
8974
10504
|
--act: rgba(158, 166, 182, 0.19);
|
|
8975
10505
|
--accent: #ff9d2e;
|
|
8976
10506
|
--link: var(--accent);
|
|
@@ -8978,6 +10508,7 @@
|
|
|
8978
10508
|
--selection-ink: var(--text);
|
|
8979
10509
|
--switch-radius: 6px;
|
|
8980
10510
|
--switch-gloss: var(--glimmer);
|
|
10511
|
+
--switch-gloss-on: rgba(255, 255, 255, 0.25);
|
|
8981
10512
|
--switch-thumb-radius: 4px;
|
|
8982
10513
|
--switch-thumb: var(--mut);
|
|
8983
10514
|
--switch-thumb-on: var(--accent-ink);
|
|
@@ -8993,6 +10524,130 @@
|
|
|
8993
10524
|
--ok: #3fb950;
|
|
8994
10525
|
--warn: #d29922;
|
|
8995
10526
|
--bad-ink: #fff;
|
|
10527
|
+
--swatch-tint-share: 22%;
|
|
10528
|
+
--swatch-fill-ink: #fff;
|
|
10529
|
+
--swatch-rose: #eb617e;
|
|
10530
|
+
--swatch-rose-ink: #fe9aaa;
|
|
10531
|
+
--swatch-rose-tint: var(--swatch-rose);
|
|
10532
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10533
|
+
--swatch-rose-tint: color-mix(
|
|
10534
|
+
in srgb,
|
|
10535
|
+
var(--swatch-rose) var(--swatch-tint-share),
|
|
10536
|
+
transparent
|
|
10537
|
+
);
|
|
10538
|
+
}
|
|
10539
|
+
--swatch-ember: #eb693f;
|
|
10540
|
+
--swatch-ember-ink: #fea082;
|
|
10541
|
+
--swatch-ember-tint: var(--swatch-ember);
|
|
10542
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10543
|
+
--swatch-ember-tint: color-mix(
|
|
10544
|
+
in srgb,
|
|
10545
|
+
var(--swatch-ember) var(--swatch-tint-share),
|
|
10546
|
+
transparent
|
|
10547
|
+
);
|
|
10548
|
+
}
|
|
10549
|
+
--swatch-amber: #ce8402;
|
|
10550
|
+
--swatch-amber-ink: #faa836;
|
|
10551
|
+
--swatch-amber-tint: var(--swatch-amber);
|
|
10552
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10553
|
+
--swatch-amber-tint: color-mix(
|
|
10554
|
+
in srgb,
|
|
10555
|
+
var(--swatch-amber) var(--swatch-tint-share),
|
|
10556
|
+
transparent
|
|
10557
|
+
);
|
|
10558
|
+
}
|
|
10559
|
+
--swatch-sun: #b09505;
|
|
10560
|
+
--swatch-sun-ink: #d9ba26;
|
|
10561
|
+
--swatch-sun-tint: var(--swatch-sun);
|
|
10562
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10563
|
+
--swatch-sun-tint: color-mix(in srgb, var(--swatch-sun) var(--swatch-tint-share), transparent);
|
|
10564
|
+
}
|
|
10565
|
+
--swatch-lime: #7fa707;
|
|
10566
|
+
--swatch-lime-ink: #a5cc54;
|
|
10567
|
+
--swatch-lime-tint: var(--swatch-lime);
|
|
10568
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10569
|
+
--swatch-lime-tint: color-mix(
|
|
10570
|
+
in srgb,
|
|
10571
|
+
var(--swatch-lime) var(--swatch-tint-share),
|
|
10572
|
+
transparent
|
|
10573
|
+
);
|
|
10574
|
+
}
|
|
10575
|
+
--swatch-moss: #42b14d;
|
|
10576
|
+
--swatch-moss-ink: #76d57b;
|
|
10577
|
+
--swatch-moss-tint: var(--swatch-moss);
|
|
10578
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10579
|
+
--swatch-moss-tint: color-mix(
|
|
10580
|
+
in srgb,
|
|
10581
|
+
var(--swatch-moss) var(--swatch-tint-share),
|
|
10582
|
+
transparent
|
|
10583
|
+
);
|
|
10584
|
+
}
|
|
10585
|
+
--swatch-jade: #08b08d;
|
|
10586
|
+
--swatch-jade-ink: #0edbb0;
|
|
10587
|
+
--swatch-jade-tint: var(--swatch-jade);
|
|
10588
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10589
|
+
--swatch-jade-tint: color-mix(
|
|
10590
|
+
in srgb,
|
|
10591
|
+
var(--swatch-jade) var(--swatch-tint-share),
|
|
10592
|
+
transparent
|
|
10593
|
+
);
|
|
10594
|
+
}
|
|
10595
|
+
--swatch-sky: #06a6cd;
|
|
10596
|
+
--swatch-sky-ink: #02d0ff;
|
|
10597
|
+
--swatch-sky-tint: var(--swatch-sky);
|
|
10598
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10599
|
+
--swatch-sky-tint: color-mix(in srgb, var(--swatch-sky) var(--swatch-tint-share), transparent);
|
|
10600
|
+
}
|
|
10601
|
+
--swatch-ocean: #4297fd;
|
|
10602
|
+
--swatch-ocean-ink: #8ebffe;
|
|
10603
|
+
--swatch-ocean-tint: var(--swatch-ocean);
|
|
10604
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10605
|
+
--swatch-ocean-tint: color-mix(
|
|
10606
|
+
in srgb,
|
|
10607
|
+
var(--swatch-ocean) var(--swatch-tint-share),
|
|
10608
|
+
transparent
|
|
10609
|
+
);
|
|
10610
|
+
}
|
|
10611
|
+
--swatch-indigo: #8087fd;
|
|
10612
|
+
--swatch-indigo-ink: #acb5ff;
|
|
10613
|
+
--swatch-indigo-tint: var(--swatch-indigo);
|
|
10614
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10615
|
+
--swatch-indigo-tint: color-mix(
|
|
10616
|
+
in srgb,
|
|
10617
|
+
var(--swatch-indigo) var(--swatch-tint-share),
|
|
10618
|
+
transparent
|
|
10619
|
+
);
|
|
10620
|
+
}
|
|
10621
|
+
--swatch-violet: #ab78ed;
|
|
10622
|
+
--swatch-violet-ink: #cba8fe;
|
|
10623
|
+
--swatch-violet-tint: var(--swatch-violet);
|
|
10624
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10625
|
+
--swatch-violet-tint: color-mix(
|
|
10626
|
+
in srgb,
|
|
10627
|
+
var(--swatch-violet) var(--swatch-tint-share),
|
|
10628
|
+
transparent
|
|
10629
|
+
);
|
|
10630
|
+
}
|
|
10631
|
+
--swatch-plum: #d368c1;
|
|
10632
|
+
--swatch-plum-ink: #f794e4;
|
|
10633
|
+
--swatch-plum-tint: var(--swatch-plum);
|
|
10634
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10635
|
+
--swatch-plum-tint: color-mix(
|
|
10636
|
+
in srgb,
|
|
10637
|
+
var(--swatch-plum) var(--swatch-tint-share),
|
|
10638
|
+
transparent
|
|
10639
|
+
);
|
|
10640
|
+
}
|
|
10641
|
+
--swatch-slate: #8c97a6;
|
|
10642
|
+
--swatch-slate-ink: #b1bdcc;
|
|
10643
|
+
--swatch-slate-tint: var(--swatch-slate);
|
|
10644
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10645
|
+
--swatch-slate-tint: color-mix(
|
|
10646
|
+
in srgb,
|
|
10647
|
+
var(--swatch-slate) var(--swatch-tint-share),
|
|
10648
|
+
transparent
|
|
10649
|
+
);
|
|
10650
|
+
}
|
|
8996
10651
|
--diff-add: var(--ok);
|
|
8997
10652
|
@supports (color: color-mix(in lab, red, red)) {
|
|
8998
10653
|
--diff-add: color-mix(in srgb, var(--ok) 16%, transparent);
|
|
@@ -9102,27 +10757,39 @@
|
|
|
9102
10757
|
--scroll-size: calc(var(--space) * 2.75);
|
|
9103
10758
|
--w-rail: calc(var(--space) * 14);
|
|
9104
10759
|
--icon-ctl-rail: calc(var(--space) * 10);
|
|
9105
|
-
--gap-rail:
|
|
10760
|
+
--gap-rail: var(--space);
|
|
9106
10761
|
--edge: calc(var(--space) * 2);
|
|
9107
10762
|
--h-lane: 42px;
|
|
9108
10763
|
--h-lane-low: calc(var(--space) * 9);
|
|
9109
10764
|
--h-tab: calc(var(--space) * 7.5);
|
|
9110
10765
|
--tabcard-w: calc(var(--space) * 80);
|
|
9111
10766
|
--tabcard-dip: 0.82;
|
|
9112
|
-
--tab-
|
|
10767
|
+
--tab-text-min: calc(var(--space) * 12);
|
|
10768
|
+
--tab-fade: calc(var(--space) * 4);
|
|
10769
|
+
--lane-arrow-w: calc(var(--space) * 5);
|
|
9113
10770
|
--h-lane-rule: calc(var(--space) * 6);
|
|
9114
10771
|
--lane-rule-alpha: 0.22;
|
|
10772
|
+
--lane-plus-alpha: 0;
|
|
9115
10773
|
--gap-tile: calc(var(--space) * 1.5);
|
|
9116
10774
|
--grab-inset: var(--space);
|
|
9117
10775
|
--w-tile-min: calc(var(--space) * 80);
|
|
9118
10776
|
--h-tile-min: calc(var(--space) * 50);
|
|
9119
10777
|
--w-sidebar: calc(var(--space) * 59);
|
|
9120
|
-
--pad-
|
|
9121
|
-
--
|
|
10778
|
+
--pad-sidebar: calc(var(--space) * 2.5);
|
|
10779
|
+
--fan-tuck: 0.6;
|
|
9122
10780
|
--rung-pressed-alpha: 0.55;
|
|
10781
|
+
--tab-rest-ink: var(--capt);
|
|
10782
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10783
|
+
--tab-rest-ink: color-mix(in srgb, var(--capt) 85%, var(--text));
|
|
10784
|
+
}
|
|
10785
|
+
--tab-rest-alpha: 0.49;
|
|
9123
10786
|
--mark-hi: #ffd074;
|
|
9124
10787
|
--mark-lo: #ff9d2e;
|
|
10788
|
+
--mark-grad: linear-gradient(180deg, var(--mark-hi), var(--mark-lo));
|
|
10789
|
+
--mark-glow: #ff9d2e;
|
|
10790
|
+
--map-floor: 0.3;
|
|
9125
10791
|
--capt-close: #c42b1c;
|
|
10792
|
+
--capt-close-ink: #fff;
|
|
9126
10793
|
--shadow-pop: 0 5px 16px rgba(0, 0, 0, 0.07);
|
|
9127
10794
|
--shadow-float: 0 8px 28px rgba(0, 0, 0, 0.1);
|
|
9128
10795
|
--shadow-modal: 0 18px 48px rgba(0, 0, 0, 0.25);
|
|
@@ -9134,7 +10801,7 @@
|
|
|
9134
10801
|
--scrim: rgba(0, 0, 0, 0.78);
|
|
9135
10802
|
--scrim-ink: #fff;
|
|
9136
10803
|
--scrim-walk: rgba(4, 9, 18, 0.45);
|
|
9137
|
-
--
|
|
10804
|
+
--scrim-tour: 0 0 0 100vmax var(--scrim-walk);
|
|
9138
10805
|
--scrim-soft: var(--win);
|
|
9139
10806
|
@supports (color: color-mix(in lab, red, red)) {
|
|
9140
10807
|
--scrim-soft: color-mix(in srgb, var(--win) 55%, transparent);
|
|
@@ -9148,6 +10815,72 @@
|
|
|
9148
10815
|
@supports (color: color-mix(in lab, red, red)) {
|
|
9149
10816
|
--plate-menu: color-mix(in srgb, var(--win) 75%, var(--tipbg));
|
|
9150
10817
|
}
|
|
10818
|
+
--glass-on-light-rim: rgba(0, 0, 0, 0.14);
|
|
10819
|
+
--glass-on-light: rgba(255, 255, 255, 0.62);
|
|
10820
|
+
--glass-on-light-hover: rgba(255, 255, 255, 0.8);
|
|
10821
|
+
--glass-on-light-ink: rgba(0, 0, 0, 0.88);
|
|
10822
|
+
--glass-on-light-lift: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.18);
|
|
10823
|
+
--glass-on-dark-rim: rgba(255, 255, 255, 0.2);
|
|
10824
|
+
--glass-on-dark: rgba(0, 0, 0, 0.58);
|
|
10825
|
+
--glass-on-dark-hover: rgba(0, 0, 0, 0.74);
|
|
10826
|
+
--glass-on-dark-ink: #fff;
|
|
10827
|
+
--glass-on-dark-lift: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 2px 8px rgba(0, 0, 0, 0.35);
|
|
10828
|
+
--film-press: linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.03) 60%);
|
|
10829
|
+
--film-press-hover: linear-gradient(
|
|
10830
|
+
180deg,
|
|
10831
|
+
rgba(255, 255, 255, 0.16),
|
|
10832
|
+
rgba(255, 255, 255, 0.06) 60%
|
|
10833
|
+
);
|
|
10834
|
+
--film-ticked: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0) 60%);
|
|
10835
|
+
--film-ticked-hover: linear-gradient(
|
|
10836
|
+
180deg,
|
|
10837
|
+
rgba(255, 255, 255, 0.08),
|
|
10838
|
+
rgba(255, 255, 255, 0.02) 60%
|
|
10839
|
+
);
|
|
10840
|
+
--shadow-press: 0 1px 2px rgba(0, 0, 0, 0.25), 0 8px 22px rgba(0, 0, 0, 0.22);
|
|
10841
|
+
--shadow-ticked: 0 1px 2px rgba(0, 0, 0, 0.18);
|
|
10842
|
+
--waytile-hover: var(--card);
|
|
10843
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10844
|
+
--waytile-hover: color-mix(in srgb, var(--card) 90%, #000);
|
|
10845
|
+
}
|
|
10846
|
+
--shadow-orb: inset 0 1.5px 0 rgba(255, 255, 255, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.16);
|
|
10847
|
+
--shadow-orb-lift: 0 2px 8px rgba(0, 0, 0, 0.18);
|
|
10848
|
+
--shadow-swatch: inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.16);
|
|
10849
|
+
--gloss-orb: radial-gradient(
|
|
10850
|
+
120% 90% at 30% 0%,
|
|
10851
|
+
rgba(255, 255, 255, 0.4) 0%,
|
|
10852
|
+
rgba(255, 255, 255, 0) 55%
|
|
10853
|
+
);
|
|
10854
|
+
--shadow-thumb: 0 1px 3px rgba(0, 0, 0, 0.3);
|
|
10855
|
+
--ring-marker: 0 0 0 1px rgba(0, 0, 0, 0.35);
|
|
10856
|
+
--shadow-logo: inset 0 1px 0 rgba(255, 255, 255, 0.28), inset 0 0 0 1px rgba(255, 255, 255, 0.12),
|
|
10857
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3),
|
|
10858
|
+
0 0.3em 0.9em rgba(0, 0, 0, 0.32);
|
|
10859
|
+
--gloss-logo: linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0) 62%);
|
|
10860
|
+
--shadow-feature-logo: 0 16px 28px -14px rgb(0 0 0 / 0.5);
|
|
10861
|
+
--scrim-feature: linear-gradient(to bottom, rgb(0 0 0 / 0), rgb(0 0 0 / 0.5) 70%);
|
|
10862
|
+
--gloss-fill: linear-gradient(180deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0) 55%);
|
|
10863
|
+
--gloss-fill-edge: inset 0 1px 0 rgba(255, 255, 255, 0.55);
|
|
10864
|
+
--page-ground: #fff;
|
|
10865
|
+
--picture-ink: #fff;
|
|
10866
|
+
--picture-line: rgba(255, 255, 255, 0.45);
|
|
10867
|
+
--picture-film: rgba(255, 255, 255, 0.07);
|
|
10868
|
+
--picture-rim: rgba(255, 255, 255, 0.22);
|
|
10869
|
+
--picture-gloss: inset 0 1px 0 rgba(255, 255, 255, 0.35);
|
|
10870
|
+
--picture-mesh-1: #22323f;
|
|
10871
|
+
--picture-mesh-2: #0b0b0c;
|
|
10872
|
+
--picture-mesh-3: #152725;
|
|
10873
|
+
--picture-mesh-4: #1c1d20;
|
|
10874
|
+
--picture-mesh-5: #0b0b0c;
|
|
10875
|
+
--picture-mesh-6: #1a2229;
|
|
10876
|
+
--heat-1: #693611;
|
|
10877
|
+
--heat-2: #a36a1f;
|
|
10878
|
+
--heat-3: #e8a530;
|
|
10879
|
+
--heat-4: #ffda6b;
|
|
10880
|
+
--heat-5: #ffe77a;
|
|
10881
|
+
--heat-6: #ff9a1f;
|
|
10882
|
+
--heat-7: #ff4d0087;
|
|
10883
|
+
--heat-ground: #000;
|
|
9151
10884
|
--chip-file: var(--info);
|
|
9152
10885
|
@supports (color: color-mix(in lab, red, red)) {
|
|
9153
10886
|
--chip-file: color-mix(in srgb, var(--info) 16%, transparent);
|
|
@@ -9168,6 +10901,10 @@
|
|
|
9168
10901
|
--blur-overlay: blur(24px) saturate(1.4);
|
|
9169
10902
|
--blur-sheet: blur(36px) saturate(1.45);
|
|
9170
10903
|
--blur-tip: blur(1px);
|
|
10904
|
+
--blur-fan: blur(2px);
|
|
10905
|
+
--blur-glass: blur(10px);
|
|
10906
|
+
--blur-film: blur(14px);
|
|
10907
|
+
--blur-copy: blur(8px);
|
|
9171
10908
|
--grain-image: url('data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%27140%27%20height=%27140%27%3E%3Cfilter%20id=%27n%27%3E%3CfeTurbulence%20type=%27fractalNoise%27%20baseFrequency=%270.85%27%20numOctaves=%272%27%20stitchTiles=%27stitch%27/%3E%3C/filter%3E%3Crect%20width=%27100%25%27%20height=%27100%25%27%20filter=%27url%28%23n%29%27/%3E%3C/svg%3E');
|
|
9172
10909
|
--ease-out: cubic-bezier(0, 0, 0.2, 1);
|
|
9173
10910
|
--dur: 0.15s;
|
|
@@ -9176,6 +10913,9 @@
|
|
|
9176
10913
|
--dur-spin: 0.9s;
|
|
9177
10914
|
--dur-shine: 2.2s;
|
|
9178
10915
|
--dur-flash: 1.2s;
|
|
10916
|
+
--dur-copied: 1.5s;
|
|
10917
|
+
--dur-arrive: 0.6s;
|
|
10918
|
+
--dur-glow: 0.35s;
|
|
9179
10919
|
--dur-scroll: 25ms;
|
|
9180
10920
|
--press: none;
|
|
9181
10921
|
--press-fade: 1;
|
|
@@ -9194,6 +10934,7 @@
|
|
|
9194
10934
|
--fs-page: 26px;
|
|
9195
10935
|
--fs-code: 22px;
|
|
9196
10936
|
--fs-page-hero: 28px;
|
|
10937
|
+
--fs-figure: 30px;
|
|
9197
10938
|
--fs-wordmark: 16.5px;
|
|
9198
10939
|
--fs-walk-title: 40px;
|
|
9199
10940
|
--fw-med: 500;
|
|
@@ -9208,8 +10949,7 @@
|
|
|
9208
10949
|
--docs-callout-info: #3b82f6;
|
|
9209
10950
|
--fs-market-title: clamp(32px, 4.2cqi, 64px);
|
|
9210
10951
|
--fs-market-lead: 20px;
|
|
9211
|
-
--fs-market-
|
|
9212
|
-
--fs-market-tile-first: clamp(28px, 3vw, 40px);
|
|
10952
|
+
--fs-market-feature: clamp(26px, 3cqi, 40px);
|
|
9213
10953
|
--fs-market-name: 40px;
|
|
9214
10954
|
--fs-market-name-narrow: 32px;
|
|
9215
10955
|
--fs-market-line: 18px;
|
|
@@ -9223,7 +10963,16 @@
|
|
|
9223
10963
|
--market-wash-foot: oklch(0.15 0.015 220);
|
|
9224
10964
|
--market-hero-ink: #fff;
|
|
9225
10965
|
--market-hero-brightness: 0.82;
|
|
10966
|
+
--market-cover-ratio: 12 / 5;
|
|
9226
10967
|
--hue: 0;
|
|
10968
|
+
--share: 1;
|
|
10969
|
+
--fan-n: 1;
|
|
10970
|
+
--fan-k: 0;
|
|
10971
|
+
--tab-whole: 0px;
|
|
10972
|
+
--tab-open: 0px;
|
|
10973
|
+
--tab-bare: 0px;
|
|
10974
|
+
--tab-w: 0px;
|
|
10975
|
+
--strip-w: 0px;
|
|
9227
10976
|
--b1-h: 0;
|
|
9228
10977
|
--b1-l: 0;
|
|
9229
10978
|
--b1-c: 0;
|
|
@@ -9287,6 +11036,9 @@
|
|
|
9287
11036
|
--gloss-hi: rgba(255, 255, 255, 0.55);
|
|
9288
11037
|
--gloss-lo: rgba(255, 255, 255, 0.18);
|
|
9289
11038
|
--glossline: rgba(255, 255, 255, 0.75);
|
|
11039
|
+
--shadow-logo: inset 0 1px 0 rgba(255, 255, 255, 0.55), inset 0 0 0 1px rgba(0, 0, 0, 0.1),
|
|
11040
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.22),
|
|
11041
|
+
0 0.3em 0.9em rgba(0, 0, 0, 0.2);
|
|
9290
11042
|
--text: #15181f;
|
|
9291
11043
|
--mut: #4c5260;
|
|
9292
11044
|
--dim: #7b8290;
|
|
@@ -9297,12 +11049,37 @@
|
|
|
9297
11049
|
--cardb: #dcdfe5;
|
|
9298
11050
|
--hov: rgba(120, 127, 145, 0.12);
|
|
9299
11051
|
--act: rgba(255, 255, 255, 0.55);
|
|
9300
|
-
--accent: #ff9d2e;
|
|
9301
|
-
--link: #b66000;
|
|
9302
11052
|
--info: #1867c0;
|
|
9303
11053
|
--bad: #c2452e;
|
|
9304
11054
|
--ok: #2f9e44;
|
|
9305
11055
|
--warn: #b7791f;
|
|
11056
|
+
--swatch-tint-share: 14%;
|
|
11057
|
+
--swatch-rose: #c64563;
|
|
11058
|
+
--swatch-rose-ink: #891739;
|
|
11059
|
+
--swatch-ember: #c74d23;
|
|
11060
|
+
--swatch-ember-ink: #852802;
|
|
11061
|
+
--swatch-amber: #a76a07;
|
|
11062
|
+
--swatch-amber-ink: #6a4203;
|
|
11063
|
+
--swatch-sun: #8e7806;
|
|
11064
|
+
--swatch-sun-ink: #5a4b03;
|
|
11065
|
+
--swatch-lime: #668700;
|
|
11066
|
+
--swatch-lime-ink: #3f5500;
|
|
11067
|
+
--swatch-moss: #229132;
|
|
11068
|
+
--swatch-moss-ink: #015d15;
|
|
11069
|
+
--swatch-jade: #058e72;
|
|
11070
|
+
--swatch-jade-ink: #015a47;
|
|
11071
|
+
--swatch-sky: #0986a6;
|
|
11072
|
+
--swatch-sky-ink: #02556a;
|
|
11073
|
+
--swatch-ocean: #2679d8;
|
|
11074
|
+
--swatch-ocean-ink: #014a94;
|
|
11075
|
+
--swatch-indigo: #656ad8;
|
|
11076
|
+
--swatch-indigo-ink: #3d3d9a;
|
|
11077
|
+
--swatch-violet: #8c5cc9;
|
|
11078
|
+
--swatch-violet-ink: #5c308e;
|
|
11079
|
+
--swatch-plum: #b14da1;
|
|
11080
|
+
--swatch-plum-ink: #79226d;
|
|
11081
|
+
--swatch-slate: #707a88;
|
|
11082
|
+
--swatch-slate-ink: #434d5a;
|
|
9306
11083
|
--bubu: #23262e;
|
|
9307
11084
|
--bubut: #f6f7f9;
|
|
9308
11085
|
--tiprgb: 252 252 253;
|
|
@@ -9352,6 +11129,9 @@
|
|
|
9352
11129
|
.hs-inkbad {
|
|
9353
11130
|
color: var(--bad);
|
|
9354
11131
|
}
|
|
11132
|
+
:where(.hs-hovbox:hover, .hs-hovbox-ink:hover) {
|
|
11133
|
+
transition: background-color var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
11134
|
+
}
|
|
9355
11135
|
.hs-hovbox:hover {
|
|
9356
11136
|
background: var(--hov);
|
|
9357
11137
|
box-shadow: var(--gloss-edge);
|
|
@@ -9388,34 +11168,34 @@
|
|
|
9388
11168
|
background: var(--btnhov);
|
|
9389
11169
|
}
|
|
9390
11170
|
.hs-glassbtn[data-on='light'] {
|
|
9391
|
-
border-color:
|
|
9392
|
-
background:
|
|
9393
|
-
box-shadow:
|
|
9394
|
-
color:
|
|
9395
|
-
backdrop-filter: blur
|
|
9396
|
-
-webkit-backdrop-filter: blur
|
|
11171
|
+
border-color: var(--glass-on-light-rim);
|
|
11172
|
+
background: var(--glass-on-light);
|
|
11173
|
+
box-shadow: var(--glass-on-light-lift);
|
|
11174
|
+
color: var(--glass-on-light-ink);
|
|
11175
|
+
backdrop-filter: var(--blur-glass);
|
|
11176
|
+
-webkit-backdrop-filter: var(--blur-glass);
|
|
9397
11177
|
}
|
|
9398
11178
|
.hs-glassbtn[data-on='light']:hover {
|
|
9399
|
-
background:
|
|
11179
|
+
background: var(--glass-on-light-hover);
|
|
9400
11180
|
}
|
|
9401
11181
|
.hs-glassbtn[data-on='dark'] {
|
|
9402
|
-
border-color:
|
|
9403
|
-
background:
|
|
9404
|
-
box-shadow:
|
|
9405
|
-
color:
|
|
9406
|
-
backdrop-filter: blur
|
|
9407
|
-
-webkit-backdrop-filter: blur
|
|
11182
|
+
border-color: var(--glass-on-dark-rim);
|
|
11183
|
+
background: var(--glass-on-dark);
|
|
11184
|
+
box-shadow: var(--glass-on-dark-lift);
|
|
11185
|
+
color: var(--glass-on-dark-ink);
|
|
11186
|
+
backdrop-filter: var(--blur-glass);
|
|
11187
|
+
-webkit-backdrop-filter: var(--blur-glass);
|
|
9408
11188
|
}
|
|
9409
11189
|
.hs-glassbtn[data-on='dark']:hover {
|
|
9410
|
-
background:
|
|
11190
|
+
background: var(--glass-on-dark-hover);
|
|
9411
11191
|
}
|
|
9412
11192
|
.hs-walk-foot .hs-glassbtn, .hs-walk-body .hs-glassbtn, .hs-installer-bar {
|
|
9413
11193
|
position: relative;
|
|
9414
11194
|
overflow: hidden;
|
|
9415
|
-
background:
|
|
9416
|
-
box-shadow: var(--gloss-edge),
|
|
9417
|
-
backdrop-filter: blur
|
|
9418
|
-
-webkit-backdrop-filter: blur
|
|
11195
|
+
background: var(--film-press), var(--pane);
|
|
11196
|
+
box-shadow: var(--gloss-edge), var(--shadow-press);
|
|
11197
|
+
backdrop-filter: var(--blur-film);
|
|
11198
|
+
-webkit-backdrop-filter: var(--blur-film);
|
|
9419
11199
|
}
|
|
9420
11200
|
.hs-walk-foot .hs-glassbtn::before, .hs-walk-body .hs-glassbtn::before, .hs-installer-bar::before {
|
|
9421
11201
|
content: '';
|
|
@@ -9428,20 +11208,20 @@
|
|
|
9428
11208
|
pointer-events: none;
|
|
9429
11209
|
}
|
|
9430
11210
|
.hs-walk-foot .hs-glassbtn:hover, .hs-walk-body .hs-glassbtn:hover {
|
|
9431
|
-
background:
|
|
11211
|
+
background: var(--film-press-hover), var(--pane);
|
|
9432
11212
|
}
|
|
9433
11213
|
.hs-walk-body .hs-glassbtn[data-ticked='true'] {
|
|
9434
|
-
background:
|
|
11214
|
+
background: var(--film-ticked), var(--pane);
|
|
9435
11215
|
@supports (color: color-mix(in lab, red, red)) {
|
|
9436
|
-
background:
|
|
11216
|
+
background: var(--film-ticked), color-mix(in srgb, var(--pane) 55%, transparent);
|
|
9437
11217
|
}
|
|
9438
|
-
box-shadow: var(--gloss-edge),
|
|
11218
|
+
box-shadow: var(--gloss-edge), var(--shadow-ticked);
|
|
9439
11219
|
}
|
|
9440
11220
|
.hs-walk-body .hs-glassbtn[data-ticked='true']::before {
|
|
9441
11221
|
opacity: 0.45;
|
|
9442
11222
|
}
|
|
9443
11223
|
.hs-walk-body .hs-glassbtn[data-ticked='true']:hover {
|
|
9444
|
-
background:
|
|
11224
|
+
background: var(--film-ticked-hover), var(--pane);
|
|
9445
11225
|
}
|
|
9446
11226
|
.hs-shell .hs-glassbtn:hover, .hs-shell .hs-hovbox:hover, .hs-shell .hs-hovbox-ink:hover, .hs-shell .hs-hovmut:hover, .hs-shell .hs-chip:hover, .hs-shell .hs-mitem:hover, .hs-shell .hs-sessrow:hover, .hs-shell .hs-projrow:hover, .hs-shell .hs-plugrow:hover {
|
|
9447
11227
|
transform: var(--hov-lift);
|
|
@@ -9516,6 +11296,7 @@
|
|
|
9516
11296
|
}
|
|
9517
11297
|
.hs-plugrow .hs-rowact, .hs-sessrow .hs-rowact, .hs-projrow .hs-rowact {
|
|
9518
11298
|
opacity: 0;
|
|
11299
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9519
11300
|
}
|
|
9520
11301
|
.hs-plugrow:hover .hs-rowact, .hs-sessrow:hover .hs-rowact, .hs-projrow:hover .hs-rowact, .hs-rowact[data-open='true'] {
|
|
9521
11302
|
opacity: 1;
|
|
@@ -9534,6 +11315,7 @@
|
|
|
9534
11315
|
.hs-sess {
|
|
9535
11316
|
display: grid;
|
|
9536
11317
|
grid-template-rows: 1fr;
|
|
11318
|
+
transition: grid-template-rows var(--dur) var(--ease-out);
|
|
9537
11319
|
}
|
|
9538
11320
|
.hs-sess[data-open='false'] {
|
|
9539
11321
|
grid-template-rows: 0fr;
|
|
@@ -9542,15 +11324,19 @@
|
|
|
9542
11324
|
min-height: 0;
|
|
9543
11325
|
overflow: hidden;
|
|
9544
11326
|
opacity: 1;
|
|
11327
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9545
11328
|
}
|
|
9546
11329
|
.hs-sess[data-open='false'] > div {
|
|
9547
11330
|
opacity: 0;
|
|
9548
11331
|
}
|
|
11332
|
+
.hs-waytile {
|
|
11333
|
+
transition: background var(--dur) var(--ease-out);
|
|
11334
|
+
}
|
|
9549
11335
|
.hs-waytile:hover {
|
|
9550
|
-
background: var(--
|
|
9551
|
-
|
|
9552
|
-
|
|
9553
|
-
|
|
11336
|
+
background: var(--waytile-hover);
|
|
11337
|
+
}
|
|
11338
|
+
.hs-orb {
|
|
11339
|
+
transition: transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
|
|
9554
11340
|
}
|
|
9555
11341
|
.hs-orb:hover {
|
|
9556
11342
|
transform: scale(1.05);
|
|
@@ -9560,6 +11346,7 @@
|
|
|
9560
11346
|
}
|
|
9561
11347
|
.hs-turn .hs-abar {
|
|
9562
11348
|
opacity: 0;
|
|
11349
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9563
11350
|
}
|
|
9564
11351
|
.hs-turn:hover .hs-abar {
|
|
9565
11352
|
opacity: 1;
|
|
@@ -9586,8 +11373,25 @@
|
|
|
9586
11373
|
background-position: calc(100% + 4.5rem) 0, 0 0;
|
|
9587
11374
|
}
|
|
9588
11375
|
}
|
|
11376
|
+
@keyframes hsPop {
|
|
11377
|
+
from {
|
|
11378
|
+
opacity: 0;
|
|
11379
|
+
transform: translateY(calc(var(--space) * -1.25));
|
|
11380
|
+
}
|
|
11381
|
+
}
|
|
11382
|
+
.hs-rview {
|
|
11383
|
+
animation: hsPop var(--dur) var(--ease-out);
|
|
11384
|
+
}
|
|
11385
|
+
@keyframes hsPopX {
|
|
11386
|
+
from {
|
|
11387
|
+
opacity: 0;
|
|
11388
|
+
transform: translateX(calc(var(--space) * -1.75));
|
|
11389
|
+
}
|
|
11390
|
+
}
|
|
11391
|
+
.hs-ptab {
|
|
11392
|
+
animation: hsPopX var(--dur) var(--ease-out);
|
|
11393
|
+
}
|
|
9589
11394
|
.hs-spin {
|
|
9590
|
-
transform-box: fill-box;
|
|
9591
11395
|
transform-origin: center;
|
|
9592
11396
|
animation: hsSpin var(--dur-spin) linear infinite;
|
|
9593
11397
|
}
|
|
@@ -9602,6 +11406,7 @@
|
|
|
9602
11406
|
--dur-slow: 0s;
|
|
9603
11407
|
--dur-stagger: 0s;
|
|
9604
11408
|
--dur-scroll: 0s;
|
|
11409
|
+
--dur-arrive: 0s;
|
|
9605
11410
|
}
|
|
9606
11411
|
.hs-shell .hs-shine, .hs-shell .hs-spin, .hs-shell .hs-flash {
|
|
9607
11412
|
animation: none;
|
|
@@ -9611,6 +11416,7 @@
|
|
|
9611
11416
|
border-radius: var(--r-card);
|
|
9612
11417
|
border: var(--bw) solid var(--tipline);
|
|
9613
11418
|
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
11419
|
+
animation: hsPop var(--dur) var(--ease-out);
|
|
9614
11420
|
}
|
|
9615
11421
|
.hs-mitem {
|
|
9616
11422
|
gap: calc(var(--space) * 2.25);
|
|
@@ -9654,6 +11460,9 @@
|
|
|
9654
11460
|
.hs-shell-frame[data-sdrag='true'] :is(webview, iframe) {
|
|
9655
11461
|
pointer-events: none;
|
|
9656
11462
|
}
|
|
11463
|
+
[data-hover-popup='true'] :is(webview, iframe) {
|
|
11464
|
+
pointer-events: none;
|
|
11465
|
+
}
|
|
9657
11466
|
.hs-sessrow[data-ins]::before {
|
|
9658
11467
|
content: '';
|
|
9659
11468
|
position: absolute;
|
|
@@ -9732,7 +11541,7 @@
|
|
|
9732
11541
|
background: var(--card);
|
|
9733
11542
|
}
|
|
9734
11543
|
.hs-tog[data-on='true'] {
|
|
9735
|
-
background: var(--
|
|
11544
|
+
background: var(--mark-grad);
|
|
9736
11545
|
border-color: transparent;
|
|
9737
11546
|
box-shadow: var(--tog-on);
|
|
9738
11547
|
}
|
|
@@ -9753,7 +11562,7 @@
|
|
|
9753
11562
|
.hs-tog[data-on='true'] .hs-toggle-thumb {
|
|
9754
11563
|
transform: translateX(17px);
|
|
9755
11564
|
background: var(--switch-thumb-on);
|
|
9756
|
-
box-shadow: inset 0 1px 0
|
|
11565
|
+
box-shadow: inset 0 1px 0 var(--switch-gloss-on);
|
|
9757
11566
|
}
|
|
9758
11567
|
.hs-range {
|
|
9759
11568
|
-webkit-appearance: none;
|
|
@@ -9775,12 +11584,13 @@
|
|
|
9775
11584
|
background: var(--text);
|
|
9776
11585
|
border: none;
|
|
9777
11586
|
cursor: pointer;
|
|
9778
|
-
box-shadow:
|
|
11587
|
+
box-shadow: var(--shadow-thumb);
|
|
9779
11588
|
}
|
|
9780
11589
|
.hs-url {
|
|
9781
11590
|
border-radius: var(--r-ctl);
|
|
9782
11591
|
background: var(--hov);
|
|
9783
11592
|
box-shadow: var(--gloss-edge);
|
|
11593
|
+
transition: background var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
|
|
9784
11594
|
}
|
|
9785
11595
|
.hs-url:hover:not(:focus-within) {
|
|
9786
11596
|
background: var(--btnhov);
|
|
@@ -9811,6 +11621,7 @@
|
|
|
9811
11621
|
color: var(--mut);
|
|
9812
11622
|
pointer-events: none;
|
|
9813
11623
|
white-space: nowrap;
|
|
11624
|
+
transition: left var(--dur) var(--ease-out), transform var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
9814
11625
|
}
|
|
9815
11626
|
.hs-url:focus-within .hs-urlph {
|
|
9816
11627
|
left: calc(var(--space) * 3);
|
|
@@ -9822,6 +11633,7 @@
|
|
|
9822
11633
|
.hs-urlgo {
|
|
9823
11634
|
opacity: 0;
|
|
9824
11635
|
pointer-events: none;
|
|
11636
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9825
11637
|
}
|
|
9826
11638
|
.hs-url:hover .hs-urlgo, .hs-url:focus-within .hs-urlgo {
|
|
9827
11639
|
opacity: 1;
|
|
@@ -9829,7 +11641,7 @@
|
|
|
9829
11641
|
.hs-url:focus-within .hs-ph-icon {
|
|
9830
11642
|
left: calc(var(--space) * 7.25);
|
|
9831
11643
|
}
|
|
9832
|
-
.hs-shell .hs-mitem:focus-visible, .hs-shell .hs-sessrow:focus-visible, .hs-shell .hs-projrow:focus-visible, .hs-shell .hs-plugrow:focus-visible, .hs-shell .hs-chip:focus-visible, .hs-shell .hs-range:focus-visible {
|
|
11644
|
+
.hs-shell .hs-mitem:focus-visible, .hs-shell .hs-sessrow:focus-visible, .hs-shell .hs-projrow:focus-visible, .hs-shell .hs-plugrow:focus-visible, .hs-shell .hs-chip:focus-visible, .hs-shell .hs-range:focus-visible, .hs-shell .hs-lane-button:focus-visible, .hs-shell .hs-sidebar-rail-item:focus-visible {
|
|
9833
11645
|
outline: none;
|
|
9834
11646
|
box-shadow: var(--focus);
|
|
9835
11647
|
}
|
|
@@ -9852,9 +11664,11 @@
|
|
|
9852
11664
|
.hs-jump {
|
|
9853
11665
|
border-radius: var(--r-pill);
|
|
9854
11666
|
border: var(--bw) solid var(--tipline);
|
|
11667
|
+
transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
|
|
9855
11668
|
}
|
|
9856
11669
|
.hs-jump:disabled {
|
|
9857
11670
|
opacity: 0;
|
|
11671
|
+
transform: translateY(calc(var(--space) * 1.25));
|
|
9858
11672
|
pointer-events: none;
|
|
9859
11673
|
}
|
|
9860
11674
|
.hs-md > :first-child {
|
|
@@ -10051,6 +11865,62 @@
|
|
|
10051
11865
|
flex: none;
|
|
10052
11866
|
padding-right: calc(var(--space) * 3.5);
|
|
10053
11867
|
}
|
|
11868
|
+
.hs-diff-split {
|
|
11869
|
+
display: flex;
|
|
11870
|
+
box-sizing: border-box;
|
|
11871
|
+
height: calc(var(--space) * 5);
|
|
11872
|
+
line-height: calc(var(--space) * 5);
|
|
11873
|
+
white-space: pre;
|
|
11874
|
+
}
|
|
11875
|
+
.hs-diff-side {
|
|
11876
|
+
display: flex;
|
|
11877
|
+
flex: 1 1 0;
|
|
11878
|
+
min-width: 0;
|
|
11879
|
+
overflow: hidden;
|
|
11880
|
+
}
|
|
11881
|
+
.hs-diff-side + .hs-diff-side {
|
|
11882
|
+
border-left: var(--bw) solid var(--line);
|
|
11883
|
+
}
|
|
11884
|
+
.hs-diff-side[data-kind='add'] {
|
|
11885
|
+
background: var(--diff-add);
|
|
11886
|
+
}
|
|
11887
|
+
.hs-diff-side[data-kind='del'] {
|
|
11888
|
+
background: var(--diff-del);
|
|
11889
|
+
}
|
|
11890
|
+
.hs-diff-side[data-kind='none'] {
|
|
11891
|
+
background: var(--hov);
|
|
11892
|
+
}
|
|
11893
|
+
.hs-diff-split[data-sel='1'] .hs-diff-side {
|
|
11894
|
+
background: var(--diff-pick);
|
|
11895
|
+
}
|
|
11896
|
+
.hs-diff-side[data-kind='add'] .hs-diff-no {
|
|
11897
|
+
background: var(--diff-add-gutter);
|
|
11898
|
+
}
|
|
11899
|
+
.hs-diff-side[data-kind='del'] .hs-diff-no {
|
|
11900
|
+
background: var(--diff-del-gutter);
|
|
11901
|
+
}
|
|
11902
|
+
.hs-diff-side[data-kind='add'] .hs-diff-sign {
|
|
11903
|
+
color: var(--ok);
|
|
11904
|
+
}
|
|
11905
|
+
.hs-diff-side[data-kind='del'] .hs-diff-sign {
|
|
11906
|
+
color: var(--bad);
|
|
11907
|
+
}
|
|
11908
|
+
.hs-diff[data-wrap='true'] :is(.hs-diff-row, .hs-diff-split) {
|
|
11909
|
+
height: auto;
|
|
11910
|
+
min-height: calc(var(--space) * 5);
|
|
11911
|
+
white-space: pre-wrap;
|
|
11912
|
+
}
|
|
11913
|
+
.hs-diff[data-wrap='true'] .hs-diff-text {
|
|
11914
|
+
flex: 1 1 0;
|
|
11915
|
+
min-width: 0;
|
|
11916
|
+
overflow-wrap: anywhere;
|
|
11917
|
+
}
|
|
11918
|
+
.hs-diff-tok {
|
|
11919
|
+
color: var(--shiki-light, inherit);
|
|
11920
|
+
}
|
|
11921
|
+
[data-theme='dark'] .hs-diff-tok {
|
|
11922
|
+
color: var(--shiki-dark, inherit);
|
|
11923
|
+
}
|
|
10054
11924
|
.hs-diff-gap {
|
|
10055
11925
|
display: flex;
|
|
10056
11926
|
align-items: center;
|