@ -316,7 +316,7 @@
background : var ( --words-toolbar-bg ) ;
background : var ( --words-toolbar-bg ) ;
color : var ( --words-command-color ) ;
color : var ( --words-command-color ) ;
font : inherit ;
font : inherit ;
font-size : 0. 8rem ;
font-size : var( --words-font-size-sm ) ;
cursor : pointer ;
cursor : pointer ;
text-align : start ;
text-align : start ;
transition :
transition :
@ -343,7 +343,7 @@
font-weight : var ( --words-strong-font-weight ) ;
font-weight : var ( --words-strong-font-weight ) ;
letter-spacing : 0 . 02em ;
letter-spacing : 0 . 02em ;
text-transform : uppercase ;
text-transform : uppercase ;
font-size : 0. 7rem ;
font-size : var( --words-status-font-size ) ;
color : var ( --words-status-color ) ;
color : var ( --words-status-color ) ;
}
}
@ -401,7 +401,7 @@
border : 0 ;
border : 0 ;
background : transparent ;
background : transparent ;
color : var ( --words-status-color ) ;
color : var ( --words-status-color ) ;
font-size : 0. 7rem ;
font-size : var( --words-status-font-size ) ;
font-weight : var ( --words-strong-font-weight ) ;
font-weight : var ( --words-strong-font-weight ) ;
letter-spacing : 0 . 04em ;
letter-spacing : 0 . 04em ;
text-transform : uppercase ;
text-transform : uppercase ;
@ -498,7 +498,7 @@
[ data-words-drawer-section-subtitle ] {
[ data-words-drawer-section-subtitle ] {
color : var ( --words-status-color ) ;
color : var ( --words-status-color ) ;
font-size : 0. 65rem ;
font-size : var( --words-status-font-size ) ;
font-weight : var ( --words-strong-font-weight ) ;
font-weight : var ( --words-strong-font-weight ) ;
letter-spacing : 0 . 04em ;
letter-spacing : 0 . 04em ;
text-transform : uppercase ;
text-transform : uppercase ;
@ -527,7 +527,7 @@
min-block-size : auto ;
min-block-size : auto ;
white-space : normal ;
white-space : normal ;
line-height : 1 . 35 ;
line-height : 1 . 35 ;
color : var ( --words- toolbar -color) ;
color : var ( --words- command -color) ;
}
}
[ data-editable ] [ data-words-drawer-editable ] [ data-editable-preview ] [ data-placeholder-shown ] {
[ data-editable ] [ data-words-drawer-editable ] [ data-editable-preview ] [ data-placeholder-shown ] {
@ -560,8 +560,8 @@
[ data-editable ] [ data-words-drawer-editable ] [ data-editable-edit-trigger ] : hover {
[ data-editable ] [ data-words-drawer-editable ] [ data-editable-edit-trigger ] : hover {
opacity : 1 ;
opacity : 1 ;
background : var ( --words-command- hover-bg ) ;
background : var ( --words-command- bg- hover) ;
color : var ( --words-command- active- color) ;
color : var ( --words-command- color-hove r) ;
}
}
/ * Edit mode : stack vertically . Textarea fills the row , action chips
/ * Edit mode : stack vertically . Textarea fills the row , action chips
@ -583,7 +583,7 @@
border : var ( --words-border-width ) solid var ( --words-toolbar-border ) ;
border : var ( --words-border-width ) solid var ( --words-toolbar-border ) ;
border-radius : var ( --words-command-radius ) ;
border-radius : var ( --words-command-radius ) ;
background : var ( --words-bg , var ( --words-toolbar-bg ) ) ;
background : var ( --words-bg , var ( --words-toolbar-bg ) ) ;
color : var ( --words- toolbar -color) ;
color : var ( --words- command -color) ;
font : inherit ;
font : inherit ;
line-height : 1 . 35 ;
line-height : 1 . 35 ;
outline : none ;
outline : none ;
@ -641,7 +641,7 @@
gap : 0 . 2rem ;
gap : 0 . 2rem ;
margin-inline-start : 0 . 4rem ;
margin-inline-start : 0 . 4rem ;
color : var ( --words-status-color ) ;
color : var ( --words-status-color ) ;
font-size : 0. 65rem ;
font-size : var( --words-status-font-size ) ;
font-weight : normal ;
font-weight : normal ;
letter-spacing : 0 ;
letter-spacing : 0 ;
text-transform : none ;
text-transform : none ;
@ -711,7 +711,7 @@
border-radius : 999px ;
border-radius : 999px ;
background : transparent ;
background : transparent ;
color : var ( --words-status-color ) ;
color : var ( --words-status-color ) ;
font-size : 0. 9rem ;
font-size : var( --words-font-size-md ) ;
line-height : 1 ;
line-height : 1 ;
cursor : pointer ;
cursor : pointer ;
}
}
@ -965,7 +965,7 @@
align-items : baseline ;
align-items : baseline ;
gap : var ( --words-command-gap ) ;
gap : var ( --words-command-gap ) ;
margin : 0 0 var ( --words-toolbar-py-sm ) 0 ;
margin : 0 0 var ( --words-toolbar-py-sm ) 0 ;
font-size : 0. 7rem ;
font-size : var( --words-status-font-size ) ;
font-weight : var ( --words-strong-font-weight ) ;
font-weight : var ( --words-strong-font-weight ) ;
letter-spacing : 0 . 04em ;
letter-spacing : 0 . 04em ;
text-transform : uppercase ;
text-transform : uppercase ;
@ -982,14 +982,14 @@
border-radius : 999px ;
border-radius : 999px ;
background : var ( --_words-accent-solid ) ;
background : var ( --_words-accent-solid ) ;
color : var ( --_words-accent-on ) ;
color : var ( --_words-accent-on ) ;
font-size : 0. 65rem ;
font-size : var( --words-status-font-size ) ;
}
}
[ data-words-drawer-empty ] {
[ data-words-drawer-empty ] {
margin : 0 ;
margin : 0 ;
color : var ( --words-status-color ) ;
color : var ( --words-status-color ) ;
font-style : italic ;
font-style : italic ;
font-size : 0. 8rem ;
font-size : var( --words-font-size-sm ) ;
}
}
[ data-words-drawer-empty ] [ data-tone = 'affirm' ] {
[ data-words-drawer-empty ] [ data-tone = 'affirm' ] {
@ -1011,7 +1011,7 @@
align-items : baseline ;
align-items : baseline ;
gap : 0 . 4rem ;
gap : 0 . 4rem ;
padding-inline-start : 0 ;
padding-inline-start : 0 ;
font-size : 0. 8rem ;
font-size : var( --words-font-size-sm ) ;
line-height : 1 . 3 ;
line-height : 1 . 3 ;
}
}
@ -1027,7 +1027,7 @@
flex-shrink : 0 ;
flex-shrink : 0 ;
min-inline-size : 1 . 5rem ;
min-inline-size : 1 . 5rem ;
color : var ( --_words-accent-text ) ;
color : var ( --_words-accent-text ) ;
font-size : 0. 65rem ;
font-size : var( --words-status-font-size ) ;
font-weight : var ( --words-strong-font-weight ) ;
font-weight : var ( --words-strong-font-weight ) ;
letter-spacing : 0 . 04em ;
letter-spacing : 0 . 04em ;
}
}
@ -1050,13 +1050,13 @@
justify-content : space-between ;
justify-content : space-between ;
align-items : baseline ;
align-items : baseline ;
gap : 0 . 5rem ;
gap : 0 . 5rem ;
font-size : 0. 8rem ;
font-size : var( --words-font-size-sm ) ;
}
}
[ data-words-drawer-stats ] dt {
[ data-words-drawer-stats ] dt {
margin : 0 ;
margin : 0 ;
color : var ( --words-status-color ) ;
color : var ( --words-status-color ) ;
font-size : 0. 7rem ;
font-size : var( --words-status-font-size ) ;
text-transform : uppercase ;
text-transform : uppercase ;
letter-spacing : 0 . 04em ;
letter-spacing : 0 . 04em ;
}
}
@ -1080,7 +1080,7 @@
padding-inline : 0 . 5rem ;
padding-inline : 0 . 5rem ;
border-radius : var ( --words-command-radius ) ;
border-radius : var ( --words-command-radius ) ;
background : color-mix ( in srgb , var ( --words-toolbar-border ) 30 % , transparent ) ;
background : color-mix ( in srgb , var ( --words-toolbar-border ) 30 % , transparent ) ;
font-size : 0. 75rem ;
font-size : var( --words-font-size-sm ) ;
line-height : 1 . 35 ;
line-height : 1 . 35 ;
}
}
@ -1109,7 +1109,7 @@
border-radius : var ( --words-command-radius ) ;
border-radius : var ( --words-command-radius ) ;
background : var ( --words-bg ) ;
background : var ( --words-bg ) ;
color : var ( --words-command-color ) ;
color : var ( --words-command-color ) ;
font-size : 0. 75rem ;
font-size : var( --words-font-size-sm ) ;
font-weight : var ( --words-strong-font-weight ) ;
font-weight : var ( --words-strong-font-weight ) ;
cursor : pointer ;
cursor : pointer ;
transition :
transition :
@ -1152,7 +1152,7 @@
border-radius : var ( --words-command-radius ) ;
border-radius : var ( --words-command-radius ) ;
background : color-mix ( in srgb , var ( --words-toolbar-border ) 30 % , transparent ) ;
background : color-mix ( in srgb , var ( --words-toolbar-border ) 30 % , transparent ) ;
color : var ( --words-command-color ) ;
color : var ( --words-command-color ) ;
font-size : 0. 75rem ;
font-size : var( --words-font-size-sm ) ;
line-height : 1 . 35 ;
line-height : 1 . 35 ;
word-break : break-all ;
word-break : break-all ;
}
}