Add emphatic color variable and set up scoped based overrides for core variables (#1932)
Some checks are pending
Project CI / build (24.x) (push) Waiting to run

This commit is contained in:
Carlos Fernandez 2026-05-26 16:18:52 -04:00 committed by GitHub
parent c2f8b34ef2
commit fa6f9d56b8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
36 changed files with 86 additions and 71 deletions

View file

@ -7,7 +7,7 @@
border-top: 0; border-top: 0;
a { a {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
&[disabled] { &[disabled] {
opacity: 0.4; opacity: 0.4;

View file

@ -67,7 +67,6 @@
i { i {
font-size: 18px; font-size: 18px;
// color: light-dark(@dark-blue, @golden);
} }
} }
} }

View file

@ -56,7 +56,7 @@
cursor: pointer; cursor: pointer;
padding: 5px; padding: 5px;
background: light-dark(@dark-blue-10, @golden-10); background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
.label { .label {
font-style: normal; font-style: normal;
@ -129,7 +129,7 @@
cursor: pointer; cursor: pointer;
padding: 5px; padding: 5px;
background: light-dark(@dark-blue-10, @golden-10); background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
.label { .label {
font-style: normal; font-style: normal;

View file

@ -37,7 +37,7 @@
.activity-marker { .activity-marker {
font-size: 0.5rem; font-size: 0.5rem;
flex: none; flex: none;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
margin-right: 4px; margin-right: 4px;
} }

View file

@ -1,5 +1,5 @@
h1 { h1 {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
font: 700 var(--font-size-24) var(--dh-font-subtitle); font: 700 var(--font-size-24) var(--dh-font-subtitle);
text-align: center; text-align: center;
} }

View file

@ -110,7 +110,7 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
button { button {
--button-text-color: var(--color-text-primary); --button-text-color: @color-text-primary;
--button-size: 1.5em; --button-size: 1.5em;
padding: 0 var(--spacer-4); padding: 0 var(--spacer-4);
img { img {

View file

@ -19,7 +19,7 @@
a, a,
span { span {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
} }
} }

View file

@ -35,7 +35,7 @@
width: 120px; width: 120px;
height: 120px; height: 120px;
background: light-dark(@dark-blue-10, @golden-10); background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
&.selected { &.selected {
background: light-dark(@dark-blue-40, @golden-40); background: light-dark(@dark-blue-40, @golden-40);

View file

@ -62,7 +62,7 @@
padding: 5rem 4px var(--spacer-8) 4px; padding: 5rem 4px var(--spacer-8) 4px;
text-align: center; text-align: center;
color: var(--color-text-primary); color: @color-text-primary;
text-shadow: 1px 1px 2px var(--shadow-color), 0 0 10px var(--shadow-color); text-shadow: 1px 1px 2px var(--shadow-color), 0 0 10px var(--shadow-color);
.smooth-gradient-ease-in-out(background-image, to bottom, var(--shadow-color), 100%); .smooth-gradient-ease-in-out(background-image, to bottom, var(--shadow-color), 100%);
} }

View file

@ -1,6 +1,6 @@
.daggerheart.dialog.dh-style.views.tag-team-dialog .window-content { .daggerheart.dialog.dh-style.views.tag-team-dialog .window-content {
h1 { h1 {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
font: 700 var(--font-size-24) var(--dh-font-subtitle); font: 700 var(--font-size-24) var(--dh-font-subtitle);
text-align: center; text-align: center;
} }
@ -64,7 +64,7 @@
.roll-title { .roll-title {
font-size: var(--font-size-20); font-size: var(--font-size-20);
font-weight: bold; font-weight: bold;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
text-align: center; text-align: center;
display: flex; display: flex;
align-items: center; align-items: center;
@ -72,7 +72,7 @@
&::before, &::before,
&::after { &::after {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
content: ''; content: '';
flex: 1; flex: 1;
height: 2px; height: 2px;
@ -202,7 +202,7 @@
justify-content: center; justify-content: center;
i { i {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
font-size: 48px; font-size: 48px;
&.inactive { &.inactive {

View file

@ -37,7 +37,7 @@
&:hover { &:hover {
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
} }
} }
@ -81,7 +81,7 @@
cursor: pointer; cursor: pointer;
padding: 5px; padding: 5px;
background: light-dark(@dark-blue-10, @golden-10); background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
.label { .label {
font-style: normal; font-style: normal;

View file

@ -14,7 +14,7 @@
box-shadow: 0 4px 30px @soft-shadow; box-shadow: 0 4px 30px @soft-shadow;
backdrop-filter: blur(9.5px); backdrop-filter: blur(9.5px);
outline: 2px solid transparent; outline: 2px solid transparent;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
border: 1px solid light-dark(@dark, @beige); border: 1px solid light-dark(@dark, @beige);
transition: all 0.3s ease; transition: all 0.3s ease;
@ -107,7 +107,7 @@
&:hover { &:hover {
background: light-dark(@light-black, @dark-blue); background: light-dark(@light-black, @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
&.glow { &.glow {
@ -128,7 +128,7 @@
&.reverted { &.reverted {
background: light-dark(@dark-blue-10, @golden-10); background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
border: 1px solid light-dark(@dark, transparent); border: 1px solid light-dark(@dark, transparent);
&:hover { &:hover {
background: light-dark(transparent, @golden); background: light-dark(transparent, @golden);
@ -175,7 +175,7 @@
height: inherit; height: inherit;
.tag { .tag {
padding: 0.3rem 0.5rem; padding: 0.3rem 0.5rem;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
background-color: light-dark(@dark-blue-10, @golden-40); background-color: light-dark(@dark-blue-10, @golden-40);
border-radius: 3px; border-radius: 3px;
transition: 0.13s ease-out; transition: 0.13s ease-out;
@ -353,7 +353,7 @@
legend { legend {
font-weight: bold; font-weight: bold;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
&.with-icon { &.with-icon {
display: flex; display: flex;
@ -571,7 +571,7 @@
border: 0; border: 0;
&:hover { &:hover {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
&:not(:first-child) { &:not(:first-child) {

View file

@ -13,7 +13,7 @@
legend { legend {
font-weight: bold; font-weight: bold;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
font-size: var(--font-size-12); font-size: var(--font-size-12);
} }
@ -25,7 +25,7 @@
button { button {
background: light-dark(@light-black, @dark-blue); background: light-dark(@light-black, @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
outline: none; outline: none;
box-shadow: none; box-shadow: none;
border: 1px solid light-dark(@dark-blue, @dark-blue); border: 1px solid light-dark(@dark-blue, @dark-blue);

View file

@ -53,7 +53,7 @@
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px; border-radius: 6px;
z-index: 1; z-index: 1;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
width: fit-content; width: fit-content;
.slot { .slot {

View file

@ -43,7 +43,7 @@ body.game:is(.performance-low, .noblur) {
&:hover { &:hover {
border-color: light-dark(@dark-blue, @golden); border-color: light-dark(@dark-blue, @golden);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
} }
} }

View file

@ -20,7 +20,7 @@
white-space: nowrap; white-space: nowrap;
a { a {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
} }
} }

View file

@ -24,7 +24,7 @@
.palette-category-title { .palette-category-title {
grid-column: span var(--effect-columns); grid-column: span var(--effect-columns);
font-weight: bold; font-weight: bold;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
} }
} }

View file

@ -13,7 +13,7 @@
font-size: var(--font-size-24); font-size: var(--font-size-24);
margin: 0; margin: 0;
text-align: center; text-align: center;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
} }
} }

View file

@ -127,7 +127,7 @@
.title-name { .title-name {
text-align: start; text-align: start;
font-size: var(--font-size-28); font-size: var(--font-size-28);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
text-align: center; text-align: center;
} }
} }
@ -180,7 +180,7 @@
display: flex; display: flex;
gap: 10px; gap: 10px;
background-color: light-dark(transparent, @dark-blue); background-color: light-dark(transparent, @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
padding: 5px 10px; padding: 5px 10px;
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px; border-radius: 6px;
@ -194,7 +194,7 @@
font-size: var(--font-size-14); font-size: var(--font-size-14);
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
.domain { .domain {
@ -206,7 +206,7 @@
font-size: var(--font-size-14); font-size: var(--font-size-14);
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
img { img {
@ -230,7 +230,7 @@
padding: 10px; padding: 10px;
border-radius: 5px; border-radius: 5px;
min-width: 90px; min-width: 90px;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
background-color: light-dark(@dark-blue-10, @golden-40); background-color: light-dark(@dark-blue-10, @golden-40);
} }
} }

View file

@ -65,7 +65,7 @@
display: flex; display: flex;
gap: 10px; gap: 10px;
background-color: light-dark(transparent, @dark-blue); background-color: light-dark(transparent, @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
padding: 5px 10px; padding: 5px 10px;
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px; border-radius: 6px;
@ -77,7 +77,7 @@
font-size: var(--font-size-14); font-size: var(--font-size-14);
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
&.threshold-value { &.threshold-value {
color: light-dark(@dark, @beige); color: light-dark(@dark, @beige);

View file

@ -103,7 +103,7 @@
padding: 5px 0; padding: 5px 0;
margin-bottom: 8px; margin-bottom: 8px;
font-size: var(--font-size-12); font-size: var(--font-size-12);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
.missing-header-feature { .missing-header-feature {
opacity: 0.5; opacity: 0.5;
@ -170,7 +170,7 @@
display: flex; display: flex;
gap: 4px; gap: 4px;
background-color: light-dark(transparent, @dark-blue); background-color: light-dark(transparent, @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
padding: 5px 10px; padding: 5px 10px;
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px; border-radius: 6px;
@ -182,7 +182,7 @@
font-size: var(--font-size-14); font-size: var(--font-size-14);
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
margin-right: 4px; margin-right: 4px;
} }
@ -195,7 +195,7 @@
font-size: var(--font-size-14); font-size: var(--font-size-14);
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
img { img {

View file

@ -54,7 +54,7 @@
span { span {
margin: 1px; margin: 1px;
width: 26px; width: 26px;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
&.list-icon { &.list-icon {
i { i {

View file

@ -286,7 +286,7 @@
h4, h4,
i { i {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
} }
} }
@ -314,7 +314,7 @@
z-index: 1; z-index: 1;
background: @dark-blue; background: @dark-blue;
justify-content: center; justify-content: center;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
.armor-slot { .armor-slot {
cursor: pointer; cursor: pointer;
@ -348,7 +348,7 @@
.label, .label,
.value, .value,
i { i {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
} }
@ -513,7 +513,7 @@
align-self: center; align-self: center;
gap: 10px; gap: 10px;
background-color: light-dark(transparent, @dark-blue); background-color: light-dark(transparent, @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
padding: 5px 10px; padding: 5px 10px;
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px; border-radius: 6px;
@ -525,7 +525,7 @@
font-size: var(--font-size-14); font-size: var(--font-size-14);
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
&.threshold-value { &.threshold-value {
color: light-dark(@dark, @beige); color: light-dark(@dark, @beige);

View file

@ -79,7 +79,7 @@
display: flex; display: flex;
gap: 4px; gap: 4px;
background-color: light-dark(var(--color-light-1), @dark-blue); background-color: light-dark(var(--color-light-1), @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
padding: 4px 6px; padding: 4px 6px;
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 3px; border-radius: 3px;
@ -93,7 +93,7 @@
&.threshold-label { &.threshold-label {
font-size: var(--font-size-10); font-size: var(--font-size-10);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
&.threshold-value { &.threshold-value {
@ -116,7 +116,7 @@
width: 100%; width: 100%;
z-index: 1; z-index: 1;
font-size: var(--font-size-20); font-size: var(--font-size-20);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
font-weight: bold; font-weight: bold;
} }
@ -132,7 +132,7 @@
.hope-section { .hope-section {
display: flex; display: flex;
background-color: light-dark(transparent, @dark-blue); background-color: light-dark(transparent, @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
padding: 3px 6px; padding: 3px 6px;
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 3px; border-radius: 3px;
@ -144,7 +144,7 @@
font-size: var(--font-size-12); font-size: var(--font-size-12);
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
margin-right: 3px; margin-right: 3px;
} }
@ -212,7 +212,7 @@
gap: 4px; gap: 4px;
background-color: light-dark(@dark-blue-10, @dark-blue); background-color: light-dark(@dark-blue-10, @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
padding: 2px 5px; padding: 2px 5px;
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 0 6px 6px 0; border-radius: 0 6px 6px 0;
@ -260,7 +260,7 @@
justify-content: space-between; justify-content: space-between;
gap: 3px; gap: 3px;
.label { .label {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
.value { .value {
font-weight: 600; font-weight: 600;

View file

@ -31,7 +31,7 @@
} }
i { i {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
} }
} }
@ -71,7 +71,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
gap: 10px; gap: 10px;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
.main-value { .main-value {
font-size: var(--font-size-24); font-size: var(--font-size-24);
@ -153,7 +153,7 @@
cursor: pointer; cursor: pointer;
padding: 5px; padding: 5px;
background: light-dark(@dark-blue-10, @golden-10); background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
&.finished { &.finished {
background-color: initial; background-color: initial;

View file

@ -93,7 +93,7 @@
} }
a[href] { a[href] {
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
a[href]:hover, a[href]:hover,

View file

@ -17,7 +17,7 @@
position: relative; position: relative;
border: 0; border: 0;
box-shadow: none; box-shadow: none;
color: var(--color-text-primary); color: @color-text-primary;
width: 300px; width: 300px;
pointer-events: all; pointer-events: all;
align-self: flex-end; align-self: flex-end;

View file

@ -200,7 +200,7 @@
font-weight: bold; font-weight: bold;
border-radius: 3px; border-radius: 3px;
background-color: light-dark(@dark-blue-40, @golden-40); background-color: light-dark(@dark-blue-40, @golden-40);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
.subfolder-list { .subfolder-list {
@ -218,7 +218,7 @@
font-weight: bold; font-weight: bold;
border-radius: 3px; border-radius: 3px;
background-color: light-dark(@dark-blue-10, @golden-10); background-color: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
} }
.wrapper { .wrapper {
@ -265,7 +265,7 @@
.item-list-header { .item-list-header {
align-items: center; align-items: center;
background-color: light-dark(@dark-15, @dark-golden-80); background-color: light-dark(@dark-15, @dark-golden-80);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 3px; border-radius: 3px;
min-height: 30px; min-height: 30px;

View file

@ -61,7 +61,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 4px; gap: 4px;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
i { i {
font-size: 14px; font-size: 14px;

View file

@ -1,7 +1,7 @@
@import '../../utils/colors.less'; @import '../../utils/colors.less';
.daggerheart.dh-style.setting { .daggerheart.dh-style.setting {
--color-form-label: var(--color-text-primary); --color-form-label: @color-text-primary;
h2, h2,
h3, h3,

View file

@ -34,7 +34,7 @@
cursor: pointer; cursor: pointer;
padding: 5px; padding: 5px;
background: light-dark(@dark-blue-10, @golden-10); background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
.label { .label {
font-style: normal; font-style: normal;

View file

@ -83,8 +83,21 @@
--gradient-stress: linear-gradient(15deg, rgb(130, 59, 1) 0%, rgb(252, 142, 69) 65%, rgb(190, 0, 0) 100%); --gradient-stress: linear-gradient(15deg, rgb(130, 59, 1) 0%, rgb(252, 142, 69) 65%, rgb(190, 0, 0) 100%);
--primary-color-fear: rgba(9, 71, 179, 0.75); --primary-color-fear: rgba(9, 71, 179, 0.75);
}
--dh-color-text-subtle: light-dark(#555, #a29086); @scope (.theme-light) to (.themed) {
.dh-style,
.duality {
--color-text-emphatic: @dark-blue;
--color-text-subtle: #555;
}
}
@scope (.theme-dark) to (.themed) {
.dh-style,
.duality {
--color-text-emphatic: @golden;
--color-text-subtle: #a29086;
}
} }
@primary-blue: var(--primary-blue, #1488cc); @primary-blue: var(--primary-blue, #1488cc);
@ -193,4 +206,7 @@
} }
} }
@color-text-subtle: var(--dh-color-text-subtle); // LESS variable versions of core foundry color variables
@color-text-emphatic: var(--color-text-emphatic);
@color-text-primary: var(--color-text-primary);
@color-text-subtle: var(--color-text-subtle);

View file

@ -124,7 +124,7 @@
background: @dark-blue; background: @dark-blue;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
min-height: 30px; min-height: 30px;
width: 100%; width: 100%;

View file

@ -9,7 +9,7 @@
display: flex; display: flex;
gap: 10px; gap: 10px;
background-color: light-dark(transparent, @dark-blue); background-color: light-dark(transparent, @dark-blue);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
padding: 5px 10px; padding: 5px 10px;
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px; border-radius: 6px;
@ -22,7 +22,7 @@
font-size: var(--font-size-14); font-size: var(--font-size-14);
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
margin: 0; margin: 0;
} }

View file

@ -3,7 +3,7 @@ aside[role='tooltip']:has(div.daggerheart.dh-style.tooltip),
#tooltip.bordered-tooltip { #tooltip.bordered-tooltip {
.tooltip-title { .tooltip-title {
font-size: var(--font-size-20); font-size: var(--font-size-20);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
font-weight: 700; font-weight: 700;
} }

View file

@ -132,7 +132,7 @@ aside[role='tooltip']:has(div.daggerheart.dh-style.tooltip.card-style) {
border-radius: 3px; border-radius: 3px;
padding: 3px; padding: 3px;
background: light-dark(@dark-blue-60, @rustic-brown-80); background: light-dark(@dark-blue-60, @rustic-brown-80);
color: light-dark(@dark-blue, @golden); color: @color-text-emphatic;
font-size: 12px; font-size: 12px;
margin-bottom: 10px; margin-bottom: 10px;
} }