@hearthscale/app-ui 0.1.0 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +21 -2
- package/dist/CLASSES.md +283 -216
- package/dist/TOKENS.md +138 -20
- package/dist/chunks/chunk-SFZCPZQD.js +335 -0
- package/dist/editor.d.ts +32 -0
- package/dist/editor.js +69 -0
- package/dist/index.d.ts +322 -12
- package/dist/index.js +1093 -379
- package/dist/markdown.d.ts +25 -0
- package/dist/markdown.js +365 -0
- package/dist/ui.css +2451 -569
- 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,22 @@
|
|
|
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
|
+
}
|
|
3673
|
+
.hs-chip[data-sel] > .hs-chip-text[data-text] {
|
|
3674
|
+
display: inline-flex;
|
|
3675
|
+
flex-direction: column;
|
|
3676
|
+
}
|
|
3677
|
+
.hs-chip[data-sel] > .hs-chip-text[data-text]::after {
|
|
3678
|
+
content: attr(data-text);
|
|
3679
|
+
height: 0;
|
|
3680
|
+
overflow: hidden;
|
|
3681
|
+
visibility: hidden;
|
|
3682
|
+
font-weight: var(--fw-semi);
|
|
3683
|
+
}
|
|
3528
3684
|
.hs-chip[data-sel='true'] {
|
|
3529
3685
|
background: var(--hov);
|
|
3530
3686
|
border-color: var(--tipline);
|
|
@@ -3588,6 +3744,55 @@
|
|
|
3588
3744
|
width: 0;
|
|
3589
3745
|
overflow: hidden;
|
|
3590
3746
|
}
|
|
3747
|
+
.hs-tour {
|
|
3748
|
+
position: fixed;
|
|
3749
|
+
inset: 0;
|
|
3750
|
+
z-index: 80;
|
|
3751
|
+
}
|
|
3752
|
+
.hs-tour-part {
|
|
3753
|
+
position: fixed;
|
|
3754
|
+
border-radius: var(--r-card);
|
|
3755
|
+
box-shadow: var(--scrim-tour);
|
|
3756
|
+
pointer-events: none;
|
|
3757
|
+
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);
|
|
3758
|
+
}
|
|
3759
|
+
.hs-tour-card {
|
|
3760
|
+
position: fixed;
|
|
3761
|
+
display: flex;
|
|
3762
|
+
flex-direction: column;
|
|
3763
|
+
gap: var(--gap-stack);
|
|
3764
|
+
width: calc(var(--space) * 80);
|
|
3765
|
+
padding: var(--pad-card);
|
|
3766
|
+
box-sizing: border-box;
|
|
3767
|
+
border: var(--bw) solid var(--tipline);
|
|
3768
|
+
border-radius: var(--r-tile);
|
|
3769
|
+
background: var(--plate-menu);
|
|
3770
|
+
box-shadow: var(--gloss-edge), var(--shadow-modal);
|
|
3771
|
+
backdrop-filter: var(--blur-overlay);
|
|
3772
|
+
-webkit-backdrop-filter: var(--blur-overlay);
|
|
3773
|
+
}
|
|
3774
|
+
.hs-tour-card[data-placed='false'] {
|
|
3775
|
+
visibility: hidden;
|
|
3776
|
+
}
|
|
3777
|
+
.hs-tour-title {
|
|
3778
|
+
font-size: var(--fs-md);
|
|
3779
|
+
font-weight: var(--fw-strong);
|
|
3780
|
+
color: var(--text);
|
|
3781
|
+
}
|
|
3782
|
+
.hs-tour-text {
|
|
3783
|
+
font-size: var(--fs-body);
|
|
3784
|
+
line-height: var(--lh-body);
|
|
3785
|
+
color: var(--mut);
|
|
3786
|
+
}
|
|
3787
|
+
.hs-tour-actions {
|
|
3788
|
+
display: flex;
|
|
3789
|
+
align-items: center;
|
|
3790
|
+
gap: var(--gap-inline);
|
|
3791
|
+
margin-top: var(--space);
|
|
3792
|
+
}
|
|
3793
|
+
.hs-tour-fill {
|
|
3794
|
+
flex: 1;
|
|
3795
|
+
}
|
|
3591
3796
|
.hs-confirm {
|
|
3592
3797
|
inset: 0;
|
|
3593
3798
|
z-index: 70;
|
|
@@ -3679,6 +3884,7 @@
|
|
|
3679
3884
|
line-height: 1.15;
|
|
3680
3885
|
color: var(--text);
|
|
3681
3886
|
text-align: center;
|
|
3887
|
+
text-wrap: balance;
|
|
3682
3888
|
}
|
|
3683
3889
|
.hs-walk-sub {
|
|
3684
3890
|
margin-top: calc(var(--space) * 2);
|
|
@@ -3943,6 +4149,12 @@
|
|
|
3943
4149
|
inset: 0;
|
|
3944
4150
|
border-radius: 0;
|
|
3945
4151
|
}
|
|
4152
|
+
.hs-view-frame:is([data-mode='overlay'], [data-mode='popover']) {
|
|
4153
|
+
position: absolute;
|
|
4154
|
+
inset: 0;
|
|
4155
|
+
border-radius: 0;
|
|
4156
|
+
background: transparent;
|
|
4157
|
+
}
|
|
3946
4158
|
.hs-view-frame[data-mode='modal'] {
|
|
3947
4159
|
flex: 1;
|
|
3948
4160
|
min-height: 0;
|
|
@@ -3988,6 +4200,7 @@
|
|
|
3988
4200
|
width: 100%;
|
|
3989
4201
|
border: 0;
|
|
3990
4202
|
background: transparent;
|
|
4203
|
+
color-scheme: light dark;
|
|
3991
4204
|
}
|
|
3992
4205
|
.hs-view-sheet {
|
|
3993
4206
|
position: absolute;
|
|
@@ -4033,12 +4246,6 @@
|
|
|
4033
4246
|
width: 0;
|
|
4034
4247
|
height: 0;
|
|
4035
4248
|
}
|
|
4036
|
-
.hs-menu-position::before {
|
|
4037
|
-
content: '';
|
|
4038
|
-
position: absolute;
|
|
4039
|
-
inset: calc(var(--space) * -3);
|
|
4040
|
-
z-index: -1;
|
|
4041
|
-
}
|
|
4042
4249
|
.hs-menu-position > .hs-menu-surface {
|
|
4043
4250
|
overflow-y: auto;
|
|
4044
4251
|
overscroll-behavior: contain;
|
|
@@ -4080,7 +4287,7 @@
|
|
|
4080
4287
|
padding: calc(var(--space) * 0.5) calc(var(--space) * 1.5);
|
|
4081
4288
|
border-radius: var(--r-pill);
|
|
4082
4289
|
background: var(--hov);
|
|
4083
|
-
font-size: var(--fs-
|
|
4290
|
+
font-size: var(--fs-cap);
|
|
4084
4291
|
color: var(--mut);
|
|
4085
4292
|
}
|
|
4086
4293
|
.hs-menu-chip {
|
|
@@ -4115,6 +4322,7 @@
|
|
|
4115
4322
|
flex-direction: row;
|
|
4116
4323
|
gap: calc(var(--space) * 2);
|
|
4117
4324
|
padding: calc(var(--space) * 2) calc(var(--space) * 2.75);
|
|
4325
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
4118
4326
|
}
|
|
4119
4327
|
html.hs-view .hs-tooltip {
|
|
4120
4328
|
background: var(--plate-menu);
|
|
@@ -4308,7 +4516,7 @@
|
|
|
4308
4516
|
display: flex;
|
|
4309
4517
|
flex-direction: column;
|
|
4310
4518
|
gap: calc(var(--space) * 1.25);
|
|
4311
|
-
padding-right: var(--
|
|
4519
|
+
padding-right: var(--pad-sidebar);
|
|
4312
4520
|
padding-bottom: calc(var(--space) * 19);
|
|
4313
4521
|
-webkit-mask-image: linear-gradient( 180deg, #000 calc(100% - var(--space) * 19), transparent calc(100% - var(--space) * 3.5) );
|
|
4314
4522
|
mask-image: linear-gradient( 180deg, #000 calc(100% - var(--space) * 19), transparent calc(100% - var(--space) * 3.5) );
|
|
@@ -4442,15 +4650,47 @@
|
|
|
4442
4650
|
height: var(--h-lane);
|
|
4443
4651
|
cursor: pointer;
|
|
4444
4652
|
color: var(--capt);
|
|
4653
|
+
transition: color var(--dur) var(--ease-out);
|
|
4445
4654
|
}
|
|
4446
4655
|
.hs-caption-button:hover {
|
|
4447
4656
|
color: var(--text);
|
|
4448
4657
|
background: var(--hov);
|
|
4449
4658
|
}
|
|
4450
4659
|
.hs-caption-button[data-danger='true']:hover {
|
|
4451
|
-
color:
|
|
4660
|
+
color: var(--capt-close-ink);
|
|
4452
4661
|
background: var(--capt-close);
|
|
4453
4662
|
}
|
|
4663
|
+
.hs-server-picture, .hs-apps-picture {
|
|
4664
|
+
position: relative;
|
|
4665
|
+
width: 100%;
|
|
4666
|
+
height: 100%;
|
|
4667
|
+
color: var(--picture-ink);
|
|
4668
|
+
}
|
|
4669
|
+
.hs-apps-picture {
|
|
4670
|
+
overflow: hidden;
|
|
4671
|
+
}
|
|
4672
|
+
.hs-picture-mesh {
|
|
4673
|
+
position: absolute;
|
|
4674
|
+
inset: 0;
|
|
4675
|
+
}
|
|
4676
|
+
.hs-heatmap-picture {
|
|
4677
|
+
width: 100%;
|
|
4678
|
+
height: 100%;
|
|
4679
|
+
}
|
|
4680
|
+
.hs-picture-tile {
|
|
4681
|
+
display: grid;
|
|
4682
|
+
place-items: center;
|
|
4683
|
+
border: var(--bw) solid var(--picture-rim);
|
|
4684
|
+
border-radius: var(--r-icon);
|
|
4685
|
+
background: var(--picture-film);
|
|
4686
|
+
box-shadow: var(--picture-gloss);
|
|
4687
|
+
backdrop-filter: var(--blur-film);
|
|
4688
|
+
-webkit-backdrop-filter: var(--blur-film);
|
|
4689
|
+
}
|
|
4690
|
+
.hs-picture-line {
|
|
4691
|
+
height: var(--bw);
|
|
4692
|
+
background: var(--picture-line);
|
|
4693
|
+
}
|
|
4454
4694
|
.hs-caption-glyph {
|
|
4455
4695
|
flex: 1;
|
|
4456
4696
|
display: grid;
|
|
@@ -4461,8 +4701,18 @@
|
|
|
4461
4701
|
.hs-caption-glyph[data-hovered='true'] {
|
|
4462
4702
|
color: var(--text);
|
|
4463
4703
|
}
|
|
4464
|
-
.hs-
|
|
4465
|
-
|
|
4704
|
+
.hs-caption-rule {
|
|
4705
|
+
position: absolute;
|
|
4706
|
+
top: calc((var(--h-lane) - var(--h-lane-rule)) / 2);
|
|
4707
|
+
left: calc(var(--gap-tile) / -2);
|
|
4708
|
+
width: var(--bw);
|
|
4709
|
+
height: var(--h-lane-rule);
|
|
4710
|
+
background: var(--tipline);
|
|
4711
|
+
opacity: var(--lane-rule-alpha);
|
|
4712
|
+
transform: translateX(-50%);
|
|
4713
|
+
}
|
|
4714
|
+
.hs-sheet-button[data-strong='true'] {
|
|
4715
|
+
font-weight: var(--fw-semi);
|
|
4466
4716
|
}
|
|
4467
4717
|
.hs-panel-menu {
|
|
4468
4718
|
min-width: calc(var(--space) * 56);
|
|
@@ -4524,14 +4774,24 @@
|
|
|
4524
4774
|
width: calc(var(--space) * 16.5);
|
|
4525
4775
|
height: calc(var(--space) * 16.5);
|
|
4526
4776
|
border-radius: var(--r-round);
|
|
4527
|
-
box-shadow:
|
|
4777
|
+
box-shadow: var(--shadow-orb), var(--shadow-orb-lift);
|
|
4528
4778
|
cursor: pointer;
|
|
4529
4779
|
flex: none;
|
|
4530
4780
|
}
|
|
4531
4781
|
.hs-orb[data-sel='true'] {
|
|
4532
|
-
box-shadow:
|
|
4782
|
+
box-shadow: var(--shadow-orb), 0 0 0 5px var(--card);
|
|
4533
4783
|
cursor: auto;
|
|
4534
4784
|
}
|
|
4785
|
+
.hs-orb[data-sel='true']::after {
|
|
4786
|
+
content: '';
|
|
4787
|
+
position: absolute;
|
|
4788
|
+
inset: calc(var(--space) * -1.75);
|
|
4789
|
+
padding: calc(var(--space) * 0.5);
|
|
4790
|
+
border-radius: var(--r-round);
|
|
4791
|
+
background: var(--mark-grad);
|
|
4792
|
+
mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
|
|
4793
|
+
pointer-events: none;
|
|
4794
|
+
}
|
|
4535
4795
|
.hs-colourway-check, .hs-colourway-custom-check {
|
|
4536
4796
|
position: absolute;
|
|
4537
4797
|
right: calc(var(--space) * -0.75);
|
|
@@ -4596,7 +4856,7 @@
|
|
|
4596
4856
|
margin-left: calc(var(--space) * -0.75);
|
|
4597
4857
|
border-radius: var(--r-pill);
|
|
4598
4858
|
background: var(--win);
|
|
4599
|
-
box-shadow:
|
|
4859
|
+
box-shadow: var(--ring-marker);
|
|
4600
4860
|
}
|
|
4601
4861
|
.hs-colour-editor {
|
|
4602
4862
|
display: flex;
|
|
@@ -4851,7 +5111,7 @@
|
|
|
4851
5111
|
inset: 0;
|
|
4852
5112
|
z-index: 1;
|
|
4853
5113
|
border: 0;
|
|
4854
|
-
background:
|
|
5114
|
+
background: var(--page-ground);
|
|
4855
5115
|
visibility: hidden;
|
|
4856
5116
|
}
|
|
4857
5117
|
.hs-tab-page[data-placed='true'] {
|
|
@@ -4861,6 +5121,16 @@
|
|
|
4861
5121
|
z-index: auto;
|
|
4862
5122
|
pointer-events: none;
|
|
4863
5123
|
}
|
|
5124
|
+
.hs-page-failed {
|
|
5125
|
+
position: absolute;
|
|
5126
|
+
inset: 0;
|
|
5127
|
+
z-index: 1;
|
|
5128
|
+
background: var(--win);
|
|
5129
|
+
}
|
|
5130
|
+
.hs-page-failed[data-covered='true'] {
|
|
5131
|
+
z-index: auto;
|
|
5132
|
+
pointer-events: none;
|
|
5133
|
+
}
|
|
4864
5134
|
.hs-main-view[data-web='true'] > .hs-view-frame {
|
|
4865
5135
|
background: transparent;
|
|
4866
5136
|
}
|
|
@@ -4923,8 +5193,6 @@
|
|
|
4923
5193
|
left: 0;
|
|
4924
5194
|
top: calc(var(--space) * 7.5);
|
|
4925
5195
|
z-index: 40;
|
|
4926
|
-
padding: calc(var(--space) * 2.5);
|
|
4927
|
-
margin: calc(var(--space) * -2.5);
|
|
4928
5196
|
}
|
|
4929
5197
|
.hs-document-refusal {
|
|
4930
5198
|
flex: 1;
|
|
@@ -5123,6 +5391,17 @@
|
|
|
5123
5391
|
height: 1em;
|
|
5124
5392
|
line-height: 1;
|
|
5125
5393
|
}
|
|
5394
|
+
.hs-icon:is(.hs-glyph-side-wide, .hs-glyph-side-narrow) {
|
|
5395
|
+
background: currentColor;
|
|
5396
|
+
}
|
|
5397
|
+
.hs-icon.hs-glyph-side-wide {
|
|
5398
|
+
-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;
|
|
5399
|
+
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;
|
|
5400
|
+
}
|
|
5401
|
+
.hs-icon.hs-glyph-side-narrow {
|
|
5402
|
+
-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;
|
|
5403
|
+
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;
|
|
5404
|
+
}
|
|
5126
5405
|
.hs-shell[data-theme='dark'] .hs-light-only, .hs-shell[data-theme='light'] .hs-dark-only {
|
|
5127
5406
|
display: none;
|
|
5128
5407
|
}
|
|
@@ -5143,6 +5422,7 @@
|
|
|
5143
5422
|
text-decoration: none;
|
|
5144
5423
|
cursor: pointer;
|
|
5145
5424
|
user-select: none;
|
|
5425
|
+
transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
5146
5426
|
}
|
|
5147
5427
|
.hs-button[data-size='md'] {
|
|
5148
5428
|
height: var(--h-ctl-md);
|
|
@@ -5182,6 +5462,16 @@
|
|
|
5182
5462
|
background: var(--hov);
|
|
5183
5463
|
color: var(--text);
|
|
5184
5464
|
}
|
|
5465
|
+
.hs-button:is( [data-variant='secondary'], [data-variant='danger'], [data-variant='ghost'] ):active:not(:disabled) {
|
|
5466
|
+
background: var(--pressed);
|
|
5467
|
+
}
|
|
5468
|
+
.hs-button:focus-visible {
|
|
5469
|
+
outline: none;
|
|
5470
|
+
box-shadow: var(--focus);
|
|
5471
|
+
}
|
|
5472
|
+
.hs-button:is([data-variant='secondary'], [data-variant='danger']):focus-visible {
|
|
5473
|
+
box-shadow: var(--gloss-edge), var(--focus);
|
|
5474
|
+
}
|
|
5185
5475
|
.hs-button[data-variant='primary'] {
|
|
5186
5476
|
position: relative;
|
|
5187
5477
|
overflow: hidden;
|
|
@@ -5190,9 +5480,18 @@
|
|
|
5190
5480
|
background: var(--accent-sheen), var(--accent-grad);
|
|
5191
5481
|
box-shadow: var(--accent-bevel), var(--accent-glow);
|
|
5192
5482
|
}
|
|
5483
|
+
.hs-button[data-variant='primary']:disabled {
|
|
5484
|
+
box-shadow: var(--accent-bevel);
|
|
5485
|
+
}
|
|
5193
5486
|
.hs-button[data-variant='primary']:hover:not(:disabled) {
|
|
5194
5487
|
filter: brightness(1.05);
|
|
5195
5488
|
}
|
|
5489
|
+
.hs-button[data-variant='primary']:active:not(:disabled) {
|
|
5490
|
+
filter: brightness(0.95);
|
|
5491
|
+
}
|
|
5492
|
+
.hs-button[data-variant='primary']:focus-visible {
|
|
5493
|
+
box-shadow: var(--accent-bevel), var(--accent-glow), var(--focus);
|
|
5494
|
+
}
|
|
5196
5495
|
.hs-button[data-variant='primary']::before {
|
|
5197
5496
|
content: '';
|
|
5198
5497
|
position: absolute;
|
|
@@ -5211,7 +5510,7 @@
|
|
|
5211
5510
|
border: 0;
|
|
5212
5511
|
border-radius: var(--r-ctl);
|
|
5213
5512
|
background: transparent;
|
|
5214
|
-
color: var(--
|
|
5513
|
+
color: var(--mut);
|
|
5215
5514
|
cursor: pointer;
|
|
5216
5515
|
}
|
|
5217
5516
|
.hs-icon-button[data-size='sm'] {
|
|
@@ -5231,6 +5530,14 @@
|
|
|
5231
5530
|
background: var(--hov);
|
|
5232
5531
|
color: var(--text);
|
|
5233
5532
|
}
|
|
5533
|
+
.hs-icon-button:active:not(:disabled) {
|
|
5534
|
+
background: var(--pressed);
|
|
5535
|
+
color: var(--text);
|
|
5536
|
+
}
|
|
5537
|
+
.hs-icon-button:focus-visible {
|
|
5538
|
+
outline: none;
|
|
5539
|
+
box-shadow: var(--focus);
|
|
5540
|
+
}
|
|
5234
5541
|
.hs-icon-button:disabled {
|
|
5235
5542
|
opacity: 0.4;
|
|
5236
5543
|
cursor: default;
|
|
@@ -5293,6 +5600,16 @@
|
|
|
5293
5600
|
padding: calc(var(--space) * 4.5) calc(var(--space) * 5) calc(var(--space) * 1.5);
|
|
5294
5601
|
font-size: var(--fs-md);
|
|
5295
5602
|
}
|
|
5603
|
+
.hs-report-exact {
|
|
5604
|
+
display: flex;
|
|
5605
|
+
flex-direction: column;
|
|
5606
|
+
align-items: flex-start;
|
|
5607
|
+
gap: calc(var(--space) * 2);
|
|
5608
|
+
margin: calc(var(--space) * 3) 0;
|
|
5609
|
+
}
|
|
5610
|
+
.hs-report-exact > :not(button) {
|
|
5611
|
+
align-self: stretch;
|
|
5612
|
+
}
|
|
5296
5613
|
.hs-notice {
|
|
5297
5614
|
display: inline-flex;
|
|
5298
5615
|
flex-wrap: wrap;
|
|
@@ -5304,6 +5621,44 @@
|
|
|
5304
5621
|
font-size: var(--fs-row);
|
|
5305
5622
|
color: var(--mut);
|
|
5306
5623
|
}
|
|
5624
|
+
html.hs-view-window-page, html.hs-view-window-page > body {
|
|
5625
|
+
margin: 0;
|
|
5626
|
+
overflow: hidden;
|
|
5627
|
+
background: transparent;
|
|
5628
|
+
}
|
|
5629
|
+
.hs-shell.hs-view-window {
|
|
5630
|
+
position: fixed;
|
|
5631
|
+
inset: 0;
|
|
5632
|
+
background: transparent;
|
|
5633
|
+
}
|
|
5634
|
+
.hs-shell.hs-overlay-page {
|
|
5635
|
+
padding: calc(var(--space) * 3);
|
|
5636
|
+
background: transparent;
|
|
5637
|
+
}
|
|
5638
|
+
.hs-overlay-note {
|
|
5639
|
+
display: flex;
|
|
5640
|
+
flex-direction: column;
|
|
5641
|
+
gap: var(--space);
|
|
5642
|
+
padding: calc(var(--space) * 2.75) calc(var(--space) * 3.5);
|
|
5643
|
+
border: var(--bw) solid var(--line);
|
|
5644
|
+
border-radius: var(--r-card);
|
|
5645
|
+
background: var(--win);
|
|
5646
|
+
box-shadow: var(--shadow-pop);
|
|
5647
|
+
color: var(--text);
|
|
5648
|
+
font-size: var(--fs-row);
|
|
5649
|
+
cursor: default;
|
|
5650
|
+
user-select: none;
|
|
5651
|
+
}
|
|
5652
|
+
.hs-overlay-note-title {
|
|
5653
|
+
font-weight: var(--fw-semi);
|
|
5654
|
+
}
|
|
5655
|
+
.hs-overlay-note-text {
|
|
5656
|
+
max-height: calc(var(--space) * 60);
|
|
5657
|
+
overflow: hidden;
|
|
5658
|
+
line-height: var(--lh-body);
|
|
5659
|
+
white-space: pre-wrap;
|
|
5660
|
+
overflow-wrap: anywhere;
|
|
5661
|
+
}
|
|
5307
5662
|
.hs-chart, .hs-diagram {
|
|
5308
5663
|
margin-bottom: calc(var(--space) * 3.5);
|
|
5309
5664
|
padding: calc(var(--space) * 3) calc(var(--space) * 3.5);
|
|
@@ -5583,20 +5938,19 @@
|
|
|
5583
5938
|
justify-content: center;
|
|
5584
5939
|
flex: none;
|
|
5585
5940
|
overflow: hidden;
|
|
5586
|
-
border-radius: var(--r-
|
|
5941
|
+
border-radius: var(--r-icon);
|
|
5587
5942
|
color: var(--mut);
|
|
5588
|
-
background: var(--hov);
|
|
5589
5943
|
font-size: 0.8em;
|
|
5590
5944
|
}
|
|
5591
|
-
.hs-model-avatar:has(img) {
|
|
5592
|
-
background: var(--avatar-plate);
|
|
5593
|
-
}
|
|
5594
5945
|
.hs-model-avatar img {
|
|
5595
5946
|
display: block;
|
|
5596
5947
|
width: 100%;
|
|
5597
5948
|
height: 100%;
|
|
5598
5949
|
object-fit: contain;
|
|
5599
5950
|
}
|
|
5951
|
+
.hs-model-avatar:has(> .hs-model-avatar-initial) {
|
|
5952
|
+
background: var(--hov);
|
|
5953
|
+
}
|
|
5600
5954
|
.hs-model-avatar-initial {
|
|
5601
5955
|
text-transform: uppercase;
|
|
5602
5956
|
}
|
|
@@ -5748,6 +6102,7 @@
|
|
|
5748
6102
|
flex: none;
|
|
5749
6103
|
}
|
|
5750
6104
|
.hs-settings-card {
|
|
6105
|
+
--hov: var(--hov-plate);
|
|
5751
6106
|
display: flex;
|
|
5752
6107
|
flex-direction: column;
|
|
5753
6108
|
min-width: 0;
|
|
@@ -5760,6 +6115,9 @@
|
|
|
5760
6115
|
border: 0;
|
|
5761
6116
|
border-radius: 0;
|
|
5762
6117
|
}
|
|
6118
|
+
.hs-settings-card .hs-link-row:hover {
|
|
6119
|
+
background: var(--hov);
|
|
6120
|
+
}
|
|
5763
6121
|
.hs-settings-card > .hs-setrow:first-child {
|
|
5764
6122
|
border-top-left-radius: calc(var(--r-card) - var(--bw));
|
|
5765
6123
|
border-top-right-radius: calc(var(--r-card) - var(--bw));
|
|
@@ -6009,11 +6367,17 @@
|
|
|
6009
6367
|
.hs-docs-prose a.hs-docs-anchor {
|
|
6010
6368
|
display: inline-flex;
|
|
6011
6369
|
align-items: center;
|
|
6012
|
-
|
|
6370
|
+
width: 0;
|
|
6371
|
+
overflow: visible;
|
|
6013
6372
|
color: var(--dim);
|
|
6014
6373
|
opacity: 0;
|
|
6015
6374
|
vertical-align: middle;
|
|
6016
6375
|
text-decoration: none;
|
|
6376
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
6377
|
+
}
|
|
6378
|
+
.hs-docs-prose a.hs-docs-anchor > :is(svg, .hs-mask) {
|
|
6379
|
+
flex: none;
|
|
6380
|
+
margin-left: calc(var(--space) * 2);
|
|
6017
6381
|
}
|
|
6018
6382
|
.hs-docs-heading:hover .hs-docs-anchor, .hs-docs-prose a.hs-docs-anchor:focus-visible {
|
|
6019
6383
|
opacity: 1;
|
|
@@ -6149,13 +6513,14 @@
|
|
|
6149
6513
|
background: var(--hov);
|
|
6150
6514
|
color: var(--mut);
|
|
6151
6515
|
cursor: pointer;
|
|
6516
|
+
transition: opacity var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
6152
6517
|
}
|
|
6153
6518
|
.hs-docs-code-body > .hs-docs-code-copy {
|
|
6154
6519
|
position: absolute;
|
|
6155
6520
|
top: calc(var(--space) * 2);
|
|
6156
6521
|
right: calc(var(--space) * 2);
|
|
6157
6522
|
opacity: 0;
|
|
6158
|
-
backdrop-filter: blur
|
|
6523
|
+
backdrop-filter: var(--blur-copy);
|
|
6159
6524
|
}
|
|
6160
6525
|
.hs-docs-code-body:hover > .hs-docs-code-copy, .hs-docs-code-copy:focus-visible, .hs-docs-code-copy[data-copied='true'] {
|
|
6161
6526
|
opacity: 1;
|
|
@@ -6199,6 +6564,10 @@
|
|
|
6199
6564
|
.hs-docs-callout[data-type='idea'] {
|
|
6200
6565
|
--callout: var(--accent);
|
|
6201
6566
|
}
|
|
6567
|
+
.hs-docs-callout[data-type='idea'] .hs-docs-callout-rail {
|
|
6568
|
+
background: var(--mark-grad);
|
|
6569
|
+
opacity: 0.5;
|
|
6570
|
+
}
|
|
6202
6571
|
.hs-docs-callout-icon {
|
|
6203
6572
|
flex: none;
|
|
6204
6573
|
display: inline-flex;
|
|
@@ -6237,6 +6606,7 @@
|
|
|
6237
6606
|
background: var(--card);
|
|
6238
6607
|
color: var(--text);
|
|
6239
6608
|
text-decoration: none;
|
|
6609
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
6240
6610
|
}
|
|
6241
6611
|
.hs-docs-prose a.hs-docs-card {
|
|
6242
6612
|
color: var(--text);
|
|
@@ -6368,6 +6738,7 @@
|
|
|
6368
6738
|
}
|
|
6369
6739
|
.hs-docs-accordion summary svg {
|
|
6370
6740
|
color: var(--dim);
|
|
6741
|
+
transition: transform var(--dur) var(--ease-out);
|
|
6371
6742
|
}
|
|
6372
6743
|
.hs-docs-accordion[open] summary svg {
|
|
6373
6744
|
transform: rotate(90deg);
|
|
@@ -6405,6 +6776,7 @@
|
|
|
6405
6776
|
color: var(--text);
|
|
6406
6777
|
font-size: var(--fs-docs-note);
|
|
6407
6778
|
text-decoration: none;
|
|
6779
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
6408
6780
|
}
|
|
6409
6781
|
.hs-docs-pager-card:hover {
|
|
6410
6782
|
background: var(--btnhov);
|
|
@@ -6460,10 +6832,8 @@
|
|
|
6460
6832
|
.hs-market-hero:not([data-plate])::before {
|
|
6461
6833
|
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
6834
|
}
|
|
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
6835
|
.hs-market-hero[data-plate]::before {
|
|
6836
|
+
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
6837
|
filter: brightness(var(--market-hero-brightness));
|
|
6468
6838
|
}
|
|
6469
6839
|
.hs-market-hero[data-plate] .hs-market-title, .hs-market-hero[data-plate] .hs-market-lead {
|
|
@@ -6473,6 +6843,13 @@
|
|
|
6473
6843
|
display: flex;
|
|
6474
6844
|
flex-direction: column;
|
|
6475
6845
|
gap: calc(var(--space) * 4.5);
|
|
6846
|
+
animation: hsMarketSettle calc(var(--dur) * 2) var(--ease-out);
|
|
6847
|
+
}
|
|
6848
|
+
@keyframes hsMarketSettle {
|
|
6849
|
+
from {
|
|
6850
|
+
opacity: 0;
|
|
6851
|
+
translate: 0 calc(var(--space) * 2);
|
|
6852
|
+
}
|
|
6476
6853
|
}
|
|
6477
6854
|
.hs-market-title {
|
|
6478
6855
|
margin: 0;
|
|
@@ -6530,6 +6907,7 @@
|
|
|
6530
6907
|
grid-template-columns: 0fr;
|
|
6531
6908
|
margin-right: 0;
|
|
6532
6909
|
opacity: 0;
|
|
6910
|
+
transition: grid-template-columns var(--dur) var(--ease-out), margin var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
6533
6911
|
}
|
|
6534
6912
|
.hs-market-menu-slot[data-shown] {
|
|
6535
6913
|
grid-template-columns: 1fr;
|
|
@@ -6540,6 +6918,7 @@
|
|
|
6540
6918
|
min-width: 0;
|
|
6541
6919
|
overflow: hidden;
|
|
6542
6920
|
white-space: nowrap;
|
|
6921
|
+
transition: padding var(--dur) var(--ease-out), border-width var(--dur) var(--ease-out), background-color var(--dur) var(--ease-out);
|
|
6543
6922
|
}
|
|
6544
6923
|
.hs-market-menu-slot:not([data-shown]) > .hs-market-menu-button {
|
|
6545
6924
|
padding: 0;
|
|
@@ -6562,6 +6941,7 @@
|
|
|
6562
6941
|
font: inherit;
|
|
6563
6942
|
color: var(--text);
|
|
6564
6943
|
cursor: pointer;
|
|
6944
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
6565
6945
|
}
|
|
6566
6946
|
.hs-market-menu-button > span {
|
|
6567
6947
|
color: var(--mut);
|
|
@@ -6601,8 +6981,6 @@
|
|
|
6601
6981
|
width: calc(var(--space) * 55);
|
|
6602
6982
|
}
|
|
6603
6983
|
.hs-market-toolbar .hs-chip {
|
|
6604
|
-
display: inline-flex;
|
|
6605
|
-
align-items: center;
|
|
6606
6984
|
height: var(--h-ctl);
|
|
6607
6985
|
padding: 0 calc(var(--space) * 2.25);
|
|
6608
6986
|
box-sizing: border-box;
|
|
@@ -6663,137 +7041,152 @@
|
|
|
6663
7041
|
display: none;
|
|
6664
7042
|
}
|
|
6665
7043
|
}
|
|
6666
|
-
.hs-market-
|
|
6667
|
-
|
|
6668
|
-
|
|
6669
|
-
|
|
6670
|
-
|
|
7044
|
+
.hs-market-feature {
|
|
7045
|
+
position: relative;
|
|
7046
|
+
overflow: hidden;
|
|
7047
|
+
border-radius: var(--r-card);
|
|
7048
|
+
isolation: isolate;
|
|
7049
|
+
box-shadow: var(--shadow-pop);
|
|
7050
|
+
}
|
|
7051
|
+
.hs-market-feature-track {
|
|
7052
|
+
display: flex;
|
|
7053
|
+
overflow-x: auto;
|
|
7054
|
+
clip-path: inset(0 round var(--r-card));
|
|
7055
|
+
scroll-snap-type: x mandatory;
|
|
7056
|
+
overscroll-behavior-x: contain;
|
|
7057
|
+
}
|
|
7058
|
+
.hs-market-feature-track::-webkit-scrollbar {
|
|
7059
|
+
display: none;
|
|
6671
7060
|
}
|
|
6672
|
-
.hs-market-
|
|
7061
|
+
.hs-market-feature-card {
|
|
6673
7062
|
position: relative;
|
|
6674
7063
|
display: flex;
|
|
6675
|
-
flex
|
|
6676
|
-
|
|
7064
|
+
flex: 0 0 100%;
|
|
7065
|
+
align-items: flex-end;
|
|
7066
|
+
aspect-ratio: var(--market-cover-ratio);
|
|
7067
|
+
min-height: calc(var(--space) * 100);
|
|
6677
7068
|
padding: 0;
|
|
6678
7069
|
overflow: hidden;
|
|
6679
|
-
border:
|
|
6680
|
-
border-radius: var(--r-card);
|
|
7070
|
+
border: 0;
|
|
6681
7071
|
background: var(--card);
|
|
6682
7072
|
font: inherit;
|
|
6683
7073
|
text-align: left;
|
|
6684
7074
|
text-decoration: none;
|
|
7075
|
+
scroll-snap-align: start;
|
|
6685
7076
|
isolation: isolate;
|
|
6686
7077
|
}
|
|
6687
|
-
.hs-shell .hs-market-
|
|
7078
|
+
.hs-shell .hs-market-feature-card, .hs-shell .hs-market-row {
|
|
6688
7079
|
color: var(--text);
|
|
6689
7080
|
cursor: pointer;
|
|
6690
7081
|
}
|
|
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
|
-
}
|
|
7082
|
+
.hs-shell .hs-market-feature-card {
|
|
7083
|
+
color: var(--scrim-ink);
|
|
6718
7084
|
}
|
|
6719
|
-
.hs-market-
|
|
7085
|
+
.hs-market-feature-cover {
|
|
6720
7086
|
position: absolute;
|
|
6721
7087
|
inset: 0;
|
|
6722
7088
|
z-index: -1;
|
|
6723
7089
|
width: 100%;
|
|
6724
7090
|
height: 100%;
|
|
6725
7091
|
object-fit: cover;
|
|
6726
|
-
|
|
7092
|
+
transition: scale calc(var(--dur) * 4) var(--ease-out);
|
|
6727
7093
|
}
|
|
6728
|
-
.hs-market-
|
|
6729
|
-
|
|
6730
|
-
place-items: center;
|
|
7094
|
+
.hs-market-feature-card:hover .hs-market-feature-cover {
|
|
7095
|
+
scale: 1.02;
|
|
6731
7096
|
}
|
|
6732
|
-
.hs-market-
|
|
6733
|
-
|
|
6734
|
-
|
|
7097
|
+
.hs-market-feature-band {
|
|
7098
|
+
position: relative;
|
|
7099
|
+
display: flex;
|
|
7100
|
+
align-items: center;
|
|
7101
|
+
gap: calc(var(--space) * 5);
|
|
7102
|
+
width: 100%;
|
|
7103
|
+
padding: calc(var(--space) * 20) calc(var(--space) * 9) calc(var(--space) * 13);
|
|
6735
7104
|
}
|
|
6736
|
-
.hs-market-
|
|
6737
|
-
|
|
6738
|
-
|
|
7105
|
+
.hs-market-feature-band::before {
|
|
7106
|
+
content: '';
|
|
7107
|
+
position: absolute;
|
|
7108
|
+
inset: 0;
|
|
7109
|
+
z-index: -1;
|
|
7110
|
+
background: var(--scrim-feature);
|
|
7111
|
+
backdrop-filter: var(--blur-overlay);
|
|
7112
|
+
-webkit-backdrop-filter: var(--blur-overlay);
|
|
7113
|
+
mask-image: linear-gradient(to bottom, transparent, #000 60%);
|
|
7114
|
+
-webkit-mask-image: linear-gradient(to bottom, transparent, #000 60%);
|
|
6739
7115
|
}
|
|
6740
|
-
.hs-market-
|
|
6741
|
-
|
|
7116
|
+
.hs-market-feature-band .hs-market-logo {
|
|
7117
|
+
flex: none;
|
|
7118
|
+
box-shadow: var(--shadow-feature-logo);
|
|
6742
7119
|
}
|
|
6743
|
-
.hs-market-
|
|
7120
|
+
.hs-market-feature-copy {
|
|
6744
7121
|
display: flex;
|
|
7122
|
+
flex: 1;
|
|
6745
7123
|
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;
|
|
7124
|
+
gap: calc(var(--space) * 1.5);
|
|
7125
|
+
min-width: 0;
|
|
6754
7126
|
}
|
|
6755
|
-
.hs-market-
|
|
6756
|
-
font-size: var(--fs-market-
|
|
6757
|
-
line-height: 1.
|
|
7127
|
+
.hs-market-feature-copy strong {
|
|
7128
|
+
font-size: var(--fs-market-feature);
|
|
7129
|
+
line-height: 1.05;
|
|
6758
7130
|
font-weight: var(--fw-semi);
|
|
6759
7131
|
letter-spacing: -0.02em;
|
|
6760
7132
|
}
|
|
6761
|
-
.hs-market-
|
|
7133
|
+
.hs-market-feature-copy > span {
|
|
6762
7134
|
display: -webkit-box;
|
|
6763
7135
|
-webkit-box-orient: vertical;
|
|
6764
7136
|
-webkit-line-clamp: 2;
|
|
6765
|
-
max-width:
|
|
7137
|
+
max-width: 56ch;
|
|
6766
7138
|
overflow: hidden;
|
|
6767
|
-
font-size: var(--fs-
|
|
7139
|
+
font-size: var(--fs-market-line);
|
|
7140
|
+
line-height: 1.35;
|
|
6768
7141
|
opacity: 0.9;
|
|
6769
7142
|
}
|
|
6770
|
-
.hs-market-
|
|
6771
|
-
|
|
7143
|
+
.hs-market-feature .hs-market-view {
|
|
7144
|
+
padding: calc(var(--space) * 2.25) calc(var(--space) * 5.5);
|
|
7145
|
+
font-size: var(--fs-md);
|
|
6772
7146
|
}
|
|
6773
|
-
.hs-market-
|
|
7147
|
+
.hs-market-feature-dots {
|
|
7148
|
+
position: absolute;
|
|
7149
|
+
bottom: calc(var(--space) * 4);
|
|
7150
|
+
left: 50%;
|
|
6774
7151
|
display: flex;
|
|
6775
7152
|
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
|
-
|
|
7153
|
+
gap: calc(var(--space) * 2);
|
|
7154
|
+
padding: calc(var(--space) * 2) calc(var(--space) * 3);
|
|
7155
|
+
border-radius: var(--r-pill);
|
|
7156
|
+
background: var(--glass-on-dark);
|
|
7157
|
+
backdrop-filter: var(--blur-glass);
|
|
7158
|
+
-webkit-backdrop-filter: var(--blur-glass);
|
|
7159
|
+
translate: -50% 0;
|
|
7160
|
+
}
|
|
7161
|
+
.hs-market-feature-dots button {
|
|
7162
|
+
width: calc(var(--space) * 1.75);
|
|
7163
|
+
height: calc(var(--space) * 1.75);
|
|
7164
|
+
padding: 0;
|
|
7165
|
+
border: 0;
|
|
7166
|
+
border-radius: var(--r-pill);
|
|
7167
|
+
background: var(--scrim-ink);
|
|
7168
|
+
opacity: 0.4;
|
|
7169
|
+
cursor: pointer;
|
|
7170
|
+
transition: width var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
6791
7171
|
}
|
|
6792
|
-
.hs-market-
|
|
6793
|
-
|
|
7172
|
+
.hs-market-feature-dots button[aria-current] {
|
|
7173
|
+
width: calc(var(--space) * 5);
|
|
7174
|
+
opacity: 1;
|
|
6794
7175
|
}
|
|
6795
|
-
|
|
6796
|
-
|
|
7176
|
+
@media (width < 760px) {
|
|
7177
|
+
.hs-market-feature-card {
|
|
7178
|
+
aspect-ratio: 4 / 5;
|
|
7179
|
+
}
|
|
7180
|
+
.hs-market-feature-band {
|
|
7181
|
+
flex-wrap: wrap;
|
|
7182
|
+
padding: calc(var(--space) * 16) calc(var(--space) * 5) calc(var(--space) * 13);
|
|
7183
|
+
}
|
|
7184
|
+
.hs-market-feature-band .hs-market-logo {
|
|
7185
|
+
display: none;
|
|
7186
|
+
}
|
|
7187
|
+
.hs-market-feature-copy {
|
|
7188
|
+
flex-basis: 100%;
|
|
7189
|
+
}
|
|
6797
7190
|
}
|
|
6798
7191
|
.hs-market-view {
|
|
6799
7192
|
flex: none;
|
|
@@ -6828,6 +7221,7 @@
|
|
|
6828
7221
|
font: inherit;
|
|
6829
7222
|
text-align: left;
|
|
6830
7223
|
text-decoration: none;
|
|
7224
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
6831
7225
|
}
|
|
6832
7226
|
.hs-market-row:hover {
|
|
6833
7227
|
background: var(--hov);
|
|
@@ -6889,18 +7283,16 @@
|
|
|
6889
7283
|
@supports (color: color-mix(in lab, red, red)) {
|
|
6890
7284
|
background: color-mix(in srgb, var(--card) 55%, transparent);
|
|
6891
7285
|
}
|
|
6892
|
-
box-shadow:
|
|
7286
|
+
box-shadow: var(--shadow-logo);
|
|
6893
7287
|
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);
|
|
7288
|
+
transition: transform calc(var(--dur) * 3) var(--ease-out);
|
|
6897
7289
|
}
|
|
6898
7290
|
.hs-market-logo::after {
|
|
6899
7291
|
content: '';
|
|
6900
7292
|
position: absolute;
|
|
6901
7293
|
inset: 0;
|
|
6902
7294
|
border-radius: inherit;
|
|
6903
|
-
background:
|
|
7295
|
+
background: var(--gloss-logo);
|
|
6904
7296
|
pointer-events: none;
|
|
6905
7297
|
}
|
|
6906
7298
|
.hs-market-banner-body > .hs-market-logo:hover {
|
|
@@ -6908,8 +7300,7 @@
|
|
|
6908
7300
|
}
|
|
6909
7301
|
.hs-market-logo img {
|
|
6910
7302
|
display: block;
|
|
6911
|
-
|
|
6912
|
-
height: 100%;
|
|
7303
|
+
border-radius: var(--r-icon);
|
|
6913
7304
|
object-fit: cover;
|
|
6914
7305
|
}
|
|
6915
7306
|
.hs-app-icon {
|
|
@@ -6958,6 +7349,7 @@
|
|
|
6958
7349
|
mask-composite: intersect;
|
|
6959
7350
|
-webkit-mask-composite: source-in;
|
|
6960
7351
|
pointer-events: none;
|
|
7352
|
+
transition: opacity calc(var(--dur) * 4) var(--ease-out);
|
|
6961
7353
|
}
|
|
6962
7354
|
.hs-market-banner-art[data-shown] {
|
|
6963
7355
|
opacity: 1;
|
|
@@ -7128,31 +7520,27 @@
|
|
|
7128
7520
|
height: calc(var(--space) * 65);
|
|
7129
7521
|
}
|
|
7130
7522
|
}
|
|
7131
|
-
.hs-shell .hs-market-
|
|
7523
|
+
.hs-shell .hs-market-turn {
|
|
7132
7524
|
position: absolute;
|
|
7133
|
-
top:
|
|
7525
|
+
top: 50%;
|
|
7134
7526
|
display: grid;
|
|
7135
7527
|
place-items: center;
|
|
7136
7528
|
width: calc(var(--space) * 10);
|
|
7137
7529
|
height: calc(var(--space) * 10);
|
|
7138
7530
|
padding: 0;
|
|
7139
|
-
|
|
7531
|
+
translate: 0 -50%;
|
|
7140
7532
|
opacity: 0;
|
|
7533
|
+
cursor: pointer;
|
|
7534
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
7141
7535
|
}
|
|
7142
|
-
.hs-market-shots-wrap:hover .hs-market-
|
|
7536
|
+
.hs-market-shots-wrap:hover .hs-market-turn, .hs-market-feature:hover .hs-market-turn, .hs-market-turn:focus-visible {
|
|
7143
7537
|
opacity: 1;
|
|
7144
7538
|
}
|
|
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);
|
|
7539
|
+
.hs-market-turn[data-side='start'] {
|
|
7540
|
+
left: calc(var(--space) * 4);
|
|
7153
7541
|
}
|
|
7154
|
-
.hs-market-
|
|
7155
|
-
|
|
7542
|
+
.hs-market-turn[data-side='end'] {
|
|
7543
|
+
right: calc(var(--space) * 4);
|
|
7156
7544
|
}
|
|
7157
7545
|
.hs-market-part {
|
|
7158
7546
|
display: flex;
|
|
@@ -7323,6 +7711,46 @@
|
|
|
7323
7711
|
.hs-shell .hs-market-get:hover {
|
|
7324
7712
|
color: var(--mut);
|
|
7325
7713
|
}
|
|
7714
|
+
.hs-market-rate {
|
|
7715
|
+
display: inline-flex;
|
|
7716
|
+
align-self: flex-start;
|
|
7717
|
+
align-items: center;
|
|
7718
|
+
gap: var(--space);
|
|
7719
|
+
}
|
|
7720
|
+
.hs-shell .hs-market-rate-star {
|
|
7721
|
+
display: grid;
|
|
7722
|
+
place-items: center;
|
|
7723
|
+
width: var(--h-ctl-md);
|
|
7724
|
+
height: var(--h-ctl-md);
|
|
7725
|
+
padding: 0;
|
|
7726
|
+
border: 0;
|
|
7727
|
+
border-radius: var(--r-sm);
|
|
7728
|
+
background: transparent;
|
|
7729
|
+
color: var(--dim);
|
|
7730
|
+
cursor: pointer;
|
|
7731
|
+
}
|
|
7732
|
+
.hs-shell .hs-market-rate-star:hover:not(:disabled), .hs-shell .hs-market-rate-star[data-lit='true'] {
|
|
7733
|
+
color: var(--text);
|
|
7734
|
+
}
|
|
7735
|
+
.hs-shell .hs-market-rate-star:disabled {
|
|
7736
|
+
cursor: default;
|
|
7737
|
+
}
|
|
7738
|
+
.hs-shell .hs-market-rate-in {
|
|
7739
|
+
display: inline-flex;
|
|
7740
|
+
align-items: center;
|
|
7741
|
+
align-self: flex-start;
|
|
7742
|
+
height: var(--h-ctl-md);
|
|
7743
|
+
padding: 0 calc(var(--space) * 4);
|
|
7744
|
+
font-size: var(--fs-md);
|
|
7745
|
+
font-weight: var(--fw-med);
|
|
7746
|
+
color: var(--text);
|
|
7747
|
+
text-decoration: none;
|
|
7748
|
+
}
|
|
7749
|
+
.hs-market-rate-failed {
|
|
7750
|
+
margin-left: calc(var(--space) * 2);
|
|
7751
|
+
font-size: var(--fs-sm);
|
|
7752
|
+
color: var(--dim);
|
|
7753
|
+
}
|
|
7326
7754
|
.hs-market-scroll {
|
|
7327
7755
|
flex: 1;
|
|
7328
7756
|
min-height: 0;
|
|
@@ -7350,25 +7778,26 @@
|
|
|
7350
7778
|
}
|
|
7351
7779
|
}
|
|
7352
7780
|
@container market-page (width < 860px) {
|
|
7353
|
-
.hs-market-tiles {
|
|
7354
|
-
grid-template-columns: 1fr;
|
|
7355
|
-
grid-auto-rows: calc(var(--space) * 70);
|
|
7356
|
-
}
|
|
7357
|
-
.hs-market-tile:first-child, .hs-market-tile:nth-child(2):last-child {
|
|
7358
|
-
grid-row: auto;
|
|
7359
|
-
}
|
|
7360
|
-
.hs-market-tile:first-child .hs-market-tile-copy strong {
|
|
7361
|
-
font-size: var(--fs-market-tile);
|
|
7362
|
-
}
|
|
7363
|
-
.hs-market-tile:first-child .hs-market-tile-plate .hs-market-logo {
|
|
7364
|
-
translate: 0 calc(var(--space) * 9);
|
|
7365
|
-
scale: 0.7;
|
|
7366
|
-
}
|
|
7367
7781
|
.hs-market-shots img {
|
|
7368
7782
|
height: calc(var(--space) * 65);
|
|
7369
7783
|
}
|
|
7370
7784
|
}
|
|
7371
|
-
@container market-page (width <
|
|
7785
|
+
@container market-page (width < 760px) {
|
|
7786
|
+
.hs-market-feature-card {
|
|
7787
|
+
aspect-ratio: 4 / 5;
|
|
7788
|
+
}
|
|
7789
|
+
.hs-market-feature-band {
|
|
7790
|
+
flex-wrap: wrap;
|
|
7791
|
+
padding: calc(var(--space) * 16) calc(var(--space) * 5) calc(var(--space) * 13);
|
|
7792
|
+
}
|
|
7793
|
+
.hs-market-feature-band .hs-market-logo {
|
|
7794
|
+
display: none;
|
|
7795
|
+
}
|
|
7796
|
+
.hs-market-feature-copy {
|
|
7797
|
+
flex-basis: 100%;
|
|
7798
|
+
}
|
|
7799
|
+
}
|
|
7800
|
+
@container market-page (width < 700px) {
|
|
7372
7801
|
.hs-market-rows, .hs-market-info {
|
|
7373
7802
|
grid-template-columns: minmax(0, 1fr);
|
|
7374
7803
|
}
|
|
@@ -7449,11 +7878,6 @@
|
|
|
7449
7878
|
font-size: var(--fs-body);
|
|
7450
7879
|
color: var(--mut);
|
|
7451
7880
|
}
|
|
7452
|
-
.hs-market-consent {
|
|
7453
|
-
display: flex;
|
|
7454
|
-
flex-direction: column;
|
|
7455
|
-
gap: calc(var(--space) * 1.5);
|
|
7456
|
-
}
|
|
7457
7881
|
.hs-market-recommend {
|
|
7458
7882
|
display: flex;
|
|
7459
7883
|
align-items: center;
|
|
@@ -7485,6 +7909,7 @@
|
|
|
7485
7909
|
font-size: var(--fs-lead);
|
|
7486
7910
|
font-weight: var(--fw-med);
|
|
7487
7911
|
cursor: pointer;
|
|
7912
|
+
transition: background-color var(--dur) var(--ease-out);
|
|
7488
7913
|
}
|
|
7489
7914
|
.hs-shell .hs-signin-method:hover {
|
|
7490
7915
|
background: var(--btnhov);
|
|
@@ -8176,8 +8601,9 @@
|
|
|
8176
8601
|
}
|
|
8177
8602
|
.hs-installer-fill {
|
|
8178
8603
|
height: 100%;
|
|
8179
|
-
background:
|
|
8180
|
-
box-shadow:
|
|
8604
|
+
background: var(--gloss-fill), linear-gradient(90deg, var(--mark-lo), var(--mark-hi));
|
|
8605
|
+
box-shadow: var(--gloss-fill-edge);
|
|
8606
|
+
transition: clip-path var(--dur) var(--ease-out);
|
|
8181
8607
|
}
|
|
8182
8608
|
.hs-installer-rows {
|
|
8183
8609
|
display: flex;
|
|
@@ -8214,7 +8640,7 @@
|
|
|
8214
8640
|
border-radius: var(--r-round);
|
|
8215
8641
|
}
|
|
8216
8642
|
.hs-installer-stage[data-state='current'] .hs-installer-dot {
|
|
8217
|
-
background: var(--
|
|
8643
|
+
background: var(--mark-grad);
|
|
8218
8644
|
box-shadow: 0 0 8px var(--accent);
|
|
8219
8645
|
@supports (color: color-mix(in lab, red, red)) {
|
|
8220
8646
|
box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 55%, transparent);
|
|
@@ -8318,25 +8744,13 @@
|
|
|
8318
8744
|
}
|
|
8319
8745
|
.hs-nav-column > .hs-settings-search {
|
|
8320
8746
|
flex: none;
|
|
8321
|
-
margin: 0 var(--
|
|
8747
|
+
margin: 0 var(--pad-sidebar) calc(var(--space) * 2) 0;
|
|
8322
8748
|
}
|
|
8323
8749
|
.hs-fact-lines {
|
|
8324
8750
|
display: flex;
|
|
8325
8751
|
flex-direction: column;
|
|
8326
8752
|
gap: var(--space);
|
|
8327
8753
|
}
|
|
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
8754
|
.hs-app-review {
|
|
8341
8755
|
margin: calc(var(--space) * 1.5) 0 0;
|
|
8342
8756
|
padding-left: calc(var(--space) * 4.5);
|
|
@@ -8349,15 +8763,15 @@
|
|
|
8349
8763
|
gap: var(--gap-stack);
|
|
8350
8764
|
}
|
|
8351
8765
|
.hs-segmented {
|
|
8352
|
-
display:
|
|
8766
|
+
display: grid;
|
|
8767
|
+
grid-auto-flow: column;
|
|
8768
|
+
grid-auto-columns: 1fr;
|
|
8353
8769
|
gap: var(--gap-label);
|
|
8354
8770
|
padding: var(--gap-label);
|
|
8355
8771
|
border: var(--bw) solid var(--cardb);
|
|
8356
8772
|
border-radius: var(--r-ctl);
|
|
8357
8773
|
}
|
|
8358
8774
|
.hs-segmented-option {
|
|
8359
|
-
flex: 1;
|
|
8360
|
-
min-width: 0;
|
|
8361
8775
|
height: calc(var(--h-ctl) - 2 * var(--gap-label) - 2 * var(--bw));
|
|
8362
8776
|
padding: var(--pad-ctl);
|
|
8363
8777
|
border: var(--bw) solid transparent;
|
|
@@ -8368,6 +8782,7 @@
|
|
|
8368
8782
|
font-size: var(--fs-body);
|
|
8369
8783
|
white-space: nowrap;
|
|
8370
8784
|
cursor: pointer;
|
|
8785
|
+
transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
8371
8786
|
}
|
|
8372
8787
|
.hs-segmented-option:hover:not(:disabled) {
|
|
8373
8788
|
color: var(--text);
|
|
@@ -8481,400 +8896,1519 @@
|
|
|
8481
8896
|
font-size: var(--fs-md);
|
|
8482
8897
|
color: var(--text);
|
|
8483
8898
|
}
|
|
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 {
|
|
8899
|
+
.hs-dashboard {
|
|
8506
8900
|
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);
|
|
8901
|
+
min-height: 100dvh;
|
|
8902
|
+
background: var(--fadeL);
|
|
8903
|
+
background-attachment: fixed;
|
|
8519
8904
|
}
|
|
8520
|
-
.hs-
|
|
8521
|
-
|
|
8905
|
+
.hs-dashboard::after {
|
|
8906
|
+
content: '';
|
|
8907
|
+
position: fixed;
|
|
8522
8908
|
}
|
|
8523
|
-
.hs-
|
|
8524
|
-
|
|
8525
|
-
flex: none;
|
|
8909
|
+
.hs-world-map-hi {
|
|
8910
|
+
stop-color: var(--mark-hi);
|
|
8526
8911
|
}
|
|
8527
|
-
.hs-
|
|
8528
|
-
|
|
8912
|
+
.hs-world-map-lo {
|
|
8913
|
+
stop-color: var(--mark-lo);
|
|
8529
8914
|
}
|
|
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);
|
|
8915
|
+
.hs-dashboard-bar {
|
|
8916
|
+
position: sticky;
|
|
8917
|
+
top: 0;
|
|
8918
|
+
z-index: 50;
|
|
8919
|
+
padding: calc(var(--space) * 3);
|
|
8538
8920
|
}
|
|
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);
|
|
8921
|
+
.hs-dashboard-plate, .hs-bento-tile, .hs-figure {
|
|
8922
|
+
border: var(--bw) solid var(--tipline);
|
|
8548
8923
|
border-radius: var(--r-card);
|
|
8549
8924
|
background: var(--tipbg);
|
|
8550
|
-
border: var(--bw) solid var(--tipline);
|
|
8551
8925
|
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
8552
8926
|
backdrop-filter: var(--blur-overlay);
|
|
8553
8927
|
-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
8928
|
}
|
|
8561
|
-
.hs-
|
|
8929
|
+
.hs-dashboard-plate {
|
|
8562
8930
|
position: relative;
|
|
8563
|
-
|
|
8564
|
-
|
|
8931
|
+
display: grid;
|
|
8932
|
+
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
|
|
8933
|
+
align-items: center;
|
|
8934
|
+
max-width: calc(var(--space) * 310);
|
|
8935
|
+
min-height: calc(var(--space) * 14);
|
|
8936
|
+
margin: 0 auto;
|
|
8937
|
+
padding: 0 calc(var(--space) * 2.5) 0 var(--space);
|
|
8565
8938
|
}
|
|
8566
|
-
|
|
8567
|
-
|
|
8568
|
-
|
|
8569
|
-
|
|
8570
|
-
|
|
8939
|
+
.hs-shell .hs-dashboard-brand {
|
|
8940
|
+
justify-self: start;
|
|
8941
|
+
display: inline-flex;
|
|
8942
|
+
color: var(--text);
|
|
8943
|
+
text-decoration: none;
|
|
8571
8944
|
}
|
|
8572
|
-
.hs-
|
|
8573
|
-
|
|
8574
|
-
|
|
8575
|
-
|
|
8945
|
+
.hs-dashboard-nav {
|
|
8946
|
+
display: flex;
|
|
8947
|
+
align-items: center;
|
|
8948
|
+
gap: var(--gap-inline);
|
|
8576
8949
|
}
|
|
8577
|
-
.hs-
|
|
8578
|
-
|
|
8950
|
+
.hs-shell .hs-dashboard-link {
|
|
8951
|
+
display: inline-flex;
|
|
8952
|
+
align-items: center;
|
|
8953
|
+
gap: calc(var(--space) * 1.75);
|
|
8954
|
+
padding: calc(var(--space) * 1.75) calc(var(--space) * 3.25);
|
|
8955
|
+
border: var(--bw) solid transparent;
|
|
8956
|
+
border-radius: var(--r-ctl);
|
|
8957
|
+
font-size: var(--fs-md);
|
|
8958
|
+
font-weight: var(--fw-med);
|
|
8959
|
+
white-space: nowrap;
|
|
8960
|
+
color: var(--mut);
|
|
8961
|
+
text-decoration: none;
|
|
8962
|
+
transition: color var(--dur) var(--ease-out), background-color var(--dur) var(--ease-out);
|
|
8579
8963
|
}
|
|
8580
|
-
.hs-
|
|
8581
|
-
|
|
8964
|
+
.hs-shell .hs-dashboard-link:hover {
|
|
8965
|
+
color: var(--text);
|
|
8966
|
+
background: var(--hov);
|
|
8967
|
+
box-shadow: var(--gloss-edge);
|
|
8582
8968
|
}
|
|
8583
|
-
.hs-
|
|
8584
|
-
|
|
8585
|
-
|
|
8586
|
-
|
|
8969
|
+
.hs-shell .hs-dashboard-link[aria-current='page'] {
|
|
8970
|
+
color: var(--text);
|
|
8971
|
+
background: var(--hov);
|
|
8972
|
+
border-color: var(--tipline);
|
|
8973
|
+
box-shadow: var(--gloss-edge);
|
|
8587
8974
|
}
|
|
8588
|
-
.hs-
|
|
8589
|
-
|
|
8590
|
-
min-height: 0;
|
|
8591
|
-
height: auto;
|
|
8975
|
+
.hs-shell .hs-dashboard-link[aria-current='page']:hover {
|
|
8976
|
+
background: var(--btnhov);
|
|
8592
8977
|
}
|
|
8593
|
-
.hs-
|
|
8978
|
+
.hs-dashboard-link > .hs-glyph {
|
|
8594
8979
|
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
8980
|
}
|
|
8602
|
-
.hs-
|
|
8603
|
-
|
|
8604
|
-
-
|
|
8981
|
+
.hs-dashboard-link:focus-visible {
|
|
8982
|
+
outline: none;
|
|
8983
|
+
box-shadow: var(--focus);
|
|
8605
8984
|
}
|
|
8606
|
-
.hs-
|
|
8607
|
-
|
|
8985
|
+
.hs-dashboard-menu, .hs-dashboard-menu-toggle {
|
|
8986
|
+
display: none;
|
|
8608
8987
|
}
|
|
8609
|
-
.hs-
|
|
8610
|
-
|
|
8988
|
+
.hs-dashboard-main {
|
|
8989
|
+
max-width: calc(var(--space) * 316);
|
|
8990
|
+
margin: 0 auto;
|
|
8991
|
+
padding: calc(var(--space) * 5) calc(var(--space) * 3) calc(var(--space) * 16);
|
|
8611
8992
|
}
|
|
8612
|
-
.hs-
|
|
8993
|
+
.hs-dashboard-title {
|
|
8994
|
+
margin: calc(var(--space) * 2) 0 calc(var(--space) * 5);
|
|
8995
|
+
font-size: var(--fs-page);
|
|
8996
|
+
font-weight: var(--fw-semi);
|
|
8997
|
+
letter-spacing: -0.02em;
|
|
8998
|
+
line-height: 1.1;
|
|
8999
|
+
color: var(--text);
|
|
9000
|
+
}
|
|
9001
|
+
.hs-dashboard-main[data-centered='true'] {
|
|
8613
9002
|
display: flex;
|
|
9003
|
+
flex-direction: column;
|
|
8614
9004
|
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);
|
|
9005
|
+
justify-content: center;
|
|
9006
|
+
gap: calc(var(--space) * 3);
|
|
9007
|
+
min-height: calc(100dvh - var(--space) * 20);
|
|
9008
|
+
padding-top: 0;
|
|
9009
|
+
text-align: center;
|
|
8628
9010
|
}
|
|
8629
|
-
.hs-
|
|
8630
|
-
|
|
8631
|
-
min-width: 0;
|
|
8632
|
-
overflow: hidden;
|
|
8633
|
-
text-overflow: ellipsis;
|
|
9011
|
+
.hs-dashboard-main[data-centered='true'] > .hs-dashboard-title {
|
|
9012
|
+
margin: 0;
|
|
8634
9013
|
}
|
|
8635
|
-
.hs-
|
|
8636
|
-
|
|
9014
|
+
.hs-dashboard-note {
|
|
9015
|
+
margin: 0;
|
|
9016
|
+
max-width: calc(var(--space) * 140);
|
|
9017
|
+
font-size: var(--fs-lead);
|
|
9018
|
+
line-height: var(--lh-body);
|
|
9019
|
+
color: var(--mut);
|
|
9020
|
+
text-wrap: pretty;
|
|
8637
9021
|
}
|
|
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;
|
|
9022
|
+
.hs-dashboard-said {
|
|
9023
|
+
margin: 0;
|
|
9024
|
+
font-size: var(--fs-md);
|
|
8647
9025
|
color: var(--text);
|
|
8648
9026
|
}
|
|
8649
|
-
.hs-
|
|
8650
|
-
|
|
8651
|
-
font-weight: var(--fw-strong);
|
|
9027
|
+
.hs-dashboard-said[data-ok='false'] {
|
|
9028
|
+
color: var(--bad);
|
|
8652
9029
|
}
|
|
8653
|
-
.hs-
|
|
8654
|
-
|
|
9030
|
+
.hs-dashboard-actions {
|
|
9031
|
+
display: flex;
|
|
9032
|
+
flex-wrap: wrap;
|
|
9033
|
+
justify-content: flex-end;
|
|
9034
|
+
gap: calc(var(--space) * 1.5);
|
|
8655
9035
|
}
|
|
8656
|
-
.hs-
|
|
8657
|
-
|
|
9036
|
+
.hs-dashboard-actions form {
|
|
9037
|
+
display: contents;
|
|
8658
9038
|
}
|
|
8659
|
-
.hs-
|
|
8660
|
-
|
|
9039
|
+
.hs-dashboard-listing {
|
|
9040
|
+
display: flex;
|
|
8661
9041
|
align-items: center;
|
|
8662
|
-
|
|
9042
|
+
gap: calc(var(--space) * 2.5);
|
|
8663
9043
|
}
|
|
8664
|
-
.hs-
|
|
8665
|
-
|
|
8666
|
-
|
|
8667
|
-
transition: flex-grow var(--dur) var(--ease-out);
|
|
9044
|
+
.hs-dashboard-listing-name {
|
|
9045
|
+
display: flex;
|
|
9046
|
+
flex-direction: column;
|
|
8668
9047
|
}
|
|
8669
|
-
.hs-
|
|
8670
|
-
|
|
9048
|
+
.hs-dashboard-listing small {
|
|
9049
|
+
color: var(--mut);
|
|
9050
|
+
font-size: var(--fs-sm);
|
|
8671
9051
|
}
|
|
8672
|
-
.hs-
|
|
9052
|
+
.hs-bento {
|
|
8673
9053
|
display: grid;
|
|
8674
|
-
|
|
8675
|
-
|
|
9054
|
+
grid-template-columns: repeat(12, minmax(0, 1fr));
|
|
9055
|
+
grid-auto-flow: row dense;
|
|
9056
|
+
gap: calc(var(--space) * 4);
|
|
8676
9057
|
}
|
|
8677
|
-
.hs-
|
|
8678
|
-
|
|
9058
|
+
.hs-bento-tile {
|
|
9059
|
+
grid-column: span 12;
|
|
9060
|
+
display: flex;
|
|
9061
|
+
flex-direction: column;
|
|
9062
|
+
gap: calc(var(--space) * 4);
|
|
8679
9063
|
min-width: 0;
|
|
8680
|
-
|
|
9064
|
+
padding: calc(var(--space) * 5);
|
|
8681
9065
|
}
|
|
8682
|
-
.hs-
|
|
8683
|
-
|
|
9066
|
+
.hs-bento-tile[data-span='4'] {
|
|
9067
|
+
grid-column: span 4;
|
|
8684
9068
|
}
|
|
8685
|
-
.hs-
|
|
8686
|
-
|
|
9069
|
+
.hs-bento-tile[data-span='5'] {
|
|
9070
|
+
grid-column: span 5;
|
|
8687
9071
|
}
|
|
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);
|
|
9072
|
+
.hs-bento-tile[data-span='6'] {
|
|
9073
|
+
grid-column: span 6;
|
|
8709
9074
|
}
|
|
8710
|
-
.hs-
|
|
8711
|
-
|
|
9075
|
+
.hs-bento-tile[data-span='7'] {
|
|
9076
|
+
grid-column: span 7;
|
|
8712
9077
|
}
|
|
8713
|
-
.hs-
|
|
8714
|
-
|
|
9078
|
+
.hs-bento-tile[data-span='8'] {
|
|
9079
|
+
grid-column: span 8;
|
|
8715
9080
|
}
|
|
8716
|
-
.hs-
|
|
8717
|
-
|
|
8718
|
-
|
|
9081
|
+
.hs-bento-tile[data-tall='true'] {
|
|
9082
|
+
grid-row: span 2;
|
|
9083
|
+
}
|
|
9084
|
+
.hs-bento-title {
|
|
9085
|
+
margin: 0;
|
|
9086
|
+
font-size: var(--fs-lead);
|
|
8719
9087
|
font-weight: var(--fw-semi);
|
|
9088
|
+
letter-spacing: -0.01em;
|
|
9089
|
+
line-height: 1.3;
|
|
8720
9090
|
color: var(--text);
|
|
8721
|
-
white-space: nowrap;
|
|
8722
|
-
overflow: hidden;
|
|
8723
|
-
text-overflow: ellipsis;
|
|
8724
9091
|
}
|
|
8725
|
-
.hs-
|
|
9092
|
+
.hs-bento-body {
|
|
9093
|
+
flex: 1;
|
|
9094
|
+
display: flex;
|
|
9095
|
+
flex-direction: column;
|
|
9096
|
+
min-width: 0;
|
|
9097
|
+
}
|
|
9098
|
+
.hs-bento-body:has(> .hs-data-table) {
|
|
9099
|
+
overflow-x: auto;
|
|
9100
|
+
}
|
|
9101
|
+
.hs-bento-tile[data-aside='true'] > .hs-bento-body {
|
|
9102
|
+
display: grid;
|
|
9103
|
+
grid-template-columns: minmax(0, 5fr) minmax(0, 3fr);
|
|
9104
|
+
align-items: start;
|
|
9105
|
+
gap: calc(var(--space) * 8);
|
|
9106
|
+
}
|
|
9107
|
+
.hs-bento-aside {
|
|
9108
|
+
align-self: stretch;
|
|
9109
|
+
min-width: 0;
|
|
9110
|
+
contain: size;
|
|
9111
|
+
overflow: hidden auto;
|
|
9112
|
+
padding-bottom: calc(var(--space) * 8);
|
|
9113
|
+
-webkit-mask-image: linear-gradient(180deg, #000 calc(100% - var(--space) * 8), transparent);
|
|
9114
|
+
mask-image: linear-gradient(180deg, #000 calc(100% - var(--space) * 8), transparent);
|
|
9115
|
+
}
|
|
9116
|
+
.hs-figures {
|
|
9117
|
+
grid-column: 1 / -1;
|
|
9118
|
+
display: grid;
|
|
9119
|
+
grid-template-columns: repeat(auto-fit, minmax(calc(var(--space) * 40), 1fr));
|
|
9120
|
+
gap: calc(var(--space) * 4);
|
|
9121
|
+
}
|
|
9122
|
+
.hs-figure {
|
|
8726
9123
|
position: relative;
|
|
8727
|
-
|
|
8728
|
-
|
|
8729
|
-
|
|
8730
|
-
|
|
9124
|
+
display: flex;
|
|
9125
|
+
flex-direction: column;
|
|
9126
|
+
justify-content: space-between;
|
|
9127
|
+
gap: calc(var(--space) * 3);
|
|
9128
|
+
min-width: 0;
|
|
9129
|
+
padding: calc(var(--space) * 4.5) calc(var(--space) * 5);
|
|
8731
9130
|
}
|
|
8732
|
-
.hs-
|
|
8733
|
-
|
|
8734
|
-
inset: 0;
|
|
8735
|
-
width: 100%;
|
|
8736
|
-
height: 100%;
|
|
8737
|
-
object-fit: cover;
|
|
8738
|
-
object-position: top left;
|
|
9131
|
+
.hs-figure:hover {
|
|
9132
|
+
z-index: 1;
|
|
8739
9133
|
}
|
|
8740
|
-
.hs-
|
|
8741
|
-
|
|
9134
|
+
.hs-figure-label {
|
|
9135
|
+
font-size: var(--fs-md);
|
|
9136
|
+
line-height: 1.35;
|
|
9137
|
+
color: var(--mut);
|
|
8742
9138
|
}
|
|
8743
|
-
.hs-
|
|
9139
|
+
.hs-figure-value {
|
|
9140
|
+
font-size: var(--fs-figure);
|
|
9141
|
+
font-weight: var(--fw-semi);
|
|
9142
|
+
font-variant-numeric: tabular-nums;
|
|
9143
|
+
letter-spacing: -0.03em;
|
|
9144
|
+
line-height: 1;
|
|
9145
|
+
color: var(--text);
|
|
9146
|
+
}
|
|
9147
|
+
.hs-bento-body > .hs-figures {
|
|
9148
|
+
grid-template-columns: minmax(0, 1fr);
|
|
9149
|
+
gap: 0;
|
|
9150
|
+
}
|
|
9151
|
+
.hs-bento-body .hs-figure {
|
|
9152
|
+
flex-direction: row;
|
|
9153
|
+
align-items: baseline;
|
|
9154
|
+
padding: calc(var(--space) * 3.5) 0;
|
|
9155
|
+
border: 0;
|
|
9156
|
+
border-top: var(--bw) solid var(--tipline);
|
|
9157
|
+
border-radius: 0;
|
|
9158
|
+
background: none;
|
|
9159
|
+
box-shadow: none;
|
|
9160
|
+
backdrop-filter: none;
|
|
9161
|
+
-webkit-backdrop-filter: none;
|
|
9162
|
+
}
|
|
9163
|
+
.hs-bento-body .hs-figure:first-child {
|
|
9164
|
+
padding-top: 0;
|
|
9165
|
+
border-top: 0;
|
|
9166
|
+
}
|
|
9167
|
+
.hs-figure > .hs-tip {
|
|
9168
|
+
top: calc(100% + var(--space));
|
|
9169
|
+
left: 0;
|
|
9170
|
+
width: max-content;
|
|
9171
|
+
max-width: min(calc(var(--space) * 70), 100%);
|
|
9172
|
+
white-space: normal;
|
|
9173
|
+
}
|
|
9174
|
+
.hs-figure:first-child > .hs-tip {
|
|
9175
|
+
max-width: calc(var(--space) * 70);
|
|
9176
|
+
}
|
|
9177
|
+
.hs-dashboard .hs-tooltip {
|
|
9178
|
+
background: var(--win);
|
|
9179
|
+
}
|
|
9180
|
+
.hs-bar-series {
|
|
9181
|
+
flex: 1;
|
|
9182
|
+
display: flex;
|
|
9183
|
+
flex-direction: column;
|
|
9184
|
+
gap: calc(var(--space) * 1.5);
|
|
9185
|
+
margin: 0;
|
|
9186
|
+
overflow-x: clip;
|
|
9187
|
+
font-size: var(--fs-sm);
|
|
9188
|
+
font-variant-numeric: tabular-nums;
|
|
9189
|
+
color: var(--dim);
|
|
9190
|
+
}
|
|
9191
|
+
.hs-bar-series-plot {
|
|
9192
|
+
flex: 1;
|
|
9193
|
+
display: flex;
|
|
9194
|
+
gap: calc(var(--space) * 0.75);
|
|
9195
|
+
min-height: calc(var(--space) * 36);
|
|
9196
|
+
border-bottom: var(--bw) solid var(--tipline);
|
|
9197
|
+
}
|
|
9198
|
+
.hs-bar-series-bar {
|
|
8744
9199
|
position: relative;
|
|
8745
9200
|
flex: 1;
|
|
9201
|
+
display: flex;
|
|
9202
|
+
align-items: flex-end;
|
|
8746
9203
|
min-width: 0;
|
|
8747
|
-
|
|
8748
|
-
margin: 0 var(--edge) var(--edge) 0;
|
|
8749
|
-
isolation: isolate;
|
|
9204
|
+
border-radius: var(--r-sm) var(--r-sm) 0 0;
|
|
8750
9205
|
}
|
|
8751
|
-
.hs-
|
|
8752
|
-
|
|
8753
|
-
|
|
9206
|
+
.hs-bar-series-bar > .hs-tip {
|
|
9207
|
+
bottom: calc(100% + var(--space));
|
|
9208
|
+
left: 50%;
|
|
9209
|
+
transform: translateX(-50%);
|
|
8754
9210
|
}
|
|
8755
|
-
.hs-
|
|
8756
|
-
|
|
8757
|
-
|
|
9211
|
+
.hs-bar-series-bar:nth-child(-n + 5) > .hs-tip {
|
|
9212
|
+
left: 0;
|
|
9213
|
+
transform: none;
|
|
8758
9214
|
}
|
|
8759
|
-
.hs-
|
|
8760
|
-
|
|
8761
|
-
|
|
9215
|
+
.hs-bar-series-bar:nth-last-child(-n + 5) > .hs-tip {
|
|
9216
|
+
left: auto;
|
|
9217
|
+
right: 0;
|
|
9218
|
+
transform: none;
|
|
8762
9219
|
}
|
|
8763
|
-
.hs-
|
|
8764
|
-
|
|
8765
|
-
left: 0;
|
|
8766
|
-
top: 0;
|
|
8767
|
-
visibility: hidden;
|
|
8768
|
-
pointer-events: none;
|
|
9220
|
+
.hs-bar-series-bar:hover {
|
|
9221
|
+
background: var(--hov);
|
|
8769
9222
|
}
|
|
8770
|
-
.hs-
|
|
8771
|
-
|
|
9223
|
+
.hs-bar-series-fill {
|
|
9224
|
+
width: 100%;
|
|
9225
|
+
border-radius: var(--r-sm) var(--r-sm) 0 0;
|
|
9226
|
+
background: var(--mark-grad);
|
|
9227
|
+
box-shadow: var(--gloss-edge);
|
|
9228
|
+
}
|
|
9229
|
+
.hs-bar-series-axis {
|
|
9230
|
+
display: flex;
|
|
9231
|
+
justify-content: space-between;
|
|
9232
|
+
}
|
|
9233
|
+
.hs-data-table {
|
|
9234
|
+
width: 100%;
|
|
9235
|
+
border-collapse: collapse;
|
|
9236
|
+
font-size: var(--fs-body);
|
|
9237
|
+
color: var(--text);
|
|
9238
|
+
}
|
|
9239
|
+
.hs-data-table th {
|
|
9240
|
+
padding: 0 calc(var(--space) * 3) calc(var(--space) * 2.5);
|
|
9241
|
+
font-size: var(--fs-sm);
|
|
9242
|
+
font-weight: 400;
|
|
9243
|
+
color: var(--mut);
|
|
9244
|
+
text-align: left;
|
|
9245
|
+
vertical-align: bottom;
|
|
9246
|
+
}
|
|
9247
|
+
.hs-data-table td {
|
|
9248
|
+
padding: calc(var(--space) * 2.25) calc(var(--space) * 3);
|
|
9249
|
+
border-top: var(--bw) solid var(--tipline);
|
|
9250
|
+
overflow-wrap: break-word;
|
|
9251
|
+
}
|
|
9252
|
+
.hs-data-table :is(th, td):first-child {
|
|
9253
|
+
padding-left: 0;
|
|
9254
|
+
}
|
|
9255
|
+
.hs-data-table :is(th, td):last-child {
|
|
9256
|
+
padding-right: 0;
|
|
9257
|
+
}
|
|
9258
|
+
.hs-data-table :is(th, td)[data-numeric='true'] {
|
|
9259
|
+
text-align: right;
|
|
9260
|
+
font-variant-numeric: tabular-nums;
|
|
9261
|
+
white-space: nowrap;
|
|
9262
|
+
}
|
|
9263
|
+
.hs-data-table-empty {
|
|
9264
|
+
color: var(--mut);
|
|
9265
|
+
}
|
|
9266
|
+
.hs-world-map {
|
|
9267
|
+
display: flex;
|
|
9268
|
+
flex-direction: column;
|
|
9269
|
+
gap: calc(var(--space) * 3);
|
|
9270
|
+
min-width: 0;
|
|
9271
|
+
margin: 0;
|
|
9272
|
+
}
|
|
9273
|
+
.hs-world-map-plot {
|
|
8772
9274
|
display: block;
|
|
8773
|
-
width:
|
|
8774
|
-
height:
|
|
9275
|
+
width: 100%;
|
|
9276
|
+
height: auto;
|
|
8775
9277
|
}
|
|
8776
|
-
.hs-
|
|
8777
|
-
|
|
9278
|
+
.hs-world-map-country {
|
|
9279
|
+
stroke: var(--tipline);
|
|
9280
|
+
stroke-width: 0.5;
|
|
9281
|
+
stroke-linejoin: round;
|
|
8778
9282
|
}
|
|
8779
|
-
.hs-
|
|
8780
|
-
|
|
9283
|
+
.hs-world-map-country:not([data-counted='true']) {
|
|
9284
|
+
fill: var(--hov);
|
|
8781
9285
|
}
|
|
8782
|
-
.hs-
|
|
8783
|
-
|
|
9286
|
+
.hs-world-map-country[data-counted='true'] {
|
|
9287
|
+
fill-opacity: calc(var(--map-floor) + (1 - var(--map-floor)) * var(--share));
|
|
8784
9288
|
}
|
|
8785
|
-
.hs-
|
|
8786
|
-
|
|
9289
|
+
.hs-world-map-scale {
|
|
9290
|
+
display: flex;
|
|
9291
|
+
align-items: center;
|
|
9292
|
+
gap: var(--gap-stack);
|
|
9293
|
+
font-size: var(--fs-sm);
|
|
9294
|
+
font-variant-numeric: tabular-nums;
|
|
9295
|
+
color: var(--dim);
|
|
8787
9296
|
}
|
|
8788
|
-
.hs-
|
|
9297
|
+
.hs-world-map-ramp {
|
|
9298
|
+
flex: none;
|
|
9299
|
+
width: calc(var(--space) * 30);
|
|
9300
|
+
height: calc(var(--space) * 2);
|
|
9301
|
+
border-radius: var(--r-pill);
|
|
9302
|
+
background: var(--mark-grad);
|
|
9303
|
+
-webkit-mask-image: linear-gradient( 90deg, rgb(0 0 0 / calc(var(--map-floor) + (1 - var(--map-floor)) * var(--share))), #000 );
|
|
9304
|
+
mask-image: linear-gradient( 90deg, rgb(0 0 0 / calc(var(--map-floor) + (1 - var(--map-floor)) * var(--share))), #000 );
|
|
9305
|
+
}
|
|
9306
|
+
@media (width < 1100px) {
|
|
9307
|
+
.hs-bento-tile[data-span='4'], .hs-bento-tile[data-span='5'], .hs-bento-tile[data-span='6'], .hs-bento-tile[data-span='7'] {
|
|
9308
|
+
grid-column: span 6;
|
|
9309
|
+
}
|
|
9310
|
+
.hs-bento-tile[data-span='8'] {
|
|
9311
|
+
grid-column: span 12;
|
|
9312
|
+
}
|
|
9313
|
+
.hs-bento-tile[data-aside='true'] > .hs-bento-body {
|
|
9314
|
+
grid-template-columns: minmax(0, 1fr);
|
|
9315
|
+
}
|
|
9316
|
+
.hs-bento-aside {
|
|
9317
|
+
contain: none;
|
|
9318
|
+
padding-bottom: 0;
|
|
9319
|
+
-webkit-mask-image: none;
|
|
9320
|
+
mask-image: none;
|
|
9321
|
+
}
|
|
9322
|
+
.hs-dashboard-plate {
|
|
9323
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
9324
|
+
}
|
|
9325
|
+
.hs-dashboard-menu-toggle {
|
|
9326
|
+
display: block;
|
|
9327
|
+
position: absolute;
|
|
9328
|
+
width: 1px;
|
|
9329
|
+
height: 1px;
|
|
9330
|
+
opacity: 0;
|
|
9331
|
+
pointer-events: none;
|
|
9332
|
+
}
|
|
9333
|
+
.hs-dashboard-menu {
|
|
9334
|
+
display: grid;
|
|
9335
|
+
place-items: center;
|
|
9336
|
+
width: calc(var(--space) * 11);
|
|
9337
|
+
height: calc(var(--space) * 11);
|
|
9338
|
+
border-radius: var(--r-ctl);
|
|
9339
|
+
color: var(--text);
|
|
9340
|
+
cursor: pointer;
|
|
9341
|
+
}
|
|
9342
|
+
.hs-dashboard-menu-toggle:focus-visible + .hs-dashboard-menu {
|
|
9343
|
+
box-shadow: var(--focus);
|
|
9344
|
+
}
|
|
9345
|
+
.hs-dashboard-menu-close, .hs-dashboard-menu-toggle:checked + .hs-dashboard-menu > .hs-dashboard-menu-open {
|
|
9346
|
+
display: none;
|
|
9347
|
+
}
|
|
9348
|
+
.hs-dashboard-menu-toggle:checked + .hs-dashboard-menu > .hs-dashboard-menu-close {
|
|
9349
|
+
display: grid;
|
|
9350
|
+
}
|
|
9351
|
+
.hs-dashboard-nav {
|
|
9352
|
+
display: none;
|
|
9353
|
+
grid-column: 1 / -1;
|
|
9354
|
+
flex-direction: column;
|
|
9355
|
+
align-items: stretch;
|
|
9356
|
+
gap: var(--space);
|
|
9357
|
+
padding: var(--space) 0 calc(var(--space) * 2.5) var(--space);
|
|
9358
|
+
border-top: var(--bw) solid var(--tipline);
|
|
9359
|
+
}
|
|
9360
|
+
.hs-dashboard-menu-toggle:checked ~ .hs-dashboard-nav {
|
|
9361
|
+
display: flex;
|
|
9362
|
+
}
|
|
9363
|
+
.hs-shell .hs-dashboard-link {
|
|
9364
|
+
padding: calc(var(--space) * 2.75) calc(var(--space) * 3);
|
|
9365
|
+
font-size: var(--fs-lead);
|
|
9366
|
+
}
|
|
9367
|
+
}
|
|
9368
|
+
@media (width < 720px) {
|
|
9369
|
+
.hs-bento-tile, .hs-bento-tile[data-span] {
|
|
9370
|
+
grid-column: 1 / -1;
|
|
9371
|
+
}
|
|
9372
|
+
.hs-bento-tile[data-tall='true'] {
|
|
9373
|
+
grid-row: auto;
|
|
9374
|
+
}
|
|
9375
|
+
.hs-figures {
|
|
9376
|
+
grid-template-columns: repeat(auto-fit, minmax(calc(var(--space) * 38), 1fr));
|
|
9377
|
+
}
|
|
9378
|
+
.hs-dashboard-bar {
|
|
9379
|
+
padding: calc(var(--space) * 2.5);
|
|
9380
|
+
}
|
|
9381
|
+
.hs-dashboard-main {
|
|
9382
|
+
padding: calc(var(--space) * 3) calc(var(--space) * 2.5) calc(var(--space) * 12);
|
|
9383
|
+
}
|
|
9384
|
+
.hs-bento-tile, .hs-figure {
|
|
9385
|
+
padding: calc(var(--space) * 4);
|
|
9386
|
+
}
|
|
9387
|
+
}
|
|
9388
|
+
.hs-sidebar-rail.hs-rail {
|
|
9389
|
+
flex: none;
|
|
9390
|
+
width: var(--w-rail);
|
|
9391
|
+
height: 100%;
|
|
9392
|
+
box-sizing: border-box;
|
|
9393
|
+
padding: 0 0 var(--edge);
|
|
9394
|
+
gap: var(--gap-rail);
|
|
9395
|
+
}
|
|
9396
|
+
.hs-rail-top {
|
|
9397
|
+
flex: none;
|
|
9398
|
+
display: grid;
|
|
9399
|
+
place-items: center;
|
|
9400
|
+
align-self: stretch;
|
|
8789
9401
|
height: var(--h-lane);
|
|
9402
|
+
-webkit-app-region: drag;
|
|
9403
|
+
}
|
|
9404
|
+
.hs-rail .hs-sidebar-rail-item, .hs-rail .hs-sidebar-rail-market {
|
|
9405
|
+
width: var(--icon-ctl-rail);
|
|
9406
|
+
height: var(--icon-ctl-rail);
|
|
9407
|
+
margin: 0;
|
|
9408
|
+
}
|
|
9409
|
+
.hs-rail-plate {
|
|
9410
|
+
position: relative;
|
|
9411
|
+
touch-action: none;
|
|
9412
|
+
}
|
|
9413
|
+
.hs-rail-plate-bypass {
|
|
9414
|
+
position: absolute;
|
|
9415
|
+
right: 0;
|
|
9416
|
+
bottom: 0;
|
|
9417
|
+
display: grid;
|
|
9418
|
+
place-items: center;
|
|
9419
|
+
border-radius: var(--r-round);
|
|
9420
|
+
background: var(--bg);
|
|
9421
|
+
color: var(--bad);
|
|
9422
|
+
pointer-events: none;
|
|
9423
|
+
}
|
|
9424
|
+
.hs-rail-plate img {
|
|
9425
|
+
-webkit-user-drag: none;
|
|
9426
|
+
}
|
|
9427
|
+
.hs-rail-plate[data-slide='true'] {
|
|
9428
|
+
transition: transform var(--dur) var(--ease-out);
|
|
9429
|
+
}
|
|
9430
|
+
.hs-rail-plate[data-lifted='true'] {
|
|
9431
|
+
z-index: 1;
|
|
9432
|
+
background: var(--hov);
|
|
9433
|
+
box-shadow: var(--gloss-edge), var(--shadow-drag);
|
|
9434
|
+
}
|
|
9435
|
+
.hs-rail[data-lifting='true'], .hs-rail[data-lifting='true'] * {
|
|
9436
|
+
cursor: grabbing;
|
|
9437
|
+
}
|
|
9438
|
+
.hs-ladder {
|
|
9439
|
+
--fan-size: var(--icon-ctl-rail);
|
|
9440
|
+
--fan-gap: var(--gap-rail);
|
|
9441
|
+
--fan-arrow-at: calc(var(--space) * 1.25);
|
|
9442
|
+
--fan-dot-x: var(--space);
|
|
9443
|
+
--fan-dot-y: calc(var(--space) * 1.75);
|
|
9444
|
+
}
|
|
9445
|
+
.hs-ladder-rung {
|
|
9446
|
+
color: var(--text);
|
|
9447
|
+
}
|
|
9448
|
+
.hs-ladder-rung[data-solid='true'] {
|
|
9449
|
+
background: var(--accent-grad);
|
|
9450
|
+
color: var(--accent-ink);
|
|
9451
|
+
box-shadow: var(--accent-shadow);
|
|
9452
|
+
}
|
|
9453
|
+
.hs-ladder-rung[data-pressed='true'] {
|
|
9454
|
+
cursor: default;
|
|
9455
|
+
}
|
|
9456
|
+
.hs-ladder-rung[data-pressed='true'] :is(svg, .hs-mask) {
|
|
9457
|
+
opacity: var(--rung-pressed-alpha);
|
|
9458
|
+
}
|
|
9459
|
+
.hs-workspace-tile {
|
|
9460
|
+
position: absolute;
|
|
9461
|
+
display: flex;
|
|
9462
|
+
flex-direction: column;
|
|
9463
|
+
}
|
|
9464
|
+
.hs-workspace-tile > .hs-tile-panel {
|
|
9465
|
+
flex: 1 1 0;
|
|
9466
|
+
min-height: 0;
|
|
9467
|
+
height: auto;
|
|
9468
|
+
}
|
|
9469
|
+
.hs-lane {
|
|
9470
|
+
flex: none;
|
|
9471
|
+
display: flex;
|
|
9472
|
+
align-items: center;
|
|
9473
|
+
gap: var(--gap-label);
|
|
9474
|
+
height: var(--h-lane-low);
|
|
9475
|
+
min-width: 0;
|
|
9476
|
+
box-sizing: border-box;
|
|
9477
|
+
}
|
|
9478
|
+
.hs-lane[data-row='top'] {
|
|
9479
|
+
height: var(--h-lane);
|
|
9480
|
+
-webkit-app-region: drag;
|
|
9481
|
+
}
|
|
9482
|
+
.hs-lane[data-row='top'] :is(.hs-lane-crumb, .hs-lane-tab, .hs-lane-tabs-arrow, .hs-lane-plus, .hs-lane-fan) {
|
|
9483
|
+
-webkit-app-region: no-drag;
|
|
9484
|
+
}
|
|
9485
|
+
.hs-lane[data-caption='true'] {
|
|
9486
|
+
padding-right: max( 0px, calc( 100vw - env(titlebar-area-x, 0px) - env(titlebar-area-width, 100vw) - var(--edge) + var(--gap-tile) ) );
|
|
9487
|
+
}
|
|
9488
|
+
.hs-lane-crumb {
|
|
9489
|
+
position: relative;
|
|
9490
|
+
overflow: hidden;
|
|
9491
|
+
display: flex;
|
|
9492
|
+
align-items: center;
|
|
9493
|
+
gap: var(--gap-inline);
|
|
9494
|
+
flex: 0 1 auto;
|
|
9495
|
+
min-width: 0;
|
|
9496
|
+
height: 100%;
|
|
9497
|
+
padding: 0 var(--gap-inline);
|
|
9498
|
+
user-select: none;
|
|
9499
|
+
}
|
|
9500
|
+
.hs-lane-crumb > .hs-toolbar-mark {
|
|
9501
|
+
flex: none;
|
|
9502
|
+
}
|
|
9503
|
+
.hs-lane-crumb > .hs-breadcrumb-separator {
|
|
9504
|
+
flex: none;
|
|
9505
|
+
padding: 0 var(--gap-label);
|
|
9506
|
+
}
|
|
9507
|
+
.hs-lane-crumb-app {
|
|
9508
|
+
flex: 0 1 auto;
|
|
9509
|
+
min-width: 0;
|
|
9510
|
+
overflow: hidden;
|
|
9511
|
+
}
|
|
9512
|
+
.hs-lane-crumb > .hs-lane-crumb-title {
|
|
9513
|
+
flex: 0 1000 auto;
|
|
9514
|
+
text-overflow: clip;
|
|
9515
|
+
}
|
|
9516
|
+
.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) {
|
|
9517
|
+
position: absolute;
|
|
9518
|
+
visibility: hidden;
|
|
9519
|
+
pointer-events: none;
|
|
9520
|
+
}
|
|
9521
|
+
.hs-lane-crumb > .hs-tab-close {
|
|
9522
|
+
display: none;
|
|
9523
|
+
}
|
|
9524
|
+
.hs-lane-crumb:is(:hover, :focus-visible) > .hs-tab-close {
|
|
9525
|
+
display: grid;
|
|
9526
|
+
}
|
|
9527
|
+
.hs-lane-crumb:focus-visible {
|
|
9528
|
+
outline: none;
|
|
9529
|
+
border-radius: var(--r-ctl);
|
|
9530
|
+
box-shadow: var(--focus);
|
|
9531
|
+
}
|
|
9532
|
+
.hs-lane-title-field {
|
|
9533
|
+
flex: 1 1 auto;
|
|
9534
|
+
min-width: 0;
|
|
9535
|
+
height: var(--h-ctl);
|
|
9536
|
+
padding: 0 var(--grab-inset);
|
|
9537
|
+
border: none;
|
|
9538
|
+
outline: none;
|
|
9539
|
+
background: transparent;
|
|
9540
|
+
font: inherit;
|
|
9541
|
+
color: var(--text);
|
|
9542
|
+
}
|
|
9543
|
+
.hs-lane-crumb > .hs-lane-title-field {
|
|
9544
|
+
font-size: var(--fs-lead);
|
|
9545
|
+
font-weight: var(--fw-strong);
|
|
9546
|
+
}
|
|
9547
|
+
.hs-lane-plus {
|
|
9548
|
+
width: var(--h-tab);
|
|
9549
|
+
height: var(--h-tab);
|
|
9550
|
+
opacity: var(--lane-plus-alpha);
|
|
9551
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9552
|
+
}
|
|
9553
|
+
.hs-lane:hover .hs-lane-plus, .hs-lane:has(:focus-visible) .hs-lane-plus {
|
|
9554
|
+
opacity: 1;
|
|
9555
|
+
}
|
|
9556
|
+
.hs-lane-fan {
|
|
9557
|
+
--fan-size: var(--h-tab);
|
|
9558
|
+
--fan-gap: var(--gap-label);
|
|
9559
|
+
--fan-arrow-at: calc(var(--space) * 0.5);
|
|
9560
|
+
}
|
|
9561
|
+
.hs-lane-fan > .hs-lane-button[data-open='true'] {
|
|
9562
|
+
background: var(--hov);
|
|
9563
|
+
box-shadow: var(--gloss-edge);
|
|
9564
|
+
color: var(--text);
|
|
9565
|
+
}
|
|
9566
|
+
.hs-lane :is(.hs-lane-tab, .hs-lane-crumb) img {
|
|
9567
|
+
-webkit-user-drag: none;
|
|
9568
|
+
}
|
|
9569
|
+
.hs-lane .hs-lane-tabs-wrap {
|
|
9570
|
+
position: relative;
|
|
9571
|
+
display: flex;
|
|
9572
|
+
flex: 0 1 var(--strip-w);
|
|
9573
|
+
align-self: stretch;
|
|
9574
|
+
min-width: 0;
|
|
9575
|
+
}
|
|
9576
|
+
.hs-lane .hs-lane-tabs {
|
|
9577
|
+
flex: 1 1 0;
|
|
9578
|
+
align-items: center;
|
|
9579
|
+
padding-top: 0;
|
|
9580
|
+
scroll-snap-type: x mandatory;
|
|
9581
|
+
scroll-padding-inline: var(--lane-arrow-w);
|
|
9582
|
+
}
|
|
9583
|
+
.hs-shell .hs-lane .hs-lane-tabs::-webkit-scrollbar {
|
|
9584
|
+
display: none;
|
|
9585
|
+
}
|
|
9586
|
+
.hs-lane .hs-lane-tabs[data-fade='l'] {
|
|
9587
|
+
-webkit-mask-image: linear-gradient( 90deg, transparent var(--lane-arrow-w), #000 calc(var(--lane-arrow-w) + var(--space) * 2) );
|
|
9588
|
+
mask-image: linear-gradient( 90deg, transparent var(--lane-arrow-w), #000 calc(var(--lane-arrow-w) + var(--space) * 2) );
|
|
9589
|
+
}
|
|
9590
|
+
.hs-lane .hs-lane-tabs[data-fade='r'] {
|
|
9591
|
+
-webkit-mask-image: linear-gradient( 90deg, #000 calc(100% - var(--lane-arrow-w) - var(--space) * 2), transparent calc(100% - var(--lane-arrow-w)) );
|
|
9592
|
+
mask-image: linear-gradient( 90deg, #000 calc(100% - var(--lane-arrow-w) - var(--space) * 2), transparent calc(100% - var(--lane-arrow-w)) );
|
|
9593
|
+
}
|
|
9594
|
+
.hs-lane .hs-lane-tabs[data-fade='lr'] {
|
|
9595
|
+
-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)) );
|
|
9596
|
+
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)) );
|
|
9597
|
+
}
|
|
9598
|
+
.hs-lane-tabs-arrow {
|
|
9599
|
+
position: absolute;
|
|
9600
|
+
top: 0;
|
|
9601
|
+
bottom: 0;
|
|
9602
|
+
display: grid;
|
|
9603
|
+
place-items: center;
|
|
9604
|
+
width: var(--lane-arrow-w);
|
|
9605
|
+
height: var(--lane-arrow-w);
|
|
9606
|
+
margin: auto 0;
|
|
9607
|
+
border-radius: var(--r-ctl);
|
|
9608
|
+
cursor: pointer;
|
|
9609
|
+
}
|
|
9610
|
+
.hs-lane-tabs-arrow[data-side='start'] {
|
|
9611
|
+
left: 0;
|
|
9612
|
+
}
|
|
9613
|
+
.hs-lane-tabs-arrow[data-side='end'] {
|
|
9614
|
+
right: 0;
|
|
9615
|
+
}
|
|
9616
|
+
.hs-lane .hs-lane-tab {
|
|
9617
|
+
flex: 0 1 var(--tab-w);
|
|
9618
|
+
min-width: min-content;
|
|
9619
|
+
scroll-snap-align: start;
|
|
9620
|
+
transition: background var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
9621
|
+
}
|
|
9622
|
+
.hs-lane .hs-lane-tab[data-sel='false']:not(:hover) {
|
|
9623
|
+
color: var(--tab-rest-ink);
|
|
9624
|
+
}
|
|
9625
|
+
.hs-lane .hs-lane-tab-mark img {
|
|
9626
|
+
transition: filter var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
9627
|
+
}
|
|
9628
|
+
.hs-lane .hs-lane-tab[data-sel='false']:not(:hover) .hs-lane-tab-mark img {
|
|
9629
|
+
filter: grayscale(1);
|
|
9630
|
+
opacity: var(--tab-rest-alpha);
|
|
9631
|
+
}
|
|
9632
|
+
.hs-lane .hs-lane-tab[data-fit='full'] {
|
|
9633
|
+
min-width: var(--tab-whole);
|
|
9634
|
+
}
|
|
9635
|
+
.hs-lane .hs-lane-tab[data-fit='full'][data-sel='true'] {
|
|
9636
|
+
min-width: var(--tab-open);
|
|
9637
|
+
}
|
|
9638
|
+
.hs-lane .hs-lane-tab[data-fit='cut'] {
|
|
9639
|
+
min-width: min(var(--tab-w), calc(var(--tab-bare) + var(--tab-text-min)));
|
|
9640
|
+
}
|
|
9641
|
+
.hs-lane .hs-lane-tab[data-fit='mark'] {
|
|
9642
|
+
position: relative;
|
|
9643
|
+
flex: none;
|
|
9644
|
+
overflow: hidden;
|
|
9645
|
+
}
|
|
9646
|
+
.hs-lane:has(> .hs-lane-fan[data-open='true']) .hs-lane-tab:not([data-fit='mark']) {
|
|
9647
|
+
min-width: var(--tab-bare);
|
|
9648
|
+
}
|
|
9649
|
+
.hs-lane-tab[data-fit='mark'] > .hs-tab-label {
|
|
9650
|
+
position: absolute;
|
|
9651
|
+
visibility: hidden;
|
|
9652
|
+
pointer-events: none;
|
|
9653
|
+
}
|
|
9654
|
+
.hs-lane-probe {
|
|
9655
|
+
position: absolute;
|
|
9656
|
+
width: var(--tab-text-min);
|
|
9657
|
+
height: 0;
|
|
9658
|
+
visibility: hidden;
|
|
9659
|
+
pointer-events: none;
|
|
9660
|
+
}
|
|
9661
|
+
.hs-lane-tab-mark {
|
|
9662
|
+
display: grid;
|
|
9663
|
+
place-items: center;
|
|
9664
|
+
flex: none;
|
|
9665
|
+
}
|
|
9666
|
+
.hs-lane-tab > .hs-tab-label {
|
|
9667
|
+
flex: 1 1 0;
|
|
9668
|
+
min-width: 0;
|
|
9669
|
+
contain: inline-size;
|
|
9670
|
+
}
|
|
9671
|
+
.hs-lane-tab > .hs-tab-close {
|
|
9672
|
+
display: none;
|
|
9673
|
+
}
|
|
9674
|
+
.hs-lane-tab[data-hover='true'] > .hs-tab-close {
|
|
9675
|
+
display: grid;
|
|
9676
|
+
}
|
|
9677
|
+
.hs-lane-tab[data-fit='mark'] > .hs-tab-close {
|
|
9678
|
+
position: absolute;
|
|
9679
|
+
top: calc(var(--space) * 0.5);
|
|
9680
|
+
right: calc(var(--space) * 0.5);
|
|
9681
|
+
width: calc(var(--space) * 3.5);
|
|
9682
|
+
height: calc(var(--space) * 3.5);
|
|
9683
|
+
border-radius: var(--r-round);
|
|
9684
|
+
background: var(--card);
|
|
9685
|
+
box-shadow: var(--gloss-edge);
|
|
9686
|
+
}
|
|
9687
|
+
.hs-lane :is(.hs-tab-label, .hs-lane-crumb-app, .hs-lane-crumb-title)[data-cut] {
|
|
9688
|
+
-webkit-mask-image: linear-gradient(90deg, #000 calc(100% - var(--tab-fade)), transparent);
|
|
9689
|
+
mask-image: linear-gradient(90deg, #000 calc(100% - var(--tab-fade)), transparent);
|
|
9690
|
+
}
|
|
9691
|
+
.hs-tab-card {
|
|
9692
|
+
position: absolute;
|
|
9693
|
+
left: 0;
|
|
9694
|
+
top: 0;
|
|
9695
|
+
z-index: 4;
|
|
9696
|
+
display: flex;
|
|
9697
|
+
flex-direction: column;
|
|
9698
|
+
gap: var(--gap-stack);
|
|
9699
|
+
width: var(--tabcard-w);
|
|
9700
|
+
box-sizing: border-box;
|
|
9701
|
+
margin-top: var(--gap-tile);
|
|
9702
|
+
padding: var(--gap-stack);
|
|
9703
|
+
border-radius: var(--r-card);
|
|
9704
|
+
background: var(--tipbg);
|
|
9705
|
+
border: var(--bw) solid var(--tipline);
|
|
9706
|
+
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
9707
|
+
backdrop-filter: var(--blur-overlay);
|
|
9708
|
+
-webkit-backdrop-filter: var(--blur-overlay);
|
|
9709
|
+
opacity: 0;
|
|
9710
|
+
pointer-events: none;
|
|
9711
|
+
transition: transform var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
9712
|
+
}
|
|
9713
|
+
.hs-tab-card[data-glide='off'] {
|
|
9714
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9715
|
+
}
|
|
9716
|
+
.hs-tab-card[data-open='true'] {
|
|
9717
|
+
opacity: 1;
|
|
9718
|
+
}
|
|
9719
|
+
.hs-tab-card-title {
|
|
9720
|
+
padding: 0 var(--grab-inset);
|
|
9721
|
+
font-size: var(--fs-sm);
|
|
9722
|
+
font-weight: var(--fw-semi);
|
|
9723
|
+
color: var(--text);
|
|
9724
|
+
white-space: nowrap;
|
|
9725
|
+
overflow: hidden;
|
|
9726
|
+
text-overflow: ellipsis;
|
|
9727
|
+
}
|
|
9728
|
+
.hs-tab-card-preview {
|
|
9729
|
+
position: relative;
|
|
9730
|
+
aspect-ratio: 16 / 9;
|
|
9731
|
+
border-radius: var(--r-sm);
|
|
9732
|
+
background: var(--card);
|
|
9733
|
+
overflow: hidden;
|
|
9734
|
+
}
|
|
9735
|
+
.hs-tab-card-preview > img {
|
|
9736
|
+
position: absolute;
|
|
9737
|
+
inset: 0;
|
|
9738
|
+
width: 100%;
|
|
9739
|
+
height: 100%;
|
|
9740
|
+
object-fit: cover;
|
|
9741
|
+
object-position: top left;
|
|
9742
|
+
}
|
|
9743
|
+
.hs-lane-tab[data-leaving] {
|
|
9744
|
+
pointer-events: none;
|
|
9745
|
+
}
|
|
9746
|
+
.hs-workspace {
|
|
9747
|
+
position: relative;
|
|
9748
|
+
flex: 1;
|
|
9749
|
+
min-width: 0;
|
|
9750
|
+
min-height: 0;
|
|
9751
|
+
margin: 0 var(--edge) var(--edge) 0;
|
|
9752
|
+
isolation: isolate;
|
|
9753
|
+
}
|
|
9754
|
+
.hs-workspace[data-drag='row'], .hs-workspace[data-drag='row'] * {
|
|
9755
|
+
cursor: ew-resize;
|
|
9756
|
+
user-select: none;
|
|
9757
|
+
}
|
|
9758
|
+
.hs-workspace[data-drag='column'], .hs-workspace[data-drag='column'] * {
|
|
9759
|
+
cursor: ns-resize;
|
|
9760
|
+
user-select: none;
|
|
9761
|
+
}
|
|
9762
|
+
.hs-workspace[data-drag='tab'], .hs-workspace[data-drag='tab'] * {
|
|
9763
|
+
cursor: grabbing;
|
|
9764
|
+
user-select: none;
|
|
9765
|
+
}
|
|
9766
|
+
.hs-workspace-measure {
|
|
9767
|
+
position: absolute;
|
|
9768
|
+
left: 0;
|
|
9769
|
+
top: 0;
|
|
9770
|
+
visibility: hidden;
|
|
9771
|
+
pointer-events: none;
|
|
9772
|
+
}
|
|
9773
|
+
.hs-workspace-measure > span {
|
|
9774
|
+
position: absolute;
|
|
9775
|
+
display: block;
|
|
9776
|
+
width: 0;
|
|
9777
|
+
height: 0;
|
|
9778
|
+
}
|
|
9779
|
+
.hs-workspace-measure > [data-m='gap'] {
|
|
9780
|
+
width: var(--gap-tile);
|
|
9781
|
+
}
|
|
9782
|
+
.hs-workspace-measure > [data-m='grab'] {
|
|
9783
|
+
width: var(--grab-inset);
|
|
9784
|
+
}
|
|
9785
|
+
.hs-workspace-measure > [data-m='min-width'] {
|
|
9786
|
+
width: var(--w-tile-min);
|
|
9787
|
+
}
|
|
9788
|
+
.hs-workspace-measure > [data-m='min-height'] {
|
|
9789
|
+
height: var(--h-tile-min);
|
|
9790
|
+
}
|
|
9791
|
+
.hs-workspace-measure > [data-m='lane'] {
|
|
9792
|
+
height: var(--h-lane);
|
|
9793
|
+
}
|
|
9794
|
+
.hs-workspace-measure > [data-m='lane-low'] {
|
|
9795
|
+
height: var(--h-lane-low);
|
|
9796
|
+
}
|
|
9797
|
+
.hs-workspace-measure > [data-m='rule'] {
|
|
9798
|
+
height: var(--h-lane-rule);
|
|
9799
|
+
}
|
|
9800
|
+
.hs-workspace-measure > [data-m='border'] {
|
|
9801
|
+
width: var(--bw);
|
|
9802
|
+
}
|
|
9803
|
+
.hs-workspace-measure > [data-m='card'] {
|
|
9804
|
+
width: var(--tabcard-w);
|
|
9805
|
+
}
|
|
9806
|
+
.hs-lane-rule {
|
|
9807
|
+
position: absolute;
|
|
9808
|
+
width: var(--bw);
|
|
9809
|
+
height: var(--h-lane-rule);
|
|
9810
|
+
background: var(--tipline);
|
|
9811
|
+
opacity: var(--lane-rule-alpha);
|
|
9812
|
+
transform: translateX(-50%);
|
|
9813
|
+
pointer-events: none;
|
|
9814
|
+
}
|
|
9815
|
+
.hs-divider {
|
|
9816
|
+
position: absolute;
|
|
9817
|
+
z-index: 2;
|
|
9818
|
+
outline: none;
|
|
9819
|
+
touch-action: none;
|
|
9820
|
+
}
|
|
9821
|
+
.hs-divider[data-axis='row'] {
|
|
9822
|
+
cursor: ew-resize;
|
|
9823
|
+
}
|
|
9824
|
+
.hs-divider[data-axis='column'] {
|
|
9825
|
+
cursor: ns-resize;
|
|
9826
|
+
}
|
|
9827
|
+
.hs-divider:focus-visible {
|
|
9828
|
+
border-radius: var(--r-sm);
|
|
9829
|
+
box-shadow: var(--focus);
|
|
9830
|
+
}
|
|
9831
|
+
.hs-tile-drop {
|
|
9832
|
+
position: absolute;
|
|
9833
|
+
z-index: 3;
|
|
9834
|
+
box-sizing: border-box;
|
|
9835
|
+
border: var(--drop-border);
|
|
9836
|
+
border-radius: var(--r-tile);
|
|
9837
|
+
background: var(--scrim-soft);
|
|
9838
|
+
pointer-events: none;
|
|
9839
|
+
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);
|
|
9840
|
+
}
|
|
9841
|
+
.hs-surfaces {
|
|
9842
|
+
position: absolute;
|
|
9843
|
+
inset: 0;
|
|
9844
|
+
z-index: 1;
|
|
9845
|
+
overflow: hidden;
|
|
9846
|
+
pointer-events: none;
|
|
9847
|
+
}
|
|
9848
|
+
.hs-surface {
|
|
9849
|
+
position: absolute;
|
|
9850
|
+
left: 0;
|
|
9851
|
+
top: 0;
|
|
9852
|
+
width: 1280px;
|
|
9853
|
+
height: 800px;
|
|
9854
|
+
display: flex;
|
|
9855
|
+
border-radius: calc(var(--r-tile) - var(--bw));
|
|
9856
|
+
overflow: hidden;
|
|
9857
|
+
visibility: hidden;
|
|
9858
|
+
content-visibility: hidden;
|
|
9859
|
+
}
|
|
9860
|
+
.hs-surface > * {
|
|
9861
|
+
flex: 1;
|
|
9862
|
+
min-width: 0;
|
|
9863
|
+
min-height: 0;
|
|
9864
|
+
}
|
|
9865
|
+
.hs-surface[data-state='live'] {
|
|
9866
|
+
visibility: visible;
|
|
9867
|
+
content-visibility: visible;
|
|
9868
|
+
pointer-events: auto;
|
|
9869
|
+
}
|
|
9870
|
+
.hs-surface:has(webview[data-awake='true']) {
|
|
9871
|
+
content-visibility: visible;
|
|
9872
|
+
}
|
|
9873
|
+
.hs-surface:not([data-state='live']):has(webview[data-awake='true']) {
|
|
9874
|
+
opacity: 0;
|
|
9875
|
+
}
|
|
9876
|
+
.hs-surfaces[data-drag='true'] .hs-surface, .hs-surfaces[data-drag='true'] .hs-surface :is(webview, iframe) {
|
|
9877
|
+
pointer-events: none;
|
|
9878
|
+
}
|
|
9879
|
+
.hs-surface[data-clip='run'] {
|
|
9880
|
+
transition: clip-path var(--dur-slow) var(--ease-out);
|
|
9881
|
+
}
|
|
9882
|
+
.hs-fan {
|
|
9883
|
+
--fan-step: calc(var(--fan-size) + var(--fan-gap));
|
|
9884
|
+
position: relative;
|
|
9885
|
+
flex: none;
|
|
9886
|
+
width: var(--fan-size);
|
|
9887
|
+
height: var(--fan-size);
|
|
9888
|
+
transition: width var(--dur-slow) var(--ease-out), height var(--dur-slow) var(--ease-out);
|
|
9889
|
+
}
|
|
9890
|
+
.hs-fan[data-axis='row'][data-open='true'] {
|
|
9891
|
+
width: calc(var(--fan-n) * var(--fan-step) - var(--fan-gap));
|
|
9892
|
+
}
|
|
9893
|
+
.hs-fan[data-axis='column'][data-open='true'] {
|
|
9894
|
+
height: calc(var(--fan-n) * var(--fan-step) - var(--fan-gap));
|
|
9895
|
+
}
|
|
9896
|
+
.hs-fan-arrow {
|
|
9897
|
+
position: absolute;
|
|
9898
|
+
display: grid;
|
|
9899
|
+
place-items: center;
|
|
9900
|
+
color: var(--dim);
|
|
9901
|
+
pointer-events: none;
|
|
9902
|
+
transition: opacity var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
9903
|
+
}
|
|
9904
|
+
.hs-fan[data-axis='row'] > .hs-fan-arrow {
|
|
9905
|
+
right: calc(var(--fan-size) - var(--fan-arrow-at));
|
|
9906
|
+
top: 50%;
|
|
9907
|
+
translate: 50% -50%;
|
|
9908
|
+
}
|
|
9909
|
+
.hs-fan[data-axis='column'] > .hs-fan-arrow {
|
|
9910
|
+
bottom: calc(var(--fan-size) - var(--fan-arrow-at));
|
|
9911
|
+
left: 50%;
|
|
9912
|
+
translate: -50% 50%;
|
|
9913
|
+
}
|
|
9914
|
+
.hs-fan[data-open='true'] > :is(.hs-fan-arrow, .hs-fan-dot) {
|
|
9915
|
+
opacity: 0;
|
|
9916
|
+
}
|
|
9917
|
+
.hs-fan-dot, .hs-fan-item-dot {
|
|
9918
|
+
position: absolute;
|
|
9919
|
+
z-index: 1;
|
|
9920
|
+
width: calc(var(--space) * 1.25);
|
|
9921
|
+
height: calc(var(--space) * 1.25);
|
|
9922
|
+
border-radius: var(--r-round);
|
|
9923
|
+
background: var(--accent-grad);
|
|
9924
|
+
right: calc(var(--fan-size) / 2 - var(--fan-dot-x));
|
|
9925
|
+
bottom: calc(var(--fan-size) / 2 + var(--fan-dot-y));
|
|
9926
|
+
translate: 50% 50%;
|
|
9927
|
+
pointer-events: none;
|
|
9928
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9929
|
+
}
|
|
9930
|
+
.hs-fan > .hs-fan-item {
|
|
9931
|
+
position: absolute;
|
|
9932
|
+
right: 0;
|
|
9933
|
+
bottom: 0;
|
|
9934
|
+
width: var(--fan-size);
|
|
9935
|
+
height: var(--fan-size);
|
|
9936
|
+
scale: var(--fan-tuck);
|
|
9937
|
+
opacity: 0;
|
|
9938
|
+
filter: var(--blur-fan);
|
|
9939
|
+
pointer-events: none;
|
|
9940
|
+
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);
|
|
9941
|
+
}
|
|
9942
|
+
.hs-fan > .hs-fan-item:last-child {
|
|
9943
|
+
scale: 1;
|
|
9944
|
+
opacity: 1;
|
|
9945
|
+
filter: none;
|
|
9946
|
+
}
|
|
9947
|
+
.hs-fan[data-open='false'] > .hs-fan-item {
|
|
9948
|
+
background: none;
|
|
9949
|
+
box-shadow: none;
|
|
9950
|
+
}
|
|
9951
|
+
.hs-fan[data-open='true'] > .hs-fan-item {
|
|
9952
|
+
scale: 1;
|
|
9953
|
+
opacity: 1;
|
|
9954
|
+
filter: none;
|
|
9955
|
+
pointer-events: auto;
|
|
9956
|
+
transition-delay: calc(var(--fan-k) * var(--dur-stagger));
|
|
9957
|
+
}
|
|
9958
|
+
.hs-fan[data-open='true'] > .hs-fan-item:hover {
|
|
9959
|
+
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);
|
|
9960
|
+
transition-delay: 0s;
|
|
9961
|
+
}
|
|
9962
|
+
.hs-fan[data-axis='row'][data-open='true'] > .hs-fan-item {
|
|
9963
|
+
translate: calc(-1 * var(--fan-k) * var(--fan-step)) 0;
|
|
9964
|
+
}
|
|
9965
|
+
.hs-fan[data-axis='column'][data-open='true'] > .hs-fan-item {
|
|
9966
|
+
translate: 0 calc(-1 * var(--fan-k) * var(--fan-step));
|
|
9967
|
+
}
|
|
9968
|
+
[data-swatch='rose'] {
|
|
9969
|
+
--swatch: var(--swatch-rose);
|
|
9970
|
+
--swatch-tint: var(--swatch-rose-tint);
|
|
9971
|
+
--swatch-ink: var(--swatch-rose-ink);
|
|
9972
|
+
}
|
|
9973
|
+
[data-swatch='ember'] {
|
|
9974
|
+
--swatch: var(--swatch-ember);
|
|
9975
|
+
--swatch-tint: var(--swatch-ember-tint);
|
|
9976
|
+
--swatch-ink: var(--swatch-ember-ink);
|
|
9977
|
+
}
|
|
9978
|
+
[data-swatch='amber'] {
|
|
9979
|
+
--swatch: var(--swatch-amber);
|
|
9980
|
+
--swatch-tint: var(--swatch-amber-tint);
|
|
9981
|
+
--swatch-ink: var(--swatch-amber-ink);
|
|
9982
|
+
}
|
|
9983
|
+
[data-swatch='sun'] {
|
|
9984
|
+
--swatch: var(--swatch-sun);
|
|
9985
|
+
--swatch-tint: var(--swatch-sun-tint);
|
|
9986
|
+
--swatch-ink: var(--swatch-sun-ink);
|
|
9987
|
+
}
|
|
9988
|
+
[data-swatch='lime'] {
|
|
9989
|
+
--swatch: var(--swatch-lime);
|
|
9990
|
+
--swatch-tint: var(--swatch-lime-tint);
|
|
9991
|
+
--swatch-ink: var(--swatch-lime-ink);
|
|
9992
|
+
}
|
|
9993
|
+
[data-swatch='moss'] {
|
|
9994
|
+
--swatch: var(--swatch-moss);
|
|
9995
|
+
--swatch-tint: var(--swatch-moss-tint);
|
|
9996
|
+
--swatch-ink: var(--swatch-moss-ink);
|
|
9997
|
+
}
|
|
9998
|
+
[data-swatch='jade'] {
|
|
9999
|
+
--swatch: var(--swatch-jade);
|
|
10000
|
+
--swatch-tint: var(--swatch-jade-tint);
|
|
10001
|
+
--swatch-ink: var(--swatch-jade-ink);
|
|
10002
|
+
}
|
|
10003
|
+
[data-swatch='sky'] {
|
|
10004
|
+
--swatch: var(--swatch-sky);
|
|
10005
|
+
--swatch-tint: var(--swatch-sky-tint);
|
|
10006
|
+
--swatch-ink: var(--swatch-sky-ink);
|
|
10007
|
+
}
|
|
10008
|
+
[data-swatch='ocean'] {
|
|
10009
|
+
--swatch: var(--swatch-ocean);
|
|
10010
|
+
--swatch-tint: var(--swatch-ocean-tint);
|
|
10011
|
+
--swatch-ink: var(--swatch-ocean-ink);
|
|
10012
|
+
}
|
|
10013
|
+
[data-swatch='indigo'] {
|
|
10014
|
+
--swatch: var(--swatch-indigo);
|
|
10015
|
+
--swatch-tint: var(--swatch-indigo-tint);
|
|
10016
|
+
--swatch-ink: var(--swatch-indigo-ink);
|
|
10017
|
+
}
|
|
10018
|
+
[data-swatch='violet'] {
|
|
10019
|
+
--swatch: var(--swatch-violet);
|
|
10020
|
+
--swatch-tint: var(--swatch-violet-tint);
|
|
10021
|
+
--swatch-ink: var(--swatch-violet-ink);
|
|
10022
|
+
}
|
|
10023
|
+
[data-swatch='plum'] {
|
|
10024
|
+
--swatch: var(--swatch-plum);
|
|
10025
|
+
--swatch-tint: var(--swatch-plum-tint);
|
|
10026
|
+
--swatch-ink: var(--swatch-plum-ink);
|
|
10027
|
+
}
|
|
10028
|
+
[data-swatch='slate'] {
|
|
10029
|
+
--swatch: var(--swatch-slate);
|
|
10030
|
+
--swatch-tint: var(--swatch-slate-tint);
|
|
10031
|
+
--swatch-ink: var(--swatch-slate-ink);
|
|
10032
|
+
}
|
|
10033
|
+
.hs-tinted {
|
|
10034
|
+
border-radius: var(--r-sm);
|
|
10035
|
+
background: var(--swatch-tint);
|
|
10036
|
+
color: var(--swatch-ink);
|
|
10037
|
+
}
|
|
10038
|
+
.hs-tinted[data-selected='true'] {
|
|
10039
|
+
background: var(--swatch);
|
|
10040
|
+
color: var(--swatch-fill-ink);
|
|
10041
|
+
}
|
|
10042
|
+
.hs-swatch-dot {
|
|
10043
|
+
flex: none;
|
|
10044
|
+
width: calc(var(--space) * 2);
|
|
10045
|
+
height: calc(var(--space) * 2);
|
|
10046
|
+
border-radius: var(--r-round);
|
|
10047
|
+
background: var(--swatch);
|
|
10048
|
+
}
|
|
10049
|
+
.hs-swatch-picker {
|
|
10050
|
+
display: flex;
|
|
10051
|
+
flex-wrap: wrap;
|
|
10052
|
+
gap: calc(var(--space) * 1.5);
|
|
10053
|
+
}
|
|
10054
|
+
.hs-swatch-choice {
|
|
10055
|
+
width: calc(var(--space) * 5.5);
|
|
10056
|
+
height: calc(var(--space) * 5.5);
|
|
10057
|
+
padding: 0;
|
|
10058
|
+
border: none;
|
|
10059
|
+
border-radius: var(--r-round);
|
|
10060
|
+
background: var(--swatch);
|
|
10061
|
+
box-shadow: var(--shadow-swatch);
|
|
10062
|
+
cursor: pointer;
|
|
10063
|
+
}
|
|
10064
|
+
.hs-swatch-choice[aria-checked='true'] {
|
|
10065
|
+
box-shadow: 0 0 0 calc(var(--bw) * 2) var(--win), 0 0 0 calc(var(--bw) * 4) var(--swatch);
|
|
10066
|
+
}
|
|
10067
|
+
.hs-swatch-choice:focus-visible {
|
|
10068
|
+
outline: none;
|
|
10069
|
+
box-shadow: 0 0 0 calc(var(--bw) * 2) var(--win), var(--focus);
|
|
10070
|
+
}
|
|
10071
|
+
.hs-slider {
|
|
10072
|
+
display: flex;
|
|
10073
|
+
align-items: center;
|
|
10074
|
+
gap: var(--gap-row);
|
|
10075
|
+
min-width: 0;
|
|
10076
|
+
font-size: var(--fs-sm);
|
|
10077
|
+
color: var(--text);
|
|
10078
|
+
}
|
|
10079
|
+
.hs-slider > .hs-range {
|
|
10080
|
+
flex: 1;
|
|
10081
|
+
min-width: calc(var(--space) * 20);
|
|
10082
|
+
width: auto;
|
|
10083
|
+
}
|
|
10084
|
+
.hs-slider > .hs-range:disabled {
|
|
10085
|
+
opacity: var(--press-fade);
|
|
10086
|
+
}
|
|
10087
|
+
.hs-slider > .hs-range:disabled::-webkit-slider-thumb {
|
|
10088
|
+
cursor: default;
|
|
10089
|
+
}
|
|
10090
|
+
.hs-slider-value {
|
|
10091
|
+
flex: none;
|
|
10092
|
+
min-width: calc(var(--space) * 9);
|
|
10093
|
+
text-align: right;
|
|
10094
|
+
font-variant-numeric: tabular-nums;
|
|
10095
|
+
color: var(--mut);
|
|
10096
|
+
}
|
|
10097
|
+
.hs-popover {
|
|
10098
|
+
position: absolute;
|
|
10099
|
+
z-index: 40;
|
|
10100
|
+
box-sizing: border-box;
|
|
10101
|
+
padding: calc(var(--space) * 3);
|
|
10102
|
+
border: var(--bw) solid var(--tipline);
|
|
10103
|
+
border-radius: var(--r-card);
|
|
10104
|
+
background: var(--plate-menu);
|
|
10105
|
+
backdrop-filter: var(--blur-surface);
|
|
10106
|
+
-webkit-backdrop-filter: var(--blur-surface);
|
|
10107
|
+
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
10108
|
+
color: var(--text);
|
|
10109
|
+
overflow: auto;
|
|
10110
|
+
overscroll-behavior: contain;
|
|
10111
|
+
outline: none;
|
|
10112
|
+
animation: hsPop var(--dur) var(--ease-out);
|
|
10113
|
+
}
|
|
10114
|
+
.hs-toast-place {
|
|
10115
|
+
position: fixed;
|
|
10116
|
+
z-index: 50;
|
|
10117
|
+
left: 50%;
|
|
10118
|
+
bottom: calc(var(--space) * 4);
|
|
10119
|
+
transform: translateX(-50%);
|
|
10120
|
+
max-width: calc(100vw - var(--space) * 8);
|
|
10121
|
+
}
|
|
10122
|
+
.hs-toast-place[data-above='true'] {
|
|
10123
|
+
display: flex;
|
|
10124
|
+
justify-content: center;
|
|
10125
|
+
transform: none;
|
|
10126
|
+
max-width: none;
|
|
10127
|
+
}
|
|
10128
|
+
.hs-toast-place[data-above='true'] > .hs-toast {
|
|
10129
|
+
min-width: 0;
|
|
10130
|
+
max-width: 100%;
|
|
10131
|
+
}
|
|
10132
|
+
.hs-toast {
|
|
10133
|
+
display: flex;
|
|
10134
|
+
align-items: center;
|
|
10135
|
+
gap: calc(var(--space) * 2);
|
|
10136
|
+
padding: calc(var(--space) * 1.5) calc(var(--space) * 1.5) calc(var(--space) * 1.5) calc(var(--space) * 3.5);
|
|
10137
|
+
border: var(--bw) solid var(--tipline);
|
|
10138
|
+
border-radius: var(--r-card);
|
|
10139
|
+
background: var(--plate-menu);
|
|
10140
|
+
backdrop-filter: var(--blur-surface);
|
|
10141
|
+
-webkit-backdrop-filter: var(--blur-surface);
|
|
10142
|
+
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
10143
|
+
font-size: var(--fs-sm);
|
|
10144
|
+
color: var(--text);
|
|
10145
|
+
animation: hsToast var(--dur) var(--ease-out);
|
|
10146
|
+
}
|
|
10147
|
+
.hs-toast-text {
|
|
10148
|
+
flex: 1;
|
|
10149
|
+
min-width: 0;
|
|
10150
|
+
}
|
|
10151
|
+
@keyframes hsToast {
|
|
10152
|
+
from {
|
|
10153
|
+
opacity: 0;
|
|
10154
|
+
transform: translateY(calc(var(--space) * 2));
|
|
10155
|
+
}
|
|
10156
|
+
}
|
|
10157
|
+
.hs-picker-field {
|
|
10158
|
+
display: inline-flex;
|
|
10159
|
+
align-items: center;
|
|
10160
|
+
width: auto;
|
|
10161
|
+
min-width: calc(var(--space) * 30);
|
|
10162
|
+
text-align: left;
|
|
10163
|
+
font-variant-numeric: tabular-nums;
|
|
10164
|
+
cursor: pointer;
|
|
10165
|
+
}
|
|
10166
|
+
.hs-picker-field[data-empty='true'] {
|
|
10167
|
+
color: var(--dim);
|
|
10168
|
+
}
|
|
10169
|
+
.hs-picker-field:disabled {
|
|
10170
|
+
opacity: var(--press-fade);
|
|
10171
|
+
cursor: default;
|
|
10172
|
+
}
|
|
10173
|
+
.hs-date-grid {
|
|
10174
|
+
display: flex;
|
|
10175
|
+
flex-direction: column;
|
|
10176
|
+
gap: var(--space);
|
|
10177
|
+
width: max-content;
|
|
10178
|
+
font-size: var(--fs-sm);
|
|
10179
|
+
}
|
|
10180
|
+
.hs-date-grid-head {
|
|
10181
|
+
display: flex;
|
|
10182
|
+
align-items: center;
|
|
10183
|
+
gap: var(--space);
|
|
10184
|
+
}
|
|
10185
|
+
.hs-date-grid-month {
|
|
10186
|
+
flex: 1;
|
|
10187
|
+
padding-left: var(--space);
|
|
10188
|
+
font-weight: var(--fw-semi);
|
|
10189
|
+
}
|
|
10190
|
+
.hs-date-grid-days {
|
|
10191
|
+
display: grid;
|
|
10192
|
+
grid-template-columns: repeat(7, calc(var(--space) * 8));
|
|
10193
|
+
grid-auto-rows: calc(var(--space) * 8);
|
|
10194
|
+
}
|
|
10195
|
+
.hs-date-grid-row {
|
|
10196
|
+
display: contents;
|
|
10197
|
+
}
|
|
10198
|
+
.hs-date-grid-weekday {
|
|
10199
|
+
display: grid;
|
|
10200
|
+
place-items: center;
|
|
10201
|
+
font-size: var(--fs-cap);
|
|
10202
|
+
color: var(--dim);
|
|
10203
|
+
}
|
|
10204
|
+
.hs-date-grid-day {
|
|
10205
|
+
display: grid;
|
|
10206
|
+
place-items: center;
|
|
10207
|
+
padding: 0;
|
|
10208
|
+
border: none;
|
|
10209
|
+
border-radius: var(--r-round);
|
|
10210
|
+
background: none;
|
|
10211
|
+
font: inherit;
|
|
10212
|
+
font-variant-numeric: tabular-nums;
|
|
10213
|
+
color: var(--text);
|
|
10214
|
+
cursor: pointer;
|
|
10215
|
+
}
|
|
10216
|
+
.hs-date-grid-day:hover {
|
|
10217
|
+
background: var(--hov);
|
|
10218
|
+
}
|
|
10219
|
+
.hs-date-grid-day[data-outside='true'] {
|
|
10220
|
+
color: var(--dim);
|
|
10221
|
+
}
|
|
10222
|
+
.hs-date-grid-day[data-today='true'] {
|
|
10223
|
+
color: var(--accent);
|
|
10224
|
+
font-weight: var(--fw-semi);
|
|
10225
|
+
}
|
|
10226
|
+
.hs-date-grid-day[aria-selected='true'] {
|
|
10227
|
+
background: var(--selection);
|
|
10228
|
+
color: var(--selection-ink);
|
|
10229
|
+
font-weight: var(--fw-semi);
|
|
10230
|
+
}
|
|
10231
|
+
.hs-date-grid-day:disabled {
|
|
10232
|
+
color: var(--dim);
|
|
10233
|
+
opacity: var(--press-fade);
|
|
10234
|
+
cursor: default;
|
|
10235
|
+
}
|
|
10236
|
+
.hs-date-grid-day:disabled:hover {
|
|
10237
|
+
background: none;
|
|
10238
|
+
}
|
|
10239
|
+
.hs-date-grid-day:focus-visible {
|
|
10240
|
+
outline: none;
|
|
10241
|
+
box-shadow: var(--focus);
|
|
10242
|
+
}
|
|
10243
|
+
.hs-person-mark {
|
|
10244
|
+
flex: none;
|
|
10245
|
+
display: inline-grid;
|
|
10246
|
+
place-items: center;
|
|
10247
|
+
overflow: hidden;
|
|
10248
|
+
width: calc(var(--space) * 6);
|
|
10249
|
+
height: calc(var(--space) * 6);
|
|
10250
|
+
border-radius: var(--r-round);
|
|
10251
|
+
background: var(--swatch-tint);
|
|
10252
|
+
color: var(--swatch-ink);
|
|
10253
|
+
font-size: var(--fs-cap);
|
|
10254
|
+
font-weight: var(--fw-semi);
|
|
10255
|
+
line-height: 1;
|
|
10256
|
+
user-select: none;
|
|
10257
|
+
}
|
|
10258
|
+
.hs-person-mark[data-size='sm'] {
|
|
10259
|
+
width: calc(var(--space) * 5);
|
|
10260
|
+
height: calc(var(--space) * 5);
|
|
10261
|
+
font-size: var(--fs-mono-xs);
|
|
10262
|
+
}
|
|
10263
|
+
.hs-person-mark[data-size='lg'] {
|
|
10264
|
+
width: calc(var(--space) * 10);
|
|
10265
|
+
height: calc(var(--space) * 10);
|
|
10266
|
+
font-size: var(--fs-body);
|
|
10267
|
+
}
|
|
10268
|
+
.hs-person-mark img {
|
|
10269
|
+
width: 100%;
|
|
10270
|
+
height: 100%;
|
|
10271
|
+
object-fit: cover;
|
|
10272
|
+
}
|
|
10273
|
+
.hs-virtual-list {
|
|
10274
|
+
overflow-y: auto;
|
|
10275
|
+
overscroll-behavior: contain;
|
|
8790
10276
|
}
|
|
8791
|
-
.hs-
|
|
8792
|
-
|
|
10277
|
+
.hs-virtual-list-rows {
|
|
10278
|
+
position: relative;
|
|
10279
|
+
width: 100%;
|
|
8793
10280
|
}
|
|
8794
|
-
.hs-
|
|
8795
|
-
|
|
10281
|
+
.hs-virtual-list-row {
|
|
10282
|
+
position: absolute;
|
|
10283
|
+
top: 0;
|
|
10284
|
+
left: 0;
|
|
10285
|
+
width: 100%;
|
|
8796
10286
|
}
|
|
8797
|
-
.hs-
|
|
8798
|
-
|
|
10287
|
+
.hs-picture-compare {
|
|
10288
|
+
position: relative;
|
|
10289
|
+
overflow: hidden;
|
|
10290
|
+
border-radius: var(--r-card);
|
|
10291
|
+
user-select: none;
|
|
10292
|
+
touch-action: none;
|
|
8799
10293
|
}
|
|
8800
|
-
.hs-
|
|
8801
|
-
|
|
10294
|
+
.hs-picture-compare img {
|
|
10295
|
+
display: block;
|
|
10296
|
+
width: 100%;
|
|
10297
|
+
height: auto;
|
|
10298
|
+
pointer-events: none;
|
|
8802
10299
|
}
|
|
8803
|
-
.hs-
|
|
10300
|
+
.hs-picture-compare-after {
|
|
8804
10301
|
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;
|
|
10302
|
+
inset: 0;
|
|
8811
10303
|
}
|
|
8812
|
-
.hs-
|
|
10304
|
+
.hs-picture-compare-after img {
|
|
10305
|
+
height: 100%;
|
|
10306
|
+
object-fit: cover;
|
|
10307
|
+
}
|
|
10308
|
+
.hs-picture-compare-handle {
|
|
8813
10309
|
position: absolute;
|
|
8814
|
-
|
|
10310
|
+
top: 0;
|
|
10311
|
+
bottom: 0;
|
|
10312
|
+
width: calc(var(--space) * 6);
|
|
10313
|
+
margin-left: calc(var(--space) * -3);
|
|
10314
|
+
display: grid;
|
|
10315
|
+
place-items: center;
|
|
10316
|
+
cursor: ew-resize;
|
|
8815
10317
|
outline: none;
|
|
8816
|
-
touch-action: none;
|
|
8817
10318
|
}
|
|
8818
|
-
.hs-
|
|
8819
|
-
|
|
10319
|
+
.hs-picture-compare-handle::before {
|
|
10320
|
+
content: '';
|
|
10321
|
+
position: absolute;
|
|
10322
|
+
top: 0;
|
|
10323
|
+
bottom: 0;
|
|
10324
|
+
left: 50%;
|
|
10325
|
+
width: calc(var(--bw) * 2);
|
|
10326
|
+
margin-left: calc(var(--bw) * -1);
|
|
10327
|
+
background: var(--picture-ink);
|
|
10328
|
+
box-shadow: var(--shadow-thumb);
|
|
8820
10329
|
}
|
|
8821
|
-
.hs-
|
|
8822
|
-
|
|
10330
|
+
.hs-picture-compare-knob {
|
|
10331
|
+
position: relative;
|
|
10332
|
+
width: calc(var(--space) * 5);
|
|
10333
|
+
height: calc(var(--space) * 5);
|
|
10334
|
+
border-radius: var(--r-round);
|
|
10335
|
+
background: var(--picture-ink);
|
|
10336
|
+
box-shadow: var(--shadow-thumb);
|
|
8823
10337
|
}
|
|
8824
|
-
.hs-
|
|
8825
|
-
border-radius: var(--r-sm);
|
|
10338
|
+
.hs-picture-compare-handle:focus-visible .hs-picture-compare-knob {
|
|
8826
10339
|
box-shadow: var(--focus);
|
|
8827
10340
|
}
|
|
8828
|
-
.hs-
|
|
10341
|
+
.hs-picture-compare-name {
|
|
8829
10342
|
position: absolute;
|
|
8830
|
-
|
|
8831
|
-
|
|
8832
|
-
border: var(--
|
|
8833
|
-
|
|
8834
|
-
|
|
10343
|
+
top: calc(var(--space) * 2);
|
|
10344
|
+
padding: calc(var(--space) * 0.5) calc(var(--space) * 1.5);
|
|
10345
|
+
border-radius: var(--r-pill);
|
|
10346
|
+
background: var(--scrim);
|
|
10347
|
+
color: var(--scrim-ink);
|
|
10348
|
+
font-size: var(--fs-cap);
|
|
8835
10349
|
pointer-events: none;
|
|
8836
10350
|
}
|
|
8837
|
-
.hs-
|
|
8838
|
-
|
|
8839
|
-
inset: 0;
|
|
8840
|
-
z-index: 1;
|
|
8841
|
-
overflow: hidden;
|
|
8842
|
-
pointer-events: none;
|
|
10351
|
+
.hs-picture-compare-name[data-side='before'] {
|
|
10352
|
+
left: calc(var(--space) * 2);
|
|
8843
10353
|
}
|
|
8844
|
-
.hs-
|
|
8845
|
-
|
|
8846
|
-
|
|
8847
|
-
|
|
8848
|
-
|
|
8849
|
-
|
|
10354
|
+
.hs-picture-compare-name[data-side='after'] {
|
|
10355
|
+
right: calc(var(--space) * 2);
|
|
10356
|
+
}
|
|
10357
|
+
.hs-rich-text {
|
|
10358
|
+
outline: none;
|
|
10359
|
+
font-size: var(--fs-body);
|
|
10360
|
+
line-height: var(--lh-body);
|
|
10361
|
+
color: var(--text);
|
|
10362
|
+
overflow-wrap: anywhere;
|
|
10363
|
+
}
|
|
10364
|
+
.hs-rich-text [data-model] {
|
|
10365
|
+
color: var(--mut);
|
|
10366
|
+
}
|
|
10367
|
+
.hs-rich-text pre {
|
|
10368
|
+
margin: calc(var(--space) * 2.5) 0;
|
|
10369
|
+
padding: calc(var(--space) * 3);
|
|
10370
|
+
border-radius: var(--r-card);
|
|
10371
|
+
background: var(--card);
|
|
10372
|
+
overflow-x: auto;
|
|
10373
|
+
}
|
|
10374
|
+
.hs-rich-text pre code {
|
|
10375
|
+
padding: 0;
|
|
10376
|
+
background: none;
|
|
10377
|
+
}
|
|
10378
|
+
.hs-rich-text ul[data-type='taskList'] {
|
|
10379
|
+
padding-left: 0;
|
|
10380
|
+
list-style: none;
|
|
10381
|
+
}
|
|
10382
|
+
.hs-rich-text ul[data-type='taskList'] > li {
|
|
8850
10383
|
display: flex;
|
|
8851
|
-
|
|
8852
|
-
|
|
8853
|
-
visibility: hidden;
|
|
8854
|
-
content-visibility: hidden;
|
|
10384
|
+
align-items: flex-start;
|
|
10385
|
+
gap: calc(var(--space) * 2);
|
|
8855
10386
|
}
|
|
8856
|
-
.hs-
|
|
8857
|
-
flex:
|
|
8858
|
-
|
|
8859
|
-
|
|
10387
|
+
.hs-rich-text ul[data-type='taskList'] > li > label {
|
|
10388
|
+
flex: none;
|
|
10389
|
+
display: flex;
|
|
10390
|
+
align-items: center;
|
|
10391
|
+
height: calc(1em * var(--lh-body));
|
|
8860
10392
|
}
|
|
8861
|
-
.hs-
|
|
8862
|
-
|
|
8863
|
-
|
|
8864
|
-
pointer-events: auto;
|
|
10393
|
+
.hs-rich-text ul[data-type='taskList'] > li > label input {
|
|
10394
|
+
margin: 0;
|
|
10395
|
+
accent-color: var(--accent);
|
|
8865
10396
|
}
|
|
8866
|
-
.hs-
|
|
8867
|
-
|
|
10397
|
+
.hs-rich-text ul[data-type='taskList'] > li > div {
|
|
10398
|
+
flex: 1;
|
|
10399
|
+
min-width: 0;
|
|
8868
10400
|
}
|
|
8869
|
-
.hs-
|
|
8870
|
-
|
|
10401
|
+
.hs-rich-text li[data-checked='true'] > div {
|
|
10402
|
+
color: var(--dim);
|
|
10403
|
+
text-decoration: line-through;
|
|
8871
10404
|
}
|
|
8872
|
-
.hs-
|
|
10405
|
+
.hs-rich-text .is-editor-empty:first-child::before {
|
|
10406
|
+
content: attr(data-placeholder);
|
|
10407
|
+
float: left;
|
|
10408
|
+
height: 0;
|
|
10409
|
+
color: var(--dim);
|
|
8873
10410
|
pointer-events: none;
|
|
8874
10411
|
}
|
|
8875
|
-
.hs-surface[data-clip='run'] {
|
|
8876
|
-
transition: clip-path var(--dur-slow) var(--ease-out);
|
|
8877
|
-
}
|
|
8878
10412
|
}
|
|
8879
10413
|
@layer hs.base, hs.theme, hs.colourway, hs.guard;
|
|
8880
10414
|
@font-face {
|
|
@@ -8971,6 +10505,14 @@
|
|
|
8971
10505
|
@supports (color: color-mix(in lab, red, red)) {
|
|
8972
10506
|
--plate: color-mix(in srgb, var(--card) 60%, var(--win));
|
|
8973
10507
|
}
|
|
10508
|
+
--hov-plate: var(--text);
|
|
10509
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10510
|
+
--hov-plate: color-mix(in srgb, var(--text) 7%, var(--plate));
|
|
10511
|
+
}
|
|
10512
|
+
--pressed: var(--text);
|
|
10513
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10514
|
+
--pressed: color-mix(in srgb, var(--text) 14%, transparent);
|
|
10515
|
+
}
|
|
8974
10516
|
--act: rgba(158, 166, 182, 0.19);
|
|
8975
10517
|
--accent: #ff9d2e;
|
|
8976
10518
|
--link: var(--accent);
|
|
@@ -8978,6 +10520,7 @@
|
|
|
8978
10520
|
--selection-ink: var(--text);
|
|
8979
10521
|
--switch-radius: 6px;
|
|
8980
10522
|
--switch-gloss: var(--glimmer);
|
|
10523
|
+
--switch-gloss-on: rgba(255, 255, 255, 0.25);
|
|
8981
10524
|
--switch-thumb-radius: 4px;
|
|
8982
10525
|
--switch-thumb: var(--mut);
|
|
8983
10526
|
--switch-thumb-on: var(--accent-ink);
|
|
@@ -8993,6 +10536,130 @@
|
|
|
8993
10536
|
--ok: #3fb950;
|
|
8994
10537
|
--warn: #d29922;
|
|
8995
10538
|
--bad-ink: #fff;
|
|
10539
|
+
--swatch-tint-share: 22%;
|
|
10540
|
+
--swatch-fill-ink: #fff;
|
|
10541
|
+
--swatch-rose: #eb617e;
|
|
10542
|
+
--swatch-rose-ink: #fe9aaa;
|
|
10543
|
+
--swatch-rose-tint: var(--swatch-rose);
|
|
10544
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10545
|
+
--swatch-rose-tint: color-mix(
|
|
10546
|
+
in srgb,
|
|
10547
|
+
var(--swatch-rose) var(--swatch-tint-share),
|
|
10548
|
+
transparent
|
|
10549
|
+
);
|
|
10550
|
+
}
|
|
10551
|
+
--swatch-ember: #eb693f;
|
|
10552
|
+
--swatch-ember-ink: #fea082;
|
|
10553
|
+
--swatch-ember-tint: var(--swatch-ember);
|
|
10554
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10555
|
+
--swatch-ember-tint: color-mix(
|
|
10556
|
+
in srgb,
|
|
10557
|
+
var(--swatch-ember) var(--swatch-tint-share),
|
|
10558
|
+
transparent
|
|
10559
|
+
);
|
|
10560
|
+
}
|
|
10561
|
+
--swatch-amber: #ce8402;
|
|
10562
|
+
--swatch-amber-ink: #faa836;
|
|
10563
|
+
--swatch-amber-tint: var(--swatch-amber);
|
|
10564
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10565
|
+
--swatch-amber-tint: color-mix(
|
|
10566
|
+
in srgb,
|
|
10567
|
+
var(--swatch-amber) var(--swatch-tint-share),
|
|
10568
|
+
transparent
|
|
10569
|
+
);
|
|
10570
|
+
}
|
|
10571
|
+
--swatch-sun: #b09505;
|
|
10572
|
+
--swatch-sun-ink: #d9ba26;
|
|
10573
|
+
--swatch-sun-tint: var(--swatch-sun);
|
|
10574
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10575
|
+
--swatch-sun-tint: color-mix(in srgb, var(--swatch-sun) var(--swatch-tint-share), transparent);
|
|
10576
|
+
}
|
|
10577
|
+
--swatch-lime: #7fa707;
|
|
10578
|
+
--swatch-lime-ink: #a5cc54;
|
|
10579
|
+
--swatch-lime-tint: var(--swatch-lime);
|
|
10580
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10581
|
+
--swatch-lime-tint: color-mix(
|
|
10582
|
+
in srgb,
|
|
10583
|
+
var(--swatch-lime) var(--swatch-tint-share),
|
|
10584
|
+
transparent
|
|
10585
|
+
);
|
|
10586
|
+
}
|
|
10587
|
+
--swatch-moss: #42b14d;
|
|
10588
|
+
--swatch-moss-ink: #76d57b;
|
|
10589
|
+
--swatch-moss-tint: var(--swatch-moss);
|
|
10590
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10591
|
+
--swatch-moss-tint: color-mix(
|
|
10592
|
+
in srgb,
|
|
10593
|
+
var(--swatch-moss) var(--swatch-tint-share),
|
|
10594
|
+
transparent
|
|
10595
|
+
);
|
|
10596
|
+
}
|
|
10597
|
+
--swatch-jade: #08b08d;
|
|
10598
|
+
--swatch-jade-ink: #0edbb0;
|
|
10599
|
+
--swatch-jade-tint: var(--swatch-jade);
|
|
10600
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10601
|
+
--swatch-jade-tint: color-mix(
|
|
10602
|
+
in srgb,
|
|
10603
|
+
var(--swatch-jade) var(--swatch-tint-share),
|
|
10604
|
+
transparent
|
|
10605
|
+
);
|
|
10606
|
+
}
|
|
10607
|
+
--swatch-sky: #06a6cd;
|
|
10608
|
+
--swatch-sky-ink: #02d0ff;
|
|
10609
|
+
--swatch-sky-tint: var(--swatch-sky);
|
|
10610
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10611
|
+
--swatch-sky-tint: color-mix(in srgb, var(--swatch-sky) var(--swatch-tint-share), transparent);
|
|
10612
|
+
}
|
|
10613
|
+
--swatch-ocean: #4297fd;
|
|
10614
|
+
--swatch-ocean-ink: #8ebffe;
|
|
10615
|
+
--swatch-ocean-tint: var(--swatch-ocean);
|
|
10616
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10617
|
+
--swatch-ocean-tint: color-mix(
|
|
10618
|
+
in srgb,
|
|
10619
|
+
var(--swatch-ocean) var(--swatch-tint-share),
|
|
10620
|
+
transparent
|
|
10621
|
+
);
|
|
10622
|
+
}
|
|
10623
|
+
--swatch-indigo: #8087fd;
|
|
10624
|
+
--swatch-indigo-ink: #acb5ff;
|
|
10625
|
+
--swatch-indigo-tint: var(--swatch-indigo);
|
|
10626
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10627
|
+
--swatch-indigo-tint: color-mix(
|
|
10628
|
+
in srgb,
|
|
10629
|
+
var(--swatch-indigo) var(--swatch-tint-share),
|
|
10630
|
+
transparent
|
|
10631
|
+
);
|
|
10632
|
+
}
|
|
10633
|
+
--swatch-violet: #ab78ed;
|
|
10634
|
+
--swatch-violet-ink: #cba8fe;
|
|
10635
|
+
--swatch-violet-tint: var(--swatch-violet);
|
|
10636
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10637
|
+
--swatch-violet-tint: color-mix(
|
|
10638
|
+
in srgb,
|
|
10639
|
+
var(--swatch-violet) var(--swatch-tint-share),
|
|
10640
|
+
transparent
|
|
10641
|
+
);
|
|
10642
|
+
}
|
|
10643
|
+
--swatch-plum: #d368c1;
|
|
10644
|
+
--swatch-plum-ink: #f794e4;
|
|
10645
|
+
--swatch-plum-tint: var(--swatch-plum);
|
|
10646
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10647
|
+
--swatch-plum-tint: color-mix(
|
|
10648
|
+
in srgb,
|
|
10649
|
+
var(--swatch-plum) var(--swatch-tint-share),
|
|
10650
|
+
transparent
|
|
10651
|
+
);
|
|
10652
|
+
}
|
|
10653
|
+
--swatch-slate: #8c97a6;
|
|
10654
|
+
--swatch-slate-ink: #b1bdcc;
|
|
10655
|
+
--swatch-slate-tint: var(--swatch-slate);
|
|
10656
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10657
|
+
--swatch-slate-tint: color-mix(
|
|
10658
|
+
in srgb,
|
|
10659
|
+
var(--swatch-slate) var(--swatch-tint-share),
|
|
10660
|
+
transparent
|
|
10661
|
+
);
|
|
10662
|
+
}
|
|
8996
10663
|
--diff-add: var(--ok);
|
|
8997
10664
|
@supports (color: color-mix(in lab, red, red)) {
|
|
8998
10665
|
--diff-add: color-mix(in srgb, var(--ok) 16%, transparent);
|
|
@@ -9102,27 +10769,39 @@
|
|
|
9102
10769
|
--scroll-size: calc(var(--space) * 2.75);
|
|
9103
10770
|
--w-rail: calc(var(--space) * 14);
|
|
9104
10771
|
--icon-ctl-rail: calc(var(--space) * 10);
|
|
9105
|
-
--gap-rail:
|
|
10772
|
+
--gap-rail: var(--space);
|
|
9106
10773
|
--edge: calc(var(--space) * 2);
|
|
9107
10774
|
--h-lane: 42px;
|
|
9108
10775
|
--h-lane-low: calc(var(--space) * 9);
|
|
9109
10776
|
--h-tab: calc(var(--space) * 7.5);
|
|
9110
10777
|
--tabcard-w: calc(var(--space) * 80);
|
|
9111
10778
|
--tabcard-dip: 0.82;
|
|
9112
|
-
--tab-
|
|
10779
|
+
--tab-text-min: calc(var(--space) * 12);
|
|
10780
|
+
--tab-fade: calc(var(--space) * 4);
|
|
10781
|
+
--lane-arrow-w: calc(var(--space) * 5);
|
|
9113
10782
|
--h-lane-rule: calc(var(--space) * 6);
|
|
9114
10783
|
--lane-rule-alpha: 0.22;
|
|
10784
|
+
--lane-plus-alpha: 0;
|
|
9115
10785
|
--gap-tile: calc(var(--space) * 1.5);
|
|
9116
10786
|
--grab-inset: var(--space);
|
|
9117
10787
|
--w-tile-min: calc(var(--space) * 80);
|
|
9118
10788
|
--h-tile-min: calc(var(--space) * 50);
|
|
9119
10789
|
--w-sidebar: calc(var(--space) * 59);
|
|
9120
|
-
--pad-
|
|
9121
|
-
--
|
|
10790
|
+
--pad-sidebar: calc(var(--space) * 2.5);
|
|
10791
|
+
--fan-tuck: 0.6;
|
|
9122
10792
|
--rung-pressed-alpha: 0.55;
|
|
10793
|
+
--tab-rest-ink: var(--capt);
|
|
10794
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10795
|
+
--tab-rest-ink: color-mix(in srgb, var(--capt) 85%, var(--text));
|
|
10796
|
+
}
|
|
10797
|
+
--tab-rest-alpha: 0.49;
|
|
9123
10798
|
--mark-hi: #ffd074;
|
|
9124
10799
|
--mark-lo: #ff9d2e;
|
|
10800
|
+
--mark-grad: linear-gradient(180deg, var(--mark-hi), var(--mark-lo));
|
|
10801
|
+
--mark-glow: #ff9d2e;
|
|
10802
|
+
--map-floor: 0.3;
|
|
9125
10803
|
--capt-close: #c42b1c;
|
|
10804
|
+
--capt-close-ink: #fff;
|
|
9126
10805
|
--shadow-pop: 0 5px 16px rgba(0, 0, 0, 0.07);
|
|
9127
10806
|
--shadow-float: 0 8px 28px rgba(0, 0, 0, 0.1);
|
|
9128
10807
|
--shadow-modal: 0 18px 48px rgba(0, 0, 0, 0.25);
|
|
@@ -9134,7 +10813,7 @@
|
|
|
9134
10813
|
--scrim: rgba(0, 0, 0, 0.78);
|
|
9135
10814
|
--scrim-ink: #fff;
|
|
9136
10815
|
--scrim-walk: rgba(4, 9, 18, 0.45);
|
|
9137
|
-
--
|
|
10816
|
+
--scrim-tour: 0 0 0 100vmax var(--scrim-walk);
|
|
9138
10817
|
--scrim-soft: var(--win);
|
|
9139
10818
|
@supports (color: color-mix(in lab, red, red)) {
|
|
9140
10819
|
--scrim-soft: color-mix(in srgb, var(--win) 55%, transparent);
|
|
@@ -9148,6 +10827,72 @@
|
|
|
9148
10827
|
@supports (color: color-mix(in lab, red, red)) {
|
|
9149
10828
|
--plate-menu: color-mix(in srgb, var(--win) 75%, var(--tipbg));
|
|
9150
10829
|
}
|
|
10830
|
+
--glass-on-light-rim: rgba(0, 0, 0, 0.14);
|
|
10831
|
+
--glass-on-light: rgba(255, 255, 255, 0.62);
|
|
10832
|
+
--glass-on-light-hover: rgba(255, 255, 255, 0.8);
|
|
10833
|
+
--glass-on-light-ink: rgba(0, 0, 0, 0.88);
|
|
10834
|
+
--glass-on-light-lift: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.18);
|
|
10835
|
+
--glass-on-dark-rim: rgba(255, 255, 255, 0.2);
|
|
10836
|
+
--glass-on-dark: rgba(0, 0, 0, 0.58);
|
|
10837
|
+
--glass-on-dark-hover: rgba(0, 0, 0, 0.74);
|
|
10838
|
+
--glass-on-dark-ink: #fff;
|
|
10839
|
+
--glass-on-dark-lift: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 2px 8px rgba(0, 0, 0, 0.35);
|
|
10840
|
+
--film-press: linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.03) 60%);
|
|
10841
|
+
--film-press-hover: linear-gradient(
|
|
10842
|
+
180deg,
|
|
10843
|
+
rgba(255, 255, 255, 0.16),
|
|
10844
|
+
rgba(255, 255, 255, 0.06) 60%
|
|
10845
|
+
);
|
|
10846
|
+
--film-ticked: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0) 60%);
|
|
10847
|
+
--film-ticked-hover: linear-gradient(
|
|
10848
|
+
180deg,
|
|
10849
|
+
rgba(255, 255, 255, 0.08),
|
|
10850
|
+
rgba(255, 255, 255, 0.02) 60%
|
|
10851
|
+
);
|
|
10852
|
+
--shadow-press: 0 1px 2px rgba(0, 0, 0, 0.25), 0 8px 22px rgba(0, 0, 0, 0.22);
|
|
10853
|
+
--shadow-ticked: 0 1px 2px rgba(0, 0, 0, 0.18);
|
|
10854
|
+
--waytile-hover: var(--card);
|
|
10855
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
10856
|
+
--waytile-hover: color-mix(in srgb, var(--card) 90%, #000);
|
|
10857
|
+
}
|
|
10858
|
+
--shadow-orb: inset 0 1.5px 0 rgba(255, 255, 255, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.16);
|
|
10859
|
+
--shadow-orb-lift: 0 2px 8px rgba(0, 0, 0, 0.18);
|
|
10860
|
+
--shadow-swatch: inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.16);
|
|
10861
|
+
--gloss-orb: radial-gradient(
|
|
10862
|
+
120% 90% at 30% 0%,
|
|
10863
|
+
rgba(255, 255, 255, 0.4) 0%,
|
|
10864
|
+
rgba(255, 255, 255, 0) 55%
|
|
10865
|
+
);
|
|
10866
|
+
--shadow-thumb: 0 1px 3px rgba(0, 0, 0, 0.3);
|
|
10867
|
+
--ring-marker: 0 0 0 1px rgba(0, 0, 0, 0.35);
|
|
10868
|
+
--shadow-logo: inset 0 1px 0 rgba(255, 255, 255, 0.28), inset 0 0 0 1px rgba(255, 255, 255, 0.12),
|
|
10869
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3),
|
|
10870
|
+
0 0.3em 0.9em rgba(0, 0, 0, 0.32);
|
|
10871
|
+
--gloss-logo: linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0) 62%);
|
|
10872
|
+
--shadow-feature-logo: 0 16px 28px -14px rgb(0 0 0 / 0.5);
|
|
10873
|
+
--scrim-feature: linear-gradient(to bottom, rgb(0 0 0 / 0), rgb(0 0 0 / 0.5) 70%);
|
|
10874
|
+
--gloss-fill: linear-gradient(180deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0) 55%);
|
|
10875
|
+
--gloss-fill-edge: inset 0 1px 0 rgba(255, 255, 255, 0.55);
|
|
10876
|
+
--page-ground: #fff;
|
|
10877
|
+
--picture-ink: #fff;
|
|
10878
|
+
--picture-line: rgba(255, 255, 255, 0.45);
|
|
10879
|
+
--picture-film: rgba(255, 255, 255, 0.07);
|
|
10880
|
+
--picture-rim: rgba(255, 255, 255, 0.22);
|
|
10881
|
+
--picture-gloss: inset 0 1px 0 rgba(255, 255, 255, 0.35);
|
|
10882
|
+
--picture-mesh-1: #22323f;
|
|
10883
|
+
--picture-mesh-2: #0b0b0c;
|
|
10884
|
+
--picture-mesh-3: #152725;
|
|
10885
|
+
--picture-mesh-4: #1c1d20;
|
|
10886
|
+
--picture-mesh-5: #0b0b0c;
|
|
10887
|
+
--picture-mesh-6: #1a2229;
|
|
10888
|
+
--heat-1: #693611;
|
|
10889
|
+
--heat-2: #a36a1f;
|
|
10890
|
+
--heat-3: #e8a530;
|
|
10891
|
+
--heat-4: #ffda6b;
|
|
10892
|
+
--heat-5: #ffe77a;
|
|
10893
|
+
--heat-6: #ff9a1f;
|
|
10894
|
+
--heat-7: #ff4d0087;
|
|
10895
|
+
--heat-ground: #000;
|
|
9151
10896
|
--chip-file: var(--info);
|
|
9152
10897
|
@supports (color: color-mix(in lab, red, red)) {
|
|
9153
10898
|
--chip-file: color-mix(in srgb, var(--info) 16%, transparent);
|
|
@@ -9168,6 +10913,10 @@
|
|
|
9168
10913
|
--blur-overlay: blur(24px) saturate(1.4);
|
|
9169
10914
|
--blur-sheet: blur(36px) saturate(1.45);
|
|
9170
10915
|
--blur-tip: blur(1px);
|
|
10916
|
+
--blur-fan: blur(2px);
|
|
10917
|
+
--blur-glass: blur(10px);
|
|
10918
|
+
--blur-film: blur(14px);
|
|
10919
|
+
--blur-copy: blur(8px);
|
|
9171
10920
|
--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
10921
|
--ease-out: cubic-bezier(0, 0, 0.2, 1);
|
|
9173
10922
|
--dur: 0.15s;
|
|
@@ -9176,6 +10925,9 @@
|
|
|
9176
10925
|
--dur-spin: 0.9s;
|
|
9177
10926
|
--dur-shine: 2.2s;
|
|
9178
10927
|
--dur-flash: 1.2s;
|
|
10928
|
+
--dur-copied: 1.5s;
|
|
10929
|
+
--dur-arrive: 0.6s;
|
|
10930
|
+
--dur-glow: 0.35s;
|
|
9179
10931
|
--dur-scroll: 25ms;
|
|
9180
10932
|
--press: none;
|
|
9181
10933
|
--press-fade: 1;
|
|
@@ -9194,6 +10946,7 @@
|
|
|
9194
10946
|
--fs-page: 26px;
|
|
9195
10947
|
--fs-code: 22px;
|
|
9196
10948
|
--fs-page-hero: 28px;
|
|
10949
|
+
--fs-figure: 30px;
|
|
9197
10950
|
--fs-wordmark: 16.5px;
|
|
9198
10951
|
--fs-walk-title: 40px;
|
|
9199
10952
|
--fw-med: 500;
|
|
@@ -9208,8 +10961,7 @@
|
|
|
9208
10961
|
--docs-callout-info: #3b82f6;
|
|
9209
10962
|
--fs-market-title: clamp(32px, 4.2cqi, 64px);
|
|
9210
10963
|
--fs-market-lead: 20px;
|
|
9211
|
-
--fs-market-
|
|
9212
|
-
--fs-market-tile-first: clamp(28px, 3vw, 40px);
|
|
10964
|
+
--fs-market-feature: clamp(26px, 3cqi, 40px);
|
|
9213
10965
|
--fs-market-name: 40px;
|
|
9214
10966
|
--fs-market-name-narrow: 32px;
|
|
9215
10967
|
--fs-market-line: 18px;
|
|
@@ -9223,7 +10975,16 @@
|
|
|
9223
10975
|
--market-wash-foot: oklch(0.15 0.015 220);
|
|
9224
10976
|
--market-hero-ink: #fff;
|
|
9225
10977
|
--market-hero-brightness: 0.82;
|
|
10978
|
+
--market-cover-ratio: 12 / 5;
|
|
9226
10979
|
--hue: 0;
|
|
10980
|
+
--share: 1;
|
|
10981
|
+
--fan-n: 1;
|
|
10982
|
+
--fan-k: 0;
|
|
10983
|
+
--tab-whole: 0px;
|
|
10984
|
+
--tab-open: 0px;
|
|
10985
|
+
--tab-bare: 0px;
|
|
10986
|
+
--tab-w: 0px;
|
|
10987
|
+
--strip-w: 0px;
|
|
9227
10988
|
--b1-h: 0;
|
|
9228
10989
|
--b1-l: 0;
|
|
9229
10990
|
--b1-c: 0;
|
|
@@ -9287,6 +11048,9 @@
|
|
|
9287
11048
|
--gloss-hi: rgba(255, 255, 255, 0.55);
|
|
9288
11049
|
--gloss-lo: rgba(255, 255, 255, 0.18);
|
|
9289
11050
|
--glossline: rgba(255, 255, 255, 0.75);
|
|
11051
|
+
--shadow-logo: inset 0 1px 0 rgba(255, 255, 255, 0.55), inset 0 0 0 1px rgba(0, 0, 0, 0.1),
|
|
11052
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.22),
|
|
11053
|
+
0 0.3em 0.9em rgba(0, 0, 0, 0.2);
|
|
9290
11054
|
--text: #15181f;
|
|
9291
11055
|
--mut: #4c5260;
|
|
9292
11056
|
--dim: #7b8290;
|
|
@@ -9297,12 +11061,37 @@
|
|
|
9297
11061
|
--cardb: #dcdfe5;
|
|
9298
11062
|
--hov: rgba(120, 127, 145, 0.12);
|
|
9299
11063
|
--act: rgba(255, 255, 255, 0.55);
|
|
9300
|
-
--accent: #ff9d2e;
|
|
9301
|
-
--link: #b66000;
|
|
9302
11064
|
--info: #1867c0;
|
|
9303
11065
|
--bad: #c2452e;
|
|
9304
11066
|
--ok: #2f9e44;
|
|
9305
11067
|
--warn: #b7791f;
|
|
11068
|
+
--swatch-tint-share: 14%;
|
|
11069
|
+
--swatch-rose: #c64563;
|
|
11070
|
+
--swatch-rose-ink: #891739;
|
|
11071
|
+
--swatch-ember: #c74d23;
|
|
11072
|
+
--swatch-ember-ink: #852802;
|
|
11073
|
+
--swatch-amber: #a76a07;
|
|
11074
|
+
--swatch-amber-ink: #6a4203;
|
|
11075
|
+
--swatch-sun: #8e7806;
|
|
11076
|
+
--swatch-sun-ink: #5a4b03;
|
|
11077
|
+
--swatch-lime: #668700;
|
|
11078
|
+
--swatch-lime-ink: #3f5500;
|
|
11079
|
+
--swatch-moss: #229132;
|
|
11080
|
+
--swatch-moss-ink: #015d15;
|
|
11081
|
+
--swatch-jade: #058e72;
|
|
11082
|
+
--swatch-jade-ink: #015a47;
|
|
11083
|
+
--swatch-sky: #0986a6;
|
|
11084
|
+
--swatch-sky-ink: #02556a;
|
|
11085
|
+
--swatch-ocean: #2679d8;
|
|
11086
|
+
--swatch-ocean-ink: #014a94;
|
|
11087
|
+
--swatch-indigo: #656ad8;
|
|
11088
|
+
--swatch-indigo-ink: #3d3d9a;
|
|
11089
|
+
--swatch-violet: #8c5cc9;
|
|
11090
|
+
--swatch-violet-ink: #5c308e;
|
|
11091
|
+
--swatch-plum: #b14da1;
|
|
11092
|
+
--swatch-plum-ink: #79226d;
|
|
11093
|
+
--swatch-slate: #707a88;
|
|
11094
|
+
--swatch-slate-ink: #434d5a;
|
|
9306
11095
|
--bubu: #23262e;
|
|
9307
11096
|
--bubut: #f6f7f9;
|
|
9308
11097
|
--tiprgb: 252 252 253;
|
|
@@ -9352,6 +11141,9 @@
|
|
|
9352
11141
|
.hs-inkbad {
|
|
9353
11142
|
color: var(--bad);
|
|
9354
11143
|
}
|
|
11144
|
+
:where(.hs-hovbox:hover, .hs-hovbox-ink:hover) {
|
|
11145
|
+
transition: background-color var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
|
|
11146
|
+
}
|
|
9355
11147
|
.hs-hovbox:hover {
|
|
9356
11148
|
background: var(--hov);
|
|
9357
11149
|
box-shadow: var(--gloss-edge);
|
|
@@ -9388,34 +11180,34 @@
|
|
|
9388
11180
|
background: var(--btnhov);
|
|
9389
11181
|
}
|
|
9390
11182
|
.hs-glassbtn[data-on='light'] {
|
|
9391
|
-
border-color:
|
|
9392
|
-
background:
|
|
9393
|
-
box-shadow:
|
|
9394
|
-
color:
|
|
9395
|
-
backdrop-filter: blur
|
|
9396
|
-
-webkit-backdrop-filter: blur
|
|
11183
|
+
border-color: var(--glass-on-light-rim);
|
|
11184
|
+
background: var(--glass-on-light);
|
|
11185
|
+
box-shadow: var(--glass-on-light-lift);
|
|
11186
|
+
color: var(--glass-on-light-ink);
|
|
11187
|
+
backdrop-filter: var(--blur-glass);
|
|
11188
|
+
-webkit-backdrop-filter: var(--blur-glass);
|
|
9397
11189
|
}
|
|
9398
11190
|
.hs-glassbtn[data-on='light']:hover {
|
|
9399
|
-
background:
|
|
11191
|
+
background: var(--glass-on-light-hover);
|
|
9400
11192
|
}
|
|
9401
11193
|
.hs-glassbtn[data-on='dark'] {
|
|
9402
|
-
border-color:
|
|
9403
|
-
background:
|
|
9404
|
-
box-shadow:
|
|
9405
|
-
color:
|
|
9406
|
-
backdrop-filter: blur
|
|
9407
|
-
-webkit-backdrop-filter: blur
|
|
11194
|
+
border-color: var(--glass-on-dark-rim);
|
|
11195
|
+
background: var(--glass-on-dark);
|
|
11196
|
+
box-shadow: var(--glass-on-dark-lift);
|
|
11197
|
+
color: var(--glass-on-dark-ink);
|
|
11198
|
+
backdrop-filter: var(--blur-glass);
|
|
11199
|
+
-webkit-backdrop-filter: var(--blur-glass);
|
|
9408
11200
|
}
|
|
9409
11201
|
.hs-glassbtn[data-on='dark']:hover {
|
|
9410
|
-
background:
|
|
11202
|
+
background: var(--glass-on-dark-hover);
|
|
9411
11203
|
}
|
|
9412
11204
|
.hs-walk-foot .hs-glassbtn, .hs-walk-body .hs-glassbtn, .hs-installer-bar {
|
|
9413
11205
|
position: relative;
|
|
9414
11206
|
overflow: hidden;
|
|
9415
|
-
background:
|
|
9416
|
-
box-shadow: var(--gloss-edge),
|
|
9417
|
-
backdrop-filter: blur
|
|
9418
|
-
-webkit-backdrop-filter: blur
|
|
11207
|
+
background: var(--film-press), var(--pane);
|
|
11208
|
+
box-shadow: var(--gloss-edge), var(--shadow-press);
|
|
11209
|
+
backdrop-filter: var(--blur-film);
|
|
11210
|
+
-webkit-backdrop-filter: var(--blur-film);
|
|
9419
11211
|
}
|
|
9420
11212
|
.hs-walk-foot .hs-glassbtn::before, .hs-walk-body .hs-glassbtn::before, .hs-installer-bar::before {
|
|
9421
11213
|
content: '';
|
|
@@ -9428,20 +11220,20 @@
|
|
|
9428
11220
|
pointer-events: none;
|
|
9429
11221
|
}
|
|
9430
11222
|
.hs-walk-foot .hs-glassbtn:hover, .hs-walk-body .hs-glassbtn:hover {
|
|
9431
|
-
background:
|
|
11223
|
+
background: var(--film-press-hover), var(--pane);
|
|
9432
11224
|
}
|
|
9433
11225
|
.hs-walk-body .hs-glassbtn[data-ticked='true'] {
|
|
9434
|
-
background:
|
|
11226
|
+
background: var(--film-ticked), var(--pane);
|
|
9435
11227
|
@supports (color: color-mix(in lab, red, red)) {
|
|
9436
|
-
background:
|
|
11228
|
+
background: var(--film-ticked), color-mix(in srgb, var(--pane) 55%, transparent);
|
|
9437
11229
|
}
|
|
9438
|
-
box-shadow: var(--gloss-edge),
|
|
11230
|
+
box-shadow: var(--gloss-edge), var(--shadow-ticked);
|
|
9439
11231
|
}
|
|
9440
11232
|
.hs-walk-body .hs-glassbtn[data-ticked='true']::before {
|
|
9441
11233
|
opacity: 0.45;
|
|
9442
11234
|
}
|
|
9443
11235
|
.hs-walk-body .hs-glassbtn[data-ticked='true']:hover {
|
|
9444
|
-
background:
|
|
11236
|
+
background: var(--film-ticked-hover), var(--pane);
|
|
9445
11237
|
}
|
|
9446
11238
|
.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
11239
|
transform: var(--hov-lift);
|
|
@@ -9516,6 +11308,7 @@
|
|
|
9516
11308
|
}
|
|
9517
11309
|
.hs-plugrow .hs-rowact, .hs-sessrow .hs-rowact, .hs-projrow .hs-rowact {
|
|
9518
11310
|
opacity: 0;
|
|
11311
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9519
11312
|
}
|
|
9520
11313
|
.hs-plugrow:hover .hs-rowact, .hs-sessrow:hover .hs-rowact, .hs-projrow:hover .hs-rowact, .hs-rowact[data-open='true'] {
|
|
9521
11314
|
opacity: 1;
|
|
@@ -9534,6 +11327,7 @@
|
|
|
9534
11327
|
.hs-sess {
|
|
9535
11328
|
display: grid;
|
|
9536
11329
|
grid-template-rows: 1fr;
|
|
11330
|
+
transition: grid-template-rows var(--dur) var(--ease-out);
|
|
9537
11331
|
}
|
|
9538
11332
|
.hs-sess[data-open='false'] {
|
|
9539
11333
|
grid-template-rows: 0fr;
|
|
@@ -9542,15 +11336,19 @@
|
|
|
9542
11336
|
min-height: 0;
|
|
9543
11337
|
overflow: hidden;
|
|
9544
11338
|
opacity: 1;
|
|
11339
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9545
11340
|
}
|
|
9546
11341
|
.hs-sess[data-open='false'] > div {
|
|
9547
11342
|
opacity: 0;
|
|
9548
11343
|
}
|
|
11344
|
+
.hs-waytile {
|
|
11345
|
+
transition: background var(--dur) var(--ease-out);
|
|
11346
|
+
}
|
|
9549
11347
|
.hs-waytile:hover {
|
|
9550
|
-
background: var(--
|
|
9551
|
-
|
|
9552
|
-
|
|
9553
|
-
|
|
11348
|
+
background: var(--waytile-hover);
|
|
11349
|
+
}
|
|
11350
|
+
.hs-orb {
|
|
11351
|
+
transition: transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
|
|
9554
11352
|
}
|
|
9555
11353
|
.hs-orb:hover {
|
|
9556
11354
|
transform: scale(1.05);
|
|
@@ -9560,6 +11358,7 @@
|
|
|
9560
11358
|
}
|
|
9561
11359
|
.hs-turn .hs-abar {
|
|
9562
11360
|
opacity: 0;
|
|
11361
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9563
11362
|
}
|
|
9564
11363
|
.hs-turn:hover .hs-abar {
|
|
9565
11364
|
opacity: 1;
|
|
@@ -9586,8 +11385,25 @@
|
|
|
9586
11385
|
background-position: calc(100% + 4.5rem) 0, 0 0;
|
|
9587
11386
|
}
|
|
9588
11387
|
}
|
|
11388
|
+
@keyframes hsPop {
|
|
11389
|
+
from {
|
|
11390
|
+
opacity: 0;
|
|
11391
|
+
transform: translateY(calc(var(--space) * -1.25));
|
|
11392
|
+
}
|
|
11393
|
+
}
|
|
11394
|
+
.hs-rview {
|
|
11395
|
+
animation: hsPop var(--dur) var(--ease-out);
|
|
11396
|
+
}
|
|
11397
|
+
@keyframes hsPopX {
|
|
11398
|
+
from {
|
|
11399
|
+
opacity: 0;
|
|
11400
|
+
transform: translateX(calc(var(--space) * -1.75));
|
|
11401
|
+
}
|
|
11402
|
+
}
|
|
11403
|
+
.hs-ptab {
|
|
11404
|
+
animation: hsPopX var(--dur) var(--ease-out);
|
|
11405
|
+
}
|
|
9589
11406
|
.hs-spin {
|
|
9590
|
-
transform-box: fill-box;
|
|
9591
11407
|
transform-origin: center;
|
|
9592
11408
|
animation: hsSpin var(--dur-spin) linear infinite;
|
|
9593
11409
|
}
|
|
@@ -9602,6 +11418,7 @@
|
|
|
9602
11418
|
--dur-slow: 0s;
|
|
9603
11419
|
--dur-stagger: 0s;
|
|
9604
11420
|
--dur-scroll: 0s;
|
|
11421
|
+
--dur-arrive: 0s;
|
|
9605
11422
|
}
|
|
9606
11423
|
.hs-shell .hs-shine, .hs-shell .hs-spin, .hs-shell .hs-flash {
|
|
9607
11424
|
animation: none;
|
|
@@ -9611,6 +11428,7 @@
|
|
|
9611
11428
|
border-radius: var(--r-card);
|
|
9612
11429
|
border: var(--bw) solid var(--tipline);
|
|
9613
11430
|
box-shadow: var(--gloss-edge), var(--shadow-pop);
|
|
11431
|
+
animation: hsPop var(--dur) var(--ease-out);
|
|
9614
11432
|
}
|
|
9615
11433
|
.hs-mitem {
|
|
9616
11434
|
gap: calc(var(--space) * 2.25);
|
|
@@ -9654,6 +11472,9 @@
|
|
|
9654
11472
|
.hs-shell-frame[data-sdrag='true'] :is(webview, iframe) {
|
|
9655
11473
|
pointer-events: none;
|
|
9656
11474
|
}
|
|
11475
|
+
[data-hover-popup='true'] :is(webview, iframe) {
|
|
11476
|
+
pointer-events: none;
|
|
11477
|
+
}
|
|
9657
11478
|
.hs-sessrow[data-ins]::before {
|
|
9658
11479
|
content: '';
|
|
9659
11480
|
position: absolute;
|
|
@@ -9732,7 +11553,7 @@
|
|
|
9732
11553
|
background: var(--card);
|
|
9733
11554
|
}
|
|
9734
11555
|
.hs-tog[data-on='true'] {
|
|
9735
|
-
background: var(--
|
|
11556
|
+
background: var(--mark-grad);
|
|
9736
11557
|
border-color: transparent;
|
|
9737
11558
|
box-shadow: var(--tog-on);
|
|
9738
11559
|
}
|
|
@@ -9753,7 +11574,7 @@
|
|
|
9753
11574
|
.hs-tog[data-on='true'] .hs-toggle-thumb {
|
|
9754
11575
|
transform: translateX(17px);
|
|
9755
11576
|
background: var(--switch-thumb-on);
|
|
9756
|
-
box-shadow: inset 0 1px 0
|
|
11577
|
+
box-shadow: inset 0 1px 0 var(--switch-gloss-on);
|
|
9757
11578
|
}
|
|
9758
11579
|
.hs-range {
|
|
9759
11580
|
-webkit-appearance: none;
|
|
@@ -9775,12 +11596,13 @@
|
|
|
9775
11596
|
background: var(--text);
|
|
9776
11597
|
border: none;
|
|
9777
11598
|
cursor: pointer;
|
|
9778
|
-
box-shadow:
|
|
11599
|
+
box-shadow: var(--shadow-thumb);
|
|
9779
11600
|
}
|
|
9780
11601
|
.hs-url {
|
|
9781
11602
|
border-radius: var(--r-ctl);
|
|
9782
11603
|
background: var(--hov);
|
|
9783
11604
|
box-shadow: var(--gloss-edge);
|
|
11605
|
+
transition: background var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
|
|
9784
11606
|
}
|
|
9785
11607
|
.hs-url:hover:not(:focus-within) {
|
|
9786
11608
|
background: var(--btnhov);
|
|
@@ -9811,6 +11633,7 @@
|
|
|
9811
11633
|
color: var(--mut);
|
|
9812
11634
|
pointer-events: none;
|
|
9813
11635
|
white-space: nowrap;
|
|
11636
|
+
transition: left var(--dur) var(--ease-out), transform var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
|
|
9814
11637
|
}
|
|
9815
11638
|
.hs-url:focus-within .hs-urlph {
|
|
9816
11639
|
left: calc(var(--space) * 3);
|
|
@@ -9822,6 +11645,7 @@
|
|
|
9822
11645
|
.hs-urlgo {
|
|
9823
11646
|
opacity: 0;
|
|
9824
11647
|
pointer-events: none;
|
|
11648
|
+
transition: opacity var(--dur) var(--ease-out);
|
|
9825
11649
|
}
|
|
9826
11650
|
.hs-url:hover .hs-urlgo, .hs-url:focus-within .hs-urlgo {
|
|
9827
11651
|
opacity: 1;
|
|
@@ -9829,7 +11653,7 @@
|
|
|
9829
11653
|
.hs-url:focus-within .hs-ph-icon {
|
|
9830
11654
|
left: calc(var(--space) * 7.25);
|
|
9831
11655
|
}
|
|
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 {
|
|
11656
|
+
.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
11657
|
outline: none;
|
|
9834
11658
|
box-shadow: var(--focus);
|
|
9835
11659
|
}
|
|
@@ -9852,9 +11676,11 @@
|
|
|
9852
11676
|
.hs-jump {
|
|
9853
11677
|
border-radius: var(--r-pill);
|
|
9854
11678
|
border: var(--bw) solid var(--tipline);
|
|
11679
|
+
transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
|
|
9855
11680
|
}
|
|
9856
11681
|
.hs-jump:disabled {
|
|
9857
11682
|
opacity: 0;
|
|
11683
|
+
transform: translateY(calc(var(--space) * 1.25));
|
|
9858
11684
|
pointer-events: none;
|
|
9859
11685
|
}
|
|
9860
11686
|
.hs-md > :first-child {
|
|
@@ -10051,6 +11877,62 @@
|
|
|
10051
11877
|
flex: none;
|
|
10052
11878
|
padding-right: calc(var(--space) * 3.5);
|
|
10053
11879
|
}
|
|
11880
|
+
.hs-diff-split {
|
|
11881
|
+
display: flex;
|
|
11882
|
+
box-sizing: border-box;
|
|
11883
|
+
height: calc(var(--space) * 5);
|
|
11884
|
+
line-height: calc(var(--space) * 5);
|
|
11885
|
+
white-space: pre;
|
|
11886
|
+
}
|
|
11887
|
+
.hs-diff-side {
|
|
11888
|
+
display: flex;
|
|
11889
|
+
flex: 1 1 0;
|
|
11890
|
+
min-width: 0;
|
|
11891
|
+
overflow: hidden;
|
|
11892
|
+
}
|
|
11893
|
+
.hs-diff-side + .hs-diff-side {
|
|
11894
|
+
border-left: var(--bw) solid var(--line);
|
|
11895
|
+
}
|
|
11896
|
+
.hs-diff-side[data-kind='add'] {
|
|
11897
|
+
background: var(--diff-add);
|
|
11898
|
+
}
|
|
11899
|
+
.hs-diff-side[data-kind='del'] {
|
|
11900
|
+
background: var(--diff-del);
|
|
11901
|
+
}
|
|
11902
|
+
.hs-diff-side[data-kind='none'] {
|
|
11903
|
+
background: var(--hov);
|
|
11904
|
+
}
|
|
11905
|
+
.hs-diff-split[data-sel='1'] .hs-diff-side {
|
|
11906
|
+
background: var(--diff-pick);
|
|
11907
|
+
}
|
|
11908
|
+
.hs-diff-side[data-kind='add'] .hs-diff-no {
|
|
11909
|
+
background: var(--diff-add-gutter);
|
|
11910
|
+
}
|
|
11911
|
+
.hs-diff-side[data-kind='del'] .hs-diff-no {
|
|
11912
|
+
background: var(--diff-del-gutter);
|
|
11913
|
+
}
|
|
11914
|
+
.hs-diff-side[data-kind='add'] .hs-diff-sign {
|
|
11915
|
+
color: var(--ok);
|
|
11916
|
+
}
|
|
11917
|
+
.hs-diff-side[data-kind='del'] .hs-diff-sign {
|
|
11918
|
+
color: var(--bad);
|
|
11919
|
+
}
|
|
11920
|
+
.hs-diff[data-wrap='true'] :is(.hs-diff-row, .hs-diff-split) {
|
|
11921
|
+
height: auto;
|
|
11922
|
+
min-height: calc(var(--space) * 5);
|
|
11923
|
+
white-space: pre-wrap;
|
|
11924
|
+
}
|
|
11925
|
+
.hs-diff[data-wrap='true'] .hs-diff-text {
|
|
11926
|
+
flex: 1 1 0;
|
|
11927
|
+
min-width: 0;
|
|
11928
|
+
overflow-wrap: anywhere;
|
|
11929
|
+
}
|
|
11930
|
+
.hs-diff-tok {
|
|
11931
|
+
color: var(--shiki-light, inherit);
|
|
11932
|
+
}
|
|
11933
|
+
[data-theme='dark'] .hs-diff-tok {
|
|
11934
|
+
color: var(--shiki-dark, inherit);
|
|
11935
|
+
}
|
|
10054
11936
|
.hs-diff-gap {
|
|
10055
11937
|
display: flex;
|
|
10056
11938
|
align-items: center;
|