All user data for FoundryVTT. Includes worlds, systems, modules, and any asset in the "foundryuserdata" directory. Does NOT include the FoundryVTT installation itself.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

18416 lines
579 KiB

1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
  1. @charset "UTF-8";
  2. :root {
  3. --tagify-dd-color-primary: rgb(53,149,246);
  4. --tagify-dd-bg-color: white;
  5. --tagify-dd-item-pad: .3em .5em;
  6. }
  7. .tagify {
  8. --tags-disabled-bg: #F1F1F1;
  9. --tags-border-color: #DDD;
  10. --tags-hover-border-color: #CCC;
  11. --tags-focus-border-color: #3595f6;
  12. --tag-border-radius: 3px;
  13. --tag-bg: #E5E5E5;
  14. --tag-hover: #D3E2E2;
  15. --tag-text-color: black;
  16. --tag-text-color--edit: black;
  17. --tag-pad: 0.3em 0.5em;
  18. --tag-inset-shadow-size: 1.1em;
  19. --tag-invalid-color: #D39494;
  20. --tag-invalid-bg: rgba(211, 148, 148, 0.5);
  21. --tag-remove-bg: rgba(211, 148, 148, 0.3);
  22. --tag-remove-btn-color: black;
  23. --tag-remove-btn-bg: none;
  24. --tag-remove-btn-bg--hover: #c77777;
  25. --input-color: inherit;
  26. --tag--min-width: 1ch;
  27. --tag--max-width: auto;
  28. --tag-hide-transition: 0.3s;
  29. --placeholder-color: rgba(0, 0, 0, 0.4);
  30. --placeholder-color-focus: rgba(0, 0, 0, 0.25);
  31. --loader-size: .8em;
  32. --readonly-striped: 1;
  33. display: inline-flex;
  34. align-items: flex-start;
  35. flex-wrap: wrap;
  36. border: 1px solid var(--tags-border-color);
  37. padding: 0;
  38. line-height: 0;
  39. cursor: text;
  40. outline: none;
  41. position: relative;
  42. box-sizing: border-box;
  43. transition: 0.1s;
  44. }
  45. @keyframes tags--bump {
  46. 30% {
  47. transform: scale(1.2);
  48. }
  49. }
  50. @keyframes rotateLoader {
  51. to {
  52. transform: rotate(1turn);
  53. }
  54. }
  55. .tagify:hover:not(.tagify--focus):not(.tagify--invalid) {
  56. --tags-border-color: var(--tags-hover-border-color);
  57. }
  58. .tagify[disabled] {
  59. background: var(--tags-disabled-bg);
  60. filter: saturate(0);
  61. opacity: 0.5;
  62. pointer-events: none;
  63. }
  64. .tagify[readonly].tagify--select, .tagify[disabled].tagify--select {
  65. pointer-events: none;
  66. }
  67. .tagify[readonly]:not(.tagify--mix):not(.tagify--select), .tagify[disabled]:not(.tagify--mix):not(.tagify--select) {
  68. cursor: default;
  69. }
  70. .tagify[readonly]:not(.tagify--mix):not(.tagify--select) > .tagify__input, .tagify[disabled]:not(.tagify--mix):not(.tagify--select) > .tagify__input {
  71. visibility: hidden;
  72. width: 0;
  73. margin: 5px 0;
  74. }
  75. .tagify[readonly]:not(.tagify--mix):not(.tagify--select) .tagify__tag > div, .tagify[disabled]:not(.tagify--mix):not(.tagify--select) .tagify__tag > div {
  76. padding: var(--tag-pad);
  77. }
  78. .tagify[readonly]:not(.tagify--mix):not(.tagify--select) .tagify__tag > div::before, .tagify[disabled]:not(.tagify--mix):not(.tagify--select) .tagify__tag > div::before {
  79. animation: readonlyStyles 1s calc(-1s * (var(--readonly-striped) - 1)) paused;
  80. }
  81. @keyframes readonlyStyles {
  82. 0% {
  83. background: linear-gradient(45deg, var(--tag-bg) 25%, transparent 25%, transparent 50%, var(--tag-bg) 50%, var(--tag-bg) 75%, transparent 75%, transparent) 0/5px 5px;
  84. box-shadow: none;
  85. filter: brightness(0.95);
  86. }
  87. }
  88. .tagify[readonly] .tagify__tag__removeBtn, .tagify[disabled] .tagify__tag__removeBtn {
  89. display: none;
  90. }
  91. .tagify--loading .tagify__input > br:last-child {
  92. display: none;
  93. }
  94. .tagify--loading .tagify__input::before {
  95. content: none;
  96. }
  97. .tagify--loading .tagify__input::after {
  98. content: "";
  99. vertical-align: middle;
  100. opacity: 1;
  101. width: 0.7em;
  102. height: 0.7em;
  103. width: var(--loader-size);
  104. height: var(--loader-size);
  105. min-width: 0;
  106. border: 3px solid;
  107. border-color: #EEE #BBB #888 transparent;
  108. border-radius: 50%;
  109. animation: rotateLoader 0.4s infinite linear;
  110. content: "" !important;
  111. margin: -2px 0 -2px 0.5em;
  112. }
  113. .tagify--loading .tagify__input:empty::after {
  114. margin-left: 0;
  115. }
  116. .tagify + input,
  117. .tagify + textarea {
  118. position: absolute !important;
  119. left: -9999em !important;
  120. transform: scale(0) !important;
  121. }
  122. .tagify__tag {
  123. display: inline-flex;
  124. align-items: center;
  125. margin: 5px 0 5px 5px;
  126. position: relative;
  127. z-index: 1;
  128. outline: none;
  129. line-height: normal;
  130. cursor: default;
  131. transition: 0.13s ease-out;
  132. }
  133. .tagify__tag > div {
  134. vertical-align: top;
  135. box-sizing: border-box;
  136. max-width: 100%;
  137. padding: var(--tag-pad);
  138. color: var(--tag-text-color);
  139. line-height: inherit;
  140. border-radius: var(--tag-border-radius);
  141. white-space: nowrap;
  142. transition: 0.13s ease-out;
  143. }
  144. .tagify__tag > div > * {
  145. white-space: pre-wrap;
  146. overflow: hidden;
  147. text-overflow: ellipsis;
  148. display: inline-block;
  149. vertical-align: top;
  150. min-width: var(--tag--min-width);
  151. max-width: var(--tag--max-width);
  152. transition: 0.8s ease, 0.1s color;
  153. }
  154. .tagify__tag > div > *[contenteditable] {
  155. outline: none;
  156. user-select: text;
  157. cursor: text;
  158. margin: -2px;
  159. padding: 2px;
  160. max-width: 350px;
  161. }
  162. .tagify__tag > div::before {
  163. content: "";
  164. position: absolute;
  165. border-radius: inherit;
  166. inset: var(--tag-bg-inset, 0);
  167. z-index: -1;
  168. pointer-events: none;
  169. transition: 120ms ease;
  170. animation: tags--bump 0.3s ease-out 1;
  171. box-shadow: 0 0 0 var(--tag-inset-shadow-size) var(--tag-bg) inset;
  172. }
  173. .tagify__tag:hover:not([readonly]) div::before, .tagify__tag:focus div::before {
  174. --tag-bg-inset: -2.5px;
  175. --tag-bg: var(--tag-hover);
  176. }
  177. .tagify__tag--loading {
  178. pointer-events: none;
  179. }
  180. .tagify__tag--loading .tagify__tag__removeBtn {
  181. display: none;
  182. }
  183. .tagify__tag--loading::after {
  184. --loader-size: .4em;
  185. content: "";
  186. vertical-align: middle;
  187. opacity: 1;
  188. width: 0.7em;
  189. height: 0.7em;
  190. width: var(--loader-size);
  191. height: var(--loader-size);
  192. min-width: 0;
  193. border: 3px solid;
  194. border-color: #EEE #BBB #888 transparent;
  195. border-radius: 50%;
  196. animation: rotateLoader 0.4s infinite linear;
  197. margin: 0 0.5em 0 -0.1em;
  198. }
  199. .tagify__tag--flash div::before {
  200. animation: none;
  201. }
  202. .tagify__tag--hide {
  203. width: 0 !important;
  204. padding-left: 0;
  205. padding-right: 0;
  206. margin-left: 0;
  207. margin-right: 0;
  208. opacity: 0;
  209. transform: scale(0);
  210. transition: var(--tag-hide-transition);
  211. pointer-events: none;
  212. }
  213. .tagify__tag--hide > div > * {
  214. white-space: nowrap;
  215. }
  216. .tagify__tag.tagify--noAnim > div::before {
  217. animation: none;
  218. }
  219. .tagify__tag.tagify--notAllowed:not(.tagify__tag--editable) div > span {
  220. opacity: 0.5;
  221. }
  222. .tagify__tag.tagify--notAllowed:not(.tagify__tag--editable) div::before {
  223. --tag-bg: var(--tag-invalid-bg);
  224. transition: 0.2s;
  225. }
  226. .tagify__tag[readonly] .tagify__tag__removeBtn {
  227. display: none;
  228. }
  229. .tagify__tag[readonly] > div::before {
  230. animation: readonlyStyles 1s calc(-1s * (var(--readonly-striped) - 1)) paused;
  231. }
  232. @keyframes readonlyStyles {
  233. 0% {
  234. background: linear-gradient(45deg, var(--tag-bg) 25%, transparent 25%, transparent 50%, var(--tag-bg) 50%, var(--tag-bg) 75%, transparent 75%, transparent) 0/5px 5px;
  235. box-shadow: none;
  236. filter: brightness(0.95);
  237. }
  238. }
  239. .tagify__tag--editable > div {
  240. color: var(--tag-text-color--edit);
  241. }
  242. .tagify__tag--editable > div::before {
  243. box-shadow: 0 0 0 2px var(--tag-hover) inset !important;
  244. }
  245. .tagify__tag--editable > .tagify__tag__removeBtn {
  246. pointer-events: none;
  247. }
  248. .tagify__tag--editable > .tagify__tag__removeBtn::after {
  249. opacity: 0;
  250. transform: translateX(100%) translateX(5px);
  251. }
  252. .tagify__tag--editable.tagify--invalid > div::before {
  253. box-shadow: 0 0 0 2px var(--tag-invalid-color) inset !important;
  254. }
  255. .tagify__tag__removeBtn {
  256. order: 5;
  257. display: inline-flex;
  258. align-items: center;
  259. justify-content: center;
  260. border-radius: 50px;
  261. cursor: pointer;
  262. font: 14px/1 Arial;
  263. background: var(--tag-remove-btn-bg);
  264. color: var(--tag-remove-btn-color);
  265. width: 14px;
  266. height: 14px;
  267. margin-right: 4.6666666667px;
  268. margin-left: auto;
  269. overflow: hidden;
  270. transition: 0.2s ease-out;
  271. }
  272. .tagify__tag__removeBtn::after {
  273. content: "×";
  274. transition: 0.3s, color 0s;
  275. }
  276. .tagify__tag__removeBtn:hover {
  277. color: white;
  278. background: var(--tag-remove-btn-bg--hover);
  279. }
  280. .tagify__tag__removeBtn:hover + div > span {
  281. opacity: 0.5;
  282. }
  283. .tagify__tag__removeBtn:hover + div::before {
  284. box-shadow: 0 0 0 var(--tag-inset-shadow-size) var(--tag-remove-bg, rgba(211, 148, 148, 0.3)) inset !important;
  285. transition: box-shadow 0.2s;
  286. }
  287. .tagify:not(.tagify--mix) .tagify__input br {
  288. display: none;
  289. }
  290. .tagify:not(.tagify--mix) .tagify__input * {
  291. display: inline;
  292. white-space: nowrap;
  293. }
  294. .tagify__input {
  295. flex-grow: 1;
  296. display: inline-block;
  297. min-width: 110px;
  298. margin: 5px;
  299. padding: var(--tag-pad);
  300. line-height: normal;
  301. position: relative;
  302. white-space: pre-wrap;
  303. color: var(--input-color);
  304. box-sizing: inherit;
  305. /* Seems firefox newer versions don't need this any more
  306. @supports ( -moz-appearance:none ){
  307. &::before{
  308. line-height: inherit;
  309. position:relative;
  310. }
  311. }
  312. */
  313. }
  314. @-moz-document url-prefix() {}
  315. .tagify__input:empty::before {
  316. position: static;
  317. }
  318. .tagify__input:focus {
  319. outline: none;
  320. }
  321. .tagify__input:focus::before {
  322. transition: 0.2s ease-out;
  323. opacity: 0;
  324. transform: translatex(6px);
  325. /* ALL MS BROWSERS: hide placeholder (on focus) otherwise the caret is placed after it, which is weird */
  326. /* IE Edge 12+ CSS styles go here */
  327. }
  328. @supports (-ms-ime-align: auto) {
  329. .tagify__input:focus::before {
  330. display: none;
  331. }
  332. }
  333. .tagify__input:focus:empty::before {
  334. transition: 0.2s ease-out;
  335. opacity: 1;
  336. transform: none;
  337. color: rgba(0, 0, 0, 0.25);
  338. color: var(--placeholder-color-focus);
  339. }
  340. @-moz-document url-prefix() {
  341. .tagify__input:focus:empty::after {
  342. display: none;
  343. }
  344. }
  345. .tagify__input::before {
  346. content: attr(data-placeholder);
  347. height: 1em;
  348. line-height: 1em;
  349. margin: auto 0;
  350. z-index: 1;
  351. color: var(--placeholder-color);
  352. white-space: nowrap;
  353. pointer-events: none;
  354. opacity: 0;
  355. position: absolute;
  356. }
  357. .tagify__input::after {
  358. content: attr(data-suggest);
  359. display: inline-block;
  360. vertical-align: middle;
  361. position: absolute;
  362. min-width: calc(100% - 1.5em);
  363. text-overflow: ellipsis;
  364. overflow: hidden;
  365. white-space: pre; /* allows spaces at the beginning */
  366. color: var(--tag-text-color);
  367. opacity: 0.3;
  368. pointer-events: none;
  369. max-width: 100px;
  370. }
  371. .tagify__input .tagify__tag {
  372. margin: 0 1px;
  373. }
  374. .tagify--mix {
  375. display: block;
  376. }
  377. .tagify--mix .tagify__input {
  378. padding: 5px;
  379. margin: 0;
  380. width: 100%;
  381. height: 100%;
  382. line-height: 1.5;
  383. display: block;
  384. }
  385. .tagify--mix .tagify__input::before {
  386. height: auto;
  387. display: none;
  388. line-height: inherit;
  389. }
  390. .tagify--mix .tagify__input::after {
  391. content: none;
  392. }
  393. .tagify--select::after {
  394. content: ">";
  395. opacity: 0.5;
  396. position: absolute;
  397. top: 50%;
  398. right: 0;
  399. bottom: 0;
  400. font: 16px monospace;
  401. line-height: 8px;
  402. height: 8px;
  403. pointer-events: none;
  404. transform: translate(-150%, -50%) scaleX(1.2) rotate(90deg);
  405. transition: 0.2s ease-in-out;
  406. }
  407. .tagify--select[aria-expanded=true]::after {
  408. transform: translate(-150%, -50%) rotate(270deg) scaleY(1.2);
  409. }
  410. .tagify--select .tagify__tag {
  411. position: absolute;
  412. top: 0;
  413. right: 1.8em;
  414. bottom: 0;
  415. }
  416. .tagify--select .tagify__tag div {
  417. display: none;
  418. }
  419. .tagify--select .tagify__input {
  420. width: 100%;
  421. }
  422. .tagify--empty .tagify__input::before {
  423. transition: 0.2s ease-out;
  424. opacity: 1;
  425. transform: none;
  426. display: inline-block;
  427. width: auto;
  428. }
  429. .tagify--mix .tagify--empty .tagify__input::before {
  430. display: inline-block;
  431. }
  432. .tagify--focus {
  433. --tags-border-color: var(--tags-focus-border-color);
  434. transition: 0s;
  435. }
  436. .tagify--invalid {
  437. --tags-border-color: #D39494;
  438. }
  439. .tagify__dropdown {
  440. position: absolute;
  441. z-index: 9999;
  442. transform: translateY(1px);
  443. overflow: hidden;
  444. }
  445. .tagify__dropdown[placement=top] {
  446. margin-top: 0;
  447. transform: translateY(-100%);
  448. }
  449. .tagify__dropdown[placement=top] .tagify__dropdown__wrapper {
  450. border-top-width: 1.1px;
  451. border-bottom-width: 0;
  452. }
  453. .tagify__dropdown[position=text] {
  454. box-shadow: 0 0 0 3px rgba(var(--tagify-dd-color-primary), 0.1);
  455. font-size: 0.9em;
  456. }
  457. .tagify__dropdown[position=text] .tagify__dropdown__wrapper {
  458. border-width: 1px;
  459. }
  460. .tagify__dropdown__wrapper {
  461. max-height: 300px;
  462. overflow: auto;
  463. overflow-x: hidden;
  464. background: var(--tagify-dd-bg-color);
  465. border: 1px solid;
  466. border-color: var(--tagify-dd-color-primary);
  467. border-bottom-width: 1.5px;
  468. border-top-width: 0;
  469. box-shadow: 0 2px 4px -2px rgba(0, 0, 0, 0.2);
  470. transition: 0.25s cubic-bezier(0, 1, 0.5, 1);
  471. }
  472. .tagify__dropdown__header:empty {
  473. display: none;
  474. }
  475. .tagify__dropdown__footer {
  476. display: inline-block;
  477. margin-top: 0.5em;
  478. padding: var(--tagify-dd-item-pad);
  479. font-size: 0.7em;
  480. font-style: italic;
  481. opacity: 0.5;
  482. }
  483. .tagify__dropdown__footer:empty {
  484. display: none;
  485. }
  486. .tagify__dropdown--initial .tagify__dropdown__wrapper {
  487. max-height: 20px;
  488. transform: translateY(-1em);
  489. }
  490. .tagify__dropdown--initial[placement=top] .tagify__dropdown__wrapper {
  491. transform: translateY(2em);
  492. }
  493. .tagify__dropdown__item {
  494. box-sizing: border-box;
  495. padding: var(--tagify-dd-item-pad);
  496. margin: 1px;
  497. cursor: pointer;
  498. border-radius: 2px;
  499. position: relative;
  500. outline: none;
  501. max-height: 60px;
  502. max-width: 100%;
  503. /* custom hidden transition effect is needed for horizontal-layout suggestions */
  504. }
  505. .tagify__dropdown__item--active {
  506. background: var(--tagify-dd-color-primary);
  507. color: white;
  508. }
  509. .tagify__dropdown__item:active {
  510. filter: brightness(105%);
  511. }
  512. .tagify__dropdown__item--hidden {
  513. padding-top: 0;
  514. padding-bottom: 0;
  515. margin: 0 1px;
  516. pointer-events: none;
  517. overflow: hidden;
  518. max-height: 0;
  519. transition: var(--tagify-dd-item--hidden-duration, 0.3s) !important;
  520. }
  521. .tagify__dropdown__item--hidden > * {
  522. transform: translateY(-100%);
  523. opacity: 0;
  524. transition: inherit;
  525. }.noUi-target,.noUi-target *{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-ms-touch-action:none;touch-action:none;-ms-user-select:none;-moz-user-select:none;user-select:none;-moz-box-sizing:border-box;box-sizing:border-box}.noUi-target{position:relative}.noUi-base,.noUi-connects{width:100%;height:100%;position:relative;z-index:1}.noUi-connects{overflow:hidden;z-index:0}.noUi-connect,.noUi-origin{will-change:transform;position:absolute;z-index:1;top:0;right:0;height:100%;width:100%;-ms-transform-origin:0 0;-webkit-transform-origin:0 0;-webkit-transform-style:preserve-3d;transform-origin:0 0;transform-style:flat}.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin{left:0;right:auto}.noUi-vertical .noUi-origin{top:-100%;width:0}.noUi-horizontal .noUi-origin{height:0}.noUi-handle{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute}.noUi-touch-area{height:100%;width:100%}.noUi-state-tap .noUi-connect,.noUi-state-tap .noUi-origin{-webkit-transition:transform .3s;transition:transform .3s}.noUi-state-drag *{cursor:inherit!important}.noUi-horizontal{height:18px}.noUi-horizontal .noUi-handle{width:34px;height:28px;right:-17px;top:-6px}.noUi-vertical{width:18px}.noUi-vertical .noUi-handle{width:28px;height:34px;right:-6px;bottom:-17px}.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle{left:-17px;right:auto}.noUi-target{background:#FAFAFA;border-radius:4px;border:1px solid #D3D3D3;box-shadow:inset 0 1px 1px #F0F0F0,0 3px 6px -5px #BBB}.noUi-connects{border-radius:3px}.noUi-connect{background:#3FB8AF}.noUi-draggable{cursor:ew-resize}.noUi-vertical .noUi-draggable{cursor:ns-resize}.noUi-handle{border:1px solid #D9D9D9;border-radius:3px;background:#FFF;cursor:default;box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #EBEBEB,0 3px 6px -3px #BBB}.noUi-active{box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #DDD,0 3px 6px -3px #BBB}.noUi-handle:after,.noUi-handle:before{content:"";display:block;position:absolute;height:14px;width:1px;background:#E8E7E6;left:14px;top:6px}.noUi-handle:after{left:17px}.noUi-vertical .noUi-handle:after,.noUi-vertical .noUi-handle:before{width:14px;height:1px;left:6px;top:14px}.noUi-vertical .noUi-handle:after{top:17px}[disabled] .noUi-connect{background:#B8B8B8}[disabled] .noUi-handle,[disabled].noUi-handle,[disabled].noUi-target{cursor:not-allowed}.noUi-pips,.noUi-pips *{-moz-box-sizing:border-box;box-sizing:border-box}.noUi-pips{position:absolute;color:#999}.noUi-value{position:absolute;white-space:nowrap;text-align:center}.noUi-value-sub{color:#ccc;font-size:10px}.noUi-marker{position:absolute;background:#CCC}.noUi-marker-sub{background:#AAA}.noUi-marker-large{background:#AAA}.noUi-pips-horizontal{padding:10px 0;height:80px;top:100%;left:0;width:100%}.noUi-value-horizontal{-webkit-transform:translate(-50%,50%);transform:translate(-50%,50%)}.noUi-rtl .noUi-value-horizontal{-webkit-transform:translate(50%,50%);transform:translate(50%,50%)}.noUi-marker-horizontal.noUi-marker{margin-left:-1px;width:2px;height:5px}.noUi-marker-horizontal.noUi-marker-sub{height:10px}.noUi-marker-horizontal.noUi-marker-large{height:15px}.noUi-pips-vertical{padding:0 10px;height:100%;top:0;left:100%}.noUi-value-vertical{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);padding-left:25px}.noUi-rtl .noUi-value-vertical{-webkit-transform:translate(0,50%);transform:translate(0,50%)}.noUi-marker-vertical.noUi-marker{width:5px;height:2px;margin-top:-1px}.noUi-marker-vertical.noUi-marker-sub{width:10px}.noUi-marker-vertical.noUi-marker-large{width:15px}.noUi-tooltip{display:block;position:absolute;border:1px solid #D9D9D9;border-radius:3px;background:#fff;color:#000;padding:5px;text-align:center;white-space:nowrap}.noUi-horizontal .noUi-tooltip{-webkit-transform:translate(-50%,0);transform:translate(-50%,0);left:50%;bottom:120%}.noUi-vertical .noUi-tooltip{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);top:50%;right:120%}.noUi-horizontal .noUi-origin>.noUi-tooltip{-webkit-transform:translate(50%,0);transform:translate(50%,0);left:auto;bottom:10px}.noUi-vertical .noUi-origin>.noUi-tooltip{-webkit-transform:translate(0,-18px);transform:translate(0,-18px);top:auto;right:28px}
  526. :root {
  527. scrollbar-color: #782e22 transparent;
  528. }
  529. * {
  530. scrollbar-width: thin;
  531. }
  532. :root {
  533. /** Font-size variables not defined by Foundry */
  534. --font-size-5: 0.3125rem;
  535. --font-size-8: 0.5rem;
  536. --font-size-9: 0.5625rem;
  537. --font-size-10: 0.625rem;
  538. --font-size-15: 0.9375rem;
  539. --font-size-17: 1.0625rem;
  540. --font-size-19: 1.1875rem;
  541. --font-size-21: 1.3125rem;
  542. --font-size-22: 1.375rem;
  543. --font-size-26: 1.625rem;
  544. --font-size-27: 1.6875rem;
  545. --font-size-30: 1.875rem;
  546. --font-size-34: 2.125rem;
  547. --font-size-36: 2.25rem;
  548. --font-size-42: 2.625rem;
  549. /** Font families */
  550. --body-serif: Gelasio, Georgia, serif;
  551. --sans-serif: Roboto, sans-serif;
  552. --sans-serif-condensed: "Roboto Condensed", var(--sans-serif);
  553. --sans-serif-monospace: "Roboto Mono", monospace;
  554. --serif: Eczar, Georgia, serif;
  555. --serif-condensed: "Modesto Condensed", serif;
  556. --journal-cursive: "La Belle Aurore", cursive;
  557. --journal-serif: "Vollkorn", var(--serif);
  558. }
  559. /* ----------------------------------------- */
  560. /* Color definitions */
  561. /* ----------------------------------------- */
  562. /* Colors */
  563. /* Global */
  564. /* used for mini headers, alternate primary color */
  565. /* compliments the primary color, usually used in combination */
  566. /* for all other uses */
  567. /* Lighter / Darker */
  568. /* Text */
  569. /* ----------------------------------------- */
  570. /* Color schemes */
  571. /* ----------------------------------------- */
  572. /* Degrees of success */
  573. /* Value adjustments (e.g. weak/elite) */
  574. /* ----------------------------------------- */
  575. /* CSS Custom Properties */
  576. /* ----------------------------------------- */
  577. :root {
  578. /* Global */
  579. --color-pf-primary: #5e0000;
  580. --color-pf-primary-light: #910000;
  581. --color-pf-primary-dark: #2b0000;
  582. --color-pf-secondary: #171f69;
  583. --color-pf-secondary-light: #202b93;
  584. --color-pf-secondary-dark: #0e133f;
  585. --primary: var(--color-pf-primary);
  586. --secondary: var(--color-pf-secondary);
  587. --tertiary: #e9d7a1;
  588. --alt: #786452;
  589. --alt-dark: #443730;
  590. --bg: #f8f4f1;
  591. --bg-dark: #e7d9cf;
  592. --sub: #605856;
  593. --color-disabled: #ababab;
  594. --inline-link-bg: #ddd;
  595. --inline-repost-bg: #eaeaea;
  596. --visibility-gm-bg: #e8e8ef;
  597. --visibility-owner-bg: #ddebe1;
  598. --blind-roll: #f5eaf5;
  599. /* Lighter / Darker */
  600. --light: #910000;
  601. --primary-dark: #2b0000;
  602. --primary-darker: #120000;
  603. --tertiary-dark: #dfc578;
  604. --tertiary-light: #f3e9ca;
  605. /* Text */
  606. --text-dark: var(--color-text-dark-primary);
  607. --text-light: #f5efe0;
  608. --color-text-dark-input: #333;
  609. --color-text-dark-improved: #006644;
  610. /* Borders */
  611. --color-border-divider: #baa991;
  612. --color-border-dark-input: #d3ccbc;
  613. --color-border-medium: gray;
  614. /* Headers w/ boxes */
  615. --header-color: var(--text-light);
  616. --header-bg: var(--secondary);
  617. /* Sidebar */
  618. --sidebar-label: var(--tertiary-dark);
  619. --sidebar-title: var(--tertiary);
  620. /** Traits */
  621. --color-bg-alignment: #576293;
  622. --color-bg-size: #3a7b59;
  623. --color-bg-trait: #5e0000;
  624. --color-border-trait: #d8c384;
  625. --color-text-trait: white;
  626. /* Rarity */
  627. --color-rarity-common: #323232;
  628. --color-rarity-uncommon: #98513d;
  629. --color-rarity-rare: #002664;
  630. --color-rarity-unique: #54166e;
  631. /** Proficiency ranks */
  632. --color-proficiency-untrained: #424242;
  633. --color-proficiency-trained: #171f69;
  634. --color-proficiency-expert: #3c005e;
  635. --color-proficiency-master: #664400;
  636. --color-proficiency-legendary: #5e0000;
  637. /* Damage colors */
  638. }
  639. :root .damage {
  640. --color-bg-acid: rgba(0, 115, 0, 0.125);
  641. --color-bg-bleed: rgba(153, 0, 26, 0.125);
  642. --color-bg-chaotic: rgba(166, 0, 166, 0.125);
  643. --color-bg-cold: rgba(47, 47, 166, 0.125);
  644. --color-bg-electricity: rgba(184, 134, 11, 0.125);
  645. --color-bg-evil: rgba(75, 0, 130, 0.125);
  646. --color-bg-fire: rgba(166, 47, 0, 0.125);
  647. --color-bg-force: rgba(99, 0, 170, 0.125);
  648. --color-bg-good: rgba(157, 115, 10, 0.125);
  649. --color-bg-lawful: rgba(64, 38, 0, 0.125);
  650. --color-bg-mental: rgba(25, 25, 112, 0.125);
  651. --color-bg-physical: rgba(60, 60, 60, 0.125);
  652. --color-bg-poison: rgba(91, 115, 50, 0.125);
  653. --color-bg-sonic: rgba(0, 139, 139, 0.125);
  654. --color-bg-spirit: rgba(90, 85, 133, 0.125);
  655. --color-bg-vitality: rgba(255, 255, 224, 0.125);
  656. --color-bg-void: rgba(0, 0, 31, 0.125);
  657. --color-border-acid: #007300;
  658. --color-border-bleed: #99001a;
  659. --color-border-chaotic: #a600a6;
  660. --color-border-cold: #2f2fa6;
  661. --color-border-electricity: darkgoldenrod;
  662. --color-border-evil: indigo;
  663. --color-border-fire: #a62f00;
  664. --color-border-force: #6300aa;
  665. --color-border-good: #9d730a;
  666. --color-border-lawful: #402600;
  667. --color-border-mental: midnightblue;
  668. --color-border-physical: #3c3c3c;
  669. --color-border-poison: #5b7332;
  670. --color-border-sonic: darkcyan;
  671. --color-border-spirit: #5a5585;
  672. --color-border-vitality: #ffffe0;
  673. --color-border-void: #00001f;
  674. --color-text-acid: #003300;
  675. --color-text-bleed: #59000f;
  676. --color-text-chaotic: #660066;
  677. --color-text-cold: #212174;
  678. --color-text-electricity: #7c5a07;
  679. --color-text-evil: #260042;
  680. --color-text-fire: #661d00;
  681. --color-text-force: #3e006a;
  682. --color-text-good: #614706;
  683. --color-text-lawful: black;
  684. --color-text-mental: #0d0d3c;
  685. --color-text-physical: #1c1c1c;
  686. --color-text-poison: #38471f;
  687. --color-text-sonic: #004b4b;
  688. --color-text-spirit: #403c5e;
  689. --color-text-vitality: #ffffa0;
  690. --color-text-void: black;
  691. }
  692. :root .damage.color.acid {
  693. background-color: var(--color-bg-acid);
  694. border-color: var(--color-border-acid);
  695. color: var(--color-text-acid);
  696. }
  697. :root .damage.color.acid .icon {
  698. color: var(--color-border-acid);
  699. }
  700. :root .damage.color.bleed {
  701. background-color: var(--color-bg-bleed);
  702. border-color: var(--color-border-bleed);
  703. color: var(--color-text-bleed);
  704. }
  705. :root .damage.color.bleed .icon {
  706. color: var(--color-border-bleed);
  707. }
  708. :root .damage.color.bludgeoning, :root .damage.color.piercing, :root .damage.color.slashing {
  709. background-color: var(--color-bg-physical);
  710. border-color: var(--color-border-physical);
  711. color: var(--color-text-physical);
  712. }
  713. :root .damage.color.bludgeoning .icon, :root .damage.color.piercing .icon, :root .damage.color.slashing .icon {
  714. color: var(--color-border-physical);
  715. }
  716. :root .damage.color.chaotic {
  717. background-color: var(--color-bg-chaotic);
  718. border-color: var(--color-border-chaotic);
  719. color: var(--color-text-chaotic);
  720. }
  721. :root .damage.color.chaotic .icon {
  722. color: var(--color-border-chaotic);
  723. }
  724. :root .damage.color.cold {
  725. background-color: var(--color-bg-cold);
  726. border-color: var(--color-border-cold);
  727. box-shadow: var(--color-border-cold);
  728. color: var(--color-text-cold);
  729. }
  730. :root .damage.color.cold .icon {
  731. color: var(--color-border-cold);
  732. }
  733. :root .damage.color.electricity {
  734. background-color: var(--color-bg-electricity);
  735. border-color: var(--color-border-electricity);
  736. color: var(--color-text-electricity);
  737. }
  738. :root .damage.color.electricity .icon {
  739. color: var(--color-border-electricity);
  740. }
  741. :root .damage.color.evil {
  742. background-color: var(--color-bg-evil);
  743. border-color: var(--color-border-evil);
  744. color: var(--color-text-evil);
  745. }
  746. :root .damage.color.evil .icon {
  747. color: var(--color-border-evil);
  748. }
  749. :root .damage.color.fire {
  750. background-color: var(--color-bg-fire);
  751. border-color: var(--color-border-fire);
  752. box-shadow: var(--color-border-fire);
  753. color: var(--color-text-fire);
  754. }
  755. :root .damage.color.fire .icon {
  756. color: var(--color-border-fire);
  757. }
  758. :root .damage.color.force {
  759. background-color: var(--color-bg-force);
  760. border-color: var(--color-border-force);
  761. color: var(--color-text-force);
  762. }
  763. :root .damage.color.force .icon {
  764. color: var(--color-border-force);
  765. }
  766. :root .damage.color.good {
  767. background-color: var(--color-bg-good);
  768. border-color: var(--color-border-good);
  769. color: var(--color-text-good);
  770. }
  771. :root .damage.color.good .icon {
  772. color: var(--color-border-good);
  773. }
  774. :root .damage.color.lawful {
  775. background-color: var(--color-bg-lawful);
  776. border-color: var(--color-border-lawful);
  777. color: var(--color-text-lawful);
  778. }
  779. :root .damage.color.lawful .icon {
  780. color: var(--color-border-lawful);
  781. }
  782. :root .damage.color.mental {
  783. background-color: var(--color-bg-mental);
  784. border-color: var(--color-border-mental);
  785. color: var(--color-text-mental);
  786. }
  787. :root .damage.color.mental .icon {
  788. color: var(--color-border-mental);
  789. }
  790. :root .damage.color.poison {
  791. background-color: var(--color-bg-poison);
  792. border-color: var(--color-border-poison);
  793. color: var(--color-text-poison);
  794. }
  795. :root .damage.color.poison .icon {
  796. color: var(--color-border-poison);
  797. }
  798. :root .damage.color.sonic {
  799. border-color: var(--color-border-sonic);
  800. background-color: var(--color-bg-sonic);
  801. color: var(--color-text-sonic);
  802. }
  803. :root .damage.color.sonic .icon {
  804. color: var(--color-border-sonic);
  805. }
  806. :root .damage.color.spirit {
  807. border-color: var(--color-border-spirit);
  808. background-color: var(--color-bg-spirit);
  809. color: var(--color-text-spirit);
  810. }
  811. :root .damage.color.spirit .icon {
  812. color: var(--color-border-spirit);
  813. }
  814. :root .damage.color.vitality {
  815. background-color: var(--color-bg-physical);
  816. border-color: var(--color-border-vitality);
  817. color: var(--color-text-vitality);
  818. text-shadow: 1px 1px var(--color-text-dark-1);
  819. }
  820. :root .damage.color.vitality .icon {
  821. color: var(--color-border-vitality);
  822. }
  823. :root .damage.color.void {
  824. background-color: var(--color-bg-void);
  825. border-color: var(--color-border-void);
  826. color: var(--color-border-void);
  827. }
  828. :root .damage.color.void .icon {
  829. color: var(--color-border-void);
  830. }
  831. @keyframes fadein {
  832. from {
  833. opacity: 0;
  834. }
  835. to {
  836. opacity: 1;
  837. }
  838. }
  839. /**
  840. * Legacy is for the old css unrelated
  841. * to the current design (crb-style).
  842. * Only use the legacy folder if you need
  843. * to make changes to the old css.
  844. *
  845. * If you're adding a new feature, put it
  846. * in the appropriate folder in src/styles.
  847. * Just make sure to update the relevant
  848. * _index.scss so that it will get compiled.
  849. *
  850. */
  851. :root {
  852. --primary-background: #454a7c;
  853. --secondary-background: gray;
  854. --tertiary-background: #454a7c;
  855. --alternate-background: darkgray;
  856. }
  857. /* ---------------------------------------- */
  858. /* Actor Sheet */
  859. /* ---------------------------------------- */
  860. .pf2e.actor form {
  861. font-size: var(--font-size-13);
  862. height: 100%;
  863. padding: 0.25rem;
  864. }
  865. .pf2e.actor form .sheet-header {
  866. border-bottom: 1px solid var(--primary-background);
  867. display: flex;
  868. flex-direction: row;
  869. flex-wrap: wrap;
  870. flex: 0 0 100%;
  871. height: 3rem;
  872. justify-content: flex-start;
  873. }
  874. .pf2e.actor form .sheet-header > * {
  875. flex: 1;
  876. }
  877. .pf2e.actor form .sheet-header h1 {
  878. margin: 0;
  879. border: none;
  880. }
  881. .pf2e.actor form .sheet-header h1 > input {
  882. font-family: var(--serif-condensed);
  883. font-weight: 700;
  884. height: 2.5rem;
  885. width: 100%;
  886. margin: 2px;
  887. font-size: var(--font-size-36);
  888. border: none;
  889. }
  890. .pf2e.actor form .sheet-sidebar {
  891. height: calc(100% - 48px);
  892. display: flex;
  893. flex-direction: column;
  894. flex-wrap: nowrap;
  895. overflow: hidden auto;
  896. border-right: 1px solid var(--primary-background);
  897. }
  898. .pf2e.actor form .sheet-sidebar .tab {
  899. height: 100%;
  900. padding-top: 2px;
  901. overflow-y: auto;
  902. }
  903. .pf2e.actor form .sheet-sidebar > * {
  904. flex: 1;
  905. }
  906. .pf2e.actor form .sheet-sidebar .sidebar-summary {
  907. overflow-y: hidden;
  908. }
  909. .pf2e.actor form .sheet-body {
  910. height: calc(100% - 35px);
  911. overflow: hidden;
  912. display: flex;
  913. flex-direction: column;
  914. flex-wrap: nowrap;
  915. }
  916. .pf2e.actor form input[type=text], .pf2e.actor form input[type=number] {
  917. background: rgba(0, 0, 0, 0.025);
  918. border: 1px solid transparent;
  919. color: var(--color-text-dark-input);
  920. height: calc(100% - 2px);
  921. margin: 1px 0;
  922. padding: 0;
  923. width: calc(100% - 2px);
  924. }
  925. .pf2e.actor form input[type=text]:hover:not(:disabled), .pf2e.actor form input[type=text]:focus, .pf2e.actor form input[type=number]:hover:not(:disabled), .pf2e.actor form input[type=number]:focus {
  926. border: 1px solid black;
  927. box-shadow: 0 0 10px #00005a;
  928. }
  929. .pf2e.actor form label {
  930. display: block;
  931. }
  932. .pf2e.actor form .mce-panel span {
  933. display: inherit;
  934. }
  935. .pf2e.actor form.editable .rollable:hover {
  936. color: #000;
  937. text-shadow: 0 0 10px #00005a;
  938. cursor: pointer;
  939. }
  940. .pf2e.actor form .sheet-tabs {
  941. font-weight: 500;
  942. height: 30px;
  943. }
  944. .pf2e.actor form .sheet-tabs > .list-row {
  945. line-height: 2rem;
  946. padding-top: 3px;
  947. font-size: var(--font-size-12);
  948. text-align: center;
  949. }
  950. .pf2e.actor form .sheet-tabs > .list-row:last-of-type {
  951. padding-right: 4px;
  952. }
  953. .pf2e.actor form .sheet-tabs > .list-row.active {
  954. color: var(--text-dark);
  955. font-weight: 700;
  956. }
  957. .pf2e.actor form .tag-legacy {
  958. float: left;
  959. margin: 0 2px 2px 0;
  960. padding: 0 3px;
  961. font-size: var(--font-size-10);
  962. line-height: 1rem;
  963. border: 1px solid var(--color-border-light-2);
  964. border-radius: 3px;
  965. white-space: normal;
  966. font-weight: 500;
  967. }
  968. .pf2e.actor form .traits label {
  969. font-weight: bold;
  970. }
  971. .pf2e.actor form .traits select {
  972. margin: 2px 0;
  973. }
  974. .pf2e.actor form .traits .trait-perception > input {
  975. flex: 0 0 32px;
  976. text-align: center;
  977. }
  978. .pf2e.actor form .traits .tag-selector {
  979. float: right;
  980. margin-right: 3px;
  981. color: #999;
  982. font-size: var(--font-size-10);
  983. line-height: 16px;
  984. }
  985. .pf2e.actor form .inventory-header {
  986. list-style: none;
  987. margin: 0;
  988. padding: 0;
  989. }
  990. .pf2e.actor form .action-header .item-controls {
  991. flex: 0 0 44px;
  992. }
  993. .pf2e.actor form .action-header .item-controls a {
  994. display: block;
  995. float: left;
  996. width: 44px;
  997. font-size: var(--font-size-14);
  998. text-align: center;
  999. }
  1000. .pf2e.actor form .list-row.action-header .item-controls a {
  1001. display: block;
  1002. float: left;
  1003. width: 22px;
  1004. font-size: var(--font-size-10);
  1005. text-align: center;
  1006. color: #666;
  1007. }
  1008. .pf2e.actor form .action-header .item-controls a.item-create, .pf2e.actor form .action-header .item-controls a.item-delete, .pf2e.actor form .action-header .item-controls a.feat-browse, .pf2e.actor form .action-header .item-controls a.action-browse {
  1009. width: 100%;
  1010. color: #fff;
  1011. background: var(--primary-background);
  1012. }
  1013. /* ----------------------------------------- */
  1014. /* Item Buttons */
  1015. /* ----------------------------------------- */
  1016. .pf2e.sheet .item-buttons button {
  1017. font-size: var(--font-size-10);
  1018. line-height: 12px;
  1019. margin: 0;
  1020. }
  1021. .pf2e.sheet .item-buttons > span {
  1022. padding: 0;
  1023. }
  1024. li.list-row.hover-container {
  1025. background-color: #aaa !important;
  1026. }
  1027. .dice-total-shield-btn.shield-activated {
  1028. background-color: #333;
  1029. color: var(--text-light);
  1030. }
  1031. .recall-knowledge-table th {
  1032. padding: 5px 8px;
  1033. }
  1034. .recall-knowledge-table td {
  1035. text-align: center;
  1036. padding: 5px 8px;
  1037. }
  1038. .recall-knowledge-table td:first-child {
  1039. text-align: right;
  1040. }
  1041. .recall-knowledge-table th:first-child {
  1042. text-align: right;
  1043. }
  1044. button:hover::not(:disabled) {
  1045. box-shadow: 0 0 3px #c00;
  1046. }
  1047. button:disabled {
  1048. color: #666;
  1049. }
  1050. button:active {
  1051. box-shadow: 0 0 5px red;
  1052. }
  1053. .app.tag-selector {
  1054. max-height: 700px;
  1055. }
  1056. /* ----------------------------------------- */
  1057. /* Item Card Structure */
  1058. /* ----------------------------------------- */
  1059. .pf2e.chat-card {
  1060. font-style: normal;
  1061. }
  1062. .pf2e.chat-card .card-header {
  1063. padding: 2px 0;
  1064. border-top: 2px groove #fff;
  1065. border-bottom: 2px groove #fff;
  1066. align-items: center;
  1067. min-height: 36px;
  1068. }
  1069. .pf2e.chat-card .card-header img {
  1070. flex: 0 0 36px;
  1071. margin-right: 5px;
  1072. height: 36px;
  1073. width: 36px;
  1074. }
  1075. .pf2e.chat-card .card-header h3 {
  1076. border-bottom: none;
  1077. flex: 1;
  1078. margin: 0;
  1079. }
  1080. .pf2e.chat-card .card-header h4 {
  1081. flex: 0;
  1082. margin: 0 5px 0 0;
  1083. white-space: nowrap;
  1084. }
  1085. .pf2e.chat-card .tags {
  1086. margin: 3px 0 0;
  1087. }
  1088. .pf2e.chat-card .card-content {
  1089. margin: 4px 0;
  1090. }
  1091. .pf2e.chat-card .card-content p {
  1092. margin: 4px 0;
  1093. min-height: unset;
  1094. }
  1095. .pf2e.chat-card .card-buttons {
  1096. display: flex;
  1097. flex-basis: 100%;
  1098. flex-direction: column;
  1099. margin: 4px 0;
  1100. }
  1101. .pf2e.chat-card .card-buttons button {
  1102. margin: 2px 0;
  1103. }
  1104. .pf2e.chat-card .card-buttons button.with-image {
  1105. display: flex;
  1106. align-items: center;
  1107. justify-content: center;
  1108. }
  1109. .pf2e.chat-card .card-buttons button.with-image img {
  1110. border: none;
  1111. height: 2em;
  1112. margin-right: 0.5em;
  1113. }
  1114. .pf2e.chat-card .card-buttons button span {
  1115. border: none;
  1116. }
  1117. .pf2e.chat-card .card-buttons .owner-buttons {
  1118. display: flex;
  1119. flex-basis: 100%;
  1120. flex-direction: column;
  1121. }
  1122. .pf2e.chat-card .card-buttons .spell-attack-buttons,
  1123. .pf2e.chat-card .card-buttons .spell-button {
  1124. display: flex;
  1125. flex-direction: row;
  1126. }
  1127. .pf2e.chat-card .card-buttons .spell-attack-buttons *,
  1128. .pf2e.chat-card .card-buttons .spell-button * {
  1129. flex-grow: 1;
  1130. flex-basis: 0;
  1131. }
  1132. .pf2e.chat-card .card-buttons .spell-attack-buttons :first-child,
  1133. .pf2e.chat-card .card-buttons .spell-button :first-child {
  1134. flex-grow: 2;
  1135. }
  1136. .pf2e.chat-card .card-buttons .spell-button button.small {
  1137. flex-grow: 0;
  1138. }
  1139. .pf2e.chat-card .card-buttons .spell-button button.small > i {
  1140. margin-right: 0;
  1141. }
  1142. .pf2e.chat-card .card-buttons .hidden-to-others {
  1143. background: var(--visibility-gm-bg);
  1144. }
  1145. .pf2e.chat-card .card-footer {
  1146. padding: 3px 0 0;
  1147. border-top: 2px groove #fff;
  1148. }
  1149. .pf2e.chat-card .card-footer span {
  1150. border-right: 2px groove #fff;
  1151. padding: 0 5px 0 0;
  1152. font-size: var(--font-size-12);
  1153. }
  1154. .pf2e.chat-card .card-footer span:last-child {
  1155. border-right: none;
  1156. padding-right: 0;
  1157. }
  1158. .pf2e.chat-card .card-buttons-multiattack {
  1159. display: grid;
  1160. grid-template-columns: auto 40px 40px;
  1161. grid-column-gap: 4px;
  1162. }
  1163. .pf2e.chat-card .card-buttons-two-column {
  1164. display: grid;
  1165. grid-template-columns: 1fr 1fr;
  1166. grid-column-gap: 4px;
  1167. }
  1168. /* This is the core CSS of Tooltipster */
  1169. /* GENERAL STRUCTURE RULES (do not edit this section) */
  1170. .tooltipster-base {
  1171. /* this ensures that a constrained height set by functionPosition,
  1172. if greater that the natural height of the tooltip, will be enforced
  1173. in browsers that support display:flex */
  1174. display: flex;
  1175. pointer-events: none;
  1176. /* this may be overriden in JS for fixed position origins */
  1177. position: absolute;
  1178. }
  1179. .tooltipster-box {
  1180. /* see .tooltipster-base. flex-shrink 1 is only necessary for IE10-
  1181. and flex-basis auto for IE11- (at least) */
  1182. flex: 1 1 auto;
  1183. }
  1184. .tooltipster-content {
  1185. /* prevents an overflow if the user adds padding to the div */
  1186. box-sizing: border-box;
  1187. /* these make sure we'll be able to detect any overflow */
  1188. max-height: 100%;
  1189. max-width: 100%;
  1190. overflow: auto;
  1191. }
  1192. .tooltipster-ruler {
  1193. /* these let us test the size of the tooltip without overflowing the window */
  1194. bottom: 0;
  1195. left: 0;
  1196. overflow: hidden;
  1197. position: fixed;
  1198. right: 0;
  1199. top: 0;
  1200. visibility: hidden;
  1201. }
  1202. /* ANIMATIONS */
  1203. /* Open/close animations */
  1204. /* fade */
  1205. .tooltipster-fade {
  1206. opacity: 0;
  1207. -webkit-transition-property: opacity;
  1208. -moz-transition-property: opacity;
  1209. -o-transition-property: opacity;
  1210. -ms-transition-property: opacity;
  1211. transition-property: opacity;
  1212. }
  1213. .tooltipster-fade.tooltipster-show {
  1214. opacity: 1;
  1215. }
  1216. /* grow */
  1217. .tooltipster-grow {
  1218. -webkit-transform: scale(0, 0);
  1219. -moz-transform: scale(0, 0);
  1220. -o-transform: scale(0, 0);
  1221. -ms-transform: scale(0, 0);
  1222. transform: scale(0, 0);
  1223. -webkit-transition-property: -webkit-transform;
  1224. -moz-transition-property: -moz-transform;
  1225. -o-transition-property: -o-transform;
  1226. -ms-transition-property: -ms-transform;
  1227. transition-property: transform;
  1228. -webkit-backface-visibility: hidden;
  1229. backface-visibility: hidden;
  1230. }
  1231. .tooltipster-grow.tooltipster-show {
  1232. -webkit-transform: scale(1, 1);
  1233. -moz-transform: scale(1, 1);
  1234. -o-transform: scale(1, 1);
  1235. -ms-transform: scale(1, 1);
  1236. transform: scale(1, 1);
  1237. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  1238. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1239. -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1240. -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1241. -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1242. transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1243. }
  1244. /* swing */
  1245. .tooltipster-swing {
  1246. opacity: 0;
  1247. -webkit-transform: rotateZ(4deg);
  1248. -moz-transform: rotateZ(4deg);
  1249. -o-transform: rotateZ(4deg);
  1250. -ms-transform: rotateZ(4deg);
  1251. transform: rotateZ(4deg);
  1252. -webkit-transition-property: -webkit-transform, opacity;
  1253. -moz-transition-property: -moz-transform;
  1254. -o-transition-property: -o-transform;
  1255. -ms-transition-property: -ms-transform;
  1256. transition-property: transform;
  1257. }
  1258. .tooltipster-swing.tooltipster-show {
  1259. opacity: 1;
  1260. -webkit-transform: rotateZ(0deg);
  1261. -moz-transform: rotateZ(0deg);
  1262. -o-transform: rotateZ(0deg);
  1263. -ms-transform: rotateZ(0deg);
  1264. transform: rotateZ(0deg);
  1265. -webkit-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 1);
  1266. -webkit-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1267. -moz-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1268. -ms-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1269. -o-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1270. transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1271. }
  1272. /* fall */
  1273. .tooltipster-fall {
  1274. -webkit-transition-property: top;
  1275. -moz-transition-property: top;
  1276. -o-transition-property: top;
  1277. -ms-transition-property: top;
  1278. transition-property: top;
  1279. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  1280. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1281. -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1282. -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1283. -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1284. transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1285. }
  1286. .tooltipster-fall.tooltipster-initial {
  1287. top: 0 !important;
  1288. }
  1289. .tooltipster-fall.tooltipster-dying {
  1290. -webkit-transition-property: all;
  1291. -moz-transition-property: all;
  1292. -o-transition-property: all;
  1293. -ms-transition-property: all;
  1294. transition-property: all;
  1295. top: 0 !important;
  1296. opacity: 0;
  1297. }
  1298. /* slide */
  1299. .tooltipster-slide {
  1300. -webkit-transition-property: left;
  1301. -moz-transition-property: left;
  1302. -o-transition-property: left;
  1303. -ms-transition-property: left;
  1304. transition-property: left;
  1305. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  1306. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1307. -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1308. -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1309. -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1310. transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1311. }
  1312. .tooltipster-slide.tooltipster-initial {
  1313. left: -40px !important;
  1314. }
  1315. .tooltipster-slide.tooltipster-dying {
  1316. -webkit-transition-property: all;
  1317. -moz-transition-property: all;
  1318. -o-transition-property: all;
  1319. -ms-transition-property: all;
  1320. transition-property: all;
  1321. left: 0 !important;
  1322. opacity: 0;
  1323. }
  1324. /* Update animations */
  1325. /* We use animations rather than transitions here because
  1326. transition durations may be specified in the style tag due to
  1327. animationDuration, and we try to avoid collisions and the use
  1328. of !important */
  1329. /* fade */
  1330. @keyframes tooltipster-fading {
  1331. 0% {
  1332. opacity: 0;
  1333. }
  1334. 100% {
  1335. opacity: 1;
  1336. }
  1337. }
  1338. .tooltipster-update-fade {
  1339. animation: tooltipster-fading 400ms;
  1340. }
  1341. /* rotate */
  1342. @keyframes tooltipster-rotating {
  1343. 25% {
  1344. transform: rotate(-2deg);
  1345. }
  1346. 75% {
  1347. transform: rotate(2deg);
  1348. }
  1349. 100% {
  1350. transform: rotate(0);
  1351. }
  1352. }
  1353. .tooltipster-update-rotate {
  1354. animation: tooltipster-rotating 600ms;
  1355. }
  1356. /* scale */
  1357. @keyframes tooltipster-scaling {
  1358. 50% {
  1359. transform: scale(1.1);
  1360. }
  1361. 100% {
  1362. transform: scale(1);
  1363. }
  1364. }
  1365. .tooltipster-update-scale {
  1366. animation: tooltipster-scaling 600ms;
  1367. }
  1368. /**
  1369. * DEFAULT STYLE OF THE SIDETIP PLUGIN
  1370. *
  1371. * All styles are "namespaced" with .tooltipster-sidetip to prevent
  1372. * conflicts between plugins.
  1373. */
  1374. /* .tooltipster-box */
  1375. .tooltipster-sidetip .tooltipster-box {
  1376. background: #565656;
  1377. border: 2px solid black;
  1378. border-radius: 4px;
  1379. }
  1380. .tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
  1381. margin-top: 8px;
  1382. }
  1383. .tooltipster-sidetip.tooltipster-left .tooltipster-box {
  1384. margin-right: 8px;
  1385. }
  1386. .tooltipster-sidetip.tooltipster-right .tooltipster-box {
  1387. margin-left: 8px;
  1388. }
  1389. .tooltipster-sidetip.tooltipster-top .tooltipster-box {
  1390. margin-bottom: 8px;
  1391. }
  1392. /* .tooltipster-content */
  1393. .tooltipster-sidetip .tooltipster-content {
  1394. color: var(--text-light);
  1395. line-height: 18px;
  1396. padding: 6px 14px;
  1397. }
  1398. /* .tooltipster-arrow : will keep only the zone of .tooltipster-arrow-uncropped that
  1399. corresponds to the arrow we want to display */
  1400. .tooltipster-sidetip .tooltipster-arrow {
  1401. overflow: hidden;
  1402. position: absolute;
  1403. }
  1404. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow {
  1405. height: 10px;
  1406. /* half the width, for centering */
  1407. margin-left: -10px;
  1408. top: 0;
  1409. width: 20px;
  1410. }
  1411. .tooltipster-sidetip.tooltipster-left .tooltipster-arrow {
  1412. height: 20px;
  1413. margin-top: -10px;
  1414. right: 0;
  1415. /* top 0 to keep the arrow from overflowing .tooltipster-base when it has not
  1416. been positioned yet */
  1417. top: 0;
  1418. width: 10px;
  1419. }
  1420. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
  1421. height: 20px;
  1422. margin-top: -10px;
  1423. left: 0;
  1424. /* same as .tooltipster-left .tooltipster-arrow */
  1425. top: 0;
  1426. width: 10px;
  1427. }
  1428. .tooltipster-sidetip.tooltipster-top .tooltipster-arrow {
  1429. bottom: 0;
  1430. height: 10px;
  1431. margin-left: -10px;
  1432. width: 20px;
  1433. }
  1434. /* common rules between .tooltipster-arrow-background and .tooltipster-arrow-border */
  1435. .tooltipster-sidetip .tooltipster-arrow-background,
  1436. .tooltipster-sidetip .tooltipster-arrow-border {
  1437. height: 0;
  1438. position: absolute;
  1439. width: 0;
  1440. }
  1441. /* .tooltipster-arrow-background */
  1442. .tooltipster-sidetip .tooltipster-arrow-background {
  1443. border: 10px solid transparent;
  1444. }
  1445. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background {
  1446. border-bottom-color: #565656;
  1447. left: 0;
  1448. top: 3px;
  1449. }
  1450. .tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background {
  1451. border-left-color: #565656;
  1452. left: -3px;
  1453. top: 0;
  1454. }
  1455. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background {
  1456. border-right-color: #565656;
  1457. left: 3px;
  1458. top: 0;
  1459. }
  1460. .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
  1461. border-top-color: #565656;
  1462. left: 0;
  1463. top: -3px;
  1464. }
  1465. /* .tooltipster-arrow-border */
  1466. .tooltipster-sidetip .tooltipster-arrow-border {
  1467. border: 10px solid transparent;
  1468. left: 0;
  1469. top: 0;
  1470. }
  1471. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border {
  1472. border-bottom-color: black;
  1473. }
  1474. .tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border {
  1475. border-left-color: black;
  1476. }
  1477. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
  1478. border-right-color: black;
  1479. }
  1480. .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
  1481. border-top-color: black;
  1482. }
  1483. /* tooltipster-arrow-uncropped */
  1484. .tooltipster-sidetip .tooltipster-arrow-uncropped {
  1485. position: relative;
  1486. }
  1487. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped {
  1488. top: -10px;
  1489. }
  1490. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped {
  1491. left: -10px;
  1492. }
  1493. @-webkit-keyframes wobble {
  1494. from {
  1495. -webkit-transform: translate3d(0, 0, 0);
  1496. transform: translate3d(0, 0, 0);
  1497. }
  1498. 15% {
  1499. -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  1500. transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  1501. }
  1502. 30% {
  1503. -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  1504. transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  1505. }
  1506. 45% {
  1507. -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  1508. transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  1509. }
  1510. 60% {
  1511. -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  1512. transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  1513. }
  1514. 75% {
  1515. -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  1516. transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  1517. }
  1518. to {
  1519. -webkit-transform: translate3d(0, 0, 0);
  1520. transform: translate3d(0, 0, 0);
  1521. }
  1522. }
  1523. @keyframes wobble {
  1524. from {
  1525. -webkit-transform: translate3d(0, 0, 0);
  1526. transform: translate3d(0, 0, 0);
  1527. }
  1528. 15% {
  1529. -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  1530. transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  1531. }
  1532. 30% {
  1533. -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  1534. transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  1535. }
  1536. 45% {
  1537. -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  1538. transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  1539. }
  1540. 60% {
  1541. -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  1542. transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  1543. }
  1544. 75% {
  1545. -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  1546. transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  1547. }
  1548. to {
  1549. -webkit-transform: translate3d(0, 0, 0);
  1550. transform: translate3d(0, 0, 0);
  1551. }
  1552. }
  1553. @keyframes rotation {
  1554. from {
  1555. -webkit-transform: rotate(0deg);
  1556. }
  1557. to {
  1558. -webkit-transform: rotate(359deg);
  1559. }
  1560. }
  1561. /* ----------------------------------------- */
  1562. /* Animation */
  1563. /* ----------------------------------------- */
  1564. :root {
  1565. --animate-duration: 1s;
  1566. --animate-delay: 1s;
  1567. --animate-repeat: 1;
  1568. }
  1569. /* ----------------------------------------- */
  1570. /* Layout */
  1571. /* ----------------------------------------- */
  1572. /** A vertical rule in a flexbox */
  1573. .vr {
  1574. border: 1px inset;
  1575. margin: 1px;
  1576. }
  1577. /* ----------------------------------------- */
  1578. /* Typography */
  1579. /* ----------------------------------------- */
  1580. .pf2e,
  1581. .app.sheet.actor {
  1582. font-family: var(--sans-serif);
  1583. }
  1584. .pf2e h1,
  1585. .pf2e h2,
  1586. .pf2e h3,
  1587. .pf2e h4,
  1588. .app.sheet.actor h1,
  1589. .app.sheet.actor h2,
  1590. .app.sheet.actor h3,
  1591. .app.sheet.actor h4 {
  1592. font-weight: 600;
  1593. }
  1594. .pf2e.sheet form span.pf2-icon,
  1595. .pf2e.sheet form span[data-pf2-action],
  1596. .pf2e.sheet form span[data-pf2-action] *,
  1597. .pf2e.sheet form span[data-pf2-check],
  1598. .pf2e.sheet form span[data-pf2-check] *,
  1599. .pf2-icon {
  1600. display: inline;
  1601. }
  1602. .pf2e.sheet form span.pf2-icon,
  1603. .pf2-icon {
  1604. font-family: "Pathfinder2eActions", sans-serif;
  1605. }
  1606. section.roll-note,
  1607. p.compact-text {
  1608. display: inline-block;
  1609. font-weight: normal;
  1610. line-height: 1.4em;
  1611. margin: 0.25em 0;
  1612. min-height: 1rem;
  1613. width: 100%;
  1614. }
  1615. .action-glyph {
  1616. align-self: center;
  1617. display: inline;
  1618. font-family: "Pathfinder2eActions", sans-serif;
  1619. letter-spacing: 0;
  1620. margin: 0;
  1621. padding: 0;
  1622. }
  1623. /* ----------------------------------------- */
  1624. /* Styled table */
  1625. /* ----------------------------------------- */
  1626. table.pf2-table {
  1627. border: solid 1px #000000;
  1628. border-collapse: collapse;
  1629. font-size: var(--font-size-13);
  1630. color: #191813;
  1631. user-select: text;
  1632. }
  1633. table.pf2-table thead,
  1634. table.pf2-table tbody,
  1635. table.pf2-table tr,
  1636. table.pf2-table th,
  1637. table.pf2-table td {
  1638. box-sizing: border-box;
  1639. user-select: text;
  1640. }
  1641. table.pf2-table tr:nth-child(odd) {
  1642. background-color: #eee5c8;
  1643. }
  1644. table.pf2-table tr:nth-child(even) {
  1645. background-color: #f6f1e1;
  1646. }
  1647. table.pf2-table th {
  1648. color: var(--text-light);
  1649. font-weight: bold;
  1650. background-color: #522e2c;
  1651. }
  1652. table.pf2-table th,
  1653. table.pf2-table td {
  1654. border: solid 1px #808080;
  1655. padding: 6px 15px;
  1656. text-align: center;
  1657. }
  1658. a.foundry-href {
  1659. color: var(--primary);
  1660. font-weight: 500;
  1661. text-decoration: underline;
  1662. }
  1663. a.content-link {
  1664. line-height: 1.6em;
  1665. }
  1666. a.content-link:has(i.fa-sparkles) {
  1667. font-style: italic;
  1668. }
  1669. #tooltip a.content-link {
  1670. color: var(--color-text-dark-primary);
  1671. }
  1672. .inline-roll.altered {
  1673. color: var(--color-text-dark-improved);
  1674. }
  1675. /* ----------------------------------------- */
  1676. /* PF2E Action Custom Element */
  1677. /* ----------------------------------------- */
  1678. span[data-pf2-action] {
  1679. background: var(--inline-link-bg);
  1680. border-radius: 2px;
  1681. border: 1px solid var(--color-border-dark-tertiary);
  1682. box-sizing: border-box;
  1683. color: var(--color-text-dark-primary);
  1684. line-height: 1.6em;
  1685. padding: 1px 4px;
  1686. white-space: nowrap;
  1687. word-break: break-all;
  1688. cursor: pointer;
  1689. }
  1690. span[data-pf2-action] > i.icon {
  1691. color: var(--color-text-dark-inactive);
  1692. margin-right: 0.25em;
  1693. }
  1694. span[data-pf2-action][data-pf2-glyph]::before {
  1695. font-family: "Pathfinder2eActions";
  1696. margin-right: 2px;
  1697. color: var(--color-text-dark-inactive);
  1698. }
  1699. span[data-pf2-action]:not([data-pf2-glyph])::before, span[data-pf2-action][data-pf2-glyph=""]::before {
  1700. display: inline-block;
  1701. height: 15px;
  1702. width: 15px;
  1703. background-image: url("../icons/actions/Passive.webp");
  1704. background-repeat: no-repeat;
  1705. background-size: 15px 15px;
  1706. opacity: 0.4;
  1707. margin-bottom: -3px;
  1708. margin-right: 2px;
  1709. content: "";
  1710. }
  1711. span[data-pf2-action][data-pf2-glyph=A]::before, span[data-pf2-action][data-pf2-glyph=a]::before, span[data-pf2-action][data-pf2-glyph="1"]::before {
  1712. content: "A";
  1713. }
  1714. span[data-pf2-action][data-pf2-glyph=D]::before, span[data-pf2-action][data-pf2-glyph=d]::before, span[data-pf2-action][data-pf2-glyph="2"]::before {
  1715. content: "D";
  1716. }
  1717. span[data-pf2-action][data-pf2-glyph=T]::before, span[data-pf2-action][data-pf2-glyph=t]::before, span[data-pf2-action][data-pf2-glyph="3"]::before {
  1718. content: "T";
  1719. }
  1720. span[data-pf2-action][data-pf2-glyph=F]::before, span[data-pf2-action][data-pf2-glyph=f]::before {
  1721. content: "F";
  1722. }
  1723. span[data-pf2-action][data-pf2-glyph=R]::before, span[data-pf2-action][data-pf2-glyph=r]::before {
  1724. content: "R";
  1725. }
  1726. /* ----------------------------------------- */
  1727. /* PF2E Check Custom Element */
  1728. /* ----------------------------------------- */
  1729. a.inline-check,
  1730. span[data-pf2-check] {
  1731. background: var(--inline-link-bg);
  1732. border-radius: 2px;
  1733. border: 1px solid var(--color-border-dark-tertiary);
  1734. box-sizing: border-box;
  1735. color: var(--color-text-dark-primary);
  1736. line-height: 1.6em;
  1737. padding: 1px 4px;
  1738. white-space: nowrap;
  1739. word-break: break-all;
  1740. }
  1741. a.inline-check > i.icon,
  1742. span[data-pf2-check] > i.icon {
  1743. color: var(--color-text-dark-inactive);
  1744. margin-right: 0.25em;
  1745. }
  1746. a.inline-check:has([data-pf2-repost]),
  1747. span[data-pf2-check]:has([data-pf2-repost]) {
  1748. padding-right: 0;
  1749. }
  1750. a.inline-check:hover,
  1751. span[data-pf2-check]:hover {
  1752. text-shadow: none;
  1753. }
  1754. a.inline-check:has(.label:hover, i.fa-dice-d20:hover),
  1755. span[data-pf2-check]:has(.label:hover, i.fa-dice-d20:hover) {
  1756. text-shadow: 0 0 8px var(--color-shadow-primary);
  1757. }
  1758. a.inline-check > i.icon:has(+ span.label > :first-child:is([data-visibility=gm])),
  1759. span[data-pf2-check] > i.icon:has(+ span.label > :first-child:is([data-visibility=gm])) {
  1760. margin-right: 0.25em;
  1761. }
  1762. a.inline-check[data-pf2-traits*=secret],
  1763. span[data-pf2-check][data-pf2-traits*=secret] {
  1764. background: var(--blind-roll);
  1765. border-color: #720073;
  1766. }
  1767. a.inline-check[data-invalid],
  1768. span[data-pf2-check][data-invalid] {
  1769. background: rgba(255, 0, 0, 0.05);
  1770. border: 1px dashed red;
  1771. }
  1772. /* ----------------------------------------- */
  1773. /* PF2E Inline Template Custom Element */
  1774. /* ----------------------------------------- */
  1775. span[data-pf2-effect-area] {
  1776. background: var(--inline-link-bg);
  1777. border-radius: 2px;
  1778. border: 1px solid var(--color-border-dark-tertiary);
  1779. box-sizing: border-box;
  1780. color: var(--color-text-dark-primary);
  1781. line-height: 1.6em;
  1782. padding: 1px 4px;
  1783. white-space: nowrap;
  1784. word-break: break-all;
  1785. cursor: pointer;
  1786. padding-right: 0;
  1787. }
  1788. span[data-pf2-effect-area] > i.icon {
  1789. color: var(--color-text-dark-inactive);
  1790. margin-right: 0.25em;
  1791. }
  1792. span[data-pf2-effect-area]::before {
  1793. color: var(--color-text-dark-inactive);
  1794. font-family: "Font Awesome 5 Free";
  1795. font-weight: 900;
  1796. margin-right: 0.25em;
  1797. }
  1798. span[data-pf2-effect-area][data-pf2-effect-area=cone]::before {
  1799. content: "\f104";
  1800. }
  1801. span[data-pf2-effect-area][data-pf2-effect-area=line]::before {
  1802. content: "\f7a5";
  1803. }
  1804. span[data-pf2-effect-area][data-pf2-effect-area=burst]::before {
  1805. content: "\f111";
  1806. }
  1807. span[data-pf2-effect-area][data-pf2-effect-area=emanation]::before {
  1808. content: "\f192";
  1809. }
  1810. span[data-pf2-effect-area][data-pf2-effect-area=rect]::before {
  1811. content: "\f0c8";
  1812. }
  1813. /* ----------------------------------------- */
  1814. /* PF2E Inline Repost Element */
  1815. /* ----------------------------------------- */
  1816. i[data-pf2-repost] {
  1817. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  1818. background: var(--inline-repost-bg);
  1819. color: var(--color-text-dark-inactive);
  1820. border-left: 1px solid var(--color-border-dark-tertiary);
  1821. background: rgba(255, 255, 255, 0.6);
  1822. padding: 2px;
  1823. margin-left: 2px;
  1824. text-shadow: none;
  1825. }
  1826. i[data-pf2-repost]:hover {
  1827. color: var(--text-light);
  1828. text-shadow: 0px 0px 2px var(--text-dark);
  1829. }
  1830. [data-visibility]:not([data-visibility=all]) {
  1831. border-radius: 1px;
  1832. box-sizing: border-box;
  1833. display: inline-block;
  1834. line-height: 1em;
  1835. outline: 1px dotted rgba(75, 74, 68, 0.5);
  1836. padding: 1px;
  1837. /* ----------------------------------------- */
  1838. /* GM Visibility Elements */
  1839. /* ----------------------------------------- */
  1840. }
  1841. [data-visibility]:not([data-visibility=all])[data-visibility=gm] {
  1842. background: var(--visibility-gm-bg);
  1843. }
  1844. [data-visibility]:not([data-visibility=all])[data-visibility=gm].message-sender {
  1845. max-width: fit-content;
  1846. }
  1847. [data-visibility]:not([data-visibility=all])[data-visibility=gm] [data-visibility=gm] {
  1848. outline: none;
  1849. padding: initial;
  1850. }
  1851. /* ----------------------------------------- */
  1852. /* Forms */
  1853. /* ----------------------------------------- */
  1854. .crb-style {
  1855. display: flex;
  1856. }
  1857. .crb-style .details-label {
  1858. color: var(--primary);
  1859. font: 600 var(--font-size-11)/1em var(--sans-serif);
  1860. margin-left: 1px;
  1861. text-transform: uppercase;
  1862. white-space: nowrap;
  1863. }
  1864. .crb-style .details-input {
  1865. color: var(--text-dark);
  1866. font-family: var(--body-serif);
  1867. font-weight: bold;
  1868. width: calc(100% - 6px);
  1869. border-bottom: 1px solid var(--color-border-dark-input);
  1870. background-color: rgba(28, 28, 28, 0.1);
  1871. }
  1872. .crb-style .details-input::placeholder {
  1873. filter: opacity(0.5);
  1874. }
  1875. .crb-style .details-input:focus {
  1876. border-bottom: 1px solid var(--alt);
  1877. }
  1878. .crb-style .details-input[type=number] {
  1879. padding-bottom: 0;
  1880. padding-left: 4px;
  1881. }
  1882. .crb-style input {
  1883. border: none;
  1884. border-radius: 0;
  1885. }
  1886. .crb-style input:focus {
  1887. box-shadow: none;
  1888. }
  1889. .crb-style input:focus::placeholder {
  1890. color: transparent;
  1891. }
  1892. .crb-style input::placeholder {
  1893. color: inherit;
  1894. }
  1895. .crb-style input::-webkit-outer-spin-button, .crb-style input::-webkit-inner-spin-button {
  1896. -webkit-appearance: none;
  1897. margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
  1898. }
  1899. .crb-style input[type=number] {
  1900. -moz-appearance: textfield;
  1901. appearance: textfield;
  1902. }
  1903. .crb-style select {
  1904. -moz-appearance: none;
  1905. -webkit-appearance: none;
  1906. appearance: none;
  1907. background-color: var(--alt);
  1908. background-image: url("../assets/icons/chevron-down.svg");
  1909. background-position: right 0.25em top 50%;
  1910. background-repeat: no-repeat;
  1911. background-size: 1em auto;
  1912. border-radius: 2px;
  1913. border: 1px solid #53422a;
  1914. color: var(--text-light);
  1915. font: 500 var(--font-size-14) var(--serif);
  1916. height: auto;
  1917. line-height: 1;
  1918. padding: 0.25rem 1.1rem 0.25rem 0.25rem;
  1919. position: relative;
  1920. text-overflow: ellipsis;
  1921. }
  1922. .crb-style select:not(:disabled) {
  1923. cursor: pointer;
  1924. }
  1925. .crb-style select option {
  1926. background-color: var(--alt);
  1927. }
  1928. .crb-style .dots span {
  1929. cursor: pointer;
  1930. }
  1931. input[type=range]:disabled::-webkit-slider-runnable-track {
  1932. background: rgba(0, 0, 0, 0.1);
  1933. border: rgba(0, 0, 0, 0.1);
  1934. box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1), 0px 0px 1px rgba(0, 0, 0, 0.1);
  1935. cursor: default;
  1936. }
  1937. input[type=range]:disabled::-moz-range-track {
  1938. background: rgba(0, 0, 0, 0.1);
  1939. border: rgba(0, 0, 0, 0.1);
  1940. box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1), 0px 0px 1px rgba(0, 0, 0, 0.1);
  1941. cursor: default;
  1942. }
  1943. input[type=range]:disabled::-webkit-slider-thumb {
  1944. background: var(--color-text-light-1);
  1945. border: var(--color-text-light-1);
  1946. box-shadow: 1px 1px 1px var(--color-text-light-1), 0px 0px 1px var(--color-text-light-1);
  1947. cursor: default;
  1948. }
  1949. input[type=range]:disabled::-moz-range-thumb {
  1950. background: var(--color-text-light-1);
  1951. border: var(--color-text-light-1);
  1952. box-shadow: 1px 1px 1px var(--color-text-light-1), 0px 0px 1px var(--color-text-light-1);
  1953. cursor: default;
  1954. }
  1955. a[href]:hover {
  1956. text-shadow: 0 0 8px var(--color-text-hyperlink);
  1957. }
  1958. #loading-bar {
  1959. white-space: nowrap;
  1960. }
  1961. #tinymce {
  1962. --space-s: 0.25em;
  1963. --space-m: 0.5em;
  1964. --space-l: 1em;
  1965. --space-xl: 1.5em;
  1966. --space-2xl: 2em;
  1967. --radius: 3px;
  1968. }
  1969. #tinymce p {
  1970. min-height: unset;
  1971. }
  1972. #tinymce :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  1973. margin-top: 1em;
  1974. }
  1975. #tinymce .inline-header {
  1976. display: flex;
  1977. align-items: center;
  1978. gap: var(--space-l);
  1979. background-color: var(--alt);
  1980. font-family: var(--sans-serif);
  1981. color: var(--text-light);
  1982. padding: 0;
  1983. font-size: 0.8em;
  1984. font-weight: 400;
  1985. border: none;
  1986. }
  1987. #tinymce .inline-header strong {
  1988. display: inline-flex;
  1989. padding: 0 var(--space-m);
  1990. background-color: var(--primary);
  1991. min-width: 15ch;
  1992. border-right: 1px solid rgba(0, 0, 0, 0.4);
  1993. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  1994. font-weight: 400;
  1995. }
  1996. #tinymce .inline-header + p {
  1997. margin-top: var(--space-s);
  1998. }
  1999. #tinymce .info {
  2000. background-color: var(--secondary);
  2001. padding: var(--space-m);
  2002. color: var(--text-light);
  2003. margin-left: auto;
  2004. margin-right: auto;
  2005. padding: 0;
  2006. border-radius: var(--radius);
  2007. font-family: var(--sans-serif);
  2008. padding-bottom: var(--space-m);
  2009. }
  2010. #tinymce .info > * + * {
  2011. margin-top: var(--space-m);
  2012. }
  2013. #tinymce .info + * {
  2014. margin-top: var(--space-xl);
  2015. }
  2016. #tinymce .info + #tinymce .info {
  2017. margin-top: var(--space-s);
  2018. }
  2019. #tinymce .info h4 {
  2020. font-size: 0.9em;
  2021. font-weight: 400;
  2022. line-height: 1.2;
  2023. font-family: var(--sans-serif);
  2024. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  2025. padding: var(--space-m) var(--space-l);
  2026. position: relative;
  2027. display: flex;
  2028. align-items: center;
  2029. justify-content: space-between;
  2030. color: var(--text-light);
  2031. }
  2032. #tinymce .info h4::after {
  2033. font-family: "Font Awesome 6";
  2034. content: "\f05a";
  2035. font-weight: 900;
  2036. margin-right: var(--space-s);
  2037. }
  2038. #tinymce .info p {
  2039. font-size: 0.8em;
  2040. margin: 0;
  2041. padding: 0 var(--space-l);
  2042. }
  2043. #tinymce .info p:first-of-type {
  2044. padding-top: var(--space-m);
  2045. border-top: 1px solid rgba(255, 255, 255, 0.1);
  2046. }
  2047. #tinymce .traits {
  2048. display: flex;
  2049. flex-wrap: wrap;
  2050. padding: 0;
  2051. }
  2052. #tinymce .traits p {
  2053. display: inline-flex;
  2054. padding: 0.16rem 0.25rem;
  2055. margin: 0;
  2056. background-color: var(--primary);
  2057. border: 2px solid var(--color-border-trait);
  2058. color: var(--text-light);
  2059. font: 500 var(--font-size-10) var(--sans-serif);
  2060. text-transform: uppercase;
  2061. }
  2062. #tinymce .statblock {
  2063. font-family: var(--sans-serif-condensed);
  2064. color: var(--text-dark);
  2065. line-height: 1.2;
  2066. margin-bottom: var(--space-m);
  2067. }
  2068. #tinymce .statblock > * + * {
  2069. margin-top: var(--space-s);
  2070. margin-bottom: 0;
  2071. }
  2072. #tinymce .statblock p {
  2073. --indent: var(--space-l);
  2074. margin-left: var(--indent);
  2075. position: relative;
  2076. }
  2077. #tinymce .statblock p strong:first-of-type {
  2078. margin-left: calc(var(--indent) * -1);
  2079. }
  2080. #tinymce .statblock p .trait:first-of-type {
  2081. margin-left: calc(var(--indent) * -1 - 2px);
  2082. }
  2083. #tinymce .statblock span.pf2-icon {
  2084. line-height: 1;
  2085. }
  2086. #tinymce .statblock h1,
  2087. #tinymce .statblock h2,
  2088. #tinymce .statblock h3,
  2089. #tinymce .statblock h4 {
  2090. display: flex;
  2091. align-items: baseline;
  2092. justify-content: space-between;
  2093. border-bottom: 1px solid var(--color-border-dark);
  2094. text-transform: uppercase;
  2095. letter-spacing: -0.05em;
  2096. font-family: var(--sans-serif-condensed);
  2097. font-weight: 700;
  2098. }
  2099. #tinymce .statblock hr {
  2100. border: none;
  2101. border-bottom: 1px solid var(--color-border-dark);
  2102. }
  2103. #tinymce .message {
  2104. font-family: var(--journal-cursive);
  2105. font-size: 2em;
  2106. line-height: 1.2;
  2107. }
  2108. #tooltip.pf2e {
  2109. border-style: solid;
  2110. border-image-outset: 0;
  2111. border-width: 9px;
  2112. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  2113. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  2114. background: rgba(0, 0, 0, 0.9);
  2115. font-size: var(--font-size-14);
  2116. padding: 0.25rem 0;
  2117. text-align: left;
  2118. }
  2119. #tooltip.pf2e h1,
  2120. #tooltip.pf2e h2,
  2121. #tooltip.pf2e h3 {
  2122. font-size: var(--font-size-12);
  2123. font-weight: 500;
  2124. text-align: left;
  2125. }
  2126. /* ----------------------------------------- */
  2127. /* Upstream Overrides */
  2128. /* ----------------------------------------- */
  2129. button:disabled {
  2130. cursor: default;
  2131. }
  2132. .crb-style.sheet .window-content {
  2133. background: url("../assets/sheet/background.webp") no-repeat;
  2134. background-size: cover;
  2135. }
  2136. .actors-sidebar .directory-item.actor h4 {
  2137. line-height: normal;
  2138. display: flex;
  2139. flex-direction: column;
  2140. justify-content: center;
  2141. }
  2142. .actors-sidebar .directory-item.actor .actor-level {
  2143. font-size: x-small;
  2144. color: var(--color-text-light-primary);
  2145. }
  2146. .actors-sidebar ol.party-list {
  2147. list-style-type: none;
  2148. margin: 0 0 0.25rem 0;
  2149. padding: 0;
  2150. position: relative;
  2151. }
  2152. .actors-sidebar li.folder-like {
  2153. border-top: none;
  2154. border-bottom: none;
  2155. }
  2156. .actors-sidebar li.folder-like > header {
  2157. border-bottom: 1px solid var(--color-border-dark);
  2158. border-top: 1px solid var(--color-border-dark);
  2159. display: flex;
  2160. line-height: 1.5rem;
  2161. padding: 6px;
  2162. }
  2163. .actors-sidebar li.folder-like > header .icon {
  2164. cursor: pointer;
  2165. font-size: var(--font-size-16);
  2166. }
  2167. .actors-sidebar li.folder-like > header .left-control > i {
  2168. margin: 0 0.5em 0 0.25em;
  2169. text-align: center;
  2170. }
  2171. .actors-sidebar li.folder-like > header h3 {
  2172. display: block;
  2173. flex: 1;
  2174. font-size: var(--font-size-16);
  2175. margin: 0;
  2176. padding-left: 1px;
  2177. }
  2178. .actors-sidebar li.folder-like > header a.create-button {
  2179. flex: 0 0 20px;
  2180. margin-left: 3px;
  2181. position: relative;
  2182. text-align: center;
  2183. }
  2184. .actors-sidebar li.folder-like > header a.create-button:hover i + i {
  2185. color: var(--color-text-hyperlink);
  2186. }
  2187. .actors-sidebar li.folder-like > header a.create-button i + i {
  2188. position: absolute;
  2189. top: -2px;
  2190. right: -2px;
  2191. font-size: 0.5rem;
  2192. background: black;
  2193. color: var(--color-text-light-highlight);
  2194. padding: 1px;
  2195. border-radius: 4px;
  2196. }
  2197. .actors-sidebar li.folder-like.collapsed i.folder {
  2198. margin-right: 2px;
  2199. }
  2200. .actors-sidebar li.folder-like.collapsed .fa-folder-open::before {
  2201. content: "\f07b";
  2202. }
  2203. .actors-sidebar li.folder-like.collapsed .subdirectory {
  2204. display: none;
  2205. }
  2206. .actors-sidebar li.folder-like.droptarget > header h3 {
  2207. text-shadow: 1px 1px 3px var(--color-shadow-dark);
  2208. font-size: 1.2em;
  2209. }
  2210. .actors-sidebar li.folder-like.droptarget > header h3 i {
  2211. text-shadow: 0 0 4px var(--color-shadow-primary);
  2212. transform: scale(1.2);
  2213. }
  2214. .actors-sidebar li.folder-like.other-parties > header {
  2215. background: var(--primary-dark);
  2216. }
  2217. .actors-sidebar li.folder-like.other-parties > header h3 i {
  2218. margin-right: 6px;
  2219. }
  2220. .actors-sidebar li.folder-like.other-parties.collapsed > header h3 i {
  2221. margin-right: 8px;
  2222. }
  2223. .actors-sidebar .subdirectory .folder-like {
  2224. border-left: 1px solid var(--color-border-dark-1);
  2225. }
  2226. .actors-sidebar .subdirectory .folder-like > header {
  2227. background: var(--primary-darker);
  2228. }
  2229. .actors-sidebar .party:not(.activated) .party-header {
  2230. background: var(--primary-darker);
  2231. padding: 2px 6px;
  2232. }
  2233. .actors-sidebar .party:not(.activated) .party-header > *:not(nav) {
  2234. opacity: 0.85;
  2235. }
  2236. .actors-sidebar .party .activate-party:hover i {
  2237. font-weight: 900;
  2238. }
  2239. .actors-sidebar .party.activated .party-header {
  2240. background: var(--primary);
  2241. }
  2242. .actors-sidebar .party .blank {
  2243. line-height: 2.375em;
  2244. padding: 0 0.5rem;
  2245. }
  2246. .directory-item.item img.thumbnail {
  2247. object-fit: contain;
  2248. }
  2249. .directory-item.item h4 {
  2250. line-height: normal;
  2251. display: flex;
  2252. flex-direction: column;
  2253. justify-content: center;
  2254. }
  2255. .directory-item.item .item-level {
  2256. font-size: x-small;
  2257. color: var(--color-text-light-primary);
  2258. }
  2259. .chat-inspect-roll .content {
  2260. display: flex;
  2261. flex-direction: column;
  2262. gap: 1em;
  2263. width: 100%;
  2264. height: 100%;
  2265. flex: 1 1 auto;
  2266. }
  2267. .chat-inspect-roll .summary {
  2268. flex: 0 1 auto;
  2269. }
  2270. .chat-inspect-roll .summary .type {
  2271. display: flex;
  2272. align-items: baseline;
  2273. gap: 2px;
  2274. }
  2275. .chat-inspect-roll .summary .tags.domains {
  2276. justify-items: end;
  2277. margin-top: 4px;
  2278. }
  2279. .chat-inspect-roll .summary .tags.domains .tag {
  2280. font-size: var(--font-size-12);
  2281. font-weight: normal;
  2282. text-transform: none;
  2283. user-select: all;
  2284. }
  2285. .chat-inspect-roll .body {
  2286. display: flex;
  2287. flex-direction: row;
  2288. gap: 1em;
  2289. width: 100%;
  2290. flex: 1;
  2291. }
  2292. .chat-inspect-roll .roll-options,
  2293. .chat-inspect-roll .modifiers {
  2294. display: flex;
  2295. flex: 1;
  2296. flex-direction: column;
  2297. height: 100%;
  2298. overflow: hidden;
  2299. }
  2300. .chat-inspect-roll .roll-options .filter {
  2301. margin-bottom: 2px;
  2302. }
  2303. .chat-inspect-roll .roll-options .roll-option-lists {
  2304. overflow: hidden scroll;
  2305. flex: 1 0 0;
  2306. overflow: auto;
  2307. padding-right: 1px;
  2308. }
  2309. .chat-inspect-roll .roll-options .roll-option-lists ul {
  2310. margin: 0;
  2311. padding: 0;
  2312. list-style-type: none;
  2313. border-radius: 3px;
  2314. white-space: nowrap;
  2315. border: 1px solid var(--color-border-dark-tertiary);
  2316. overflow-x: auto;
  2317. }
  2318. .chat-inspect-roll .roll-options .roll-option-lists li {
  2319. user-select: text;
  2320. line-height: 1.5em;
  2321. padding-left: 5px;
  2322. }
  2323. .chat-inspect-roll .roll-options .roll-option-lists li:nth-child(even) {
  2324. background-color: rgba(0, 0, 0, 0.0666666667);
  2325. }
  2326. .chat-inspect-roll .modifier-list {
  2327. overflow: hidden scroll;
  2328. flex: 1 0 0;
  2329. display: flex;
  2330. flex-direction: column;
  2331. gap: 4px;
  2332. }
  2333. .chat-inspect-roll .modifier-list .modifier {
  2334. border: 1px solid black;
  2335. border-radius: 3px;
  2336. padding: 4px;
  2337. }
  2338. .chat-inspect-roll .modifier-list .modifier.disabled {
  2339. border-style: dashed;
  2340. opacity: 0.6;
  2341. }
  2342. .chat-inspect-roll .modifier-list .modifier h4 {
  2343. font-size: 1.1em;
  2344. }
  2345. .chat-inspect-roll .modifier-list .modifier > div {
  2346. display: flex;
  2347. justify-content: space-between;
  2348. align-items: baseline;
  2349. }
  2350. .chat-message.emote > .message-content {
  2351. font-style: italic;
  2352. }
  2353. .chat-message.emote > .message-content p.action-content {
  2354. display: flex;
  2355. align-items: center;
  2356. font-weight: normal;
  2357. }
  2358. .chat-message.emote > .message-content p.action-content img {
  2359. height: 2.33em;
  2360. width: 2.33em;
  2361. float: left;
  2362. margin-right: 0.5em;
  2363. }
  2364. .chat-message.emote > .message-content hr.action-divider {
  2365. margin: 0;
  2366. }
  2367. .chat-message > .message-header .flavor-text h4.action {
  2368. line-height: 1.5em;
  2369. margin: 0;
  2370. }
  2371. .chat-message > .message-header .flavor-text h4.action > strong {
  2372. font-weight: 600;
  2373. }
  2374. .chat-message > .message-content > .description {
  2375. margin-bottom: 0rem;
  2376. position: relative;
  2377. }
  2378. .chat-message > .message-content > .description a.preview {
  2379. height: 4.5ch;
  2380. display: block;
  2381. -webkit-mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0));
  2382. mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0));
  2383. overflow: hidden;
  2384. position: relative;
  2385. z-index: 2;
  2386. }
  2387. .chat-message > .message-content > .description a.preview:hover {
  2388. text-shadow: none;
  2389. }
  2390. .chat-message > .message-content > .description a.preview:hover + .shadow {
  2391. box-shadow: 0 1px 6px var(--color-shadow-primary);
  2392. clip-path: polygon(0 0, 100% 0, 100% 200%, 0 200%);
  2393. width: 100%;
  2394. }
  2395. .chat-message > .message-content > .description .shadow {
  2396. border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  2397. height: 6px;
  2398. position: relative;
  2399. top: -6px;
  2400. z-index: 1;
  2401. }
  2402. .chat-message > .message-content .message-buttons {
  2403. display: flex;
  2404. margin: 0.35em 0 2px;
  2405. }
  2406. .chat-message > .message-content .message-buttons button {
  2407. align-items: center;
  2408. display: flex;
  2409. justify-content: center;
  2410. position: relative;
  2411. }
  2412. .chat-message > .message-content .message-buttons button .cue {
  2413. position: absolute;
  2414. right: 0.5rem;
  2415. }
  2416. .chat-message > .message-content .message-buttons button .cue i {
  2417. --fa-primary-color: var(--color-border-dark);
  2418. --fa-secondary-color: var(--primary);
  2419. --fa-secondary-opacity: 0.6;
  2420. }
  2421. .chat-message > .message-content .message-buttons:has(.effect-applied) {
  2422. align-items: center;
  2423. color: var(--color-text-dark-secondary);
  2424. font-style: italic;
  2425. height: 2.1rem;
  2426. justify-content: center;
  2427. padding-bottom: 0.1rem;
  2428. }
  2429. .chat-message > .message-header .flavor-text .target-dc-result {
  2430. line-height: 0.75rem;
  2431. margin-bottom: 4px;
  2432. }
  2433. .chat-message > .message-header .flavor-text .target-dc-result .target-dc,
  2434. .chat-message > .message-header .flavor-text .target-dc-result .result {
  2435. display: block;
  2436. margin: 1px 0;
  2437. width: fit-content;
  2438. }
  2439. .chat-message > .message-header .flavor-text .target-dc-result .unadjusted {
  2440. text-decoration: line-through;
  2441. }
  2442. .chat-message > .message-header .flavor-text .target-dc-result .adjusted {
  2443. text-decoration: underline dotted;
  2444. }
  2445. .chat-message > .message-header .flavor-text .target-dc-result .adjusted.increased {
  2446. color: rgb(0, 128, 0);
  2447. }
  2448. .chat-message > .message-header .flavor-text .target-dc-result .adjusted.decreased {
  2449. color: rgb(255, 0, 0);
  2450. }
  2451. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .criticalSuccess {
  2452. color: rgb(0, 128, 0);
  2453. }
  2454. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .success {
  2455. color: rgb(0, 0, 255);
  2456. }
  2457. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .failure {
  2458. color: rgb(255, 69, 0);
  2459. }
  2460. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .criticalFailure {
  2461. color: rgb(255, 0, 0);
  2462. }
  2463. .chat-message > .message-header .flavor-text .effect {
  2464. display: flex;
  2465. align-items: center;
  2466. column-gap: 5px;
  2467. }
  2468. .chat-message > .message-header .flavor-text .effect img {
  2469. height: 32px;
  2470. width: 32px;
  2471. }
  2472. .chat-message .message-content .damage-roll:not(:first-child) {
  2473. margin-top: 1em;
  2474. }
  2475. .chat-message .message-content .damage-roll .dice-result .dice-formula {
  2476. align-items: center;
  2477. display: flex;
  2478. flex-wrap: wrap;
  2479. gap: 0.25em;
  2480. justify-content: center;
  2481. }
  2482. .chat-message .message-content .damage-roll .dice-result .dice-formula .instance {
  2483. padding: 0 0.25em;
  2484. }
  2485. .chat-message .message-content .damage-roll .dice-result .dice-total {
  2486. flex-direction: column;
  2487. font-weight: normal;
  2488. }
  2489. .chat-message .message-content .damage-roll .dice-result .dice-total .total {
  2490. font-weight: 700;
  2491. padding: 0 2ch;
  2492. }
  2493. .chat-message .message-content .damage-roll .dice-result .dice-total .total .increased-from {
  2494. color: var(--color-text-dark-2);
  2495. font-size: var(--font-size-16);
  2496. font-weight: normal;
  2497. vertical-align: 15%;
  2498. }
  2499. .chat-message .message-content .damage-roll .dice-result .dice-total .instances {
  2500. align-items: center;
  2501. display: flex;
  2502. flex-wrap: wrap;
  2503. font-size: var(--font-size-12);
  2504. justify-content: center;
  2505. line-height: var(--font-size-12);
  2506. margin-bottom: 0.2em;
  2507. vertical-align: top;
  2508. }
  2509. .chat-message .message-content .damage-roll .dice-result .dice-total .instances .instance {
  2510. padding: 0.15em 0.25em;
  2511. }
  2512. .chat-message .message-content .damage-roll .dice-result .dice-tooltip {
  2513. display: flex;
  2514. flex-direction: column;
  2515. gap: 0.25em;
  2516. margin-bottom: 0.25em;
  2517. }
  2518. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance {
  2519. border-radius: 2px;
  2520. border-style: solid;
  2521. border-width: 1px;
  2522. }
  2523. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance > header {
  2524. align-items: center;
  2525. display: flex;
  2526. justify-content: space-between;
  2527. margin-bottom: 0.1em;
  2528. }
  2529. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance .dice .part-formula,
  2530. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance .dice .part-total {
  2531. color: var(--color-text-dark-secondary);
  2532. }
  2533. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance > header,
  2534. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance .dice {
  2535. padding: 0.2em;
  2536. }
  2537. .chat-message .message-content .damage-roll .dice-result .instance {
  2538. white-space: nowrap;
  2539. }
  2540. .chat-message .message-content .damage-roll .dice-result .instance.tooltip-part > header {
  2541. background: var(--color-bg-bludgeoning);
  2542. }
  2543. .chat-message .message-content .damage-roll .dice-result .instance.tooltip-part > .dice {
  2544. text-shadow: none;
  2545. }
  2546. .chat-message .message-content .damage-roll .dice-result .instance .precision,
  2547. .chat-message .message-content .damage-roll .dice-result .instance .splash {
  2548. border-color: inherit;
  2549. border-width: 1px;
  2550. border-style: dotted;
  2551. padding: 1px 2px;
  2552. line-height: 0;
  2553. }
  2554. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type {
  2555. margin-bottom: 3px;
  2556. }
  2557. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type h3 {
  2558. text-transform: capitalize;
  2559. padding-left: 3px;
  2560. padding-right: 1px;
  2561. }
  2562. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type i.fa {
  2563. flex: none;
  2564. margin: 2px;
  2565. }
  2566. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type .dice {
  2567. margin-left: 2px;
  2568. margin-right: 2px;
  2569. }
  2570. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .dice .part-header .part-flavor {
  2571. text-transform: capitalize;
  2572. }
  2573. .chat-message .message-content .damage-application {
  2574. display: flex;
  2575. justify-content: center;
  2576. margin-top: 3px;
  2577. order: 3;
  2578. }
  2579. .chat-message .message-content .damage-application button {
  2580. align-items: center;
  2581. display: flex;
  2582. flex-direction: column;
  2583. font-size: var(--font-size-18);
  2584. height: 2em;
  2585. justify-content: space-around;
  2586. line-height: unset;
  2587. padding: 0;
  2588. }
  2589. .chat-message .message-content .damage-application button.half-damage {
  2590. position: relative;
  2591. }
  2592. .chat-message .message-content .damage-application button.half-damage .transparent-half {
  2593. background: rgb(248, 247, 233);
  2594. display: block;
  2595. height: 24px;
  2596. left: 49%;
  2597. opacity: 0.6;
  2598. position: absolute;
  2599. top: 0px;
  2600. width: 10px;
  2601. }
  2602. .chat-message .message-content .damage-application button > img {
  2603. border: none;
  2604. height: var(--font-size-18);
  2605. }
  2606. .chat-message .message-content .damage-application button.heal-damage .fa-stack {
  2607. font-size: 0.5em;
  2608. }
  2609. .chat-message .message-content .damage-application button.heal-damage .fa-stack i.fa-plus {
  2610. font-size: var(--font-size-10);
  2611. }
  2612. .chat-message .message-content .damage-application button .label {
  2613. font-size: var(--font-size-9);
  2614. font-weight: 500;
  2615. text-transform: uppercase;
  2616. }
  2617. .chat-message .message-content .damage-taken section.roll-note {
  2618. font-size: var(--font-size-12);
  2619. }
  2620. .chat-message .message-content .damage-taken .persistent {
  2621. font-style: normal;
  2622. margin-top: 1em;
  2623. }
  2624. .chat-message .message-content .damage-taken .persistent h4 {
  2625. border-bottom: 1px solid var(--color-underline-header);
  2626. max-width: fit-content;
  2627. }
  2628. .chat-message .message-content .damage-taken button.revert-damage {
  2629. align-items: center;
  2630. background: var(--bg-dark);
  2631. display: inline-flex;
  2632. justify-content: center;
  2633. width: 3ch;
  2634. margin-left: 2px;
  2635. }
  2636. .chat-message .message-content .damage-taken button.revert-damage > i {
  2637. margin: 0;
  2638. }
  2639. .chat-message .message-content .damage-taken .reverted {
  2640. text-decoration: line-through;
  2641. }
  2642. .chat-message .flavor-text .pf2e-reroll-indicator {
  2643. float: right;
  2644. }
  2645. .chat-message .message-content .pf2e-reroll-discard .dice-total,
  2646. .chat-message .message-content .pf2e-reroll-discard .dice-tooltip {
  2647. opacity: 0.3;
  2648. }
  2649. .chat-message .message-content .pf2e-reroll-second .dice-formula {
  2650. display: none;
  2651. }
  2652. .chat-message .message-header .flavor-text {
  2653. display: block;
  2654. }
  2655. .chat-message .message-header .flavor-text ul.notes {
  2656. display: block;
  2657. line-height: 1.5em;
  2658. list-style: none;
  2659. margin: 0;
  2660. padding: 0;
  2661. }
  2662. .chat-message .message-header .flavor-text ul.notes li {
  2663. display: block;
  2664. line-height: 1.5em;
  2665. }
  2666. .chat-message > .message-content ul.participant-conditions {
  2667. background: rgba(0, 0, 0, 0.1);
  2668. border-radius: 3px;
  2669. border: 1px solid var(--color-border-light-2);
  2670. box-shadow: 0 0 2px white inset;
  2671. display: flex;
  2672. flex-direction: column;
  2673. gap: 3px;
  2674. list-style: none;
  2675. padding: 0.5em;
  2676. }
  2677. .chat-message > .message-content ul.participant-conditions li {
  2678. align-items: center;
  2679. cursor: help;
  2680. display: flex;
  2681. gap: 0.5rem;
  2682. }
  2683. .chat-message > .message-content ul.participant-conditions li img {
  2684. width: 2rem;
  2685. }
  2686. section.compendium-sidebar .directory-item.compendium.locked > .compendium-banner {
  2687. opacity: 0.5;
  2688. }
  2689. section.compendium-sidebar .directory-item.compendium.locked:hover > .compendium-banner {
  2690. opacity: 1;
  2691. }
  2692. section.compendium-sidebar ol.directory-list ol.document-matches {
  2693. background: rgba(0, 0, 0, 0.25);
  2694. margin-top: 1px;
  2695. padding: 0;
  2696. }
  2697. section.compendium-sidebar ol.directory-list ol.document-matches li.match {
  2698. align-items: center;
  2699. column-gap: 2px;
  2700. cursor: pointer;
  2701. display: grid;
  2702. font-size: var(--font-size-12);
  2703. grid-template-areas: "thumbnail name" "thumbnail details";
  2704. grid-template-columns: 38px 1fr;
  2705. grid-template-rows: 1fr 1fr;
  2706. list-style: none;
  2707. padding: 2px 0 2px 4px;
  2708. }
  2709. section.compendium-sidebar ol.directory-list ol.document-matches li.match:hover {
  2710. background: rgba(255, 255, 255, 0.1);
  2711. }
  2712. section.compendium-sidebar ol.directory-list ol.document-matches li.match > * {
  2713. align-items: inherit;
  2714. display: flex;
  2715. height: 100%;
  2716. }
  2717. section.compendium-sidebar ol.directory-list ol.document-matches li.match .thumbnail {
  2718. grid-area: thumbnail;
  2719. justify-content: start;
  2720. }
  2721. section.compendium-sidebar ol.directory-list ol.document-matches li.match .thumbnail img {
  2722. border: none;
  2723. height: 36px;
  2724. object-fit: contain;
  2725. object-position: 50% 0;
  2726. padding: 2px 0;
  2727. width: 36px;
  2728. }
  2729. section.compendium-sidebar ol.directory-list ol.document-matches li.match .name {
  2730. grid-area: name;
  2731. }
  2732. section.compendium-sidebar ol.directory-list ol.document-matches li.match .details {
  2733. color: var(--color-text-light-primary);
  2734. grid-area: details;
  2735. }
  2736. #pack-search-drag-preview {
  2737. background: url(../../../ui/parchment.jpg) repeat;
  2738. border-bottom: 1px solid var(--color-border-light-1);
  2739. border-top: 1px solid transparent;
  2740. box-shadow: none;
  2741. display: flex;
  2742. height: 50px;
  2743. line-height: 48px;
  2744. position: absolute;
  2745. text-shadow: 0 0 0.5rem var(--color-shadow-primary);
  2746. top: -1000px;
  2747. width: 328px;
  2748. }
  2749. #pack-search-drag-preview img {
  2750. border: none;
  2751. height: 48px;
  2752. }
  2753. #pack-search-drag-preview h4 {
  2754. color: var(--color-text-dark-primary);
  2755. font-size: var(--font-size-14);
  2756. }
  2757. #combat nav.encounters,
  2758. #combat-popout nav.encounters {
  2759. line-height: 1.5rem;
  2760. padding-top: 0.25rem;
  2761. }
  2762. #combat .threat-award,
  2763. #combat-popout .threat-award {
  2764. color: var(--text-light);
  2765. display: flex;
  2766. font-size: var(--font-size-14);
  2767. gap: 1rem;
  2768. justify-content: center;
  2769. line-height: 1.5rem;
  2770. text-shadow: 1px 1px 4px var(--color-shadow-dark);
  2771. white-space: nowrap;
  2772. }
  2773. #combat .threat-award > *,
  2774. #combat-popout .threat-award > * {
  2775. width: 6rem;
  2776. }
  2777. #combat .threat-award .threat .value.trivial,
  2778. #combat-popout .threat-award .threat .value.trivial {
  2779. color: aqua;
  2780. }
  2781. #combat .threat-award .threat .value.low,
  2782. #combat-popout .threat-award .threat .value.low {
  2783. color: lime;
  2784. }
  2785. #combat .threat-award .threat .value.moderate,
  2786. #combat-popout .threat-award .threat .value.moderate {
  2787. color: yellow;
  2788. }
  2789. #combat .threat-award .threat .value.severe,
  2790. #combat-popout .threat-award .threat .value.severe {
  2791. color: orange;
  2792. }
  2793. #combat .threat-award .threat .value.extreme,
  2794. #combat-popout .threat-award .threat .value.extreme {
  2795. color: red;
  2796. }
  2797. #combat .encounter-controls,
  2798. #combat-popout .encounter-controls {
  2799. padding: 0.25rem 0 0.5rem;
  2800. }
  2801. #combat li.combatant,
  2802. #combat-popout li.combatant {
  2803. cursor: default;
  2804. padding: 3px 0 3px 3px;
  2805. }
  2806. #combat li.combatant.gm-draggable,
  2807. #combat-popout li.combatant.gm-draggable {
  2808. cursor: grab;
  2809. }
  2810. #combat li.combatant.drag-preview,
  2811. #combat-popout li.combatant.drag-preview {
  2812. background: rgba(0, 0, 0, 0.75);
  2813. box-shadow: 0 0 6px inset var(--color-shadow-highlight);
  2814. }
  2815. #combat li.combatant.drag-gap,
  2816. #combat-popout li.combatant.drag-gap {
  2817. visibility: hidden;
  2818. }
  2819. #combat li.combatant .hidden-name .token-name h4,
  2820. #combat-popout li.combatant .hidden-name .token-name h4 {
  2821. color: var(--color-text-light-7);
  2822. }
  2823. #combat li.combatant .token-name h4,
  2824. #combat-popout li.combatant .token-name h4 {
  2825. flex-direction: row;
  2826. }
  2827. #combat li.combatant .token-name h4 .users-targeting,
  2828. #combat-popout li.combatant .token-name h4 .users-targeting {
  2829. display: inline-block;
  2830. font-size: x-small;
  2831. line-height: inherit;
  2832. padding: 0 0.3em;
  2833. text-shadow: none;
  2834. vertical-align: bottom;
  2835. }
  2836. #combat a.combat-control.center,
  2837. #combat-popout a.combat-control.center {
  2838. white-space: nowrap;
  2839. }
  2840. .sidebar-tab ol.subdirectory {
  2841. border-left-width: 6px;
  2842. }
  2843. .hover {
  2844. cursor: pointer;
  2845. }
  2846. .hover-content {
  2847. display: none;
  2848. }
  2849. .crb-hover .tooltipster-box {
  2850. border-style: solid;
  2851. border-image-outset: 0;
  2852. border-width: 9px;
  2853. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  2854. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  2855. background-color: rgba(0, 0, 0, 0.9);
  2856. overflow: visible;
  2857. }
  2858. .crb-hover .tooltipster-box .tooltipster-content {
  2859. margin: 0;
  2860. padding: 0;
  2861. }
  2862. .crb-hover .tooltipster-box .tooltipster-content .item-summary {
  2863. --space-s: 0.25em;
  2864. --space-m: 0.5em;
  2865. --space-l: 1em;
  2866. --space-xl: 1.5em;
  2867. --space-2xl: 2em;
  2868. --radius: 3px;
  2869. }
  2870. .crb-hover .tooltipster-box .tooltipster-content .item-summary p {
  2871. min-height: unset;
  2872. }
  2873. .crb-hover .tooltipster-box .tooltipster-content .item-summary :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  2874. margin-top: 1em;
  2875. }
  2876. .crb-hover .tooltipster-box .tooltipster-content .item-summary .inline-header {
  2877. display: flex;
  2878. align-items: center;
  2879. gap: var(--space-l);
  2880. background-color: var(--alt);
  2881. font-family: var(--sans-serif);
  2882. color: var(--text-light);
  2883. padding: 0;
  2884. font-size: 0.8em;
  2885. font-weight: 400;
  2886. border: none;
  2887. }
  2888. .crb-hover .tooltipster-box .tooltipster-content .item-summary .inline-header strong {
  2889. display: inline-flex;
  2890. padding: 0 var(--space-m);
  2891. background-color: var(--primary);
  2892. min-width: 15ch;
  2893. border-right: 1px solid rgba(0, 0, 0, 0.4);
  2894. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  2895. font-weight: 400;
  2896. }
  2897. .crb-hover .tooltipster-box .tooltipster-content .item-summary .inline-header + p {
  2898. margin-top: var(--space-s);
  2899. }
  2900. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info {
  2901. background-color: var(--secondary);
  2902. padding: var(--space-m);
  2903. color: var(--text-light);
  2904. margin-left: auto;
  2905. margin-right: auto;
  2906. padding: 0;
  2907. border-radius: var(--radius);
  2908. font-family: var(--sans-serif);
  2909. padding-bottom: var(--space-m);
  2910. }
  2911. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info > * + * {
  2912. margin-top: var(--space-m);
  2913. }
  2914. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info + * {
  2915. margin-top: var(--space-xl);
  2916. }
  2917. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info + .crb-hover .tooltipster-box .tooltipster-content .item-summary .info {
  2918. margin-top: var(--space-s);
  2919. }
  2920. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info h4 {
  2921. font-size: 0.9em;
  2922. font-weight: 400;
  2923. line-height: 1.2;
  2924. font-family: var(--sans-serif);
  2925. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  2926. padding: var(--space-m) var(--space-l);
  2927. position: relative;
  2928. display: flex;
  2929. align-items: center;
  2930. justify-content: space-between;
  2931. color: var(--text-light);
  2932. }
  2933. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info h4::after {
  2934. font-family: "Font Awesome 6";
  2935. content: "\f05a";
  2936. font-weight: 900;
  2937. margin-right: var(--space-s);
  2938. }
  2939. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info p {
  2940. font-size: 0.8em;
  2941. margin: 0;
  2942. padding: 0 var(--space-l);
  2943. }
  2944. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info p:first-of-type {
  2945. padding-top: var(--space-m);
  2946. border-top: 1px solid rgba(255, 255, 255, 0.1);
  2947. }
  2948. .crb-hover .tooltipster-box .tooltipster-content .item-summary .traits {
  2949. display: flex;
  2950. flex-wrap: wrap;
  2951. padding: 0;
  2952. }
  2953. .crb-hover .tooltipster-box .tooltipster-content .item-summary .traits p {
  2954. display: inline-flex;
  2955. padding: 0.16rem 0.25rem;
  2956. margin: 0;
  2957. background-color: var(--primary);
  2958. border: 2px solid var(--color-border-trait);
  2959. color: var(--text-light);
  2960. font: 500 var(--font-size-10) var(--sans-serif);
  2961. text-transform: uppercase;
  2962. }
  2963. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock {
  2964. font-family: var(--sans-serif-condensed);
  2965. color: var(--text-dark);
  2966. line-height: 1.2;
  2967. margin-bottom: var(--space-m);
  2968. }
  2969. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock > * + * {
  2970. margin-top: var(--space-s);
  2971. margin-bottom: 0;
  2972. }
  2973. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock p {
  2974. --indent: var(--space-l);
  2975. margin-left: var(--indent);
  2976. position: relative;
  2977. }
  2978. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock p strong:first-of-type {
  2979. margin-left: calc(var(--indent) * -1);
  2980. }
  2981. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock p .trait:first-of-type {
  2982. margin-left: calc(var(--indent) * -1 - 2px);
  2983. }
  2984. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock span.pf2-icon {
  2985. line-height: 1;
  2986. }
  2987. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock h1,
  2988. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock h2,
  2989. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock h3,
  2990. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock h4 {
  2991. display: flex;
  2992. align-items: baseline;
  2993. justify-content: space-between;
  2994. border-bottom: 1px solid var(--color-border-dark);
  2995. text-transform: uppercase;
  2996. letter-spacing: -0.05em;
  2997. font-family: var(--sans-serif-condensed);
  2998. font-weight: 700;
  2999. }
  3000. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock hr {
  3001. border: none;
  3002. border-bottom: 1px solid var(--color-border-dark);
  3003. }
  3004. .crb-hover .tooltipster-box .tooltipster-content .item-summary .message {
  3005. font-family: var(--journal-cursive);
  3006. font-size: 2em;
  3007. line-height: 1.2;
  3008. }
  3009. .crb-hover .tooltipster-box .tooltipster-content .item-summary a,
  3010. .crb-hover .tooltipster-box .tooltipster-content .item-summary span[data-pf2-effect-area] {
  3011. color: var(--color-text-dark-primary);
  3012. }
  3013. .crb-hover .tooltipster-box .tooltipster-content .hover-content {
  3014. display: flex;
  3015. min-width: 120px;
  3016. max-width: fit-content;
  3017. padding: 4px;
  3018. line-height: 1;
  3019. flex-direction: column;
  3020. }
  3021. .crb-hover .tooltipster-box .tooltipster-content .hover-content p {
  3022. font-size: var(--font-size-14);
  3023. font-family: var(--body-serif);
  3024. font-weight: 400;
  3025. }
  3026. .crb-hover .tooltipster-box .tooltipster-content .hover-content h1,
  3027. .crb-hover .tooltipster-box .tooltipster-content .hover-content h2,
  3028. .crb-hover .tooltipster-box .tooltipster-content .hover-content h3 {
  3029. font-size: var(--font-size-12);
  3030. font-weight: 500;
  3031. text-align: left;
  3032. }
  3033. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title {
  3034. align-items: baseline;
  3035. border-bottom: 1px solid var(--sidebar-title);
  3036. display: flex;
  3037. flex: 1 auto;
  3038. justify-content: space-between;
  3039. margin: 0.25em 0 0.5em;
  3040. }
  3041. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title h2,
  3042. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title a {
  3043. font-family: var(--sans-serif);
  3044. font-size: var(--font-size-10);
  3045. text-transform: uppercase;
  3046. letter-spacing: 0.05em;
  3047. text-rendering: optimizeLegibility;
  3048. border: none;
  3049. color: var(--sidebar-title);
  3050. line-height: 1.5;
  3051. margin: 0;
  3052. }
  3053. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title h2 + h2,
  3054. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title a + h2 {
  3055. font-size: var(--font-size-11);
  3056. }
  3057. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title a {
  3058. color: var(--text-light);
  3059. text-decoration: none;
  3060. }
  3061. .crb-hover .tooltipster-box .tooltipster-content .hover-content.select-shield {
  3062. width: 160px;
  3063. }
  3064. .crb-hover .tooltipster-box .tooltipster-content .hover-content.select-shield ul li.item .data {
  3065. position: relative;
  3066. top: -2px;
  3067. }
  3068. .crb-hover .tooltipster-box .tooltipster-content .hover-content.select-shield ul li.item .tag-legacy {
  3069. width: auto;
  3070. }
  3071. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option {
  3072. color: rgba(255, 255, 255, 0.5);
  3073. }
  3074. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option i {
  3075. margin: 1px 4px 1px 0;
  3076. }
  3077. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option.selected {
  3078. color: var(--text-light);
  3079. }
  3080. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option.selected:hover {
  3081. cursor: default;
  3082. text-shadow: none;
  3083. }
  3084. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul {
  3085. list-style: none;
  3086. margin: 0;
  3087. padding: 0;
  3088. flex: 1 auto;
  3089. }
  3090. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input {
  3091. color: var(--text-light);
  3092. border: none;
  3093. border-radius: 0;
  3094. background: transparent;
  3095. font-family: var(--body-serif);
  3096. width: 100%;
  3097. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  3098. }
  3099. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input:focus {
  3100. box-shadow: none;
  3101. border-bottom: 1px solid white;
  3102. }
  3103. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input:focus::placeholder {
  3104. color: transparent;
  3105. }
  3106. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input::placeholder {
  3107. color: rgba(255, 255, 255, 0.8);
  3108. }
  3109. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input::-webkit-outer-spin-button, .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input::-webkit-inner-spin-button {
  3110. -webkit-appearance: none;
  3111. appearance: none;
  3112. margin: 0;
  3113. }
  3114. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input[type=number] {
  3115. appearance: textfield;
  3116. -moz-appearance: textfield;
  3117. }
  3118. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul select {
  3119. border-radius: 2px;
  3120. height: 18px;
  3121. border: 1px solid white;
  3122. background: transparent;
  3123. cursor: pointer;
  3124. }
  3125. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul select option {
  3126. font-size: 0.8rem;
  3127. min-height: 1rem;
  3128. color: var(--text-dark);
  3129. text-transform: capitalize;
  3130. }
  3131. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul label {
  3132. display: flex;
  3133. align-items: center;
  3134. text-align: left;
  3135. font-family: var(--serif);
  3136. font-weight: 500;
  3137. }
  3138. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .label,
  3139. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .data {
  3140. font-size: var(--font-size-12);
  3141. font-family: var(--serif);
  3142. font-weight: 400;
  3143. color: var(--text-light);
  3144. margin: 0;
  3145. padding: 0;
  3146. }
  3147. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item {
  3148. display: grid;
  3149. grid: "data label close" min-content "data type close" min-content/30px 1fr;
  3150. margin: 8px 0;
  3151. align-items: center;
  3152. column-gap: 8px;
  3153. justify-items: start;
  3154. }
  3155. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item:first-child {
  3156. border: none;
  3157. }
  3158. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.no-effect {
  3159. filter: opacity(0.5);
  3160. position: relative;
  3161. }
  3162. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .tag-legacy {
  3163. font-family: var(--sans-serif);
  3164. font-size: var(--font-size-10);
  3165. text-transform: uppercase;
  3166. letter-spacing: 0.05em;
  3167. text-rendering: optimizeLegibility;
  3168. display: flex;
  3169. justify-content: center;
  3170. align-items: center;
  3171. color: var(--tertiary);
  3172. grid-area: type;
  3173. letter-spacing: 0.5px;
  3174. white-space: nowrap;
  3175. width: min-content;
  3176. }
  3177. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .tag-legacy .remove-modifier {
  3178. white-space: nowrap;
  3179. }
  3180. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .label {
  3181. grid-area: label;
  3182. }
  3183. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .data {
  3184. grid-area: data;
  3185. text-align: right;
  3186. font-size: var(--font-size-21);
  3187. justify-self: right;
  3188. width: min-content;
  3189. padding-top: 2px;
  3190. }
  3191. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .label,
  3192. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .data,
  3193. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .data::placeholder {
  3194. color: rgba(255, 255, 255, 0.5);
  3195. }
  3196. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .label {
  3197. text-decoration: line-through;
  3198. }
  3199. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .remove-modifier {
  3200. grid-area: close;
  3201. font-size: 0.8rem;
  3202. cursor: pointer;
  3203. }
  3204. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier {
  3205. border-top: 1px solid var(--sidebar-title);
  3206. padding-top: 5px;
  3207. grid: "value name name" 1fr "type type btn" 1fr/42px 1fr 1fr;
  3208. font-size: 0.8rem;
  3209. gap: 0.25rem 0.5rem;
  3210. align-items: baseline;
  3211. }
  3212. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value {
  3213. grid-area: value;
  3214. font-size: 1rem;
  3215. text-align: right;
  3216. display: grid;
  3217. grid: "input plus" 1fr "input minus" 1fr/1fr 10px;
  3218. column-gap: 4px;
  3219. align-items: center;
  3220. }
  3221. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value input {
  3222. grid-area: input;
  3223. }
  3224. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value .fa-solid {
  3225. margin-top: 2px;
  3226. font-size: var(--font-size-9);
  3227. cursor: pointer;
  3228. }
  3229. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value .fa-solid.fa-plus-circle {
  3230. grid-area: plus;
  3231. }
  3232. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value .fa-solid.fa-minus-circle {
  3233. grid-area: minus;
  3234. }
  3235. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-name {
  3236. grid-area: name;
  3237. }
  3238. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-submit {
  3239. font-family: var(--sans-serif);
  3240. font-size: var(--font-size-10);
  3241. text-transform: uppercase;
  3242. letter-spacing: 0.05em;
  3243. text-rendering: optimizeLegibility;
  3244. grid-area: btn;
  3245. white-space: nowrap;
  3246. line-height: 1.5;
  3247. background-color: black;
  3248. color: var(--tertiary);
  3249. }
  3250. .crb-hover .tooltipster-box .tooltipster-content .hover-content.manage-tabs ul li {
  3251. display: flex;
  3252. }
  3253. .crb-hover .tooltipster-box .tooltipster-content .hover-content.manage-tabs ul li label {
  3254. color: var(--tertiary);
  3255. flex-basis: 100%;
  3256. }
  3257. .crb-hover .tooltipster-box .tooltipster-content .hover-content.manage-tabs ul li input {
  3258. display: flex;
  3259. min-width: 2em;
  3260. }
  3261. .crb-hover .tooltipster-box .tooltipster-content .hover-content.carry-hover-content {
  3262. white-space: nowrap;
  3263. }
  3264. .crb-hover .tooltipster-box .tooltipster-content .hover-content.carry-hover-content a.item-control i.fas {
  3265. min-width: 1.25em;
  3266. }
  3267. .icon.anger::before {
  3268. content: "💢︎";
  3269. }
  3270. .icon.bang::before {
  3271. content: "💥︎";
  3272. }
  3273. .icon.collision::before {
  3274. content: "💥︎";
  3275. }
  3276. .icon.crystal-ball::before {
  3277. content: "🔮︎";
  3278. }
  3279. .icon.dizzy::before {
  3280. content: "💫︎";
  3281. }
  3282. .icon.diamond-with-dot::before {
  3283. content: "💠︎";
  3284. }
  3285. .icon.gemstone::before {
  3286. content: "💎︎";
  3287. }
  3288. .icon.gem-stone::before {
  3289. content: "💎︎";
  3290. }
  3291. .icon.glowing-star::before {
  3292. content: "🌟︎";
  3293. }
  3294. .icon.prayer-beads::before {
  3295. content: "📿︎";
  3296. }
  3297. .icon.ring::before {
  3298. content: "💍︎";
  3299. }
  3300. .icon.sparkle::before {
  3301. content: "❇︎";
  3302. }
  3303. .icon.sparkler::before {
  3304. content: "🎇︎";
  3305. }
  3306. .icon.sparkles::before {
  3307. content: "✨︎";
  3308. }
  3309. .roll-modifiers-dialog {
  3310. background: none;
  3311. box-shadow: none;
  3312. }
  3313. .roll-modifiers-dialog .window-header {
  3314. border: none;
  3315. box-shadow: inset 0 0 0 1px #9f725b, inset 0 0 0 2px var(--tertiary), inset 0 0 0 3px #956d58, 0 0 20px rgba(0, 0, 0, 0.8);
  3316. background: linear-gradient(90deg, var(--secondary) 0%, #202b93 50%, var(--secondary) 100%);
  3317. border-radius: 0;
  3318. margin-bottom: 2px;
  3319. font-size: var(--font-size-13);
  3320. }
  3321. .roll-modifiers-dialog .window-content {
  3322. border-style: solid;
  3323. border-image-outset: 0;
  3324. border-width: 9px;
  3325. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  3326. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  3327. padding-top: 0;
  3328. }
  3329. .roll-modifiers-dialog button {
  3330. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  3331. background-color: var(--alt);
  3332. border-radius: 2px;
  3333. color: var(--text-light);
  3334. cursor: pointer;
  3335. font-family: var(--sans-serif);
  3336. }
  3337. .roll-modifiers-dialog button:hover {
  3338. text-shadow: 0 0 2px var(--tertiary);
  3339. }
  3340. .roll-modifiers-dialog .toggle {
  3341. background: var(--secondary);
  3342. border-radius: 50px;
  3343. box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2);
  3344. cursor: pointer;
  3345. display: inline-block;
  3346. height: 19px;
  3347. margin: 4px auto;
  3348. position: relative;
  3349. width: 46px;
  3350. }
  3351. .roll-modifiers-dialog .toggle::before {
  3352. color: var(--text-light);
  3353. content: "ON";
  3354. left: 6px;
  3355. position: absolute;
  3356. z-index: 0;
  3357. }
  3358. .roll-modifiers-dialog .toggle::after {
  3359. color: var(--text-dark);
  3360. content: "OFF";
  3361. position: absolute;
  3362. right: 4px;
  3363. text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15);
  3364. z-index: 0;
  3365. }
  3366. .roll-modifiers-dialog .toggle::after, .roll-modifiers-dialog .toggle::before {
  3367. font-family: var(--sans-serif);
  3368. font-size: var(--font-size-10);
  3369. text-transform: uppercase;
  3370. letter-spacing: 0.05em;
  3371. text-rendering: optimizeLegibility;
  3372. top: 4px;
  3373. }
  3374. .roll-modifiers-dialog .toggle .widget {
  3375. background: #fcfff4;
  3376. background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  3377. border-radius: 50px;
  3378. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0px 2px 5px 0px rgba(0, 0, 0, 0.3);
  3379. cursor: pointer;
  3380. display: block;
  3381. height: 16px;
  3382. position: absolute;
  3383. right: 1px;
  3384. top: 1px;
  3385. transition: all 0.4s ease;
  3386. width: 19px;
  3387. z-index: 1;
  3388. }
  3389. .roll-modifiers-dialog .toggle input[type=checkbox] {
  3390. visibility: hidden;
  3391. }
  3392. .roll-modifiers-dialog .toggle input[type=checkbox]:not(:checked) + .widget {
  3393. right: 23px;
  3394. }
  3395. .roll-modifiers-dialog .dialog-row {
  3396. align-items: center;
  3397. display: flex;
  3398. padding: 8px 0;
  3399. gap: 2px;
  3400. }
  3401. .roll-modifiers-dialog .dialog-row .mod {
  3402. flex: 1.5 0 0;
  3403. }
  3404. .roll-modifiers-dialog .dialog-row .type {
  3405. flex: 0 0 6.25rem;
  3406. text-transform: capitalize;
  3407. }
  3408. .roll-modifiers-dialog .dialog-row .value {
  3409. flex: 0 0 36px;
  3410. display: flex;
  3411. justify-content: center;
  3412. }
  3413. .roll-modifiers-dialog .dialog-row .exclude {
  3414. flex: 0 0 50px;
  3415. justify-self: right;
  3416. }
  3417. .roll-modifiers-dialog .dialog-row.header {
  3418. font-size: var(--font-size-13);
  3419. font-weight: 700;
  3420. padding-bottom: 0;
  3421. }
  3422. .roll-modifiers-dialog .dialog-row.header + hr {
  3423. margin-bottom: 0;
  3424. }
  3425. .roll-modifiers-dialog .dialog-row.disabled {
  3426. text-decoration: line-through;
  3427. }
  3428. .roll-modifiers-dialog .dialog-row.disabled > * {
  3429. filter: opacity(0.5);
  3430. }
  3431. .roll-modifiers-dialog .dialog-row.disabled > * i {
  3432. color: var(--text-dark);
  3433. }
  3434. .roll-modifiers-dialog .dialog-row.disabled .toggle {
  3435. background: rgba(0, 0, 0, 0.4);
  3436. }
  3437. .roll-modifiers-dialog .dialog-row.disabled .toggle input[type=checkbox] + label {
  3438. right: 26px;
  3439. }
  3440. .roll-modifiers-dialog .dialog-row.disabled.hidden {
  3441. display: none;
  3442. }
  3443. .roll-modifiers-dialog .dialog-row .exclude.disabled {
  3444. filter: opacity(0.5);
  3445. }
  3446. .roll-modifiers-dialog .dialog-row .exclude.disabled .toggle,
  3447. .roll-modifiers-dialog .dialog-row .exclude.disabled .widget {
  3448. cursor: default;
  3449. }
  3450. .roll-modifiers-dialog .dialog-row .exclude.disabled i {
  3451. color: var(--text-dark);
  3452. }
  3453. .roll-modifiers-dialog .substitutions,
  3454. .roll-modifiers-dialog .modifier-container {
  3455. display: flex;
  3456. flex-direction: column;
  3457. }
  3458. .roll-modifiers-dialog .substitutions + hr,
  3459. .roll-modifiers-dialog .modifier-container + hr {
  3460. margin-top: 0;
  3461. }
  3462. .roll-modifiers-dialog .substitutions .dialog-row,
  3463. .roll-modifiers-dialog .modifier-container .dialog-row {
  3464. border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  3465. }
  3466. .roll-modifiers-dialog .substitutions .dialog-row:last-child,
  3467. .roll-modifiers-dialog .modifier-container .dialog-row:last-child {
  3468. border-bottom: none;
  3469. }
  3470. .roll-modifiers-dialog .substitutions .dialog-row .tag,
  3471. .roll-modifiers-dialog .modifier-container .dialog-row .tag {
  3472. background-color: var(--sub);
  3473. border-radius: 2px;
  3474. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25);
  3475. color: var(--text-light);
  3476. font-family: var(--sans-serif);
  3477. font-size: var(--font-size-10);
  3478. letter-spacing: 0.5px;
  3479. padding: 4px 8px;
  3480. text-transform: uppercase;
  3481. width: fit-content;
  3482. }
  3483. .roll-modifiers-dialog .total-mod {
  3484. font-weight: 700;
  3485. padding: 0;
  3486. }
  3487. .roll-modifiers-dialog .roll-mode-panel {
  3488. display: flex;
  3489. flex-wrap: nowrap;
  3490. align-items: stretch;
  3491. }
  3492. .roll-modifiers-dialog .roll-mode-panel .label {
  3493. flex: 1 40%;
  3494. }
  3495. .roll-modifiers-dialog .roll-mode-panel select {
  3496. flex: 2 60%;
  3497. height: auto;
  3498. width: 100%;
  3499. margin-right: 4px;
  3500. border-radius: 2px;
  3501. cursor: pointer;
  3502. }
  3503. .roll-modifiers-dialog .roll {
  3504. color: var(--text-light);
  3505. background-color: var(--secondary);
  3506. }
  3507. .roll-modifiers-dialog .roll .damage.color,
  3508. .roll-modifiers-dialog .roll i {
  3509. color: var(--text-light) !important;
  3510. }
  3511. .roll-modifiers-dialog .add-entry-row {
  3512. display: flex;
  3513. flex-wrap: nowrap;
  3514. align-items: stretch;
  3515. gap: 2px;
  3516. }
  3517. .roll-modifiers-dialog .add-entry-row select,
  3518. .roll-modifiers-dialog .add-entry-row input {
  3519. height: auto;
  3520. border-radius: 2px;
  3521. }
  3522. .roll-modifiers-dialog .add-entry-row button {
  3523. line-height: 1;
  3524. margin: 0;
  3525. padding: 4px 6px;
  3526. text-transform: uppercase;
  3527. flex: 0 0 min-content;
  3528. font-weight: 700;
  3529. font-size: 0.75rem;
  3530. }
  3531. .roll-modifiers-dialog .add-entry-row .add-modifier-name {
  3532. flex: 1;
  3533. }
  3534. .roll-modifiers-dialog .add-entry-row .add-modifier-type {
  3535. flex: 0 0 min-content;
  3536. }
  3537. .roll-modifiers-dialog .add-entry-row .add-modifier-value {
  3538. flex: 0 0 4ch;
  3539. }
  3540. .dice-checks .fate {
  3541. display: flex;
  3542. justify-content: space-evenly;
  3543. align-items: center;
  3544. }
  3545. .dice-checks .fate label {
  3546. cursor: pointer;
  3547. }
  3548. .dialog.trick-magic-item .dialog-content p {
  3549. font-weight: normal;
  3550. }
  3551. .dialog.trick-magic-item .dialog-buttons {
  3552. flex-direction: column;
  3553. }
  3554. .damage-dialog .dialog-row .value {
  3555. flex-basis: 4rem;
  3556. }
  3557. .damage-dialog .dialog-row .dice-type,
  3558. .damage-dialog .dialog-row .modifier-type {
  3559. background: none;
  3560. white-space: nowrap;
  3561. }
  3562. .damage-dialog .dialog-row .dice-type .icon-container,
  3563. .damage-dialog .dialog-row .modifier-type .icon-container {
  3564. white-space: nowrap;
  3565. }
  3566. .damage-dialog .dialog-row .dice-type .icon-container i,
  3567. .damage-dialog .dialog-row .modifier-type .icon-container i {
  3568. vertical-align: middle;
  3569. text-align: start;
  3570. font-size: 1rem;
  3571. }
  3572. .damage-dialog .dialog-row .no-mod {
  3573. filter: opacity(0.7);
  3574. }
  3575. .damage-dialog .dialog-row .damage {
  3576. padding: 2px 4px;
  3577. }
  3578. .damage-dialog .dice .dialog-row .value {
  3579. flex: 1 0 0;
  3580. gap: 2px;
  3581. justify-content: flex-end;
  3582. margin-right: 6px;
  3583. }
  3584. .damage-dialog .add-modifier-panel {
  3585. flex-wrap: wrap;
  3586. }
  3587. .damage-dialog .add-modifier-panel .add-modifier-name {
  3588. flex-basis: 100%;
  3589. }
  3590. .damage-dialog .add-modifier-panel .add-modifier-value {
  3591. flex: 1;
  3592. }
  3593. .damage-dialog .add-dice-panel .add-dice-count {
  3594. flex: 0 0 4ch;
  3595. text-align: end;
  3596. }
  3597. /* ----------------------------------------- */
  3598. /* Tag Selector */
  3599. /* ----------------------------------------- */
  3600. .app.tag-selector form {
  3601. height: 100%;
  3602. }
  3603. .app.tag-selector form ol.trait-list {
  3604. display: flex;
  3605. flex-direction: column;
  3606. list-style-type: none;
  3607. max-height: 87%;
  3608. overflow-y: scroll;
  3609. padding: 0;
  3610. }
  3611. .app.tag-selector form ol.trait-list.has-custom {
  3612. max-height: 78%;
  3613. }
  3614. .app.tag-selector form table th,
  3615. .app.tag-selector form table td {
  3616. text-align: left;
  3617. white-space: nowrap;
  3618. }
  3619. .app.tag-selector form table tbody td:first-child label {
  3620. vertical-align: super;
  3621. }
  3622. .app.tag-selector form .trait-header {
  3623. flex: 0 0 32px;
  3624. line-height: 32px;
  3625. text-align: center;
  3626. margin: 0;
  3627. }
  3628. .app.tag-selector form .trait-header .header-search {
  3629. flex: 1;
  3630. }
  3631. .app.tag-selector form .trait-header .header-search input {
  3632. background: rgba(255, 255, 245, 0.8);
  3633. width: calc(100% - 26px);
  3634. margin: 0 2px;
  3635. }
  3636. .app.tag-selector form .trait-footer {
  3637. flex: 0 0 32px;
  3638. line-height: 32px;
  3639. margin: 0;
  3640. margin-bottom: 5px;
  3641. border-top: 1px solid grey;
  3642. }
  3643. .app.tag-selector form .trait-selection-label {
  3644. display: flex;
  3645. align-items: center;
  3646. }
  3647. .app.tag-selector form .trait-selection-label .trait-label {
  3648. margin-left: 5px;
  3649. }
  3650. .app.tag-selector form input:not([type=checkbox]) {
  3651. flex: 1.8;
  3652. }
  3653. #token-hud .status-effects {
  3654. grid-template-columns: repeat(5, 1fr);
  3655. width: auto;
  3656. }
  3657. #token-hud .status-effects .effect-control {
  3658. border-radius: 1px;
  3659. color: var(--color-text-dark-1);
  3660. cursor: pointer;
  3661. height: 36px;
  3662. opacity: 0.75;
  3663. position: relative;
  3664. width: 36px;
  3665. }
  3666. #token-hud .status-effects .effect-control.active img {
  3667. border: 1px solid var(--color-border-highlight);
  3668. opacity: 1;
  3669. }
  3670. #token-hud .status-effects .effect-control img {
  3671. border: 1px solid rgba(0, 0, 0, 0);
  3672. height: 35px;
  3673. margin: 0;
  3674. width: 35px;
  3675. }
  3676. #token-hud .status-effects .effect-control:not(.active):hover img {
  3677. border: 1px solid rgba(255, 100, 0, 0.5);
  3678. }
  3679. #token-hud .status-effects .effect-control .badge {
  3680. background: rgba(255, 255, 255, 0.9);
  3681. border-radius: 50%;
  3682. border: 0.1em solid darkred;
  3683. font-size: var(--font-size-8);
  3684. height: 0.8rem;
  3685. line-height: var(--font-size-10);
  3686. pointer-events: none;
  3687. position: absolute;
  3688. right: -3px;
  3689. text-align: center;
  3690. top: -3px;
  3691. width: 0.8rem;
  3692. z-index: 1;
  3693. }
  3694. #token-hud .status-effects .effect-control.overridden > * {
  3695. filter: saturate(0);
  3696. }
  3697. #token-hud .status-effects .effect-control.valued .badge {
  3698. font-size: var(--font-size-12);
  3699. font-style: unset;
  3700. font-weight: 500;
  3701. line-height: var(--font-size-12);
  3702. }
  3703. #token-hud .status-effects .title-bar {
  3704. background: rgba(0, 0, 0, 0.6);
  3705. border-radius: inherit;
  3706. border: inherit;
  3707. box-shadow: inherit;
  3708. box-sizing: content-box;
  3709. font-size: var(--font-size-14);
  3710. font-weight: normal;
  3711. left: 0;
  3712. line-height: normal;
  3713. padding: 3px 0;
  3714. position: absolute;
  3715. text-align: center;
  3716. top: -30px;
  3717. visibility: hidden;
  3718. width: 100%;
  3719. z-index: 1;
  3720. }
  3721. #token-hud .status-effects .title-bar.active {
  3722. visibility: visible;
  3723. }
  3724. #token-hud .control-icon[data-action=clown-car][data-disabled=true] {
  3725. cursor: wait;
  3726. opacity: 0.5;
  3727. }
  3728. #token-hud .control-icon[data-action=clown-car] img {
  3729. height: 36px;
  3730. transform-style: preserve-3d;
  3731. transition: 0.5s;
  3732. width: 36px;
  3733. }
  3734. #token-hud .control-icon[data-action=clown-car] img.retrieve {
  3735. transform: scaleX(-1);
  3736. }
  3737. .default section.window-content {
  3738. padding: 0;
  3739. overflow: hidden;
  3740. }
  3741. /* Adjust height of the header */
  3742. .attribute-builder .window-content {
  3743. background: url("../assets/sheet/background.webp");
  3744. background-repeat: repeat-x, no-repeat;
  3745. background-size: cover;
  3746. background-attachment: local;
  3747. height: 100%;
  3748. padding: 10px 20px 10px 20px;
  3749. position: relative;
  3750. --color-boost: #316549;
  3751. --color-boost-dark: #1b3c2a;
  3752. --color-flaw: #5e0000;
  3753. }
  3754. .attribute-builder .window-content h3 {
  3755. font: 400 var(--font-size-24) var(--serif-condensed);
  3756. line-height: var(--font-size-24);
  3757. }
  3758. .attribute-builder .window-content h4 {
  3759. font: 400 var(--font-size-10) var(--sans-serif);
  3760. text-transform: uppercase;
  3761. color: #605856;
  3762. }
  3763. .attribute-builder .window-content button:focus:not(:focus-visible) {
  3764. box-shadow: none;
  3765. }
  3766. .attribute-builder .window-content .row {
  3767. display: flex;
  3768. align-items: center;
  3769. }
  3770. .attribute-builder .window-content .row .row-heading {
  3771. width: 220px;
  3772. }
  3773. .attribute-builder .window-content .row.not-eligible {
  3774. pointer-events: none;
  3775. filter: blur(1px);
  3776. opacity: 0.6;
  3777. }
  3778. .attribute-builder .window-content .row.not-eligible .remaining {
  3779. visibility: hidden;
  3780. }
  3781. .attribute-builder .window-content .row .attributes {
  3782. display: grid;
  3783. grid-template-columns: repeat(6, 84px);
  3784. grid-template-rows: auto;
  3785. flex: 0 0 auto;
  3786. }
  3787. .attribute-builder .window-content .row .full-row {
  3788. display: flex;
  3789. flex: 1;
  3790. justify-content: center;
  3791. }
  3792. .attribute-builder .window-content header.row {
  3793. align-items: normal;
  3794. padding-top: 10px;
  3795. height: 60px;
  3796. }
  3797. .attribute-builder .window-content header.row .row-column {
  3798. display: block;
  3799. }
  3800. .attribute-builder .window-content header.row .attributes {
  3801. align-items: normal;
  3802. }
  3803. .attribute-builder .window-content .background-stripes {
  3804. position: absolute;
  3805. left: 0;
  3806. top: 0;
  3807. bottom: 50px;
  3808. right: 0;
  3809. padding: 10px 20px 10px 20px;
  3810. pointer-events: none;
  3811. align-items: normal;
  3812. }
  3813. .attribute-builder .window-content .background-stripes .attributes div:nth-child(odd) {
  3814. background-color: rgba(68, 55, 48, 0.1);
  3815. }
  3816. .attribute-builder .window-content .voluntary-flaw-row {
  3817. margin: 0.5rem 0;
  3818. }
  3819. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons {
  3820. display: flex;
  3821. flex-direction: row;
  3822. }
  3823. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons button {
  3824. flex: 1 1 0;
  3825. }
  3826. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons button.first {
  3827. border-bottom-right-radius: 0;
  3828. border-right: none;
  3829. border-top-right-radius: 0;
  3830. width: 4em;
  3831. }
  3832. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons button.second {
  3833. border-bottom-left-radius: 0;
  3834. border-top-left-radius: 0;
  3835. max-width: 2em;
  3836. text-transform: none;
  3837. }
  3838. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons button.second.selected {
  3839. border-left-color: rgba(255, 255, 255, 0.5);
  3840. }
  3841. .attribute-builder .window-content .row-heading {
  3842. align-items: center;
  3843. display: grid;
  3844. grid-template-areas: "img description remaining";
  3845. grid-template-columns: 42px 1fr auto;
  3846. }
  3847. .attribute-builder .window-content .row-heading h3 {
  3848. align-self: start;
  3849. font-size: var(--font-size-24);
  3850. grid-column: 1/4;
  3851. }
  3852. .attribute-builder .window-content .row-heading .hint-container {
  3853. grid-column: 1/4;
  3854. }
  3855. .attribute-builder .window-content .row-heading img {
  3856. border: 0;
  3857. grid-area: img;
  3858. height: 2rem;
  3859. width: 2rem;
  3860. }
  3861. .attribute-builder .window-content .row-heading div.label {
  3862. display: flex;
  3863. flex-direction: column;
  3864. grid-area: description;
  3865. margin-right: 10px;
  3866. overflow: hidden;
  3867. text-overflow: ellipsis;
  3868. white-space: nowrap;
  3869. }
  3870. .attribute-builder .window-content .row-heading div.remaining {
  3871. grid-area: remaining;
  3872. display: flex;
  3873. margin-right: 10px;
  3874. width: 1.6rem;
  3875. height: 1.6rem;
  3876. border-radius: 50%;
  3877. background: rgba(68, 55, 48, 0.1);
  3878. align-self: center;
  3879. align-items: center;
  3880. justify-content: center;
  3881. text-align: center;
  3882. }
  3883. .attribute-builder .window-content .row-heading div.remaining.extra {
  3884. animation: glow 0.75s infinite alternate;
  3885. }
  3886. @keyframes glow {
  3887. from {
  3888. box-shadow: 0 0 1px 1px #ffb351;
  3889. }
  3890. to {
  3891. box-shadow: 0 0 3px 3px #ffb351;
  3892. }
  3893. }
  3894. .attribute-builder .window-content .row-column {
  3895. align-items: center;
  3896. display: flex;
  3897. flex-direction: column;
  3898. justify-content: center;
  3899. text-align: center;
  3900. }
  3901. .attribute-builder .window-content .row-column button {
  3902. align-items: center;
  3903. border: 1px solid var(--button-color);
  3904. color: var(--button-color);
  3905. display: flex;
  3906. font-size: var(--font-size-12);
  3907. height: 1.5em;
  3908. justify-content: center;
  3909. margin: 0;
  3910. outline: none;
  3911. padding: 0.1em 0 0;
  3912. position: relative;
  3913. text-transform: uppercase;
  3914. width: 6em;
  3915. }
  3916. .attribute-builder .window-content .row-column button > i.key-attribute {
  3917. bottom: 3px;
  3918. font-size: smaller;
  3919. left: 2px;
  3920. position: absolute;
  3921. }
  3922. .attribute-builder .window-content .row-column button.boost, .attribute-builder .window-content .row-column button.apex {
  3923. margin-top: auto;
  3924. --button-color: var(--color-boost);
  3925. --button-locked-color: var(--color-boost-dark);
  3926. }
  3927. .attribute-builder .window-content .row-column button.flaw {
  3928. margin-bottom: auto;
  3929. --button-color: var(--color-flaw);
  3930. --button-locked-color: var(--color-flaw);
  3931. }
  3932. .attribute-builder .window-content .row-column button.selected {
  3933. background: var(--button-color);
  3934. }
  3935. .attribute-builder .window-content .row-column button.selected.partial {
  3936. background: var(--color-boost-dark);
  3937. }
  3938. .attribute-builder .window-content .row-column button:hover {
  3939. box-shadow: 0 0 5px var(--button-color);
  3940. cursor: pointer;
  3941. }
  3942. .attribute-builder .window-content .row-column button:hover.key-attribute.selected {
  3943. box-shadow: none;
  3944. cursor: default;
  3945. }
  3946. .attribute-builder .window-content .row-column button:hover:disabled {
  3947. background: rgba(0, 0, 0, 0.04);
  3948. box-shadow: none;
  3949. cursor: not-allowed;
  3950. }
  3951. .attribute-builder .window-content .row-column button.hidden {
  3952. pointer-events: none;
  3953. visibility: hidden;
  3954. }
  3955. .attribute-builder .window-content .row-column button:disabled {
  3956. background: rgba(0, 0, 0, 0.04);
  3957. opacity: 0.4;
  3958. }
  3959. .attribute-builder .window-content .row-column button:disabled:active {
  3960. pointer-events: none;
  3961. }
  3962. .attribute-builder .window-content .row-column button.locked {
  3963. background: var(--button-locked-color);
  3964. border-color: var(--button-locked-color);
  3965. pointer-events: none;
  3966. }
  3967. .attribute-builder .window-content .row-column button.locked, .attribute-builder .window-content .row-column button.selected {
  3968. color: var(--text-light);
  3969. }
  3970. .attribute-builder .window-content .row-column div + .boost,
  3971. .attribute-builder .window-content .row-column button + .boost {
  3972. margin-top: 4px;
  3973. }
  3974. .attribute-builder .window-content .summary-row .row-heading {
  3975. display: block;
  3976. }
  3977. .attribute-builder .window-content .summary-row .hint-container {
  3978. background: rgba(211, 204, 188, 0.4);
  3979. padding: 12px;
  3980. margin-right: 10px;
  3981. border: 1px solid rgb(211, 204, 188);
  3982. border-radius: 3px;
  3983. align-self: end;
  3984. }
  3985. .attribute-builder .window-content .summary-row .hint-container h3 {
  3986. color: var(--primary);
  3987. font-variant: small-caps;
  3988. font-size: var(--font-size-20);
  3989. line-height: var(--font-size-16);
  3990. font-family: var(--sans-serif-condensed);
  3991. font-weight: 500;
  3992. }
  3993. .attribute-builder .window-content .summary-row .hint-container p {
  3994. font-style: italic;
  3995. font-size: var(--font-size-12);
  3996. line-height: var(--font-size-14);
  3997. font-family: var(--sans-serif);
  3998. font-weight: 500;
  3999. margin-bottom: 3px;
  4000. }
  4001. .attribute-builder .window-content .summary-row .hint-container label {
  4002. display: flex;
  4003. align-items: center;
  4004. margin-top: 10px;
  4005. }
  4006. .attribute-builder .window-content .summary-row .attributes {
  4007. grid-template-rows: auto auto;
  4008. }
  4009. .attribute-builder .window-content .summary-row .row-column {
  4010. display: flex;
  4011. flex-direction: column;
  4012. padding-top: 10px;
  4013. }
  4014. .attribute-builder .window-content .summary-row .row-column .value {
  4015. height: 40px;
  4016. font: 700 var(--font-size-24) var(--serif);
  4017. line-height: var(--font-size-30);
  4018. }
  4019. .attribute-builder .window-content .summary-row .row-column input {
  4020. width: calc(100% - 20px);
  4021. flex-grow: 0;
  4022. height: 30px;
  4023. color: var(--text-dark);
  4024. font: 500 var(--font-size-24) var(--serif);
  4025. border: 0;
  4026. border-bottom: 1px solid #d3ccbc;
  4027. border-radius: 0;
  4028. background-color: transparent;
  4029. margin: 0 10px 10px 10px;
  4030. }
  4031. .attribute-builder .window-content .summary-row .row-column input::placeholder {
  4032. filter: opacity(0.5);
  4033. }
  4034. .attribute-builder .window-content .summary-row .row-column input:focus {
  4035. border-bottom: 1px solid var(--alt);
  4036. }
  4037. .attribute-builder .window-content .summary-row .row-column input[type=number] {
  4038. padding-bottom: 0;
  4039. padding-left: 4px;
  4040. }
  4041. .attribute-builder .window-content .summary-row .complete {
  4042. grid-row: 2;
  4043. grid-column: 1/7;
  4044. margin-top: 10px;
  4045. margin-left: auto;
  4046. }
  4047. .attribute-builder .window-content .summary-row button.complete {
  4048. color: var(--text-light);
  4049. background: var(--secondary);
  4050. height: 35px;
  4051. width: 131px;
  4052. border: 1px solid var(--tertiary);
  4053. }
  4054. .attribute-builder .window-content .title {
  4055. color: var(--primary);
  4056. font: 500 var(--font-size-10) var(--sans-serif-condensed);
  4057. line-height: var(--font-size-10);
  4058. text-transform: uppercase;
  4059. }
  4060. .attribute-builder .window-content div[data-tooltip-content].description,
  4061. .attribute-builder .window-content div[data-tooltip-content] .description,
  4062. .attribute-builder .window-content div[data-tooltip].description,
  4063. .attribute-builder .window-content div[data-tooltip] .description {
  4064. text-decoration: underline dotted;
  4065. text-underline-offset: 2px;
  4066. }
  4067. .attribute-builder .window-content .description {
  4068. font: 600 var(--font-size-16) var(--serif);
  4069. }
  4070. .attribute-builder .window-content .extra {
  4071. align-items: center;
  4072. display: flex;
  4073. font-size: var(--font-size-12);
  4074. gap: 1px;
  4075. margin-top: -0.25rem;
  4076. }
  4077. .attribute-builder .window-content .extra > i {
  4078. margin-left: 0.125rem;
  4079. }
  4080. .attribute-builder .window-content .extra input[type=checkbox] {
  4081. height: var(--font-size-12);
  4082. margin: 0;
  4083. }
  4084. .crb-hover .tooltipster-box .tooltipster-content .hover-content h2:not(:first-child) {
  4085. margin-top: 10px;
  4086. }
  4087. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul.boost-details li {
  4088. white-space: nowrap;
  4089. display: flex;
  4090. flex-direction: row;
  4091. align-items: center;
  4092. }
  4093. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul.boost-details li i {
  4094. font-size: var(--font-size-5);
  4095. margin-right: 5px;
  4096. }
  4097. .iwr-editor {
  4098. max-height: 500px;
  4099. }
  4100. .iwr-editor a.document-id-link {
  4101. display: none;
  4102. }
  4103. .iwr-editor .entries {
  4104. display: flex;
  4105. flex-direction: column;
  4106. gap: 0.5em;
  4107. }
  4108. .iwr-editor .entries .entry {
  4109. padding: 0.25em 0.5em;
  4110. }
  4111. .iwr-editor .entries .entry label {
  4112. flex: unset;
  4113. white-space: nowrap;
  4114. width: 6em;
  4115. }
  4116. .iwr-editor .entries .entry a.form-action,
  4117. .iwr-editor .entries .entry .synthetic-source {
  4118. flex: 0;
  4119. margin-left: 0.5em;
  4120. }
  4121. .iwr-editor .entries .entry:not(.new):nth-child(odd) {
  4122. background-color: rgba(0, 0, 0, 0.075);
  4123. }
  4124. .iwr-editor select:disabled {
  4125. color: var(--color-text-dark-7);
  4126. }
  4127. .iwr-editor tags.tagify.pf2e-tagify {
  4128. background: rgba(0, 0, 0, 0.05);
  4129. border: 1px solid var(--color-border-light-tertiary);
  4130. }
  4131. .iwr-editor tags.tagify.pf2e-tagify[disabled] > .tagify__input {
  4132. margin: 0;
  4133. }
  4134. .iwr-editor input[type=number] {
  4135. max-width: 5ch;
  4136. }
  4137. body > .choices__list--dropdown {
  4138. background-color: white;
  4139. position: fixed;
  4140. }
  4141. .actor.sheet .image-container {
  4142. position: relative;
  4143. }
  4144. .actor.sheet .image-container .hover-icon {
  4145. display: none;
  4146. font-size: var(--font-size-16);
  4147. }
  4148. .actor.sheet .image-container:hover .hover-icon {
  4149. display: block;
  4150. }
  4151. .actor.sheet .image-container [data-action=show-image] {
  4152. position: absolute;
  4153. bottom: 0.25rem;
  4154. right: 0.025rem;
  4155. }
  4156. .actor.sheet h3 {
  4157. border-bottom: none;
  4158. }
  4159. .actor.sheet button > i {
  4160. margin-right: 0;
  4161. }
  4162. .actor.sheet .item-summary {
  4163. --space-s: 0.25em;
  4164. --space-m: 0.5em;
  4165. --space-l: 1em;
  4166. --space-xl: 1.5em;
  4167. --space-2xl: 2em;
  4168. --radius: 3px;
  4169. overflow: hidden;
  4170. }
  4171. .actor.sheet .item-summary p {
  4172. min-height: unset;
  4173. }
  4174. .actor.sheet .item-summary :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  4175. margin-top: 1em;
  4176. }
  4177. .actor.sheet .item-summary .inline-header {
  4178. display: flex;
  4179. align-items: center;
  4180. gap: var(--space-l);
  4181. background-color: var(--alt);
  4182. font-family: var(--sans-serif);
  4183. color: var(--text-light);
  4184. padding: 0;
  4185. font-size: 0.8em;
  4186. font-weight: 400;
  4187. border: none;
  4188. }
  4189. .actor.sheet .item-summary .inline-header strong {
  4190. display: inline-flex;
  4191. padding: 0 var(--space-m);
  4192. background-color: var(--primary);
  4193. min-width: 15ch;
  4194. border-right: 1px solid rgba(0, 0, 0, 0.4);
  4195. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  4196. font-weight: 400;
  4197. }
  4198. .actor.sheet .item-summary .inline-header + p {
  4199. margin-top: var(--space-s);
  4200. }
  4201. .actor.sheet .item-summary .info {
  4202. background-color: var(--secondary);
  4203. padding: var(--space-m);
  4204. color: var(--text-light);
  4205. margin-left: auto;
  4206. margin-right: auto;
  4207. padding: 0;
  4208. border-radius: var(--radius);
  4209. font-family: var(--sans-serif);
  4210. padding-bottom: var(--space-m);
  4211. }
  4212. .actor.sheet .item-summary .info > * + * {
  4213. margin-top: var(--space-m);
  4214. }
  4215. .actor.sheet .item-summary .info + * {
  4216. margin-top: var(--space-xl);
  4217. }
  4218. .actor.sheet .item-summary .info + .actor.sheet .item-summary .info {
  4219. margin-top: var(--space-s);
  4220. }
  4221. .actor.sheet .item-summary .info h4 {
  4222. font-size: 0.9em;
  4223. font-weight: 400;
  4224. line-height: 1.2;
  4225. font-family: var(--sans-serif);
  4226. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  4227. padding: var(--space-m) var(--space-l);
  4228. position: relative;
  4229. display: flex;
  4230. align-items: center;
  4231. justify-content: space-between;
  4232. color: var(--text-light);
  4233. }
  4234. .actor.sheet .item-summary .info h4::after {
  4235. font-family: "Font Awesome 6";
  4236. content: "\f05a";
  4237. font-weight: 900;
  4238. margin-right: var(--space-s);
  4239. }
  4240. .actor.sheet .item-summary .info p {
  4241. font-size: 0.8em;
  4242. margin: 0;
  4243. padding: 0 var(--space-l);
  4244. }
  4245. .actor.sheet .item-summary .info p:first-of-type {
  4246. padding-top: var(--space-m);
  4247. border-top: 1px solid rgba(255, 255, 255, 0.1);
  4248. }
  4249. .actor.sheet .item-summary .traits {
  4250. display: flex;
  4251. flex-wrap: wrap;
  4252. padding: 0;
  4253. }
  4254. .actor.sheet .item-summary .traits p {
  4255. display: inline-flex;
  4256. padding: 0.16rem 0.25rem;
  4257. margin: 0;
  4258. background-color: var(--primary);
  4259. border: 2px solid var(--color-border-trait);
  4260. color: var(--text-light);
  4261. font: 500 var(--font-size-10) var(--sans-serif);
  4262. text-transform: uppercase;
  4263. }
  4264. .actor.sheet .item-summary .statblock {
  4265. font-family: var(--sans-serif-condensed);
  4266. color: var(--text-dark);
  4267. line-height: 1.2;
  4268. margin-bottom: var(--space-m);
  4269. }
  4270. .actor.sheet .item-summary .statblock > * + * {
  4271. margin-top: var(--space-s);
  4272. margin-bottom: 0;
  4273. }
  4274. .actor.sheet .item-summary .statblock p {
  4275. --indent: var(--space-l);
  4276. margin-left: var(--indent);
  4277. position: relative;
  4278. }
  4279. .actor.sheet .item-summary .statblock p strong:first-of-type {
  4280. margin-left: calc(var(--indent) * -1);
  4281. }
  4282. .actor.sheet .item-summary .statblock p .trait:first-of-type {
  4283. margin-left: calc(var(--indent) * -1 - 2px);
  4284. }
  4285. .actor.sheet .item-summary .statblock span.pf2-icon {
  4286. line-height: 1;
  4287. }
  4288. .actor.sheet .item-summary .statblock h1,
  4289. .actor.sheet .item-summary .statblock h2,
  4290. .actor.sheet .item-summary .statblock h3,
  4291. .actor.sheet .item-summary .statblock h4 {
  4292. display: flex;
  4293. align-items: baseline;
  4294. justify-content: space-between;
  4295. border-bottom: 1px solid var(--color-border-dark);
  4296. text-transform: uppercase;
  4297. letter-spacing: -0.05em;
  4298. font-family: var(--sans-serif-condensed);
  4299. font-weight: 700;
  4300. }
  4301. .actor.sheet .item-summary .statblock hr {
  4302. border: none;
  4303. border-bottom: 1px solid var(--color-border-dark);
  4304. }
  4305. .actor.sheet .item-summary .message {
  4306. font-family: var(--journal-cursive);
  4307. font-size: 2em;
  4308. line-height: 1.2;
  4309. }
  4310. .actor.sheet .item-summary span[data-visibility=all] {
  4311. display: inline-block;
  4312. line-height: 1em;
  4313. padding: 2px 1px 1px;
  4314. }
  4315. .actor.sheet .item-summary .item-buttons button {
  4316. background-color: var(--primary);
  4317. border: none;
  4318. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  4319. border-top: 1px solid #ff5e5e;
  4320. border-bottom: 1px solid black;
  4321. color: var(--text-light);
  4322. cursor: pointer;
  4323. font-family: var(--serif);
  4324. font-size: var(--font-size-14);
  4325. font-weight: 500;
  4326. line-height: 1.8em;
  4327. margin: 8px 0 0 0;
  4328. padding: 0 8px;
  4329. }
  4330. .actor.sheet .item-summary .item-buttons button:hover {
  4331. box-shadow: none;
  4332. text-shadow: 0 0 2px white;
  4333. }
  4334. .actor.sheet .expandable:not(.expanded) .item-summary {
  4335. display: none;
  4336. }
  4337. .actor.sheet .inventory {
  4338. --border-color: var(--alt);
  4339. }
  4340. .actor.sheet .inventory ol:not(.currency) {
  4341. margin: 0;
  4342. padding: 0;
  4343. list-style: none;
  4344. display: flex;
  4345. flex-direction: column;
  4346. }
  4347. .actor.sheet .inventory .notify {
  4348. animation: glow 0.75s infinite alternate;
  4349. }
  4350. .actor.sheet .inventory .item-name {
  4351. display: flex;
  4352. align-items: center;
  4353. font-weight: 500;
  4354. flex: 2;
  4355. gap: 4px;
  4356. }
  4357. .actor.sheet .inventory .item-name h3,
  4358. .actor.sheet .inventory .item-name h4 {
  4359. cursor: pointer;
  4360. font-weight: 500;
  4361. line-height: var(--font-size-12);
  4362. margin: auto auto auto 0;
  4363. padding: 2px;
  4364. word-break: break-word;
  4365. }
  4366. .actor.sheet .inventory .item-name h3:hover,
  4367. .actor.sheet .inventory .item-name h4:hover {
  4368. color: var(--primary);
  4369. }
  4370. .actor.sheet .inventory .item-name h4:not(:hover).rarity-uncommon {
  4371. border-color: var(--color-rarity-uncommon);
  4372. color: var(--color-rarity-uncommon);
  4373. }
  4374. .actor.sheet .inventory .item-name h4:not(:hover).rarity-rare {
  4375. border-color: var(--color-rarity-rare);
  4376. color: var(--color-rarity-rare);
  4377. }
  4378. .actor.sheet .inventory .item-name h4:not(:hover).rarity-unique {
  4379. border-color: var(--color-rarity-unique);
  4380. color: var(--color-rarity-unique);
  4381. }
  4382. .actor.sheet .inventory .item-name .item-image {
  4383. box-shadow: inset 0 0 0 1px var(--tertiary);
  4384. }
  4385. .actor.sheet .inventory .item-name .item-image img {
  4386. border-radius: 0;
  4387. }
  4388. .actor.sheet .inventory .item-name .size {
  4389. font-size: 0.8em;
  4390. color: var(--alt);
  4391. margin: 0;
  4392. }
  4393. .actor.sheet .inventory .item-name .item-charges {
  4394. color: var(--sub);
  4395. }
  4396. .actor.sheet .inventory .inventory-list,
  4397. .actor.sheet .inventory .inventory-items {
  4398. flex-direction: column;
  4399. list-style-type: none;
  4400. position: relative;
  4401. width: 100%;
  4402. }
  4403. .actor.sheet .inventory .inventory-list > li:nth-of-type(even),
  4404. .actor.sheet .inventory .inventory-items > li:nth-of-type(even) {
  4405. background-color: rgba(120, 100, 82, 0.1);
  4406. }
  4407. .actor.sheet .inventory .inventory-list .list-row:last-child .item-summary,
  4408. .actor.sheet .inventory .inventory-items .list-row:last-child .item-summary {
  4409. border-bottom: none;
  4410. }
  4411. .actor.sheet .inventory .inventory-list .temporary-item,
  4412. .actor.sheet .inventory .inventory-items .temporary-item {
  4413. background-color: rgba(0, 5, 255, 0.1137254902);
  4414. }
  4415. .actor.sheet .inventory .inventory-list {
  4416. overflow: hidden scroll;
  4417. display: flex;
  4418. height: calc(100% - 60px);
  4419. padding-right: 0.15rem;
  4420. }
  4421. .actor.sheet .inventory .quantity,
  4422. .actor.sheet .inventory .bulk,
  4423. .actor.sheet .inventory .item-controls,
  4424. .actor.sheet .inventory .sell-value {
  4425. display: flex;
  4426. justify-content: center;
  4427. align-items: center;
  4428. flex: 0 0 68px;
  4429. }
  4430. .actor.sheet .inventory .sell-value {
  4431. justify-content: end;
  4432. padding-right: 3px;
  4433. }
  4434. .actor.sheet .inventory .quantity {
  4435. justify-content: space-around;
  4436. }
  4437. .actor.sheet .inventory .quantity .decrease,
  4438. .actor.sheet .inventory .quantity .increase {
  4439. display: flex;
  4440. justify-content: center;
  4441. align-items: center;
  4442. font-family: var(--sans-serif-monospace);
  4443. height: 100%;
  4444. text-align: center;
  4445. width: 18px;
  4446. }
  4447. .actor.sheet .inventory .bulk {
  4448. flex: 0 0 36px;
  4449. }
  4450. .actor.sheet .inventory .item-controls {
  4451. flex: 0 0 90px;
  4452. font-size: var(--font-size-12);
  4453. gap: 1px;
  4454. justify-content: end;
  4455. }
  4456. .actor.sheet .inventory .inventory-header {
  4457. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  4458. align-items: center;
  4459. background-color: var(--alt);
  4460. color: var(--color-text-light-0);
  4461. display: flex;
  4462. font-family: var(--sans-serif);
  4463. font-size: var(--font-size-10);
  4464. justify-content: end;
  4465. letter-spacing: 0.05em;
  4466. line-height: 1;
  4467. margin-top: 6px;
  4468. padding: 0.25rem;
  4469. text-rendering: optimizeLegibility;
  4470. text-transform: uppercase;
  4471. width: 100%;
  4472. }
  4473. .actor.sheet .inventory .inventory-header:first-child {
  4474. margin-top: 0;
  4475. }
  4476. .actor.sheet .inventory .inventory-header h3 {
  4477. font-size: var(--font-size-14);
  4478. margin: 2px 0;
  4479. text-shadow: 0 0 2px rgba(0, 0, 0, 0.75);
  4480. text-transform: capitalize;
  4481. }
  4482. .actor.sheet .inventory .inventory-header h3:hover {
  4483. color: var(--color-text-light-0);
  4484. }
  4485. .actor.sheet .inventory .inventory-header .item-name {
  4486. padding-left: 4px;
  4487. }
  4488. .actor.sheet .inventory .inventory-header .item-invested-total {
  4489. flex: none;
  4490. margin-right: 1em;
  4491. }
  4492. .actor.sheet .inventory .inventory-header .item-controls {
  4493. gap: 0.25rem;
  4494. }
  4495. .actor.sheet .inventory .inventory-header .overinvested {
  4496. color: orange;
  4497. text-shadow: 1px 1px 0px black;
  4498. }
  4499. .actor.sheet .inventory .inventory-items {
  4500. border: 1px solid var(--border-color);
  4501. border-top: none;
  4502. }
  4503. .actor.sheet .inventory .item {
  4504. display: flex;
  4505. flex-wrap: wrap;
  4506. font-size: var(--font-size-12);
  4507. justify-content: flex-start;
  4508. width: 100%;
  4509. }
  4510. .actor.sheet .inventory .item .quantity,
  4511. .actor.sheet .inventory .item .bulk,
  4512. .actor.sheet .inventory .item .item-controls,
  4513. .actor.sheet .inventory .item .sell-value {
  4514. border-left: 1px solid var(--alt);
  4515. }
  4516. .actor.sheet .inventory .list-row {
  4517. width: 100%;
  4518. }
  4519. .actor.sheet .inventory .list-row .item-controls {
  4520. color: var(--text-dark);
  4521. font-size: var(--font-size-13);
  4522. }
  4523. .actor.sheet .inventory .list-row .item-controls .item-control.toggle-invested, .actor.sheet .inventory .list-row .item-controls .item-control.item-carry-type {
  4524. color: rgba(0, 0, 0, 0.5);
  4525. }
  4526. .actor.sheet .inventory .list-row .item-controls .item-control.toggle-invested.active, .actor.sheet .inventory .list-row .item-controls .item-control.item-carry-type.active {
  4527. color: var(--secondary);
  4528. }
  4529. .actor.sheet .inventory .list-row .item-controls .item-control.item-carry-type {
  4530. text-align: right;
  4531. }
  4532. .actor.sheet .inventory .list-row .item-controls .item-control .fa-stack {
  4533. margin: -3px -2px 0;
  4534. }
  4535. .actor.sheet .inventory .list-row .item-controls .item-control .fa-stack .fa-1,
  4536. .actor.sheet .inventory .list-row .item-controls .item-control .fa-stack .fa-2 {
  4537. left: 1px;
  4538. position: relative;
  4539. }
  4540. .actor.sheet .inventory .list-row.drag-preview {
  4541. box-shadow: 0 0 6px inset var(--color-shadow-highlight);
  4542. }
  4543. .actor.sheet .inventory .list-row.drag-gap {
  4544. visibility: hidden;
  4545. }
  4546. .actor.sheet .inventory .container-metadata .container-capacity {
  4547. font-family: var(--sans-serif);
  4548. font-size: var(--font-size-10);
  4549. text-transform: uppercase;
  4550. letter-spacing: 0.05em;
  4551. text-rendering: optimizeLegibility;
  4552. position: relative;
  4553. background-color: rgba(0, 0, 0, 0.75);
  4554. box-shadow: inset 0 0 4px black;
  4555. color: var(--color-text-light-0);
  4556. display: flex;
  4557. width: 100%;
  4558. }
  4559. .actor.sheet .inventory .container-metadata .container-capacity .container-capacity-bar {
  4560. background-color: var(--secondary);
  4561. border-radius: 0 2px 2px 0;
  4562. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 0 2px rgba(255, 255, 255, 0.1);
  4563. padding: 8px 0;
  4564. }
  4565. .actor.sheet .inventory .container-metadata .container-capacity .container-capacity-label {
  4566. position: absolute;
  4567. height: 100%;
  4568. top: 0;
  4569. left: 0;
  4570. padding: 2px;
  4571. }
  4572. .actor.sheet .inventory .container-metadata .container-capacity.over-limit .container-capacity-bar {
  4573. background-color: var(--primary);
  4574. }
  4575. .actor.sheet .inventory .container-metadata .container-held-items {
  4576. padding-left: 10px;
  4577. border-left: none;
  4578. border-right: none;
  4579. }
  4580. .actor.sheet .inventory .container-metadata .container-held-items li:nth-of-type(even) {
  4581. background-color: rgba(120, 100, 82, 0.1);
  4582. }
  4583. .actor.sheet .inventory .container-metadata .container-held-items li:first-of-type .item::before {
  4584. height: 50%;
  4585. top: 0;
  4586. }
  4587. .actor.sheet .inventory .container-metadata .container-held-items .item {
  4588. position: relative;
  4589. }
  4590. .actor.sheet .inventory .container-metadata .container-held-items .item::before, .actor.sheet .inventory .container-metadata .container-held-items .item::after {
  4591. position: absolute;
  4592. border-left: 1px solid var(--alt);
  4593. top: 0;
  4594. height: 50%;
  4595. left: -5px;
  4596. width: 5px;
  4597. content: "";
  4598. }
  4599. .actor.sheet .inventory .container-metadata .container-held-items .item::before {
  4600. border-bottom: 1px solid var(--alt);
  4601. top: 0;
  4602. }
  4603. .actor.sheet .inventory .container-metadata .container-held-items .item::after {
  4604. top: 50%;
  4605. }
  4606. .actor.sheet .inventory .container-metadata .container-held-items .item .item-summary {
  4607. border-left: 1px solid var(--alt);
  4608. }
  4609. .actor.sheet .inventory .container-metadata .container-held-items .container-metadata {
  4610. position: relative;
  4611. }
  4612. .actor.sheet .inventory .container-metadata .container-held-items .container-metadata::before {
  4613. position: absolute;
  4614. border-left: 1px solid var(--alt);
  4615. top: 0;
  4616. height: 100%;
  4617. left: -5px;
  4618. width: 0px;
  4619. content: "";
  4620. }
  4621. .actor.sheet .inventory .container-metadata .container-held-items li:last-of-type .item::after,
  4622. .actor.sheet .inventory .container-metadata .container-held-items li:last-of-type .container-metadata::before {
  4623. border: none;
  4624. }
  4625. .actor.sheet .inventory .item-summary {
  4626. flex: 100%;
  4627. padding: 4px 8px 8px;
  4628. border-top: 1px solid var(--alt);
  4629. border-bottom: 1px solid var(--alt);
  4630. background: var(--bg);
  4631. }
  4632. .actor.sheet .inventory .encumbrance {
  4633. align-items: center;
  4634. display: grid;
  4635. grid: "img bar overflow" min-content/24px 1fr;
  4636. margin-top: auto;
  4637. }
  4638. .actor.sheet .inventory .encumbrance img {
  4639. border: none;
  4640. border-radius: 2px;
  4641. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  4642. border-radius: 0;
  4643. grid-area: img;
  4644. position: relative;
  4645. z-index: 4;
  4646. }
  4647. .actor.sheet .inventory .encumbrance .encumbrance-bar {
  4648. position: relative;
  4649. z-index: 2;
  4650. grid-area: bar;
  4651. height: 16px;
  4652. width: 100%;
  4653. background-color: var(--secondary);
  4654. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  4655. }
  4656. .actor.sheet .inventory .encumbrance .encumbrance-label {
  4657. position: relative;
  4658. z-index: 3;
  4659. grid-area: bar;
  4660. color: var(--text-light);
  4661. font-family: var(--serif);
  4662. font-size: var(--font-size-12);
  4663. font-weight: 500;
  4664. padding: 0 8px;
  4665. padding-top: 2px;
  4666. display: flex;
  4667. align-items: center;
  4668. justify-content: space-between;
  4669. width: 100%;
  4670. text-shadow: 0 0 2px black;
  4671. }
  4672. .actor.sheet .inventory .encumbrance .encumbrance-light-bulk-overflow {
  4673. position: relative;
  4674. z-index: 3;
  4675. grid-area: overflow;
  4676. color: var(--text-dark);
  4677. font-family: var(--serif);
  4678. font-size: var(--font-size-12);
  4679. font-weight: 500;
  4680. padding: 0 8px;
  4681. padding-top: 2px;
  4682. display: flex;
  4683. align-items: center;
  4684. justify-content: space-between;
  4685. width: 100%;
  4686. text-shadow: 0 0 2px white;
  4687. }
  4688. .actor.sheet .inventory .encumbrance .bar-bg {
  4689. position: relative;
  4690. z-index: 1;
  4691. grid-area: bar;
  4692. width: 100%;
  4693. height: 16px;
  4694. background-color: rgba(0, 0, 0, 0.5);
  4695. border-radius: 0 2px 2px 0;
  4696. box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.75);
  4697. }
  4698. .actor.sheet .inventory .encumbrance.over-limit .encumbrance-bar {
  4699. background-color: var(--primary) !important;
  4700. }
  4701. .actor.sheet .inventory .total-bulk {
  4702. align-items: center;
  4703. display: flex;
  4704. font-weight: 500;
  4705. gap: 0.25rem;
  4706. height: 1.5rem;
  4707. justify-content: start;
  4708. margin-bottom: 0.7rem;
  4709. }
  4710. .actor.sheet .inventory .total-bulk img {
  4711. border: none;
  4712. border-radius: 2px;
  4713. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  4714. height: 1.5rem;
  4715. width: 1.5rem;
  4716. border-radius: 0;
  4717. z-index: 1;
  4718. }
  4719. .actor.sheet .inventory .total-bulk .bar {
  4720. justify-content: start;
  4721. margin-top: 0;
  4722. position: relative;
  4723. height: 1.25rem;
  4724. padding-left: 0.5rem;
  4725. left: -0.35rem;
  4726. z-index: 0;
  4727. }
  4728. .actor.sheet .item-image {
  4729. display: flex;
  4730. cursor: pointer;
  4731. position: relative;
  4732. font-size: var(--font-size-16);
  4733. height: 24px;
  4734. min-width: 24px;
  4735. }
  4736. .actor.sheet .item-image.framed {
  4737. background-color: var(--tertiary);
  4738. }
  4739. .actor.sheet .item-image.framed img {
  4740. border-radius: 2px;
  4741. }
  4742. .actor.sheet .item-image.framed,
  4743. .actor.sheet .item-image.framed i {
  4744. border: none;
  4745. border-radius: 2px;
  4746. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  4747. }
  4748. .actor.sheet .item-image img {
  4749. border: none;
  4750. }
  4751. .actor.sheet .item-image i {
  4752. display: none;
  4753. position: absolute;
  4754. width: 100%;
  4755. height: 100%;
  4756. color: var(--text-dark);
  4757. box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.5);
  4758. }
  4759. .actor.sheet .item-image:hover i {
  4760. background: #f1eee9;
  4761. display: flex;
  4762. justify-content: center;
  4763. align-items: center;
  4764. }
  4765. .actor.sheet .alignment-select {
  4766. background-color: var(--color-bg-alignment);
  4767. border: 2px solid var(--color-border-trait);
  4768. color: var(--color-text-trait);
  4769. }
  4770. .actor.sheet .size-select {
  4771. background-color: var(--color-bg-size);
  4772. border: 2px solid var(--color-border-trait);
  4773. color: var(--color-text-trait);
  4774. }
  4775. .actor.sheet .rarity-select {
  4776. border: 2px solid var(--color-border-trait);
  4777. color: var(--color-text-trait);
  4778. }
  4779. .actor.sheet .rarity-select.common {
  4780. background-color: var(--color-rarity-common);
  4781. }
  4782. .actor.sheet .rarity-select.uncommon {
  4783. background-color: var(--color-rarity-uncommon);
  4784. }
  4785. .actor.sheet .rarity-select.rare {
  4786. background-color: var(--color-rarity-rare);
  4787. }
  4788. .actor.sheet .rarity-select.unique {
  4789. background-color: var(--color-rarity-unique);
  4790. }
  4791. .actor.sheet.character .attack-popout.actions {
  4792. gap: 0.5rem;
  4793. padding: 0;
  4794. margin-left: 0.25rem;
  4795. }
  4796. .actor.sheet.character .attack-popout.actions ol.actions-list + .actions-list {
  4797. margin-top: 0.5rem;
  4798. }
  4799. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .item-name {
  4800. align-items: start;
  4801. }
  4802. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .item-name .actions-title {
  4803. display: flex;
  4804. flex-direction: column;
  4805. }
  4806. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .item-name .item-image {
  4807. height: 32px;
  4808. width: 32px;
  4809. }
  4810. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group {
  4811. align-items: center;
  4812. display: flex;
  4813. flex-direction: row;
  4814. flex-wrap: nowrap;
  4815. font-size: var(--font-size-14);
  4816. margin-bottom: 0;
  4817. padding: 2px 0;
  4818. }
  4819. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group button {
  4820. border: none;
  4821. flex: 0;
  4822. gap: 2px;
  4823. height: 1.25rem;
  4824. line-height: unset;
  4825. margin: 0;
  4826. padding: 0 0.5em;
  4827. white-space: nowrap;
  4828. }
  4829. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group button:not(:disabled):hover {
  4830. box-shadow: none;
  4831. text-shadow: 0 0 2px var(--text-light);
  4832. }
  4833. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options {
  4834. align-items: center;
  4835. display: flex;
  4836. font-size: var(--font-size-14);
  4837. gap: 2px;
  4838. justify-content: center;
  4839. padding: 0 3px;
  4840. }
  4841. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options .title {
  4842. text-transform: uppercase;
  4843. }
  4844. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button {
  4845. align-items: center;
  4846. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  4847. display: flex;
  4848. justify-content: center;
  4849. width: 3ch;
  4850. }
  4851. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button.selected {
  4852. background: var(--text-dark);
  4853. }
  4854. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button.selected > .icon {
  4855. color: var(--bg-dark);
  4856. }
  4857. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button:not(disabled):hover {
  4858. box-shadow: inset 0 0 0 1px rgba(94, 0, 0, 0.5);
  4859. text-shadow: none;
  4860. }
  4861. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button:active {
  4862. text-shadow: 0 0 1px var(--primary);
  4863. }
  4864. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .alt-usage {
  4865. flex-basis: 100%;
  4866. margin-left: calc(3em - 2px);
  4867. position: relative;
  4868. }
  4869. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .alt-usage .alt-usage-icon {
  4870. border: none;
  4871. height: 1rem;
  4872. position: absolute;
  4873. left: -1.5em;
  4874. top: 0.2em;
  4875. }
  4876. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo,
  4877. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions {
  4878. margin-left: 2.5rem;
  4879. }
  4880. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo {
  4881. align-items: center;
  4882. display: flex;
  4883. gap: 3px;
  4884. margin-bottom: 2px;
  4885. }
  4886. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo select.linked {
  4887. font: normal var(--font-size-12) var(--sans-serif);
  4888. line-height: var(--font-size-12);
  4889. padding-top: 3px;
  4890. width: fit-content;
  4891. }
  4892. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo select.linked[data-compatible=false] {
  4893. color: rgba(255, 255, 255, 0.6);
  4894. }
  4895. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo select.linked option,
  4896. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo select.linked optgroup {
  4897. color: var(--text-light);
  4898. }
  4899. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo .magazine {
  4900. margin-right: 0.5rem;
  4901. font-family: var(--sans-serif);
  4902. font-weight: 600;
  4903. }
  4904. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo .magazine .icon {
  4905. display: inline-block;
  4906. width: 0.9rem;
  4907. height: 0.9rem;
  4908. background-image: url("../assets/icons/heavy-bullets.svg");
  4909. background-size: cover;
  4910. }
  4911. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions {
  4912. display: flex;
  4913. gap: 3px;
  4914. }
  4915. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions button select.modular {
  4916. appearance: auto;
  4917. background: none;
  4918. color: var(--text-dark);
  4919. cursor: default;
  4920. font: inherit;
  4921. margin-left: 0.5em;
  4922. padding: 0.15em 0.2em;
  4923. text-transform: uppercase;
  4924. }
  4925. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions button select.modular option {
  4926. background: var(--bg-dark);
  4927. }
  4928. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions button:has(select.modular:hover) {
  4929. text-shadow: none;
  4930. }
  4931. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .action-name {
  4932. justify-content: space-between;
  4933. }
  4934. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike:not(.ready) .auxiliary-actions {
  4935. justify-content: right;
  4936. }
  4937. .actor.sheet.character .attack-popout.actions ol.actions-list li.action .item-image:hover {
  4938. background: none;
  4939. }
  4940. .actor.sheet.character .attack-popout.actions ol.actions-list li.action .tracking {
  4941. align-items: center;
  4942. display: flex;
  4943. flex-direction: row;
  4944. flex-wrap: nowrap;
  4945. margin-left: auto;
  4946. margin-right: 1rem;
  4947. }
  4948. .actor.sheet.character .attack-popout.actions ol.actions-list li.action .tracking input {
  4949. width: 0;
  4950. flex: 0 1 4rem;
  4951. text-align: center;
  4952. }
  4953. .actor.sheet.character .attack-popout.actions ol.actions-list li.action .tracking span {
  4954. white-space: nowrap;
  4955. }
  4956. .actor.sheet.character .attack-popout.actions h4 {
  4957. flex: 1;
  4958. }
  4959. .actor.sheet.character .attack-popout.actions button.activate {
  4960. background: none;
  4961. border: 1px solid var(--color-border-dark);
  4962. border-radius: 5px;
  4963. flex: 0;
  4964. line-height: 1.25em;
  4965. opacity: 0.7;
  4966. margin-right: 0.5rem;
  4967. padding: 0 0.25rem;
  4968. }
  4969. .actor.sheet.character .attack-popout.actions button.activate.active, .actor.sheet.character .attack-popout.actions button.activate:hover {
  4970. background-color: var(--primary);
  4971. color: var(--text-light);
  4972. opacity: 1;
  4973. }
  4974. .actor.sheet.character .attack-popout.actions .item-controls {
  4975. display: flex;
  4976. min-width: 2.5em;
  4977. justify-content: end;
  4978. }
  4979. .actor.sheet.character .attack-popout .actions-container {
  4980. padding: 0 0.5rem 2rem 0;
  4981. }
  4982. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper {
  4983. justify-items: center;
  4984. }
  4985. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .action-radio {
  4986. display: none;
  4987. }
  4988. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels {
  4989. min-height: min-content;
  4990. width: 100%;
  4991. }
  4992. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-panel {
  4993. display: none;
  4994. }
  4995. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-panel.active {
  4996. display: flex;
  4997. flex-direction: column;
  4998. }
  4999. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options {
  5000. border-image-repeat: repeat;
  5001. border-image-slice: 11;
  5002. border-image-source: url("../assets/sheet/frame-elegant.svg");
  5003. border-image-width: 14px;
  5004. border-style: double;
  5005. display: flex;
  5006. flex-wrap: wrap;
  5007. margin-bottom: 0.5rem;
  5008. padding: 0.5rem 1rem;
  5009. }
  5010. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option {
  5011. align-items: center;
  5012. display: flex;
  5013. width: 100%;
  5014. margin: 1px 0;
  5015. }
  5016. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label * {
  5017. vertical-align: middle;
  5018. }
  5019. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label input {
  5020. margin: 0;
  5021. padding: 0;
  5022. }
  5023. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label .unchecked-disabled {
  5024. color: var(--color-text-dark-inactive);
  5025. }
  5026. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label select {
  5027. margin-left: 0.25em;
  5028. }
  5029. .actor.sheet.character .attack-popout ol.actions-list {
  5030. padding-left: 0;
  5031. }
  5032. .actor.sheet.character .attack-popout ol.actions-list li.action-header {
  5033. align-items: center;
  5034. display: flex;
  5035. }
  5036. .actor.sheet.character .attack-popout ol.actions-list li.action, .actor.sheet.character .attack-popout ol.actions-list li.strike {
  5037. border: solid transparent;
  5038. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  5039. border-width: 0 0 1px;
  5040. padding: 4px;
  5041. width: 100%;
  5042. }
  5043. .actor.sheet.character .attack-popout ol.actions-list li.action p:empty, .actor.sheet.character .attack-popout ol.actions-list li.strike p:empty {
  5044. display: none;
  5045. }
  5046. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name {
  5047. grid-area: icon-name;
  5048. align-items: center;
  5049. display: flex;
  5050. flex: 1;
  5051. margin: 0;
  5052. }
  5053. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name h4, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name h4 {
  5054. cursor: pointer;
  5055. margin: 0;
  5056. max-width: fit-content;
  5057. }
  5058. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name .item-image, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name .item-image {
  5059. display: flex;
  5060. justify-content: center;
  5061. align-items: center;
  5062. background-repeat: no-repeat;
  5063. background-size: contain;
  5064. color: transparent;
  5065. cursor: pointer;
  5066. font-size: var(--font-size-18);
  5067. height: 32px;
  5068. margin-right: 8px;
  5069. width: 32px;
  5070. }
  5071. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name .item-image:hover, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name .item-image:hover {
  5072. background: none;
  5073. color: var(--primary);
  5074. }
  5075. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name .actions-title, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name .actions-title {
  5076. flex: 1;
  5077. }
  5078. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name .actions-title .action-name, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name .actions-title .action-name {
  5079. display: flex;
  5080. flex-direction: row;
  5081. }
  5082. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name .actions-title .action-name > h4, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name .actions-title .action-name > h4 {
  5083. cursor: pointer;
  5084. }
  5085. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name .actions-title .action-name > h4:hover, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name .actions-title .action-name > h4:hover {
  5086. color: var(--primary);
  5087. }
  5088. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name .actions-title .action-name > h4:hover .action-glyph, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name .actions-title .action-name > h4:hover .action-glyph {
  5089. color: var(--text-dark);
  5090. }
  5091. .actor.sheet.character .attack-popout ol.actions-list li.action button.use-action, .actor.sheet.character .attack-popout ol.actions-list li.strike button.use-action {
  5092. align-items: center;
  5093. border-radius: 2px;
  5094. border: none;
  5095. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3), inset 0 0 0 2px rgba(0, 0, 0, 0.2);
  5096. display: flex;
  5097. flex: 0;
  5098. font: 500 var(--font-size-10) var(--sans-serif);
  5099. gap: 0.25em;
  5100. height: 2em;
  5101. justify-content: space-evenly;
  5102. letter-spacing: 0.05em;
  5103. margin: 0;
  5104. max-width: fit-content;
  5105. padding: 0.5em;
  5106. text-rendering: optimizeLegibility;
  5107. text-transform: uppercase;
  5108. white-space: nowrap;
  5109. }
  5110. .actor.sheet.character .attack-popout ol.actions-list li.action button.use-action:not(:disabled), .actor.sheet.character .attack-popout ol.actions-list li.strike button.use-action:not(:disabled) {
  5111. background: var(--bg-dark);
  5112. cursor: pointer;
  5113. }
  5114. .actor.sheet.character .attack-popout ol.actions-list li.action button.use-action:not(:disabled):hover, .actor.sheet.character .attack-popout ol.actions-list li.strike button.use-action:not(:disabled):hover {
  5115. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), inset 0 0 0 2px rgba(0, 0, 0, 0.4);
  5116. }
  5117. .actor.sheet.character .attack-popout ol.actions-list li.action button.use-action:not(:disabled):active, .actor.sheet.character .attack-popout ol.actions-list li.strike button.use-action:not(:disabled):active {
  5118. color: var(--primary);
  5119. }
  5120. .actor.sheet.character .attack-popout ol.actions-list li.action .item-controls, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-controls {
  5121. font-size: var(--font-size-12);
  5122. grid-area: controls;
  5123. white-space: nowrap;
  5124. }
  5125. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary {
  5126. flex-basis: 100%;
  5127. margin: 0.5rem 0;
  5128. }
  5129. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .title,
  5130. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .framing, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .title,
  5131. .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .framing {
  5132. color: var(--primary);
  5133. margin-top: 1em;
  5134. margin: 0;
  5135. padding: 0;
  5136. }
  5137. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .framing, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .framing {
  5138. color: var(--secondary);
  5139. margin: 1em 0 0.25em;
  5140. }
  5141. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .framing strong, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .framing strong {
  5142. font-weight: 500;
  5143. }
  5144. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .framing + p, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .framing + p {
  5145. margin-top: 0;
  5146. }
  5147. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary img, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary img {
  5148. border: none;
  5149. vertical-align: middle;
  5150. }
  5151. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary img.actionlight, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary img.actionlight {
  5152. background: var(--alt);
  5153. vertical-align: middle;
  5154. border: 1px solid var(--text-dark);
  5155. }
  5156. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .item-properties .tag.toggled-on:hover, .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .item-properties .tag.toggled-off:hover, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .item-properties .tag.toggled-on:hover, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .item-properties .tag.toggled-off:hover {
  5157. box-shadow: none;
  5158. text-shadow: 0 0 2px white;
  5159. }
  5160. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .item-properties .tag.toggled-on, .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .item-properties .tag.toggled-off, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .item-properties .tag.toggled-on, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .item-properties .tag.toggled-off {
  5161. cursor: pointer;
  5162. }
  5163. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .item-properties .tag.toggled-on, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .item-properties .tag.toggled-on {
  5164. background-color: rgba(23, 31, 105, 0.5);
  5165. color: var(--text-dark);
  5166. text-shadow: 0 0 2px white;
  5167. }
  5168. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary {
  5169. border-image-repeat: repeat;
  5170. border-image-slice: 11;
  5171. border-image-source: url("../assets/sheet/frame-elegant.svg");
  5172. border-image-width: 14px;
  5173. border-style: double;
  5174. padding: 0.5rem 1rem 1rem;
  5175. }
  5176. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary dd, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary dd {
  5177. margin: 0;
  5178. margin-bottom: 0.5rem;
  5179. }
  5180. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .tag.tag_secondary, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .tag.tag_secondary {
  5181. background-color: rgba(0, 0, 0, 0.8);
  5182. }
  5183. .actor.sheet.character .attack-popout ol.actions-list li.action.hidden, .actor.sheet.character .attack-popout ol.actions-list li.strike.hidden {
  5184. display: none;
  5185. }
  5186. .actor.sheet.character .attack-popout ol.actions-list li.action {
  5187. align-items: center;
  5188. column-gap: 0.5rem;
  5189. display: grid;
  5190. grid: "icon name tracking controls" 1fr "icon buttons tracking controls" auto "summary summary summary summary" auto/min-content 1fr 20% 10%;
  5191. }
  5192. .actor.sheet.character .attack-popout ol.actions-list li.action > .icon {
  5193. grid-area: icon;
  5194. height: 32px;
  5195. width: 32px;
  5196. }
  5197. .actor.sheet.character .attack-popout ol.actions-list li.action .name {
  5198. align-items: center;
  5199. grid-area: name;
  5200. display: flex;
  5201. margin-bottom: 0;
  5202. text-align: left;
  5203. }
  5204. .actor.sheet.character .attack-popout ol.actions-list li.action .button-group {
  5205. grid-area: buttons;
  5206. display: flex;
  5207. flex-wrap: wrap;
  5208. gap: 1px;
  5209. }
  5210. .actor.sheet.character .attack-popout ol.actions-list li.action .tracking {
  5211. grid-area: tracking;
  5212. }
  5213. .actor.sheet.character .attack-popout ol.actions-list li.action .item-controls {
  5214. grid-area: controls;
  5215. }
  5216. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary {
  5217. grid-area: summary;
  5218. }
  5219. .actor.sheet.character .attack-popout.actions {
  5220. margin: 0.25em 0.1em 0 0.4em;
  5221. }
  5222. .actor.sheet.character .attack-popout .actions-container {
  5223. padding: 0.5em 0 0.5em 0.4em;
  5224. }
  5225. .actor.sheet.character .attack-popout ol.actions-list li.strike {
  5226. border: unset;
  5227. }
  5228. .actor.sheet.character .attack-popout ol.actions-list li.strike .ammo select.linked {
  5229. -moz-appearance: none;
  5230. -webkit-appearance: none;
  5231. appearance: none;
  5232. background-color: var(--alt);
  5233. background-image: url("../assets/icons/chevron-down.svg");
  5234. background-position: right 0.25em top 50%;
  5235. background-repeat: no-repeat;
  5236. background-size: 1em auto;
  5237. border-radius: 2px;
  5238. border: 1px solid #53422a;
  5239. color: var(--text-light);
  5240. height: auto;
  5241. padding: 0.25rem 1.1rem 0.25rem 0.25rem;
  5242. position: relative;
  5243. text-overflow: ellipsis;
  5244. }
  5245. .actor.sheet.character .attack-popout ol.actions-list li.strike .ammo select.linked[data-compatible=false] {
  5246. color: rgba(255, 255, 255, 0.6);
  5247. }
  5248. .actor.sheet.character .attack-popout ol.actions-list li.strike .ammo select.linked option,
  5249. .actor.sheet.character .attack-popout ol.actions-list li.strike .ammo select.linked optgroup {
  5250. color: var(--text-light);
  5251. background-color: var(--alt);
  5252. }
  5253. .actor.sheet.character .crb-style .pf-rank {
  5254. font-family: var(--sans-serif);
  5255. font-size: var(--font-size-10);
  5256. text-transform: uppercase;
  5257. letter-spacing: 0.05em;
  5258. text-rendering: optimizeLegibility;
  5259. align-items: center;
  5260. background: var(--color-proficiency-untrained);
  5261. border-radius: 2px;
  5262. border: 1px solid rgba(0, 0, 0, 0.5);
  5263. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  5264. color: var(--text-light);
  5265. cursor: pointer;
  5266. display: flex;
  5267. font-weight: 500;
  5268. justify-content: center;
  5269. padding: 2px 1px 1px 1px;
  5270. text-align-last: center;
  5271. }
  5272. .actor.sheet.character .crb-style .pf-rank.readonly {
  5273. pointer-events: none;
  5274. }
  5275. .actor.sheet.character .crb-style .pf-rank option[value="0"] {
  5276. background: var(--color-proficiency-untrained);
  5277. }
  5278. .actor.sheet.character .crb-style .pf-rank.trained, .actor.sheet.character .crb-style .pf-rank[data-rank="1"],
  5279. .actor.sheet.character .crb-style .pf-rank option[value="1"] {
  5280. background: var(--color-proficiency-trained);
  5281. }
  5282. .actor.sheet.character .crb-style .pf-rank.expert, .actor.sheet.character .crb-style .pf-rank[data-rank="2"],
  5283. .actor.sheet.character .crb-style .pf-rank option[value="2"] {
  5284. background: var(--color-proficiency-expert);
  5285. }
  5286. .actor.sheet.character .crb-style .pf-rank.master, .actor.sheet.character .crb-style .pf-rank[data-rank="3"],
  5287. .actor.sheet.character .crb-style .pf-rank option[value="3"] {
  5288. background: var(--color-proficiency-master);
  5289. }
  5290. .actor.sheet.character .crb-style .pf-rank.legendary, .actor.sheet.character .crb-style .pf-rank[data-rank="4"],
  5291. .actor.sheet.character .crb-style .pf-rank option[value="4"] {
  5292. background: var(--color-proficiency-legendary);
  5293. }
  5294. .actor.sheet.character .crb-style span.pf-rank {
  5295. min-width: 61px;
  5296. pointer-events: none;
  5297. }
  5298. .actor.sheet.character .crb-style aside .sidebar a.roll-icon.rest {
  5299. padding-bottom: 0;
  5300. }
  5301. .actor.sheet.character .crb-style aside .sidebar .class-dc.secondary {
  5302. margin-top: 0.2em;
  5303. }
  5304. .actor.sheet.character .crb-style aside .sidebar .class-dc .classdc-rank {
  5305. align-items: center;
  5306. display: flex;
  5307. gap: 0.5em;
  5308. }
  5309. .actor.sheet.character .crb-style header.char-header .char-details .dots {
  5310. display: flex;
  5311. font-size: var(--font-size-10);
  5312. }
  5313. .actor.sheet.character .crb-style header.char-header .char-details .dots .label {
  5314. color: var(--sidebar-label);
  5315. padding-left: 3px;
  5316. margin-right: 8px;
  5317. font-weight: 700;
  5318. }
  5319. .actor.sheet.character .crb-style header.char-header .char-level .exp-data {
  5320. display: flex;
  5321. flex-direction: column;
  5322. justify-content: space-between;
  5323. padding: 0.5em 0;
  5324. position: relative;
  5325. }
  5326. .actor.sheet.character .crb-style header.char-header .char-level .exp-data .exp-input {
  5327. font-size: var(--font-size-13);
  5328. height: 1.5em;
  5329. }
  5330. .actor.sheet.character .crb-style header.char-header .char-level .exp-data .exp-input input {
  5331. color: var(--text-light);
  5332. font-family: var(--sans-serif);
  5333. text-align: right;
  5334. width: 3em;
  5335. }
  5336. .actor.sheet.character .crb-style header.char-header .char-level .exp-data .exp-input .slash {
  5337. color: var(--sidebar-label);
  5338. }
  5339. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress {
  5340. background-color: unset;
  5341. border: 1px solid rgba(255, 255, 255, 0.1);
  5342. border-left: none;
  5343. bottom: 7px;
  5344. box-shadow: 0 0 2px var(--sidebar-label);
  5345. height: 5px;
  5346. left: -9px;
  5347. position: absolute;
  5348. width: 7em;
  5349. }
  5350. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress::-moz-progress-bar {
  5351. background: var(--sidebar-title);
  5352. }
  5353. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress::-webkit-progress-bar {
  5354. background: rgba(0, 0, 0, 0.2);
  5355. }
  5356. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress::-webkit-progress-value {
  5357. background: var(--sidebar-title);
  5358. }
  5359. .actor.sheet.character .crb-style nav.sheet-navigation .item.to-hide {
  5360. opacity: 45%;
  5361. }
  5362. .actor.sheet.character .crb-style nav.sheet-navigation .item.hidden {
  5363. display: none;
  5364. }
  5365. .actor.sheet.character .crb-style nav.sheet-navigation .item .pfs-icon {
  5366. clip-rule: evenodd;
  5367. fill-rule: evenodd;
  5368. padding: 4px;
  5369. position: relative;
  5370. stroke-linejoin: round;
  5371. stroke-miterlimit: 2;
  5372. top: -1px;
  5373. }
  5374. .actor.sheet.character .crb-style nav.sheet-navigation .item .pfs-icon path {
  5375. fill-rule: nonzero;
  5376. }
  5377. .actor.sheet.character .crb-style nav.sheet-navigation .manage-tabs {
  5378. color: var(--text-light);
  5379. margin: 0;
  5380. padding: 0 6px;
  5381. }
  5382. .actor.sheet.character .crb-style .sheet-body .sheet-content > .tab.active {
  5383. display: flex;
  5384. height: 100%;
  5385. }
  5386. .actor.sheet.character .crb-style .sheet-body .sheet-content > .tab:not(.inventory, .actions),
  5387. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab-content {
  5388. overflow: hidden scroll;
  5389. flex-grow: 1;
  5390. min-height: 0;
  5391. overflow: hidden scroll;
  5392. }
  5393. .actor.sheet.character .crb-style .sheet-body .sheet-content nav + .tab-content {
  5394. padding-top: 0.75rem;
  5395. }
  5396. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header {
  5397. position: relative;
  5398. margin-top: 0.75em;
  5399. font-size: var(--font-size-16);
  5400. font-family: var(--serif);
  5401. font-weight: 600;
  5402. color: var(--primary);
  5403. line-height: 1;
  5404. border-bottom: 1px solid var(--color-border-divider);
  5405. }
  5406. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header > button, .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header > .controls {
  5407. position: absolute;
  5408. bottom: -1px;
  5409. right: 0;
  5410. }
  5411. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header .controls {
  5412. display: flex;
  5413. }
  5414. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header button {
  5415. background: transparent;
  5416. border-radius: 2px 2px 0 0;
  5417. border: 1px solid var(--color-border-divider);
  5418. color: var(--primary);
  5419. cursor: pointer;
  5420. font-family: var(--sans-serif);
  5421. font-size: var(--font-size-12);
  5422. font-weight: 500;
  5423. height: 20px;
  5424. line-height: var(--font-size-12);
  5425. margin: 0;
  5426. outline: none;
  5427. text-transform: uppercase;
  5428. width: auto;
  5429. }
  5430. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header button.has-unallocated {
  5431. animation: glow 0.75s infinite alternate;
  5432. }
  5433. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image {
  5434. cursor: pointer;
  5435. display: flex;
  5436. font-size: var(--font-size-16);
  5437. height: 24px;
  5438. min-width: 24px;
  5439. position: relative;
  5440. width: 24px;
  5441. }
  5442. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image img {
  5443. border: none;
  5444. }
  5445. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image i {
  5446. display: none;
  5447. position: absolute;
  5448. width: 100%;
  5449. height: 100%;
  5450. color: var(--text-dark);
  5451. }
  5452. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image:hover i {
  5453. background: #f1eee9;
  5454. display: flex;
  5455. justify-content: center;
  5456. align-items: center;
  5457. }
  5458. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed {
  5459. background-color: var(--tertiary);
  5460. }
  5461. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed,
  5462. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed i {
  5463. border: none;
  5464. border-radius: 2px;
  5465. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  5466. }
  5467. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab {
  5468. flex-direction: column;
  5469. }
  5470. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character select {
  5471. width: calc(100% - 6px);
  5472. background-color: var(--alt);
  5473. border: 1px solid #605041;
  5474. }
  5475. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character select:disabled {
  5476. cursor: initial;
  5477. }
  5478. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character hr {
  5479. margin: 10px 6px 10px 0;
  5480. }
  5481. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 {
  5482. background-color: rgba(28, 28, 28, 0.1);
  5483. border: none;
  5484. color: var(--text-dark);
  5485. display: flex;
  5486. font: 700 var(--font-size-14) var(--body-serif);
  5487. grid-area: mod;
  5488. line-height: 1;
  5489. margin: 0;
  5490. padding: 8px 4px 6px;
  5491. width: calc(100% - 6px);
  5492. }
  5493. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 a {
  5494. margin-left: auto;
  5495. }
  5496. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 a i {
  5497. position: relative;
  5498. right: -2px;
  5499. top: -2px;
  5500. float: right;
  5501. }
  5502. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 span.value {
  5503. display: inline-block;
  5504. max-width: 87%;
  5505. overflow: hidden;
  5506. text-overflow: ellipsis;
  5507. white-space: nowrap;
  5508. }
  5509. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details {
  5510. display: grid;
  5511. grid: "img alignment deity" 46px "img details details" auto/120px 130px 1fr;
  5512. margin-top: 4px;
  5513. }
  5514. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .image-container {
  5515. grid-area: img;
  5516. margin-left: 0.25rem;
  5517. z-index: 3;
  5518. }
  5519. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .image-container .actor-image {
  5520. border: none;
  5521. box-shadow: 0 0 0 1px #918c88, 0 0 0 2px #e1d8cf, 0 0 0 3px #a98f39, inset 0 0 8px rgba(0, 0, 0, 0.5), 0 0 8px black;
  5522. border-radius: 0;
  5523. max-height: 11rem;
  5524. object-fit: cover;
  5525. object-position: top;
  5526. width: 100%;
  5527. }
  5528. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment {
  5529. grid-area: alignment;
  5530. position: relative;
  5531. display: flex;
  5532. align-items: center;
  5533. justify-content: center;
  5534. background: url("../assets/sheet/banner-bg.webp") repeat-x center;
  5535. z-index: 1;
  5536. }
  5537. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment .bio-alignment {
  5538. position: absolute;
  5539. left: 0;
  5540. }
  5541. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment select {
  5542. background: none;
  5543. border: none;
  5544. box-shadow: none;
  5545. color: var(--text-dark);
  5546. cursor: pointer;
  5547. display: block;
  5548. font-family: var(--body-serif);
  5549. font-size: var(--font-size-14);
  5550. font-weight: 700;
  5551. outline: none;
  5552. overflow-x: visible;
  5553. padding-left: 8px;
  5554. width: auto;
  5555. line-height: 1;
  5556. text-transform: capitalize;
  5557. margin-top: 2px;
  5558. }
  5559. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment select option {
  5560. color: var(--text-light);
  5561. font: initial;
  5562. }
  5563. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment input[type=text] {
  5564. font: 700 var(--font-size-14) var(--body-serif);
  5565. text-align: center;
  5566. max-width: 138px;
  5567. }
  5568. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment::after {
  5569. position: absolute;
  5570. content: "";
  5571. height: 46px;
  5572. width: 15px;
  5573. top: 0;
  5574. right: -11px;
  5575. background: url("../assets/sheet/banner-bg2.webp") no-repeat right;
  5576. }
  5577. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity {
  5578. align-items: center;
  5579. display: flex;
  5580. grid-area: deity;
  5581. margin-left: auto;
  5582. min-width: 10em;
  5583. padding-bottom: 0.7em;
  5584. }
  5585. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input {
  5586. display: flex;
  5587. flex-flow: column wrap;
  5588. justify-content: end;
  5589. }
  5590. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input span {
  5591. text-align: right;
  5592. }
  5593. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input h3 {
  5594. min-width: 9em;
  5595. }
  5596. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input h3 span {
  5597. max-width: 10em;
  5598. }
  5599. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity img.symbol {
  5600. border: none;
  5601. box-shadow: 0 0 0 1px #918c88, 0 0 0 2px #e1d8cf, 0 0 0 3px #a98f39, inset 0 0 8px rgba(0, 0, 0, 0.5), 0 0 8px black;
  5602. border-radius: 50%;
  5603. height: 32px;
  5604. margin: 0.5rem 0 0 0.5rem;
  5605. width: 32px;
  5606. }
  5607. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-sheet {
  5608. grid-area: details;
  5609. display: grid;
  5610. grid-template-columns: 44% 55%;
  5611. grid-template-rows: repeat(2, 42px);
  5612. grid-row-gap: 8px;
  5613. padding-left: 12px;
  5614. margin-top: 8px;
  5615. }
  5616. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-sheet .pc_heritage, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-sheet .pc_background, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-sheet .pc_weight {
  5617. margin: 0;
  5618. }
  5619. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-sheet .detail-small {
  5620. display: flex;
  5621. }
  5622. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control {
  5623. cursor: pointer;
  5624. margin-left: auto;
  5625. }
  5626. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control i.fa-ellipsis-v:hover {
  5627. text-shadow: 0 0 8px var(--color-shadow-primary);
  5628. }
  5629. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control #context-menu {
  5630. left: -85px;
  5631. min-width: 105px;
  5632. padding: 0;
  5633. text-align: left;
  5634. }
  5635. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control #context-menu .context-item {
  5636. font-family: var(--font-primary);
  5637. font-weight: normal;
  5638. min-width: 105px;
  5639. }
  5640. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control #context-menu .context-item i {
  5641. position: static;
  5642. float: none;
  5643. }
  5644. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background {
  5645. display: flex;
  5646. flex-wrap: wrap;
  5647. }
  5648. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background label {
  5649. align-items: start;
  5650. display: flex;
  5651. flex: 1 0 0;
  5652. flex-direction: column;
  5653. justify-content: start;
  5654. margin-bottom: 8px;
  5655. }
  5656. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background label span {
  5657. width: 100%;
  5658. }
  5659. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits {
  5660. display: flex;
  5661. flex-wrap: wrap;
  5662. }
  5663. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .tags {
  5664. width: 100%;
  5665. }
  5666. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc {
  5667. display: flex;
  5668. flex-direction: column;
  5669. justify-content: start;
  5670. align-items: start;
  5671. flex: 20%;
  5672. margin-bottom: 8px;
  5673. }
  5674. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc span {
  5675. width: 100%;
  5676. }
  5677. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc span.speed * {
  5678. width: 50%;
  5679. }
  5680. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_land-speed, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_size {
  5681. flex: 50%;
  5682. }
  5683. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_speed-types {
  5684. flex: 50%;
  5685. }
  5686. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_senses {
  5687. flex: 50%;
  5688. }
  5689. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_languages {
  5690. flex: 50%;
  5691. margin-bottom: 0;
  5692. }
  5693. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_traits {
  5694. flex: 50%;
  5695. margin-bottom: 0;
  5696. }
  5697. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc label,
  5698. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc h4 {
  5699. margin: 0;
  5700. white-space: nowrap;
  5701. }
  5702. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc .tags {
  5703. margin: 0;
  5704. padding: 0;
  5705. }
  5706. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc .tags,
  5707. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc select,
  5708. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc input,
  5709. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc h3 {
  5710. margin-top: 4px;
  5711. }
  5712. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes {
  5713. margin: 0;
  5714. padding: 0;
  5715. display: grid;
  5716. gap: 12px;
  5717. grid: 1fr/repeat(6, 1fr);
  5718. justify-content: center;
  5719. list-style: none;
  5720. }
  5721. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute {
  5722. display: grid;
  5723. grid: "abbrev" auto "mod" 1fr "label" auto/1fr;
  5724. column-gap: 10px;
  5725. align-items: center;
  5726. }
  5727. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute:focus-within .abbreviation {
  5728. filter: opacity(1);
  5729. }
  5730. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute.key .abbreviation,
  5731. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute.key .modifier {
  5732. color: var(--secondary);
  5733. }
  5734. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation {
  5735. margin: 0;
  5736. padding: 0;
  5737. border: none;
  5738. color: var(--primary);
  5739. font: 400 22px var(--serif-condensed);
  5740. grid-area: abbrev;
  5741. position: relative;
  5742. text-align: center;
  5743. text-transform: capitalize;
  5744. }
  5745. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.key,
  5746. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.apex {
  5747. bottom: 4px;
  5748. position: absolute;
  5749. font-size: var(--font-size-12);
  5750. }
  5751. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.key {
  5752. left: 2px;
  5753. }
  5754. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.apex {
  5755. right: 2px;
  5756. }
  5757. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.apex.unselected:not(:hover) {
  5758. opacity: 0.75;
  5759. }
  5760. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute h3.modifier {
  5761. display: flex;
  5762. justify-content: center;
  5763. align-items: center;
  5764. border-image-repeat: repeat;
  5765. border-image-slice: 11;
  5766. border-image-source: url("../assets/sheet/frame-elegant.svg");
  5767. border-image-width: 14px;
  5768. border-style: double;
  5769. grid-area: mod;
  5770. font-size: var(--font-size-24);
  5771. font-family: var(--serif);
  5772. font-weight: 700;
  5773. height: 46px;
  5774. margin: 0;
  5775. padding-right: 4px;
  5776. }
  5777. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .label {
  5778. color: rgb(68, 55, 48);
  5779. grid-area: label;
  5780. margin: 0;
  5781. opacity: 0.4;
  5782. padding: 2px;
  5783. text-align: center;
  5784. }
  5785. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions {
  5786. gap: 0.5rem;
  5787. padding: 0;
  5788. margin-left: 0.25rem;
  5789. }
  5790. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list + .actions-list {
  5791. margin-top: 0.5rem;
  5792. }
  5793. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name {
  5794. align-items: start;
  5795. }
  5796. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .actions-title {
  5797. display: flex;
  5798. flex-direction: column;
  5799. }
  5800. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .item-image {
  5801. height: 32px;
  5802. width: 32px;
  5803. }
  5804. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group {
  5805. align-items: center;
  5806. display: flex;
  5807. flex-direction: row;
  5808. flex-wrap: nowrap;
  5809. font-size: var(--font-size-14);
  5810. margin-bottom: 0;
  5811. padding: 2px 0;
  5812. }
  5813. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group button {
  5814. border: none;
  5815. flex: 0;
  5816. gap: 2px;
  5817. height: 1.25rem;
  5818. line-height: unset;
  5819. margin: 0;
  5820. padding: 0 0.5em;
  5821. white-space: nowrap;
  5822. }
  5823. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group button:not(:disabled):hover {
  5824. box-shadow: none;
  5825. text-shadow: 0 0 2px var(--text-light);
  5826. }
  5827. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options {
  5828. align-items: center;
  5829. display: flex;
  5830. font-size: var(--font-size-14);
  5831. gap: 2px;
  5832. justify-content: center;
  5833. padding: 0 3px;
  5834. }
  5835. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options .title {
  5836. text-transform: uppercase;
  5837. }
  5838. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button {
  5839. align-items: center;
  5840. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  5841. display: flex;
  5842. justify-content: center;
  5843. width: 3ch;
  5844. }
  5845. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button.selected {
  5846. background: var(--text-dark);
  5847. }
  5848. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button.selected > .icon {
  5849. color: var(--bg-dark);
  5850. }
  5851. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button:not(disabled):hover {
  5852. box-shadow: inset 0 0 0 1px rgba(94, 0, 0, 0.5);
  5853. text-shadow: none;
  5854. }
  5855. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button:active {
  5856. text-shadow: 0 0 1px var(--primary);
  5857. }
  5858. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .alt-usage {
  5859. flex-basis: 100%;
  5860. margin-left: calc(3em - 2px);
  5861. position: relative;
  5862. }
  5863. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .alt-usage .alt-usage-icon {
  5864. border: none;
  5865. height: 1rem;
  5866. position: absolute;
  5867. left: -1.5em;
  5868. top: 0.2em;
  5869. }
  5870. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo,
  5871. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions {
  5872. margin-left: 2.5rem;
  5873. }
  5874. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo {
  5875. align-items: center;
  5876. display: flex;
  5877. gap: 3px;
  5878. margin-bottom: 2px;
  5879. }
  5880. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo select.linked {
  5881. font: normal var(--font-size-12) var(--sans-serif);
  5882. line-height: var(--font-size-12);
  5883. padding-top: 3px;
  5884. width: fit-content;
  5885. }
  5886. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo select.linked[data-compatible=false] {
  5887. color: rgba(255, 255, 255, 0.6);
  5888. }
  5889. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo select.linked option,
  5890. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo select.linked optgroup {
  5891. color: var(--text-light);
  5892. }
  5893. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo .magazine {
  5894. margin-right: 0.5rem;
  5895. font-family: var(--sans-serif);
  5896. font-weight: 600;
  5897. }
  5898. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo .magazine .icon {
  5899. display: inline-block;
  5900. width: 0.9rem;
  5901. height: 0.9rem;
  5902. background-image: url("../assets/icons/heavy-bullets.svg");
  5903. background-size: cover;
  5904. }
  5905. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions {
  5906. display: flex;
  5907. gap: 3px;
  5908. }
  5909. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions button select.modular {
  5910. appearance: auto;
  5911. background: none;
  5912. color: var(--text-dark);
  5913. cursor: default;
  5914. font: inherit;
  5915. margin-left: 0.5em;
  5916. padding: 0.15em 0.2em;
  5917. text-transform: uppercase;
  5918. }
  5919. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions button select.modular option {
  5920. background: var(--bg-dark);
  5921. }
  5922. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions button:has(select.modular:hover) {
  5923. text-shadow: none;
  5924. }
  5925. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .action-name {
  5926. justify-content: space-between;
  5927. }
  5928. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike:not(.ready) .auxiliary-actions {
  5929. justify-content: right;
  5930. }
  5931. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-image:hover {
  5932. background: none;
  5933. }
  5934. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .tracking {
  5935. align-items: center;
  5936. display: flex;
  5937. flex-direction: row;
  5938. flex-wrap: nowrap;
  5939. margin-left: auto;
  5940. margin-right: 1rem;
  5941. }
  5942. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .tracking input {
  5943. width: 0;
  5944. flex: 0 1 4rem;
  5945. text-align: center;
  5946. }
  5947. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .tracking span {
  5948. white-space: nowrap;
  5949. }
  5950. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions h4 {
  5951. flex: 1;
  5952. }
  5953. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate {
  5954. background: none;
  5955. border: 1px solid var(--color-border-dark);
  5956. border-radius: 5px;
  5957. flex: 0;
  5958. line-height: 1.25em;
  5959. opacity: 0.7;
  5960. margin-right: 0.5rem;
  5961. padding: 0 0.25rem;
  5962. }
  5963. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.active, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate:hover {
  5964. background-color: var(--primary);
  5965. color: var(--text-light);
  5966. opacity: 1;
  5967. }
  5968. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .item-controls {
  5969. display: flex;
  5970. min-width: 2.5em;
  5971. justify-content: end;
  5972. }
  5973. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list {
  5974. gap: 0.2em;
  5975. padding-bottom: 1em;
  5976. }
  5977. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item {
  5978. display: flex;
  5979. flex-wrap: wrap;
  5980. align-items: center;
  5981. justify-content: space-between;
  5982. padding: 2px 4px 2px 12px;
  5983. width: 100%;
  5984. }
  5985. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item p:empty {
  5986. display: none;
  5987. }
  5988. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-name {
  5989. display: flex;
  5990. align-items: center;
  5991. flex: 1;
  5992. }
  5993. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-name h4 {
  5994. cursor: pointer;
  5995. margin: 0;
  5996. }
  5997. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-name .item-image {
  5998. margin-right: 8px;
  5999. }
  6000. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-controls {
  6001. display: flex;
  6002. flex: 0;
  6003. font-size: var(--font-size-12);
  6004. gap: 1px;
  6005. white-space: nowrap;
  6006. }
  6007. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-controls a.info-only:hover {
  6008. cursor: default;
  6009. text-shadow: none;
  6010. }
  6011. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-controls a + a {
  6012. margin-left: 4px;
  6013. }
  6014. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary {
  6015. flex-basis: 100%;
  6016. }
  6017. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item.unidentified {
  6018. border-radius: 1px;
  6019. outline: 1px dotted rgba(75, 74, 68, 0.5);
  6020. background: var(--visibility-gm-bg);
  6021. }
  6022. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .button-group {
  6023. display: flex;
  6024. justify-content: flex-end;
  6025. align-items: center;
  6026. flex-wrap: nowrap;
  6027. width: 50%;
  6028. flex: 0;
  6029. }
  6030. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .button-group button {
  6031. margin: 0;
  6032. border: none;
  6033. cursor: pointer;
  6034. font-family: var(--sans-serif);
  6035. font-size: var(--font-size-10);
  6036. text-transform: uppercase;
  6037. letter-spacing: 0.05em;
  6038. text-rendering: optimizeLegibility;
  6039. padding: 5px;
  6040. color: var(--text-light);
  6041. width: 70px;
  6042. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  6043. background: var(--secondary);
  6044. border-radius: 2px;
  6045. flex: 0;
  6046. white-space: nowrap;
  6047. margin-left: 4px;
  6048. flex: 0;
  6049. }
  6050. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .button-group button:hover {
  6051. box-shadow: none;
  6052. text-shadow: 0 0 2px white;
  6053. }
  6054. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item {
  6055. border-top: 1px solid #d5cac1;
  6056. border: solid transparent;
  6057. border-width: 0 0 1px;
  6058. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  6059. }
  6060. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item:last-child {
  6061. border-bottom: none;
  6062. }
  6063. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item-name h4 {
  6064. font-family: var(--serif);
  6065. }
  6066. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry {
  6067. align-items: center;
  6068. display: flex;
  6069. flex-wrap: wrap;
  6070. margin-bottom: 0.25em;
  6071. padding-bottom: 1em;
  6072. }
  6073. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry:first-child .action-header {
  6074. justify-content: start;
  6075. }
  6076. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable .d20-svg {
  6077. width: var(--font-size-14);
  6078. height: var(--font-size-14);
  6079. }
  6080. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable .d20-svg path {
  6081. fill: black;
  6082. }
  6083. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable:hover svg {
  6084. animation: rotation 2s infinite linear;
  6085. }
  6086. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data {
  6087. align-items: center;
  6088. display: flex;
  6089. flex: 1;
  6090. gap: 1rem;
  6091. margin: 0.5em 0.25rem;
  6092. }
  6093. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data section {
  6094. display: flex;
  6095. align-items: center;
  6096. }
  6097. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .rollable {
  6098. cursor: pointer;
  6099. }
  6100. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data button {
  6101. width: auto;
  6102. line-height: 1.5em;
  6103. padding-top: 1px;
  6104. margin-bottom: 1px;
  6105. }
  6106. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data button i {
  6107. font-size: 0.9em;
  6108. }
  6109. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .skill-score {
  6110. font-family: var(--serif);
  6111. font-weight: bold;
  6112. font-size: 1rem;
  6113. letter-spacing: -1px;
  6114. line-height: 1;
  6115. color: var(--secondary);
  6116. }
  6117. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values {
  6118. display: flex;
  6119. gap: 0.5rem;
  6120. }
  6121. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values .skill-data {
  6122. display: flex;
  6123. gap: 0.25rem;
  6124. white-space: nowrap;
  6125. }
  6126. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values h4 {
  6127. white-space: nowrap;
  6128. }
  6129. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values .rollable {
  6130. gap: 0.1rem;
  6131. }
  6132. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool {
  6133. cursor: pointer;
  6134. gap: 0.25em;
  6135. position: relative;
  6136. }
  6137. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool img.pool-size {
  6138. border: none;
  6139. width: 34px;
  6140. height: 32px;
  6141. }
  6142. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool .pips {
  6143. display: flex;
  6144. font-size: var(--font-size-10);
  6145. gap: 1px;
  6146. }
  6147. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool .pips i {
  6148. padding-bottom: 0.08rem;
  6149. }
  6150. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool h4 {
  6151. white-space: nowrap;
  6152. }
  6153. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .spell-ability {
  6154. gap: 0.5em;
  6155. margin-left: auto;
  6156. }
  6157. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .spell-ability .spell-tradition {
  6158. font-family: var(--body-serif);
  6159. font-weight: 600;
  6160. }
  6161. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .pf-rank {
  6162. margin-bottom: 0.13rem;
  6163. }
  6164. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellbook-empty {
  6165. margin: 8px 0;
  6166. background: none;
  6167. border: none;
  6168. }
  6169. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .pf-add-item-row {
  6170. grid-column: span 4;
  6171. text-align: center;
  6172. width: 100%;
  6173. display: flex;
  6174. justify-content: space-evenly;
  6175. }
  6176. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .pf-add-item-row a {
  6177. width: 100%;
  6178. margin-bottom: 12px;
  6179. }
  6180. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane {
  6181. margin: 0;
  6182. padding: 0;
  6183. }
  6184. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies h1,
  6185. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies h4,
  6186. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies h6 {
  6187. margin: 0;
  6188. padding: 0;
  6189. line-height: 1;
  6190. display: flex;
  6191. align-items: center;
  6192. }
  6193. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies h6 {
  6194. padding: 2px 4px;
  6195. border-radius: 2px;
  6196. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  6197. font-family: var(--sans-serif);
  6198. font-size: var(--font-size-10);
  6199. text-transform: uppercase;
  6200. letter-spacing: 0.05em;
  6201. text-rendering: optimizeLegibility;
  6202. color: var(--text-light);
  6203. display: flex;
  6204. justify-content: center;
  6205. align-items: center;
  6206. cursor: pointer;
  6207. }
  6208. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .core-title {
  6209. width: 100%;
  6210. text-align: left;
  6211. margin: 0;
  6212. padding: 0;
  6213. margin-left: 0;
  6214. padding-top: 10px;
  6215. padding-left: 12px;
  6216. height: 43px;
  6217. border: none;
  6218. color: var(--text-light);
  6219. font-family: var(--serif);
  6220. }
  6221. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list,
  6222. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list,
  6223. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list {
  6224. list-style: none;
  6225. margin: 0;
  6226. padding: 0;
  6227. display: grid;
  6228. grid-template-columns: repeat(2, 1fr);
  6229. gap: 12px;
  6230. align-items: center;
  6231. margin-bottom: 2em;
  6232. }
  6233. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill,
  6234. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill,
  6235. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill {
  6236. border-image-repeat: repeat;
  6237. border-image-slice: 11;
  6238. border-image-source: url("../assets/sheet/frame-elegant.svg");
  6239. border-image-width: 14px;
  6240. border-style: double;
  6241. padding: 2px 15px 2px 4px;
  6242. display: flex;
  6243. align-items: center;
  6244. }
  6245. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .rollable,
  6246. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .rollable,
  6247. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .rollable {
  6248. cursor: pointer;
  6249. }
  6250. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .rollable:hover,
  6251. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .rollable:hover,
  6252. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .rollable:hover {
  6253. color: var(--primary);
  6254. text-shadow: 0 0 2px white;
  6255. }
  6256. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .rollable:hover .skill-score,
  6257. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .rollable:hover .skill-score,
  6258. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .rollable:hover .skill-score {
  6259. text-decoration: underline;
  6260. }
  6261. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .skill-score,
  6262. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .skill-score,
  6263. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .skill-score {
  6264. color: var(--primary);
  6265. font-family: var(--serif);
  6266. font-size: var(--font-size-24);
  6267. font-weight: 600;
  6268. line-height: 1;
  6269. text-align: end;
  6270. margin-right: 4px;
  6271. width: 2.5rem;
  6272. }
  6273. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .skill-name,
  6274. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .skill-name,
  6275. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .skill-name {
  6276. display: flex;
  6277. align-items: center;
  6278. flex: 1;
  6279. }
  6280. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .button-group,
  6281. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group,
  6282. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group {
  6283. display: flex;
  6284. align-items: center;
  6285. justify-content: center;
  6286. flex-wrap: wrap;
  6287. flex-direction: column;
  6288. }
  6289. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .button-group h6,
  6290. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group h6,
  6291. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group h6 {
  6292. margin: 1px 0;
  6293. background: var(--sub);
  6294. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
  6295. }
  6296. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .button-group h6:hover,
  6297. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group h6:hover,
  6298. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group h6:hover {
  6299. background: var(--primary);
  6300. }
  6301. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill.custom,
  6302. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill.custom,
  6303. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill.custom {
  6304. position: relative;
  6305. }
  6306. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill.custom a.delete,
  6307. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill.custom a.delete,
  6308. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill.custom a.delete {
  6309. position: absolute;
  6310. top: -8px;
  6311. right: -8px;
  6312. z-index: -1;
  6313. opacity: 0.75;
  6314. }
  6315. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill.custom a.delete:hover,
  6316. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill.custom a.delete:hover,
  6317. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill.custom a.delete:hover {
  6318. z-index: 1;
  6319. opacity: 1;
  6320. }
  6321. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill.custom:hover a.delete,
  6322. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill.custom:hover a.delete,
  6323. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill.custom:hover a.delete {
  6324. z-index: 1;
  6325. }
  6326. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill,
  6327. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill {
  6328. grid: "score name btn" min-content/42px 2fr 1fr;
  6329. padding: 2px 15px 2px 6px;
  6330. }
  6331. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input,
  6332. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input {
  6333. color: var(--text-dark);
  6334. border-bottom: 1px solid var(--sub);
  6335. margin-right: 4px;
  6336. font-weight: 600;
  6337. }
  6338. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input:hover,
  6339. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input:hover {
  6340. border: 1px solid var(--sub);
  6341. }
  6342. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group,
  6343. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group {
  6344. flex-direction: row;
  6345. flex-wrap: nowrap;
  6346. margin-left: auto;
  6347. }
  6348. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group .item-controls,
  6349. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group .item-controls {
  6350. font-size: var(--font-size-12);
  6351. margin-top: 1px;
  6352. margin-left: 0.5rem;
  6353. }
  6354. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list {
  6355. grid-template-columns: 1fr;
  6356. }
  6357. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list {
  6358. grid-template: repeat(2, 1fr);
  6359. }
  6360. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .item {
  6361. grid-column: 1/3;
  6362. }
  6363. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lore-header .item-controls {
  6364. white-space: nowrap;
  6365. color: var(--text-light);
  6366. font-family: var(--sans-serif);
  6367. font-size: var(--font-size-10);
  6368. text-transform: uppercase;
  6369. letter-spacing: 0.05em;
  6370. text-rendering: optimizeLegibility;
  6371. }
  6372. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lore-header .item-controls .item-control {
  6373. padding: 4px;
  6374. background: var(--secondary);
  6375. font-size: var(--font-size-10);
  6376. border-radius: 2px;
  6377. }
  6378. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats {
  6379. padding-bottom: 1em;
  6380. }
  6381. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-section {
  6382. padding-bottom: 1em;
  6383. }
  6384. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item {
  6385. display: grid;
  6386. grid: "name ctrl" min-content "content content" min-content/1fr min-content;
  6387. align-items: center;
  6388. padding: 2px 0;
  6389. }
  6390. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item:nth-child(odd) {
  6391. background-color: rgba(120, 100, 82, 0.1);
  6392. }
  6393. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name,
  6394. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-controls {
  6395. margin: 0;
  6396. }
  6397. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name {
  6398. align-items: center;
  6399. display: flex;
  6400. flex: 1;
  6401. grid-area: name;
  6402. height: calc(1.5rem + 2px);
  6403. width: 100%;
  6404. }
  6405. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .feat-slot-title {
  6406. display: flex;
  6407. font-family: var(--serif);
  6408. font-size: 1.1em;
  6409. font-weight: 600;
  6410. color: var(--secondary);
  6411. justify-content: center;
  6412. width: 20px;
  6413. margin-left: 6px;
  6414. }
  6415. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .item-placeholder {
  6416. margin-left: 40px;
  6417. margin-right: 4px;
  6418. }
  6419. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name h4 {
  6420. cursor: pointer;
  6421. font-family: var(--serif);
  6422. }
  6423. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name h4:hover {
  6424. color: var(--primary);
  6425. text-shadow: 0 0 3px var(--tertiary);
  6426. }
  6427. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .item-image {
  6428. margin-left: 8px;
  6429. margin-right: 8px;
  6430. }
  6431. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-controls {
  6432. align-items: center;
  6433. display: flex;
  6434. font-size: var(--font-size-12);
  6435. grid-area: ctrl;
  6436. height: 100%;
  6437. white-space: nowrap;
  6438. width: 100%;
  6439. }
  6440. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-controls a:last-child {
  6441. margin-right: 6px;
  6442. }
  6443. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-summary {
  6444. flex: 100%;
  6445. grid-area: content;
  6446. padding: 0 8px 8px;
  6447. margin: 4px 0 0 4px;
  6448. }
  6449. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items {
  6450. grid-column: span 2;
  6451. border-left: 3px dotted #786452;
  6452. display: flex;
  6453. margin: 1px 0 0 45px;
  6454. padding: 0;
  6455. flex-basis: 100%;
  6456. flex-direction: column;
  6457. }
  6458. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li {
  6459. align-items: center;
  6460. display: flex;
  6461. flex-wrap: wrap;
  6462. gap: 2px;
  6463. margin: 2px 0;
  6464. padding-bottom: 1px;
  6465. }
  6466. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li:last-child {
  6467. padding-bottom: 0;
  6468. }
  6469. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li .item-name .feat-slot-title {
  6470. width: 0;
  6471. }
  6472. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li .item-name img {
  6473. margin-left: 0;
  6474. }
  6475. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li .item-controls {
  6476. flex: 0;
  6477. }
  6478. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li ol.nested-items {
  6479. margin-left: 25px;
  6480. }
  6481. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography h3.header {
  6482. display: flex;
  6483. align-items: baseline;
  6484. justify-content: space-between;
  6485. padding: 0 1px;
  6486. }
  6487. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography h3.header a {
  6488. color: var(--color-text-dark-primary);
  6489. font-size: var(--font-size-12);
  6490. }
  6491. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography h3.header a i.fa-eye-slash {
  6492. opacity: 75%;
  6493. }
  6494. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.editable .editor-content,
  6495. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.editable input {
  6496. background: rgba(0, 0, 0, 0.05);
  6497. }
  6498. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.editable .editor-content {
  6499. min-height: 4rem;
  6500. }
  6501. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section:not(.editable) .editor-content {
  6502. min-height: 2rem;
  6503. }
  6504. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:disabled {
  6505. color: var(--text-dark);
  6506. }
  6507. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.appearance-details {
  6508. display: grid;
  6509. grid-template: "bio bio" 1fr "height weight" min-content/1fr 1fr;
  6510. }
  6511. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.appearance-details .bio {
  6512. grid-area: bio;
  6513. }
  6514. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.personality {
  6515. display: flex;
  6516. flex-wrap: wrap;
  6517. }
  6518. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.personality .bio {
  6519. display: flex;
  6520. flex-direction: column;
  6521. justify-content: flex-start;
  6522. align-items: flex-start;
  6523. flex: 50%;
  6524. margin-bottom: 8px;
  6525. }
  6526. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.personality .bio span {
  6527. width: 100%;
  6528. }
  6529. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.campaign {
  6530. display: flex;
  6531. flex-direction: column;
  6532. gap: 0.5rem;
  6533. }
  6534. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input {
  6535. background: none;
  6536. border-bottom: 1px solid var(--color-border-input);
  6537. font-family: var(--body-serif);
  6538. width: calc(100% - 6px);
  6539. }
  6540. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input::placeholder {
  6541. filter: opacity(0.5);
  6542. color: var(--text-dark);
  6543. }
  6544. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:focus {
  6545. border-bottom: 1px solid #644f33;
  6546. }
  6547. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:focus::placeholder {
  6548. color: transparent;
  6549. }
  6550. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input[type=number] {
  6551. padding-bottom: 0;
  6552. padding-left: 4px;
  6553. }
  6554. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section hr {
  6555. margin: 10px 6px 10px 0;
  6556. }
  6557. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio h3 {
  6558. margin: 0;
  6559. padding: 0;
  6560. background-color: rgba(28, 28, 28, 0.1);
  6561. border: none;
  6562. color: var(--text-dark);
  6563. font: 700 var(--font-size-14) var(--body-serif);
  6564. grid-area: mod;
  6565. height: 26px;
  6566. padding: 8px 4px 6px;
  6567. width: calc(100% - 6px);
  6568. }
  6569. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio h3 i {
  6570. position: relative;
  6571. right: -2px;
  6572. top: -2px;
  6573. float: right;
  6574. }
  6575. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio h3 span.value {
  6576. display: inline-block;
  6577. max-width: 87%;
  6578. overflow: hidden;
  6579. text-overflow: ellipsis;
  6580. white-space: nowrap;
  6581. }
  6582. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio h4.details-label {
  6583. margin-bottom: 0;
  6584. width: 100%;
  6585. }
  6586. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content {
  6587. padding: 0 0 0.5rem;
  6588. /* Typography */
  6589. }
  6590. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h1,
  6591. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h2 {
  6592. font-family: var(--serif);
  6593. line-height: 1.1;
  6594. }
  6595. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h1 {
  6596. text-align: center;
  6597. font-size: 2.5em;
  6598. margin-bottom: 30px;
  6599. }
  6600. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h2 {
  6601. color: var(--secondary);
  6602. font-size: 2.25em;
  6603. }
  6604. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h3 {
  6605. font-size: 2em;
  6606. border-bottom: 0px;
  6607. }
  6608. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h4 {
  6609. color: var(--text-dark);
  6610. border-bottom: 1px solid var(--color-border-dark-primary);
  6611. margin-bottom: 0px;
  6612. text-transform: uppercase;
  6613. }
  6614. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h5 {
  6615. text-transform: uppercase;
  6616. }
  6617. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h6 {
  6618. background-color: var(--header-bg);
  6619. color: var(--header-color);
  6620. margin-bottom: 5px;
  6621. padding-left: 8px;
  6622. padding-top: 5px;
  6623. padding-bottom: 3px;
  6624. font-size: 1.25em;
  6625. text-transform: uppercase;
  6626. border-radius: 12px 12px 0px 0px;
  6627. }
  6628. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content p,
  6629. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content p + p,
  6630. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content ul,
  6631. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content ol {
  6632. font-family: var(--body-serif);
  6633. }
  6634. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .editor-edit {
  6635. background: var(--primary);
  6636. color: var(--text-light);
  6637. }
  6638. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox.tox-tinymce {
  6639. height: 200px !important;
  6640. }
  6641. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-editor-container .tox-editor-header {
  6642. background: none;
  6643. }
  6644. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-editor-container .tox-editor-header .tox-toolbar-overlord {
  6645. background-color: var(--secondary);
  6646. }
  6647. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-editor-container .tox-editor-header .tox-toolbar-overlord .tox-toolbar__primary {
  6648. background-color: var(--alt);
  6649. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);
  6650. }
  6651. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-tbtn {
  6652. color: #cdcdcd;
  6653. border-radius: 1px;
  6654. }
  6655. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-tbtn svg {
  6656. fill: #cdcdcd;
  6657. }
  6658. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-tbtn:hover {
  6659. background: var(--secondary);
  6660. color: var(--text-light);
  6661. }
  6662. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-tbtn:hover svg {
  6663. fill: white;
  6664. }
  6665. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .editor-content {
  6666. overflow-y: inherit;
  6667. padding: 0 0.25rem;
  6668. }
  6669. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory {
  6670. height: calc(100% - 40px);
  6671. }
  6672. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-list {
  6673. padding-right: 0.1rem;
  6674. }
  6675. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .item-controls {
  6676. flex: 0 0 100px;
  6677. }
  6678. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .wealth {
  6679. margin-bottom: 0.5rem;
  6680. }
  6681. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs {
  6682. gap: 0.2em;
  6683. }
  6684. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item {
  6685. display: flex;
  6686. flex-wrap: wrap;
  6687. align-items: center;
  6688. justify-content: space-between;
  6689. padding: 2px 4px 2px 12px;
  6690. width: 100%;
  6691. }
  6692. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item p:empty {
  6693. display: none;
  6694. }
  6695. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-name {
  6696. display: flex;
  6697. align-items: center;
  6698. flex: 1;
  6699. }
  6700. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-name h4 {
  6701. cursor: pointer;
  6702. margin: 0;
  6703. }
  6704. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-name .item-image {
  6705. margin-right: 8px;
  6706. }
  6707. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-controls {
  6708. display: flex;
  6709. flex: 0;
  6710. font-size: var(--font-size-12);
  6711. gap: 1px;
  6712. white-space: nowrap;
  6713. }
  6714. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-controls a.info-only:hover {
  6715. cursor: default;
  6716. text-shadow: none;
  6717. }
  6718. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-controls a + a {
  6719. margin-left: 4px;
  6720. }
  6721. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary {
  6722. flex-basis: 100%;
  6723. }
  6724. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item.unidentified {
  6725. border-radius: 1px;
  6726. outline: 1px dotted rgba(75, 74, 68, 0.5);
  6727. background: var(--visibility-gm-bg);
  6728. }
  6729. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .button-group {
  6730. display: flex;
  6731. justify-content: flex-end;
  6732. align-items: center;
  6733. flex-wrap: nowrap;
  6734. width: 50%;
  6735. flex: 0;
  6736. }
  6737. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .button-group button {
  6738. margin: 0;
  6739. border: none;
  6740. cursor: pointer;
  6741. font-family: var(--sans-serif);
  6742. font-size: var(--font-size-10);
  6743. text-transform: uppercase;
  6744. letter-spacing: 0.05em;
  6745. text-rendering: optimizeLegibility;
  6746. padding: 5px;
  6747. color: var(--text-light);
  6748. width: 70px;
  6749. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  6750. background: var(--secondary);
  6751. border-radius: 2px;
  6752. flex: 0;
  6753. white-space: nowrap;
  6754. margin-left: 4px;
  6755. flex: 0;
  6756. }
  6757. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .button-group button:hover {
  6758. box-shadow: none;
  6759. text-shadow: 0 0 2px white;
  6760. }
  6761. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section {
  6762. display: flex;
  6763. flex-direction: column;
  6764. gap: 0.25em;
  6765. margin: 0.75rem 0;
  6766. }
  6767. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section:first-child {
  6768. margin-top: 0.25rem;
  6769. }
  6770. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play {
  6771. align-items: center;
  6772. display: grid;
  6773. grid-template-columns: 6em 1em 4em;
  6774. }
  6775. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play > * {
  6776. width: 100%;
  6777. }
  6778. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play input {
  6779. text-align: center;
  6780. }
  6781. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play .dash {
  6782. font-weight: bold;
  6783. text-align: center;
  6784. }
  6785. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play label.player-number {
  6786. grid-column: span 2;
  6787. }
  6788. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump {
  6789. align-items: center;
  6790. flex-direction: row;
  6791. }
  6792. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle {
  6793. width: 42px;
  6794. height: 1rem;
  6795. background: rgba(0, 0, 0, 0.5);
  6796. position: relative;
  6797. border-radius: 50px;
  6798. box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2);
  6799. }
  6800. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle.enabled {
  6801. background: var(--secondary);
  6802. }
  6803. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle::after {
  6804. content: "OFF";
  6805. color: var(--text-dark);
  6806. position: absolute;
  6807. right: 5px;
  6808. z-index: 0;
  6809. text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15);
  6810. }
  6811. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle::before {
  6812. content: "ON";
  6813. color: var(--text-light);
  6814. position: absolute;
  6815. left: 6px;
  6816. z-index: 0;
  6817. }
  6818. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle::after, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle::before {
  6819. font-family: var(--sans-serif);
  6820. font-size: var(--font-size-10);
  6821. text-transform: uppercase;
  6822. letter-spacing: 0.05em;
  6823. text-rendering: optimizeLegibility;
  6824. top: 4px;
  6825. }
  6826. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle label {
  6827. display: block;
  6828. width: 18px;
  6829. height: 14px;
  6830. position: absolute;
  6831. top: 1px;
  6832. right: 20px;
  6833. cursor: pointer;
  6834. background: #fcfff4;
  6835. z-index: 1;
  6836. background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  6837. border-radius: 50%;
  6838. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0px 2px 5px 0px rgba(0, 0, 0, 0.3);
  6839. transition: all 0.4s ease;
  6840. }
  6841. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle input[type=checkbox] {
  6842. visibility: hidden;
  6843. }
  6844. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle input[type=checkbox]:checked + label {
  6845. right: 1px;
  6846. }
  6847. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.faction {
  6848. max-width: fit-content;
  6849. }
  6850. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.reputations {
  6851. font-family: var(--serif);
  6852. gap: 0.2em;
  6853. }
  6854. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.reputations .reputation {
  6855. align-items: center;
  6856. display: flex;
  6857. gap: 0.2em;
  6858. justify-content: space-between;
  6859. width: 12em;
  6860. }
  6861. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.reputations .reputation input {
  6862. padding: 0 0.3em;
  6863. text-align: right;
  6864. width: 3em;
  6865. }
  6866. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options {
  6867. display: flex;
  6868. flex-wrap: wrap;
  6869. margin: 0 1rem 1rem;
  6870. padding: 0.5rem 1rem;
  6871. border-image-repeat: repeat;
  6872. border-image-slice: 11;
  6873. border-image-source: url("../assets/sheet/frame-elegant.svg");
  6874. border-image-width: 14px;
  6875. border-style: double;
  6876. }
  6877. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options .crafting-option {
  6878. display: flex;
  6879. align-items: center;
  6880. width: 100%;
  6881. }
  6882. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options .crafting-option label * {
  6883. vertical-align: middle;
  6884. }
  6885. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options .crafting-option label input {
  6886. margin: 0;
  6887. padding: 0;
  6888. }
  6889. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas,
  6890. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry {
  6891. display: flex;
  6892. flex-wrap: wrap;
  6893. justify-content: space-evenly;
  6894. align-items: center;
  6895. background: none;
  6896. border: none;
  6897. }
  6898. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas.item-container,
  6899. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry.item-container {
  6900. margin-bottom: 0.5em;
  6901. }
  6902. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas.alchemical-entry,
  6903. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry.alchemical-entry {
  6904. margin-bottom: 0;
  6905. }
  6906. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas.alchemical-entry:last-child,
  6907. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry.alchemical-entry:last-child {
  6908. margin-bottom: 0.5em;
  6909. }
  6910. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas:first-child .action-header,
  6911. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry:first-child .action-header {
  6912. margin-top: 0;
  6913. }
  6914. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header .item-controls .toggle-free-crafting,
  6915. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header .item-controls .toggle-free-crafting {
  6916. display: flex;
  6917. align-items: center;
  6918. justify-content: flex-end;
  6919. }
  6920. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header .item-controls .toggle-free-crafting *,
  6921. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header .item-controls .toggle-free-crafting * {
  6922. flex: 1 0 auto;
  6923. }
  6924. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header .item-controls .toggle-free-crafting input[type=checkbox],
  6925. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header .item-controls .toggle-free-crafting input[type=checkbox] {
  6926. height: 1em;
  6927. width: 1em;
  6928. }
  6929. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header.alchemical-title,
  6930. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header.alchemical-title {
  6931. background: var(--secondary);
  6932. }
  6933. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list,
  6934. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list {
  6935. margin: 0;
  6936. padding: 0;
  6937. width: 100%;
  6938. flex-basis: 100%;
  6939. position: relative;
  6940. z-index: 1;
  6941. }
  6942. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item[data-expended-state=true] h4,
  6943. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item[data-expended-state=true] h4 {
  6944. color: var(--color-disabled);
  6945. text-decoration: line-through;
  6946. }
  6947. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item[data-expended-state=true] .toggle-formula-expended,
  6948. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item[data-expended-state=true] .toggle-formula-expended {
  6949. color: var(--primary);
  6950. }
  6951. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header,
  6952. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item,
  6953. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header,
  6954. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item {
  6955. display: grid;
  6956. grid: "name dc price quantity controls" 1fr/4fr 0.7fr 1fr 1fr 1fr;
  6957. align-items: center;
  6958. justify-items: center;
  6959. margin: 0;
  6960. padding: 0;
  6961. background: none;
  6962. border: none;
  6963. border-left: 1px solid var(--sub);
  6964. border-right: 1px solid var(--sub);
  6965. cursor: default;
  6966. }
  6967. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header:nth-child(odd),
  6968. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item:nth-child(odd),
  6969. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header:nth-child(odd),
  6970. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item:nth-child(odd) {
  6971. background-color: rgba(120, 100, 82, 0.1);
  6972. }
  6973. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header:last-child,
  6974. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item:last-child,
  6975. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header:last-child,
  6976. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item:last-child {
  6977. border-bottom: 1px solid var(--sub);
  6978. }
  6979. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header:last-child .item-image,
  6980. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item:last-child .item-image,
  6981. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header:last-child .item-image,
  6982. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item:last-child .item-image {
  6983. margin-bottom: 0;
  6984. margin-top: 2px;
  6985. }
  6986. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header,
  6987. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header,
  6988. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header,
  6989. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header {
  6990. background: rgba(96, 88, 86, 0.25);
  6991. border: 1px solid var(--sub);
  6992. padding: 4px;
  6993. color: var(--text-dark);
  6994. font: 600 var(--font-size-12) var(--sans-serif);
  6995. line-height: 1;
  6996. letter-spacing: 0.25px;
  6997. margin: 0;
  6998. }
  6999. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header h3,
  7000. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header h3,
  7001. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header h3,
  7002. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header h3 {
  7003. text-transform: capitalize;
  7004. font-size: var(--font-size-12);
  7005. margin-left: 0;
  7006. padding: 4px 0;
  7007. }
  7008. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header .level-name,
  7009. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header .level-name,
  7010. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header .level-name,
  7011. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header .level-name {
  7012. line-height: 1;
  7013. gap: 0.5em;
  7014. }
  7015. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header .level-name h3,
  7016. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header .level-name h3,
  7017. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header .level-name h3,
  7018. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header .level-name h3 {
  7019. margin: 0;
  7020. padding: 0;
  7021. }
  7022. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header .formula-number,
  7023. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header .formula-number,
  7024. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header .formula-number,
  7025. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header .formula-number {
  7026. background: var(--alt);
  7027. border: 1px solid var(--sub);
  7028. border-radius: 3px;
  7029. color: var(--text-light);
  7030. font-size: var(--font-size-11);
  7031. height: 14px;
  7032. max-width: 22px;
  7033. padding-top: 2px;
  7034. text-align: center;
  7035. width: 22px;
  7036. }
  7037. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header input.formula-number,
  7038. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header input.formula-number,
  7039. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header input.formula-number,
  7040. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header input.formula-number {
  7041. background: var(--alt-dark);
  7042. }
  7043. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name,
  7044. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name,
  7045. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name,
  7046. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name {
  7047. cursor: pointer;
  7048. min-height: 28px;
  7049. }
  7050. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name,
  7051. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name,
  7052. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name,
  7053. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name,
  7054. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name,
  7055. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name,
  7056. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name,
  7057. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name {
  7058. justify-self: start;
  7059. display: flex;
  7060. align-items: center;
  7061. justify-content: flex-start;
  7062. flex-wrap: nowrap;
  7063. line-height: 1.5;
  7064. flex-basis: 50%;
  7065. }
  7066. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name h3,
  7067. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name h3,
  7068. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name h3,
  7069. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name h3,
  7070. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name h3,
  7071. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name h3,
  7072. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name h3,
  7073. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name h3 {
  7074. white-space: nowrap;
  7075. }
  7076. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name + span:not(.flex0),
  7077. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name + span:not(.flex0),
  7078. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name + span:not(.flex0),
  7079. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name + span:not(.flex0),
  7080. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name + span:not(.flex0),
  7081. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name + span:not(.flex0),
  7082. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name + span:not(.flex0),
  7083. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name + span:not(.flex0) {
  7084. font-size: var(--font-size-12);
  7085. }
  7086. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name .item-image,
  7087. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name .item-image,
  7088. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name .item-image,
  7089. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name .item-image,
  7090. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name .item-image,
  7091. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name .item-image,
  7092. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name .item-image,
  7093. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name .item-image {
  7094. margin: 2px 0;
  7095. margin-left: 4px;
  7096. }
  7097. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name h4,
  7098. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name h4,
  7099. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name h4,
  7100. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name h4,
  7101. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name h4,
  7102. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name h4,
  7103. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name h4,
  7104. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name h4 {
  7105. margin: 0;
  7106. padding: 0;
  7107. margin-left: 8px;
  7108. line-height: 1;
  7109. letter-spacing: -0.075em;
  7110. }
  7111. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name h4:hover,
  7112. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name h4:hover,
  7113. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name h4:hover,
  7114. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name h4:hover,
  7115. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name h4:hover,
  7116. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name h4:hover,
  7117. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name h4:hover,
  7118. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name h4:hover {
  7119. color: var(--secondary);
  7120. }
  7121. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name.aa-level, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name.reagent-resource,
  7122. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name.aa-level,
  7123. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name.reagent-resource,
  7124. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name.aa-level,
  7125. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name.reagent-resource,
  7126. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name.aa-level,
  7127. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name.reagent-resource,
  7128. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name.aa-level,
  7129. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name.reagent-resource,
  7130. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name.aa-level,
  7131. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name.reagent-resource,
  7132. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name.aa-level,
  7133. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name.reagent-resource,
  7134. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name.aa-level,
  7135. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name.reagent-resource {
  7136. justify-content: flex-end;
  7137. }
  7138. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-controls,
  7139. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-controls,
  7140. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-controls,
  7141. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-controls {
  7142. justify-self: end;
  7143. font-size: var(--font-size-12);
  7144. margin-right: 4px;
  7145. }
  7146. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-controls .item-control.disabled,
  7147. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-controls .item-control.disabled,
  7148. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-controls .item-control.disabled,
  7149. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-controls .item-control.disabled {
  7150. opacity: 0.3;
  7151. }
  7152. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-summary,
  7153. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-summary,
  7154. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-summary,
  7155. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-summary {
  7156. grid-column: 1/6;
  7157. padding: 8px;
  7158. border-bottom: 1px solid var(--sub);
  7159. border-top: 1px solid #aca5a3;
  7160. background-color: var(--bg);
  7161. }
  7162. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-summary p,
  7163. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-summary p,
  7164. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-summary p,
  7165. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-summary p {
  7166. margin-top: 0;
  7167. }
  7168. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-summary .item-buttons button,
  7169. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-summary .item-buttons button,
  7170. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-summary .item-buttons button,
  7171. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-summary .item-buttons button {
  7172. display: none;
  7173. }
  7174. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity,
  7175. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity,
  7176. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity,
  7177. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity {
  7178. align-items: center;
  7179. display: flex;
  7180. gap: 3px;
  7181. justify-content: center;
  7182. }
  7183. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity .adjust,
  7184. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity .adjust,
  7185. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity .adjust,
  7186. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity .adjust {
  7187. align-items: center;
  7188. display: flex;
  7189. font-size: var(--font-size-16);
  7190. font-family: var(--sans-serif-monospace);
  7191. justify-content: center;
  7192. width: 1em;
  7193. }
  7194. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity input,
  7195. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity input,
  7196. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity input,
  7197. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity input {
  7198. width: 1.5rem;
  7199. text-align: center;
  7200. }
  7201. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .empty,
  7202. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .empty {
  7203. align-items: center;
  7204. display: flex;
  7205. justify-content: space-between;
  7206. min-height: 28px;
  7207. }
  7208. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .empty > *,
  7209. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .empty > * {
  7210. white-space: nowrap;
  7211. }
  7212. .actor.sheet.character .crb-style .sheet-body .sheet-content .directory-list {
  7213. margin: 0;
  7214. padding: 0;
  7215. display: flex;
  7216. flex-direction: column;
  7217. list-style: none;
  7218. width: 100%;
  7219. }
  7220. .actor.sheet.character .crb-style .sheet-body .sheet-content .directory-list h4 {
  7221. margin: 0;
  7222. padding: 0;
  7223. }
  7224. .actor.sheet.character .crb-style .sheet-body .sheet-content .directory-list .item ol {
  7225. list-style: none;
  7226. }
  7227. .actor.sheet.character .crb-style .sheet-body .sheet-content .blue-button {
  7228. align-items: center;
  7229. background: var(--secondary);
  7230. border: black;
  7231. border-radius: 2px;
  7232. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  7233. color: var(--text-light);
  7234. display: flex;
  7235. font-family: var(--serif);
  7236. font-weight: 500;
  7237. gap: 0.25em;
  7238. line-height: 1.8em;
  7239. justify-content: center;
  7240. margin: 0;
  7241. padding: 0 0.5em;
  7242. }
  7243. .actor.sheet.character .crb-style .sheet-body .sheet-content .blue-button:hover {
  7244. text-shadow: 0 0 4px white;
  7245. }
  7246. .actor.sheet.vehicle .crb-style .sheet-navigation {
  7247. min-width: 375px;
  7248. }
  7249. .actor.sheet.vehicle .crb-style aside .sidebar .save-roll input[type=number] {
  7250. width: 3ch;
  7251. font-size: var(--font-size-20);
  7252. height: 24px;
  7253. }
  7254. .actor.sheet.vehicle .crb-style aside .sidebar .hitpoints .container {
  7255. display: grid;
  7256. }
  7257. .actor.sheet.vehicle .crb-style aside .sidebar .armor-class {
  7258. grid: "ac hardness" 1fr;
  7259. }
  7260. .actor.sheet.vehicle .crb-style aside .sidebar .armor-class .shield {
  7261. padding: 18px 20px 0 20px;
  7262. }
  7263. .actor.sheet.vehicle .crb-style aside .sidebar .armor-class .hardness {
  7264. background: url("../assets/sheet/shield-red.webp") no-repeat top center;
  7265. }
  7266. .actor.sheet.vehicle .crb-style aside .sidebar li.tag {
  7267. font-size: var(--font-size-10);
  7268. }
  7269. .actor.sheet.vehicle .crb-style header.char-header .tags select {
  7270. font-family: var(--sans-serif);
  7271. font-size: var(--font-size-12);
  7272. text-transform: uppercase;
  7273. }
  7274. .actor.sheet.vehicle .crb-style header.char-header .char-details {
  7275. font-size: var(--font-size-13);
  7276. font-weight: normal;
  7277. }
  7278. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab:not(.inventory),
  7279. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab .inventory .inventory-list {
  7280. overflow: hidden scroll;
  7281. flex-grow: 1;
  7282. overflow: hidden scroll;
  7283. }
  7284. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.actions ol.actions-list li.action .icon {
  7285. height: var(--font-size-18);
  7286. width: var(--font-size-18);
  7287. }
  7288. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details {
  7289. display: grid;
  7290. grid: "img details" 1fr/120px 1fr;
  7291. min-width: 330px;
  7292. }
  7293. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .frame {
  7294. margin-left: 5px;
  7295. }
  7296. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .frame .actor-image {
  7297. margin-top: 8px;
  7298. max-height: 90%;
  7299. object-fit: contain;
  7300. border-radius: 0;
  7301. border: none;
  7302. box-shadow: 0 0 0 1px #918c88, 0 0 0 2px #e1d8cf, 0 0 0 3px #a98f39, inset 0 0 8px rgba(0, 0, 0, 0.5), 0 0 8px black;
  7303. }
  7304. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .image-container [data-action=show-image] {
  7305. bottom: 3px;
  7306. right: 1px;
  7307. }
  7308. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .detail-sheet {
  7309. display: grid;
  7310. grid: repeat(2, 42px)/3fr 2fr;
  7311. grid-row-gap: 8px;
  7312. padding-left: 12px;
  7313. }
  7314. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .detail-small {
  7315. display: flex;
  7316. }
  7317. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-properties {
  7318. display: flex;
  7319. flex-wrap: wrap;
  7320. padding-top: 8px;
  7321. }
  7322. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-properties > div {
  7323. display: flex;
  7324. flex-direction: column;
  7325. justify-content: flex-start;
  7326. align-items: flex-start;
  7327. margin-bottom: 8px;
  7328. }
  7329. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-properties > div > span {
  7330. width: 100%;
  7331. }
  7332. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .detailsInput {
  7333. margin-bottom: 8px;
  7334. }
  7335. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list {
  7336. gap: 0.2em;
  7337. padding-bottom: 1em;
  7338. }
  7339. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item {
  7340. display: flex;
  7341. flex-wrap: wrap;
  7342. align-items: center;
  7343. justify-content: space-between;
  7344. padding: 2px 4px 2px 12px;
  7345. width: 100%;
  7346. }
  7347. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item p:empty {
  7348. display: none;
  7349. }
  7350. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-name {
  7351. display: flex;
  7352. align-items: center;
  7353. flex: 1;
  7354. }
  7355. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-name h4 {
  7356. cursor: pointer;
  7357. margin: 0;
  7358. }
  7359. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-name .item-image {
  7360. margin-right: 8px;
  7361. }
  7362. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-controls {
  7363. display: flex;
  7364. flex: 0;
  7365. font-size: var(--font-size-12);
  7366. gap: 1px;
  7367. white-space: nowrap;
  7368. }
  7369. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-controls a.info-only:hover {
  7370. cursor: default;
  7371. text-shadow: none;
  7372. }
  7373. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-controls a + a {
  7374. margin-left: 4px;
  7375. }
  7376. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-summary {
  7377. flex-basis: 100%;
  7378. }
  7379. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item.unidentified {
  7380. border-radius: 1px;
  7381. outline: 1px dotted rgba(75, 74, 68, 0.5);
  7382. background: var(--visibility-gm-bg);
  7383. }
  7384. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .button-group {
  7385. display: flex;
  7386. justify-content: flex-end;
  7387. align-items: center;
  7388. flex-wrap: nowrap;
  7389. width: 50%;
  7390. flex: 0;
  7391. }
  7392. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .button-group button {
  7393. margin: 0;
  7394. border: none;
  7395. cursor: pointer;
  7396. font-family: var(--sans-serif);
  7397. font-size: var(--font-size-10);
  7398. text-transform: uppercase;
  7399. letter-spacing: 0.05em;
  7400. text-rendering: optimizeLegibility;
  7401. padding: 5px;
  7402. color: var(--text-light);
  7403. width: 70px;
  7404. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  7405. background: var(--secondary);
  7406. border-radius: 2px;
  7407. flex: 0;
  7408. white-space: nowrap;
  7409. margin-left: 4px;
  7410. flex: 0;
  7411. }
  7412. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .button-group button:hover {
  7413. box-shadow: none;
  7414. text-shadow: 0 0 2px white;
  7415. }
  7416. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item {
  7417. border-top: 1px solid #d5cac1;
  7418. border: solid transparent;
  7419. border-width: 0 0 1px;
  7420. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  7421. }
  7422. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item-image {
  7423. border-radius: 2px;
  7424. }
  7425. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item:last-child {
  7426. border-bottom: none;
  7427. }
  7428. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item-name h4 {
  7429. font-family: var(--serif);
  7430. }
  7431. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects h3.header {
  7432. position: relative;
  7433. margin-top: 0.75em;
  7434. font-size: var(--font-size-16);
  7435. font-family: var(--serif);
  7436. font-weight: 600;
  7437. color: var(--primary);
  7438. line-height: 1;
  7439. border-bottom: 1px solid var(--color-border-divider);
  7440. }
  7441. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects h3.header > button, .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects h3.header > .controls {
  7442. position: absolute;
  7443. bottom: -1px;
  7444. right: 0;
  7445. }
  7446. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects h3.header .controls {
  7447. display: flex;
  7448. }
  7449. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects h3.header button {
  7450. background: transparent;
  7451. border-radius: 2px 2px 0 0;
  7452. border: 1px solid var(--color-border-divider);
  7453. color: var(--primary);
  7454. cursor: pointer;
  7455. font-family: var(--sans-serif);
  7456. font-size: var(--font-size-12);
  7457. font-weight: 500;
  7458. height: 20px;
  7459. line-height: var(--font-size-12);
  7460. margin: 0;
  7461. outline: none;
  7462. text-transform: uppercase;
  7463. width: auto;
  7464. }
  7465. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects ol.directory-list {
  7466. margin: 0;
  7467. padding: 0;
  7468. display: flex;
  7469. flex-direction: column;
  7470. list-style: none;
  7471. width: 100%;
  7472. }
  7473. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects ol.directory-list h4 {
  7474. margin: 0;
  7475. padding: 0;
  7476. }
  7477. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects ol.directory-list .item ol {
  7478. list-style: none;
  7479. }
  7480. .actor.sheet.vehicle .crb-style input.adjustable:not(:focus).adjusted-higher,
  7481. .actor.sheet.vehicle .crb-style span.adjustable.adjusted-higher {
  7482. color: #009988;
  7483. }
  7484. .actor.sheet.vehicle .crb-style input.adjustable:not(:focus).adjusted-lower,
  7485. .actor.sheet.vehicle .crb-style span.adjustable.adjusted-lower {
  7486. color: #cc3311;
  7487. }
  7488. .actor.sheet.vehicle .crb-style .inventory {
  7489. margin-bottom: 0.6rem;
  7490. }
  7491. .actor.sheet.vehicle .crb-style .row-nr-1 {
  7492. grid-row: 1/2;
  7493. }
  7494. .actor.sheet.vehicle .crb-style .row-nr-2 {
  7495. grid-row: 2/3;
  7496. }
  7497. .actor.sheet.vehicle .crb-style .row-nr-3 {
  7498. grid-row: 3/4;
  7499. }
  7500. .actor.sheet.vehicle .crb-style .span-2-columns {
  7501. grid-column-end: span 2;
  7502. }
  7503. .actor.sheet.vehicle .crb-style .flexitem-1 {
  7504. flex: 1 1 10%;
  7505. }
  7506. .actor.sheet.vehicle .crb-style .flexitem-5 {
  7507. flex: 5 1 50%;
  7508. }
  7509. .actor.sheet.vehicle .crb-style .flexitem-full {
  7510. flex: 100%;
  7511. }
  7512. .actor.sheet .crb-style {
  7513. display: grid;
  7514. grid: "sidebar header" 75px "sidebar nav" minmax(min-content, max-content) "sidebar content" 1fr/230px 1fr;
  7515. font-family: var(--body-serif);
  7516. background: url("../assets/sheet/header.webp"), url("../assets/sheet/background.webp");
  7517. background-repeat: repeat-x, no-repeat;
  7518. background-size: auto 89px, cover;
  7519. background-attachment: local;
  7520. height: 100%;
  7521. /* Navigation */
  7522. /** White background navigation with little decorations on the left and right */
  7523. /* Page structure elements */
  7524. /* Read-Only Sheet */
  7525. }
  7526. .actor.sheet .crb-style .d20-svg {
  7527. width: 19px;
  7528. height: 19px;
  7529. }
  7530. .actor.sheet .crb-style aside {
  7531. grid-area: sidebar;
  7532. color: var(--sidebar-label);
  7533. font-family: var(--serif);
  7534. font-size: var(--font-size-10);
  7535. font-weight: 600;
  7536. margin-left: 8px;
  7537. background-image: url("../assets/sheet/red_sidebar_top.webp"), url("../assets/sheet/red_sidebar_bottom.webp");
  7538. background-repeat: no-repeat;
  7539. background-position: center calc(100% - 52px), center bottom;
  7540. background-size: 224px 100%, 224px 52px;
  7541. display: flex;
  7542. flex-direction: column;
  7543. }
  7544. .actor.sheet .crb-style aside input[type=number] {
  7545. -moz-appearance: textfield;
  7546. color: var(--text-light);
  7547. text-align: center;
  7548. font-size: var(--font-size-26);
  7549. line-height: 1;
  7550. font-weight: initial;
  7551. font-family: var(--serif);
  7552. border: none;
  7553. }
  7554. .actor.sheet .crb-style aside input[type=number]:focus {
  7555. box-shadow: none;
  7556. }
  7557. .actor.sheet .crb-style aside input[type=number]::-webkit-outer-spin-button, .actor.sheet .crb-style aside input[type=number]::-webkit-inner-spin-button {
  7558. -webkit-appearance: none;
  7559. margin: 0;
  7560. }
  7561. .actor.sheet .crb-style aside input[type=number]:read-only {
  7562. pointer-events: none;
  7563. color: var(--tertiary-light);
  7564. }
  7565. .actor.sheet .crb-style aside input[type=number]:hover {
  7566. text-shadow: 0 0 4px var(--tertiary);
  7567. }
  7568. .actor.sheet .crb-style aside .modifiers_button {
  7569. background: rgba(255, 255, 255, 0.75);
  7570. border-radius: 2px 2px 0 0;
  7571. border: none;
  7572. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
  7573. color: var(--primary);
  7574. flex: 0;
  7575. font: 600 var(--font-size-9) var(--sans-serif);
  7576. letter-spacing: 0.05em;
  7577. line-height: 1;
  7578. margin: 0;
  7579. padding: 2px 3px;
  7580. text-rendering: optimizeLegibility;
  7581. text-transform: uppercase;
  7582. white-space: nowrap;
  7583. }
  7584. .actor.sheet .crb-style aside .modifiers_button:hover:not(:disabled) {
  7585. background: white;
  7586. box-shadow: inset 0 0 0 1px white;
  7587. }
  7588. .actor.sheet .crb-style aside .logo {
  7589. margin: 5px -6px 0 -6px;
  7590. border: none;
  7591. z-index: 10;
  7592. max-width: unset;
  7593. flex-shrink: 0;
  7594. }
  7595. .actor.sheet .crb-style aside .sidebar {
  7596. padding: 0 2px 2px 8px;
  7597. margin-bottom: 42px;
  7598. overflow: hidden scroll;
  7599. }
  7600. .actor.sheet .crb-style aside .sidebar::-webkit-scrollbar-track {
  7601. box-shadow: none;
  7602. }
  7603. .actor.sheet .crb-style aside .sidebar h2,
  7604. .actor.sheet .crb-style aside .sidebar h3,
  7605. .actor.sheet .crb-style aside .sidebar h4 {
  7606. margin: 0;
  7607. line-height: 1;
  7608. }
  7609. .actor.sheet .crb-style aside .sidebar_label {
  7610. color: var(--sidebar-label);
  7611. font-family: var(--sans-serif);
  7612. font-size: var(--font-size-10);
  7613. text-transform: uppercase;
  7614. letter-spacing: 0.05em;
  7615. text-rendering: optimizeLegibility;
  7616. white-space: nowrap;
  7617. }
  7618. .actor.sheet .crb-style aside .sidebar_title {
  7619. display: flex;
  7620. flex-wrap: nowrap;
  7621. justify-content: space-between;
  7622. align-items: flex-end;
  7623. margin: 0.8em 0 0.5em;
  7624. }
  7625. .actor.sheet .crb-style aside .sidebar_title:first-of-type {
  7626. margin-top: 0.5em;
  7627. margin-bottom: -1px;
  7628. }
  7629. .actor.sheet .crb-style aside .sidebar_title h2 {
  7630. font-family: var(--sans-serif);
  7631. font-size: var(--font-size-13);
  7632. font-variant: small-caps;
  7633. letter-spacing: 0.05em;
  7634. line-height: 1;
  7635. color: var(--sidebar-title);
  7636. flex: 1;
  7637. }
  7638. .actor.sheet .crb-style aside .sidebar_title .modifiers_button,
  7639. .actor.sheet .crb-style aside .sidebar_title h2 {
  7640. border-bottom: 1px solid var(--sidebar-title);
  7641. }
  7642. .actor.sheet .crb-style aside .sidebar a.dots {
  7643. display: flex;
  7644. flex-direction: column;
  7645. gap: 2px;
  7646. }
  7647. .actor.sheet .crb-style aside .sidebar a.dots > * {
  7648. cursor: pointer;
  7649. }
  7650. .actor.sheet .crb-style aside .sidebar a.dots .pips {
  7651. display: flex;
  7652. justify-content: center;
  7653. }
  7654. .actor.sheet .crb-style aside .sidebar .data-value {
  7655. display: flex;
  7656. justify-content: center;
  7657. align-items: center;
  7658. font-size: 0; /* Removes whitespace for inputs */
  7659. }
  7660. .actor.sheet .crb-style aside .sidebar .data-value h2 {
  7661. color: var(--tertiary-light);
  7662. text-align: center;
  7663. font-size: var(--font-size-26);
  7664. line-height: 1;
  7665. font-weight: initial;
  7666. font-family: var(--serif);
  7667. border: none;
  7668. }
  7669. .actor.sheet .crb-style aside .sidebar a.roll-icon {
  7670. display: inline-flex;
  7671. align-items: center;
  7672. padding-bottom: 2px;
  7673. }
  7674. .actor.sheet .crb-style aside .sidebar a.roll-icon i {
  7675. font-size: var(--font-size-19);
  7676. color: var(--text-light);
  7677. transition: all 0.2s ease-in-out;
  7678. }
  7679. .actor.sheet .crb-style aside .sidebar a.roll-icon i:hover {
  7680. transform: scale(1.25);
  7681. }
  7682. .actor.sheet .crb-style aside .sidebar a.roll-icon svg {
  7683. animation-play-state: paused;
  7684. }
  7685. .actor.sheet .crb-style aside .sidebar a.roll-icon svg path {
  7686. fill: var(--text-light);
  7687. }
  7688. .actor.sheet .crb-style aside .sidebar a.roll-icon:hover svg {
  7689. animation-play-state: running;
  7690. animation: rotation 2s infinite linear;
  7691. }
  7692. .actor.sheet .crb-style aside .sidebar a.roll-icon.disabled {
  7693. cursor: default;
  7694. filter: brightness(0.75);
  7695. opacity: 0.75;
  7696. text-shadow: none;
  7697. }
  7698. .actor.sheet .crb-style aside .sidebar a.roll-icon.disabled:hover svg {
  7699. animation-play-state: paused;
  7700. }
  7701. .actor.sheet .crb-style aside .sidebar select {
  7702. font-size: var(--font-size-15);
  7703. background-color: var(--primary);
  7704. padding: 2px 6px;
  7705. width: 100%;
  7706. max-width: 100%;
  7707. border: 1px solid #956d58;
  7708. /* prettier-ignore */
  7709. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 0 4px rgba(0, 0, 0, 0.5);
  7710. }
  7711. .actor.sheet .crb-style aside .sidebar ol {
  7712. display: flex;
  7713. flex-direction: column;
  7714. list-style: none;
  7715. margin: 0;
  7716. padding: 0;
  7717. }
  7718. .actor.sheet .crb-style aside .sidebar ol li {
  7719. display: flex;
  7720. flex-direction: row;
  7721. align-items: center;
  7722. justify-content: space-between;
  7723. }
  7724. .actor.sheet .crb-style aside .sidebar .tags .tag.edit-btn {
  7725. background-color: var(--color-bg-option);
  7726. color: var(--primary);
  7727. }
  7728. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big {
  7729. display: grid;
  7730. grid-template-columns: repeat(3, 1fr);
  7731. justify-content: space-evenly;
  7732. }
  7733. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container {
  7734. text-align: center;
  7735. }
  7736. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.current-hp {
  7737. background-image: linear-gradient(90deg, #450000 0%, #870000 50%, #450000 100%);
  7738. background-color: var(--primary);
  7739. border-radius: 0 0 4px 4px;
  7740. border: 1px solid var(--sidebar-title);
  7741. display: flex;
  7742. flex-direction: column;
  7743. padding: 10px 4px 0;
  7744. position: relative;
  7745. width: min-content;
  7746. z-index: 0;
  7747. }
  7748. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.current-hp .data-value {
  7749. margin-top: 3px;
  7750. }
  7751. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.current-hp .data-value input[type=number] {
  7752. font-size: var(--font-size-32);
  7753. letter-spacing: -1px;
  7754. height: 32px;
  7755. }
  7756. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.max-hp, .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.temp-hp {
  7757. margin-top: 0.75rem;
  7758. }
  7759. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.temp-hp {
  7760. margin-right: 0.5rem;
  7761. text-align: center;
  7762. }
  7763. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.max-hp {
  7764. margin-left: 0.5rem;
  7765. text-align: center;
  7766. }
  7767. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.max-hp .unrecoverable {
  7768. color: orangered;
  7769. }
  7770. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small {
  7771. display: flex;
  7772. justify-content: space-evenly;
  7773. margin: 8px 2px 0 2px;
  7774. text-align: center;
  7775. gap: 2px;
  7776. }
  7777. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small h4,
  7778. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small label {
  7779. font-family: var(--sans-serif);
  7780. font-size: var(--font-size-10);
  7781. text-transform: uppercase;
  7782. letter-spacing: 0.05em;
  7783. text-rendering: optimizeLegibility;
  7784. }
  7785. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small .far,
  7786. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small .fas {
  7787. color: var(--text-light);
  7788. }
  7789. .actor.sheet .crb-style aside .sidebar .armor-class {
  7790. display: grid;
  7791. grid: "ac shield-hp shield-footer" 74px "shield-data shield-data shield-data" auto/66px 59px auto;
  7792. grid-column-gap: 4px;
  7793. }
  7794. .actor.sheet .crb-style aside .sidebar .armor-class .shield {
  7795. display: flex;
  7796. justify-content: flex-start;
  7797. align-items: center;
  7798. flex-direction: column;
  7799. height: 74px;
  7800. text-align: center;
  7801. padding: 14px 10px 0 10px;
  7802. }
  7803. .actor.sheet .crb-style aside .sidebar .armor-class .shield .data-value h2,
  7804. .actor.sheet .crb-style aside .sidebar .armor-class .shield .data-value input[type=number] {
  7805. font-size: var(--font-size-32);
  7806. width: 55px;
  7807. }
  7808. .actor.sheet .crb-style aside .sidebar .armor-class .shield label {
  7809. white-space: normal;
  7810. }
  7811. .actor.sheet .crb-style aside .sidebar .armor-class .shield.ac {
  7812. grid-area: ac;
  7813. background: url("../assets/sheet/shield-blue.webp") no-repeat center center;
  7814. }
  7815. .actor.sheet .crb-style aside .sidebar .armor-class .shield.hp {
  7816. grid-area: shield-hp;
  7817. background: url("../assets/sheet/shield-red.webp") no-repeat top center;
  7818. }
  7819. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats {
  7820. grid-area: shield-data;
  7821. }
  7822. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol {
  7823. margin-top: 4px;
  7824. flex-direction: row;
  7825. height: 100%;
  7826. padding: 0 4px;
  7827. justify-content: space-evenly;
  7828. }
  7829. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li {
  7830. justify-content: center;
  7831. font-size: 0;
  7832. }
  7833. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li + li {
  7834. margin-left: 8px;
  7835. }
  7836. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label {
  7837. position: relative;
  7838. }
  7839. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label svg {
  7840. border: none;
  7841. width: auto;
  7842. height: 20px;
  7843. }
  7844. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label svg path {
  7845. fill: var(--tertiary-light);
  7846. }
  7847. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label svg text {
  7848. fill: var(--primary-dark);
  7849. }
  7850. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label:after {
  7851. display: inline-block;
  7852. position: absolute;
  7853. font-family: var(--sans-serif);
  7854. font-size: var(--font-size-10);
  7855. text-transform: uppercase;
  7856. letter-spacing: 0.05em;
  7857. text-rendering: optimizeLegibility;
  7858. color: var(--primary);
  7859. top: 0;
  7860. left: 1px;
  7861. line-height: 1.5;
  7862. }
  7863. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label.ac:after {
  7864. content: "AC";
  7865. top: 3px;
  7866. left: 3px;
  7867. }
  7868. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label.hardness:after {
  7869. left: 5px;
  7870. top: 3px;
  7871. content: "H";
  7872. }
  7873. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label.bt:after {
  7874. top: 3px;
  7875. left: 3.5px;
  7876. content: "BT";
  7877. }
  7878. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .data-value {
  7879. flex: 1;
  7880. border: 1px solid #956d58;
  7881. /* prettier-ignore */
  7882. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 0 4px rgba(0, 0, 0, 0.5);
  7883. padding-left: 4px;
  7884. margin-left: -8px;
  7885. height: 20px;
  7886. }
  7887. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .data-value input[type=number] {
  7888. font-size: var(--font-size-14);
  7889. font-weight: 400;
  7890. padding-top: 2px;
  7891. height: 14px;
  7892. }
  7893. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer {
  7894. grid-area: shield-footer;
  7895. display: inline-flex;
  7896. flex-direction: column;
  7897. justify-content: center;
  7898. justify-self: center;
  7899. width: calc(100% - 6px);
  7900. }
  7901. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer .shield-max {
  7902. display: flex;
  7903. flex-direction: column;
  7904. }
  7905. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer .shield-max label {
  7906. white-space: normal;
  7907. text-align: center;
  7908. margin-bottom: 4px;
  7909. }
  7910. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer .shield-status {
  7911. display: flex;
  7912. align-items: end;
  7913. justify-content: center;
  7914. gap: 5px;
  7915. color: var(--tertiary-light);
  7916. margin-top: 4px;
  7917. }
  7918. .actor.sheet .crb-style aside .sidebar .stamina {
  7919. flex-direction: row;
  7920. }
  7921. .actor.sheet .crb-style aside .sidebar .stamina li {
  7922. flex-direction: column;
  7923. }
  7924. .actor.sheet .crb-style aside .sidebar .stamina li input {
  7925. padding: 0;
  7926. font-size: var(--font-size-24);
  7927. }
  7928. .actor.sheet .crb-style aside .sidebar .stamina li input.left {
  7929. color: var(--text-light);
  7930. text-align: right;
  7931. margin-right: 4px;
  7932. }
  7933. .actor.sheet .crb-style aside .sidebar .stamina li input.right {
  7934. color: var(--tertiary-light);
  7935. text-align: left;
  7936. margin-left: 4px;
  7937. }
  7938. .actor.sheet .crb-style aside .sidebar .stamina li .divider {
  7939. font-size: var(--font-size-16);
  7940. line-height: 1;
  7941. }
  7942. .actor.sheet .crb-style aside .sidebar .stamina li .stamina-group {
  7943. display: flex;
  7944. align-items: center;
  7945. }
  7946. .actor.sheet .crb-style aside .sidebar .roll-data {
  7947. display: flex;
  7948. align-items: center;
  7949. justify-content: space-between;
  7950. }
  7951. .actor.sheet .crb-style aside .sidebar .roll-data h3 {
  7952. font-size: var(--font-size-18);
  7953. font-weight: initial;
  7954. color: var(--tertiary-light);
  7955. white-space: nowrap;
  7956. }
  7957. .actor.sheet .crb-style aside .sidebar .roll-data .initiative-select {
  7958. width: 129px;
  7959. }
  7960. .actor.sheet .crb-style aside .sidebar .perception-sidebar,
  7961. .actor.sheet .crb-style aside .sidebar .initiative-sidebar {
  7962. gap: 5px;
  7963. }
  7964. .actor.sheet .crb-style aside .sidebar .perception-sidebar h3,
  7965. .actor.sheet .crb-style aside .sidebar .initiative-sidebar h3 {
  7966. flex-grow: 1;
  7967. }
  7968. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves {
  7969. margin: 0;
  7970. padding: 0;
  7971. display: flex;
  7972. }
  7973. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data {
  7974. flex: 1 1 auto;
  7975. display: flex;
  7976. flex-direction: column;
  7977. justify-content: center;
  7978. align-items: center;
  7979. border-left: 1px solid rgba(255, 239, 189, 0.1882352941);
  7980. }
  7981. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data:first-child {
  7982. border-left: none;
  7983. }
  7984. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .sidebar_label {
  7985. font-weight: initial;
  7986. text-transform: capitalize;
  7987. font-size: var(--font-size-12);
  7988. border: none;
  7989. margin-bottom: 2px;
  7990. }
  7991. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .save-roll {
  7992. display: flex;
  7993. justify-content: center;
  7994. align-items: center;
  7995. margin: 4px 0;
  7996. }
  7997. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .save-roll h3 {
  7998. margin: 0;
  7999. margin-left: 2px;
  8000. }
  8001. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .modifiers_button {
  8002. padding: 2px;
  8003. border-radius: 2px;
  8004. width: initial;
  8005. }
  8006. .actor.sheet .crb-style aside .sidebar ol.tags {
  8007. flex-direction: row;
  8008. }
  8009. .actor.sheet .crb-style aside .sidebar ol.tags li {
  8010. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  8011. }
  8012. .actor.sheet .crb-style header.char-header {
  8013. display: flex;
  8014. justify-content: space-between;
  8015. align-items: center;
  8016. color: var(--text-light);
  8017. }
  8018. .actor.sheet .crb-style header.char-header .char-details {
  8019. font-family: var(--sans-serif);
  8020. font-size: var(--font-size-10);
  8021. text-transform: uppercase;
  8022. letter-spacing: 0.05em;
  8023. text-rendering: optimizeLegibility;
  8024. margin-left: 8px;
  8025. }
  8026. .actor.sheet .crb-style header.char-header .char-details h1.char-name {
  8027. margin: 0;
  8028. border: none;
  8029. }
  8030. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable {
  8031. letter-spacing: normal;
  8032. word-spacing: normal;
  8033. text-transform: none;
  8034. text-indent: 0;
  8035. text-shadow: none;
  8036. text-rendering: auto;
  8037. }
  8038. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable.gender {
  8039. font-size: var(--font-size-14);
  8040. }
  8041. .actor.sheet .crb-style header.char-header .char-details h1.char-name input[type=text],
  8042. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable {
  8043. font-family: var(--serif);
  8044. font-weight: 500;
  8045. font-size: var(--font-size-24);
  8046. color: var(--text-light);
  8047. line-height: calc(1em + 1px);
  8048. border-bottom: 1px solid transparent;
  8049. height: 26px;
  8050. }
  8051. .actor.sheet .crb-style header.char-header .char-details h1.char-name input[type=text]:focus,
  8052. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable:focus {
  8053. box-shadow: none;
  8054. border-bottom: 1px solid var(--text-light);
  8055. }
  8056. .actor.sheet .crb-style header.char-header .char-details h2.non-editable.ancestry-class {
  8057. font-family: var(--serif);
  8058. border-bottom: none;
  8059. margin-bottom: 0;
  8060. font-weight: 400;
  8061. }
  8062. .actor.sheet .crb-style header.char-header .char-level {
  8063. display: flex;
  8064. justify-content: flex-start;
  8065. padding-bottom: 4px;
  8066. }
  8067. .actor.sheet .crb-style header.char-header .char-level .level {
  8068. position: relative;
  8069. display: flex;
  8070. justify-content: center;
  8071. align-items: center;
  8072. flex-direction: column;
  8073. height: 43px;
  8074. width: 40px;
  8075. background: url("../assets/sheet/level-badge.webp") no-repeat;
  8076. background-size: 40px 43px;
  8077. z-index: 2;
  8078. font-size: 0;
  8079. padding-top: 2px;
  8080. }
  8081. .actor.sheet .crb-style header.char-header .char-level .level label {
  8082. color: var(--sidebar-label);
  8083. font-family: var(--sans-serif);
  8084. font-size: var(--font-size-10);
  8085. text-transform: uppercase;
  8086. letter-spacing: 0.05em;
  8087. text-rendering: optimizeLegibility;
  8088. line-height: 1.5;
  8089. }
  8090. .actor.sheet .crb-style header.char-header .char-level .level input {
  8091. font-family: var(--serif);
  8092. font-size: var(--font-size-22);
  8093. font-weight: 400;
  8094. color: var(--text-light);
  8095. line-height: calc(1em + 1px);
  8096. height: 24px;
  8097. }
  8098. .actor.sheet .crb-style header.char-header .char-level .level label,
  8099. .actor.sheet .crb-style header.char-header .char-level .level input {
  8100. margin-left: 1px;
  8101. text-align: center;
  8102. }
  8103. .actor.sheet .crb-style .char-header {
  8104. grid-area: header;
  8105. padding-right: 1rem;
  8106. }
  8107. .actor.sheet .crb-style .sheet-navigation {
  8108. grid-area: nav;
  8109. margin-left: -2px;
  8110. }
  8111. .actor.sheet .crb-style .sheet-body {
  8112. grid-area: content;
  8113. position: relative;
  8114. z-index: 0;
  8115. }
  8116. .actor.sheet .crb-style .sheet-body ol {
  8117. list-style: none;
  8118. }
  8119. .actor.sheet .crb-style .sheet-body .sheet-content,
  8120. .actor.sheet .crb-style .sheet-body .sheet-content .inventory {
  8121. bottom: 0;
  8122. display: flex;
  8123. flex-direction: column;
  8124. left: 0;
  8125. position: absolute;
  8126. top: 0;
  8127. width: 100%;
  8128. }
  8129. .actor.sheet .crb-style .sheet-body .sheet-content.tab[data-tab],
  8130. .actor.sheet .crb-style .sheet-body .sheet-content .inventory.tab[data-tab] {
  8131. display: none;
  8132. }
  8133. .actor.sheet .crb-style .sheet-body .sheet-content.tab[data-tab].active,
  8134. .actor.sheet .crb-style .sheet-body .sheet-content .inventory.tab[data-tab].active {
  8135. display: initial;
  8136. }
  8137. .actor.sheet .crb-style .sheet-body .sheet-content {
  8138. color: var(--text-dark);
  8139. }
  8140. .actor.sheet .crb-style .sheet-body .sheet-content > .tab {
  8141. padding: 0.6rem 0.6rem 0;
  8142. }
  8143. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list {
  8144. margin: 0;
  8145. padding: 0;
  8146. border-bottom: 1px solid var(--color-border-light-2);
  8147. flex-basis: 100%;
  8148. gap: 1px;
  8149. position: relative;
  8150. width: 100%;
  8151. z-index: 1;
  8152. }
  8153. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li {
  8154. margin: 0;
  8155. padding: 0;
  8156. align-items: center;
  8157. background: none;
  8158. cursor: default;
  8159. display: grid;
  8160. grid: "name range components cast-spell controls" auto "content content content content content" auto/9fr 4fr 4fr 2fr 2.5fr;
  8161. justify-content: center;
  8162. padding: 0 0.3em 1px 0.35em;
  8163. }
  8164. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li[data-expended-state=true] h4 {
  8165. color: var(--color-disabled);
  8166. text-decoration: line-through;
  8167. }
  8168. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li[data-expended-state=true] .cast-spell {
  8169. background: var(--color-disabled);
  8170. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  8171. cursor: not-allowed;
  8172. }
  8173. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li:nth-child(odd) {
  8174. background-color: rgba(120, 100, 82, 0.1);
  8175. }
  8176. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li:last-child {
  8177. border-bottom: 1px solid var(--sub);
  8178. }
  8179. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li:last-child .item-image {
  8180. margin-bottom: 0;
  8181. margin-top: 2px;
  8182. }
  8183. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header {
  8184. margin: 0;
  8185. padding: 0;
  8186. background: rgba(96, 88, 86, 0.25);
  8187. border: 1px solid var(--color-border-light-2);
  8188. border-radius: 2px;
  8189. color: var(--text-dark);
  8190. font: 500 var(--font-size-12) var(--sans-serif);
  8191. letter-spacing: 0.25px;
  8192. line-height: 1;
  8193. padding: 0 0.5em;
  8194. text-transform: uppercase;
  8195. }
  8196. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header h3 {
  8197. text-transform: capitalize;
  8198. font-size: var(--font-size-13);
  8199. margin-left: 0;
  8200. padding: 4px 0;
  8201. }
  8202. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .item-name {
  8203. line-height: 1;
  8204. gap: 0.25em;
  8205. }
  8206. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .item-name h3 {
  8207. margin: 0;
  8208. padding: 0;
  8209. font-weight: 700;
  8210. }
  8211. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .item-controls {
  8212. grid-column: span 2;
  8213. }
  8214. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses {
  8215. align-items: center;
  8216. display: flex;
  8217. gap: 0.25em;
  8218. line-height: 1;
  8219. }
  8220. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input,
  8221. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input {
  8222. background: var(--alt);
  8223. border-radius: 3px;
  8224. border: 1px solid var(--sub);
  8225. color: var(--text-light);
  8226. font: var(--font-size-12) var(--sans-serif);
  8227. height: unset;
  8228. text-align: center;
  8229. width: 2em;
  8230. }
  8231. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .spell-slots-increment-reset,
  8232. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses .spell-slots-increment-reset {
  8233. padding-left: 5px;
  8234. font-size: var(--font-size-10);
  8235. }
  8236. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell {
  8237. border: none;
  8238. font-size: var(--font-size-13);
  8239. }
  8240. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .level-prepared-toggle {
  8241. flex: 0;
  8242. font-size: 0.75rem;
  8243. color: var(--secondary);
  8244. }
  8245. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name {
  8246. align-items: center;
  8247. display: flex;
  8248. flex-wrap: nowrap;
  8249. justify-content: start;
  8250. justify-self: start;
  8251. min-height: 1.75rem;
  8252. }
  8253. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h3 {
  8254. white-space: nowrap;
  8255. }
  8256. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name + span {
  8257. font-size: 0.75rem;
  8258. }
  8259. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .focus-pool-input {
  8260. align-items: center;
  8261. display: flex;
  8262. flex-wrap: nowrap;
  8263. }
  8264. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .slash {
  8265. font-size: 0.75rem;
  8266. }
  8267. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-slots,
  8268. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-max {
  8269. padding-top: 3px;
  8270. font-size: 0.75rem;
  8271. }
  8272. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-slots.infinity,
  8273. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-max.infinity {
  8274. position: relative;
  8275. top: -2px;
  8276. }
  8277. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .item-image {
  8278. height: 1.5rem;
  8279. width: 1.5rem;
  8280. flex: 0 0 auto;
  8281. margin: 2px 0;
  8282. }
  8283. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h4 {
  8284. margin: 0;
  8285. padding: 0;
  8286. font-size: var(--font-size-14);
  8287. letter-spacing: -0.075em;
  8288. line-height: 1;
  8289. margin-left: 8px;
  8290. cursor: pointer;
  8291. }
  8292. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h4:hover {
  8293. color: var(--secondary);
  8294. }
  8295. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .action-glyph {
  8296. margin-left: 4px;
  8297. font-size: small;
  8298. }
  8299. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name.empty {
  8300. grid-column: 1/span 4;
  8301. }
  8302. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-range {
  8303. grid-area: range;
  8304. padding-left: 0.2em;
  8305. }
  8306. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-components {
  8307. grid-area: components;
  8308. justify-self: right;
  8309. padding: 0 0.5em;
  8310. }
  8311. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-components .tag {
  8312. font: var(--font-size-12) var(--sans-serif-condensed);
  8313. }
  8314. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-cast {
  8315. grid-area: cast-spell;
  8316. display: flex;
  8317. justify-content: center;
  8318. }
  8319. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-controls {
  8320. grid-area: controls;
  8321. display: flex;
  8322. justify-self: end;
  8323. padding-right: 0.25em;
  8324. }
  8325. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li button.cast-spell {
  8326. align-items: center;
  8327. background: var(--secondary);
  8328. border-radius: 2px;
  8329. border: black;
  8330. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  8331. color: var(--text-light);
  8332. cursor: pointer;
  8333. display: flex;
  8334. font: 700 0.55rem var(--sans-serif);
  8335. justify-self: center;
  8336. letter-spacing: 0.25px;
  8337. max-width: fit-content;
  8338. padding: 0.5em 1em;
  8339. text-transform: uppercase;
  8340. }
  8341. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-summary {
  8342. grid-area: content;
  8343. width: 100%;
  8344. padding: 8px;
  8345. border-bottom: 1px solid var(--sub);
  8346. border-top: 1px solid #aca5a3;
  8347. background-color: var(--bg);
  8348. }
  8349. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list[data-category=spontaneous] .virtual {
  8350. position: relative;
  8351. }
  8352. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list[data-category=spontaneous] .virtual::before {
  8353. pointer-events: none;
  8354. content: "";
  8355. position: absolute;
  8356. height: 100%;
  8357. width: 100%;
  8358. background-color: rgba(0, 5, 255, 0.1137254902);
  8359. mix-blend-mode: saturation;
  8360. }
  8361. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list[data-category=spontaneous] .item:not(.virtual) + .virtual {
  8362. border-top: 1px solid rgba(0, 0, 0, 0.15);
  8363. }
  8364. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .level-prepared-header {
  8365. font-size: 0.75rem;
  8366. color: var(--text-light);
  8367. margin: 0;
  8368. padding: 4px;
  8369. text-align: center;
  8370. background: var(--secondary);
  8371. position: relative;
  8372. }
  8373. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spell .item-name {
  8374. width: 100%;
  8375. }
  8376. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list input.toggle-signature-spell[type=checkbox] {
  8377. width: 12px;
  8378. height: 12px;
  8379. margin: 0 2px 0 0;
  8380. flex: 0 0 auto;
  8381. }
  8382. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spellbook-empty {
  8383. display: flex;
  8384. align-items: center;
  8385. min-height: 28px;
  8386. justify-content: flex-end;
  8387. }
  8388. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spellbook-empty h4 {
  8389. margin: 0;
  8390. white-space: nowrap;
  8391. margin-right: auto;
  8392. }
  8393. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spellbook-empty a {
  8394. flex: 0 1 0;
  8395. white-space: nowrap;
  8396. margin-left: 8px;
  8397. }
  8398. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list > h3,
  8399. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list > li > h3 {
  8400. font-size: 1rem;
  8401. font-weight: 500;
  8402. font-family: var(--serif);
  8403. line-height: 1;
  8404. color: var(--text-light);
  8405. margin: 0;
  8406. padding: 0;
  8407. margin-left: 8px;
  8408. }
  8409. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header {
  8410. align-items: center;
  8411. background: var(--primary);
  8412. border: none;
  8413. border-radius: 0.25em;
  8414. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  8415. display: flex;
  8416. flex-basis: 100%;
  8417. flex-wrap: nowrap;
  8418. height: 32px;
  8419. justify-content: space-between;
  8420. margin-left: 0;
  8421. margin-top: 8px;
  8422. padding: 0 0.5em;
  8423. position: relative;
  8424. width: 100%;
  8425. z-index: 2;
  8426. }
  8427. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header:first-child {
  8428. margin-top: 0;
  8429. }
  8430. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header + li {
  8431. border-top: none;
  8432. }
  8433. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header .drag-handle {
  8434. cursor: move;
  8435. }
  8436. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header > a .fas,
  8437. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header > a > .fa {
  8438. flex-basis: 0;
  8439. color: var(--text-light);
  8440. margin-right: 0.25em;
  8441. padding-top: 0.25em;
  8442. }
  8443. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header .item-controls {
  8444. color: var(--text-light);
  8445. flex: 1 0 auto;
  8446. font: 0.85em var(--sans-serif);
  8447. letter-spacing: 0.05em;
  8448. margin-left: auto;
  8449. max-width: fit-content;
  8450. text-transform: uppercase;
  8451. font-size: var(--font-size-12);
  8452. }
  8453. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header h3 {
  8454. color: var(--text-light);
  8455. flex: 1 1 100%;
  8456. margin-bottom: 0;
  8457. font-size: var(--font-size-16);
  8458. }
  8459. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header h3 input.item-name-input {
  8460. color: var(--text-light);
  8461. max-width: 100%;
  8462. font-weight: 500;
  8463. }
  8464. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header h3 input.item-name-input:read-only {
  8465. pointer-events: none;
  8466. }
  8467. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container {
  8468. padding: 0 0.5rem 2rem 0;
  8469. }
  8470. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper {
  8471. justify-items: center;
  8472. }
  8473. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .action-radio {
  8474. display: none;
  8475. }
  8476. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels {
  8477. min-height: min-content;
  8478. width: 100%;
  8479. }
  8480. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-panel {
  8481. display: none;
  8482. }
  8483. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-panel.active {
  8484. display: flex;
  8485. flex-direction: column;
  8486. }
  8487. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options {
  8488. border-image-repeat: repeat;
  8489. border-image-slice: 11;
  8490. border-image-source: url("../assets/sheet/frame-elegant.svg");
  8491. border-image-width: 14px;
  8492. border-style: double;
  8493. display: flex;
  8494. flex-wrap: wrap;
  8495. margin-bottom: 0.5rem;
  8496. padding: 0.5rem 1rem;
  8497. }
  8498. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option {
  8499. align-items: center;
  8500. display: flex;
  8501. width: 100%;
  8502. margin: 1px 0;
  8503. }
  8504. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label * {
  8505. vertical-align: middle;
  8506. }
  8507. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label input {
  8508. margin: 0;
  8509. padding: 0;
  8510. }
  8511. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label .unchecked-disabled {
  8512. color: var(--color-text-dark-inactive);
  8513. }
  8514. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label select {
  8515. margin-left: 0.25em;
  8516. }
  8517. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list {
  8518. padding-left: 0;
  8519. }
  8520. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action-header {
  8521. align-items: center;
  8522. display: flex;
  8523. }
  8524. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike {
  8525. border: solid transparent;
  8526. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  8527. border-width: 0 0 1px;
  8528. padding: 4px;
  8529. width: 100%;
  8530. }
  8531. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action p:empty, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike p:empty {
  8532. display: none;
  8533. }
  8534. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name {
  8535. grid-area: icon-name;
  8536. align-items: center;
  8537. display: flex;
  8538. flex: 1;
  8539. margin: 0;
  8540. }
  8541. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name h4, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name h4 {
  8542. cursor: pointer;
  8543. margin: 0;
  8544. max-width: fit-content;
  8545. }
  8546. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name .item-image, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .item-image {
  8547. display: flex;
  8548. justify-content: center;
  8549. align-items: center;
  8550. background-repeat: no-repeat;
  8551. background-size: contain;
  8552. color: transparent;
  8553. cursor: pointer;
  8554. font-size: var(--font-size-18);
  8555. height: 32px;
  8556. margin-right: 8px;
  8557. width: 32px;
  8558. }
  8559. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name .item-image:hover, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .item-image:hover {
  8560. background: none;
  8561. color: var(--primary);
  8562. }
  8563. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name .actions-title, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .actions-title {
  8564. flex: 1;
  8565. }
  8566. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name .actions-title .action-name, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .actions-title .action-name {
  8567. display: flex;
  8568. flex-direction: row;
  8569. }
  8570. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name .actions-title .action-name > h4, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .actions-title .action-name > h4 {
  8571. cursor: pointer;
  8572. }
  8573. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name .actions-title .action-name > h4:hover, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .actions-title .action-name > h4:hover {
  8574. color: var(--primary);
  8575. }
  8576. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name .actions-title .action-name > h4:hover .action-glyph, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .actions-title .action-name > h4:hover .action-glyph {
  8577. color: var(--text-dark);
  8578. }
  8579. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action button.use-action, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike button.use-action {
  8580. align-items: center;
  8581. border-radius: 2px;
  8582. border: none;
  8583. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3), inset 0 0 0 2px rgba(0, 0, 0, 0.2);
  8584. display: flex;
  8585. flex: 0;
  8586. font: 500 var(--font-size-10) var(--sans-serif);
  8587. gap: 0.25em;
  8588. height: 2em;
  8589. justify-content: space-evenly;
  8590. letter-spacing: 0.05em;
  8591. margin: 0;
  8592. max-width: fit-content;
  8593. padding: 0.5em;
  8594. text-rendering: optimizeLegibility;
  8595. text-transform: uppercase;
  8596. white-space: nowrap;
  8597. }
  8598. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action button.use-action:not(:disabled), .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike button.use-action:not(:disabled) {
  8599. background: var(--bg-dark);
  8600. cursor: pointer;
  8601. }
  8602. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action button.use-action:not(:disabled):hover, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike button.use-action:not(:disabled):hover {
  8603. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), inset 0 0 0 2px rgba(0, 0, 0, 0.4);
  8604. }
  8605. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action button.use-action:not(:disabled):active, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike button.use-action:not(:disabled):active {
  8606. color: var(--primary);
  8607. }
  8608. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-controls, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-controls {
  8609. font-size: var(--font-size-12);
  8610. grid-area: controls;
  8611. white-space: nowrap;
  8612. }
  8613. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary {
  8614. flex-basis: 100%;
  8615. margin: 0.5rem 0;
  8616. }
  8617. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .title,
  8618. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .framing, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .title,
  8619. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .framing {
  8620. color: var(--primary);
  8621. margin-top: 1em;
  8622. margin: 0;
  8623. padding: 0;
  8624. }
  8625. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .framing, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .framing {
  8626. color: var(--secondary);
  8627. margin: 1em 0 0.25em;
  8628. }
  8629. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .framing strong, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .framing strong {
  8630. font-weight: 500;
  8631. }
  8632. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .framing + p, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .framing + p {
  8633. margin-top: 0;
  8634. }
  8635. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary img, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary img {
  8636. border: none;
  8637. vertical-align: middle;
  8638. }
  8639. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary img.actionlight, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary img.actionlight {
  8640. background: var(--alt);
  8641. vertical-align: middle;
  8642. border: 1px solid var(--text-dark);
  8643. }
  8644. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .item-properties .tag.toggled-on:hover, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .item-properties .tag.toggled-off:hover, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .item-properties .tag.toggled-on:hover, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .item-properties .tag.toggled-off:hover {
  8645. box-shadow: none;
  8646. text-shadow: 0 0 2px white;
  8647. }
  8648. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .item-properties .tag.toggled-on, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .item-properties .tag.toggled-off, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .item-properties .tag.toggled-on, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .item-properties .tag.toggled-off {
  8649. cursor: pointer;
  8650. }
  8651. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .item-properties .tag.toggled-on, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .item-properties .tag.toggled-on {
  8652. background-color: rgba(23, 31, 105, 0.5);
  8653. color: var(--text-dark);
  8654. text-shadow: 0 0 2px white;
  8655. }
  8656. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary {
  8657. border-image-repeat: repeat;
  8658. border-image-slice: 11;
  8659. border-image-source: url("../assets/sheet/frame-elegant.svg");
  8660. border-image-width: 14px;
  8661. border-style: double;
  8662. padding: 0.5rem 1rem 1rem;
  8663. }
  8664. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary dd, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary dd {
  8665. margin: 0;
  8666. margin-bottom: 0.5rem;
  8667. }
  8668. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .tag.tag_secondary, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .tag.tag_secondary {
  8669. background-color: rgba(0, 0, 0, 0.8);
  8670. }
  8671. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action.hidden, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike.hidden {
  8672. display: none;
  8673. }
  8674. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action {
  8675. align-items: center;
  8676. column-gap: 0.5rem;
  8677. display: grid;
  8678. grid: "icon name tracking controls" 1fr "icon buttons tracking controls" auto "summary summary summary summary" auto/min-content 1fr 20% 10%;
  8679. }
  8680. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action > .icon {
  8681. grid-area: icon;
  8682. height: 32px;
  8683. width: 32px;
  8684. }
  8685. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .name {
  8686. align-items: center;
  8687. grid-area: name;
  8688. display: flex;
  8689. margin-bottom: 0;
  8690. text-align: left;
  8691. }
  8692. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .button-group {
  8693. grid-area: buttons;
  8694. display: flex;
  8695. flex-wrap: wrap;
  8696. gap: 1px;
  8697. }
  8698. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .tracking {
  8699. grid-area: tracking;
  8700. }
  8701. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-controls {
  8702. grid-area: controls;
  8703. }
  8704. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary {
  8705. grid-area: summary;
  8706. }
  8707. .actor.sheet .crb-style .sheet-body .sheet-content footer {
  8708. font-family: var(--sans-serif);
  8709. font-size: var(--font-size-10);
  8710. text-transform: uppercase;
  8711. letter-spacing: 0.05em;
  8712. text-rendering: optimizeLegibility;
  8713. color: var(--primary);
  8714. text-align: right;
  8715. line-height: 1.4;
  8716. margin: 1em 1em 0;
  8717. }
  8718. .actor.sheet .crb-style nav.sheet-navigation {
  8719. display: inline-flex;
  8720. justify-content: center;
  8721. align-items: center;
  8722. height: 20px;
  8723. background: var(--secondary);
  8724. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  8725. transition: all 0.1s ease-out;
  8726. box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
  8727. border-top: 1px solid rgba(255, 255, 255, 0.1);
  8728. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  8729. position: relative;
  8730. }
  8731. .actor.sheet .crb-style nav.sheet-navigation .navigation-title {
  8732. color: var(--text-light);
  8733. margin-right: auto;
  8734. padding-left: 1em;
  8735. white-space: nowrap;
  8736. width: 7em;
  8737. }
  8738. .actor.sheet .crb-style nav.sheet-navigation > a {
  8739. display: flex;
  8740. justify-content: center;
  8741. align-items: center;
  8742. margin: 0 6px;
  8743. font-size: var(--font-size-12);
  8744. }
  8745. .actor.sheet .crb-style nav.sheet-navigation .item {
  8746. height: 24px;
  8747. width: 24px;
  8748. border-radius: 50%;
  8749. z-index: 1;
  8750. transition: all 0.1s ease-out;
  8751. color: var(--tertiary);
  8752. fill: var(--tertiary);
  8753. background-image: url("../assets/sheet/nav-item-inactive.webp");
  8754. background-size: contain;
  8755. /* prettier-ignore */
  8756. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25);
  8757. }
  8758. .actor.sheet .crb-style nav.sheet-navigation .item.active {
  8759. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25), 0 0 8px var(--tertiary);
  8760. }
  8761. .actor.sheet .crb-style nav.sheet-navigation .item:last-child {
  8762. margin-right: 10px;
  8763. }
  8764. .actor.sheet .crb-style nav.sheet-navigation .item:hover, .actor.sheet .crb-style nav.sheet-navigation .item.active {
  8765. z-index: 2;
  8766. transform: scale(1.2);
  8767. color: var(--text-light);
  8768. fill: var(--text-light);
  8769. background-image: url("../assets/sheet/nav-item.webp");
  8770. }
  8771. .actor.sheet .crb-style nav.sheet-navigation .item .fas {
  8772. padding-bottom: 0;
  8773. }
  8774. .actor.sheet .crb-style nav.sheet-navigation .item:hover .pfs-icon {
  8775. filter: drop-shadow(0 0 8px var(--color-shadow-primary));
  8776. }
  8777. .actor.sheet .crb-style nav.sheet-navigation .item .action-icon {
  8778. font-family: "Pathfinder2eActions", sans-serif;
  8779. font-size: 1rem;
  8780. }
  8781. .actor.sheet .crb-style nav.sub-nav {
  8782. margin: 0;
  8783. padding: 0;
  8784. display: flex;
  8785. flex-wrap: nowrap;
  8786. justify-content: center;
  8787. align-items: center;
  8788. list-style: none;
  8789. background-color: var(--bg);
  8790. box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  8791. width: 100%;
  8792. flex: 0 0 2.5rem;
  8793. }
  8794. .actor.sheet .crb-style nav.sub-nav::before, .actor.sheet .crb-style nav.sub-nav::after {
  8795. content: "";
  8796. width: 37px;
  8797. height: 16px;
  8798. background: url("../assets/sheet/sub-nav-decoration.webp");
  8799. margin: 0 16px;
  8800. }
  8801. .actor.sheet .crb-style nav.sub-nav::after {
  8802. transform: scaleX(-100%);
  8803. }
  8804. .actor.sheet .crb-style nav.sub-nav a,
  8805. .actor.sheet .crb-style nav.sub-nav .tab {
  8806. border-left: 1px solid rgba(255, 255, 255, 0.3);
  8807. border-right: 1px solid rgba(0, 0, 0, 0.2);
  8808. color: var(--alt);
  8809. cursor: pointer;
  8810. display: block;
  8811. font: 400 var(--font-size-16) var(--serif);
  8812. flex: 1;
  8813. margin: 0 0.25rem;
  8814. max-width: 30%;
  8815. text-align: center;
  8816. text-decoration: none;
  8817. transition: all 0.1s ease-out;
  8818. }
  8819. .actor.sheet .crb-style nav.sub-nav a.active,
  8820. .actor.sheet .crb-style nav.sub-nav .tab.active {
  8821. color: var(--primary);
  8822. font-weight: 600;
  8823. }
  8824. .actor.sheet .crb-style nav.sub-nav a:first-child,
  8825. .actor.sheet .crb-style nav.sub-nav .tab:first-child {
  8826. border-left: none;
  8827. }
  8828. .actor.sheet .crb-style nav.sub-nav a:last-child,
  8829. .actor.sheet .crb-style nav.sub-nav .tab:last-child {
  8830. border-right: none;
  8831. }
  8832. .actor.sheet .crb-style nav.sub-nav a:hover,
  8833. .actor.sheet .crb-style nav.sub-nav .tab:hover {
  8834. text-shadow: 0 0 3px rgba(255, 255, 255, 0.5);
  8835. }
  8836. .actor.sheet .crb-style .tab nav.sub-nav {
  8837. padding-right: 20px;
  8838. }
  8839. .actor.sheet .crb-style .stroke-header {
  8840. position: relative;
  8841. }
  8842. .actor.sheet .crb-style .stroke-header svg {
  8843. position: absolute;
  8844. fill: var(--primary);
  8845. }
  8846. .actor.sheet .crb-style .stroke-header h3 {
  8847. position: relative;
  8848. }
  8849. .actor.sheet .crb-style.limited .sidebar {
  8850. align-items: center;
  8851. display: flex;
  8852. flex-direction: column;
  8853. height: 100%;
  8854. }
  8855. .actor.sheet .crb-style.limited .sidebar .profile-img {
  8856. display: flex;
  8857. align-items: end;
  8858. margin: 1rem 0;
  8859. max-width: 85%;
  8860. max-height: 200px;
  8861. background-color: var(--tertiary);
  8862. background-size: cover;
  8863. background-position: top center;
  8864. border: 1px solid rgba(0, 0, 0, 0.5);
  8865. box-shadow: 0 0 0 1px #c0c0c0, 0 0 0 2px #808080;
  8866. }
  8867. .actor.sheet .crb-style.limited .sidebar .appearance {
  8868. color: var(--sidebar-title);
  8869. display: flex;
  8870. flex-direction: column;
  8871. }
  8872. .actor.sheet .crb-style.limited .sidebar .appearance h3 {
  8873. border-bottom: none;
  8874. font-size: 1rem;
  8875. text-align: center;
  8876. }
  8877. .actor.sheet .crb-style.limited .sidebar .appearance .body {
  8878. font-weight: 400;
  8879. font-size: var(--font-size-14);
  8880. }
  8881. .actor.sheet .crb-style.limited .sidebar .orn img {
  8882. border: none;
  8883. position: relative;
  8884. }
  8885. .actor.sheet .crb-style.limited .sidebar .orn img:first-child {
  8886. left: 4px;
  8887. }
  8888. .actor.sheet .crb-style.limited .sidebar .orn img:last-child {
  8889. right: 4px;
  8890. transform: scaleX(-1);
  8891. }
  8892. .actor.sheet .crb-style.limited .sidebar ul.stats {
  8893. margin: 0;
  8894. padding: 0;
  8895. list-style: none;
  8896. text-align: center;
  8897. }
  8898. .actor.sheet .crb-style.limited .sidebar ul.stats li {
  8899. margin: 0;
  8900. padding: 0;
  8901. }
  8902. .actor.sheet .crb-style.limited .tab.biography .bio.backstory p:first-child {
  8903. margin-top: 0;
  8904. }
  8905. .actor.sheet .crb-style input.adjusted:not(:focus) {
  8906. font-weight: 700;
  8907. color: #009988;
  8908. }
  8909. .actor.sheet .crb-style button.tag:disabled {
  8910. cursor: not-allowed;
  8911. background-color: var(--color-text-dark-inactive);
  8912. }
  8913. .actor.sheet .crb-style .tags .tag.edit-btn {
  8914. align-items: center;
  8915. border-radius: 0;
  8916. display: flex;
  8917. justify-content: center;
  8918. }
  8919. .actor.sheet .crb-style .tags .tag.edit-btn a {
  8920. display: inline-flex;
  8921. }
  8922. .actor.sheet .crb-style .tags .tag.edit-btn a svg {
  8923. height: 9px;
  8924. width: auto;
  8925. }
  8926. .spellcasting-entry.preparation h3 {
  8927. border-bottom: none;
  8928. }
  8929. .spellcasting-entry.preparation button > i {
  8930. margin-right: 0;
  8931. }
  8932. .spellcasting-entry.preparation ol.spell-list {
  8933. margin: 0;
  8934. padding: 0;
  8935. border-bottom: 1px solid var(--color-border-light-2);
  8936. flex-basis: 100%;
  8937. gap: 1px;
  8938. position: relative;
  8939. width: 100%;
  8940. z-index: 1;
  8941. }
  8942. .spellcasting-entry.preparation ol.spell-list > li {
  8943. margin: 0;
  8944. padding: 0;
  8945. align-items: center;
  8946. background: none;
  8947. cursor: default;
  8948. display: grid;
  8949. grid: "name range components cast-spell controls" auto "content content content content content" auto/9fr 4fr 4fr 2fr 2.5fr;
  8950. justify-content: center;
  8951. padding: 0 0.3em 1px 0.35em;
  8952. }
  8953. .spellcasting-entry.preparation ol.spell-list > li[data-expended-state=true] h4 {
  8954. color: var(--color-disabled);
  8955. text-decoration: line-through;
  8956. }
  8957. .spellcasting-entry.preparation ol.spell-list > li[data-expended-state=true] .cast-spell {
  8958. background: var(--color-disabled);
  8959. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  8960. cursor: not-allowed;
  8961. }
  8962. .spellcasting-entry.preparation ol.spell-list > li:nth-child(odd) {
  8963. background-color: rgba(120, 100, 82, 0.1);
  8964. }
  8965. .spellcasting-entry.preparation ol.spell-list > li:last-child {
  8966. border-bottom: 1px solid var(--sub);
  8967. }
  8968. .spellcasting-entry.preparation ol.spell-list > li:last-child .item-image {
  8969. margin-bottom: 0;
  8970. margin-top: 2px;
  8971. }
  8972. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header {
  8973. margin: 0;
  8974. padding: 0;
  8975. background: rgba(96, 88, 86, 0.25);
  8976. border: 1px solid var(--color-border-light-2);
  8977. border-radius: 2px;
  8978. color: var(--text-dark);
  8979. font: 500 var(--font-size-12) var(--sans-serif);
  8980. letter-spacing: 0.25px;
  8981. line-height: 1;
  8982. padding: 0 0.5em;
  8983. text-transform: uppercase;
  8984. }
  8985. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header h3 {
  8986. text-transform: capitalize;
  8987. font-size: var(--font-size-13);
  8988. margin-left: 0;
  8989. padding: 4px 0;
  8990. }
  8991. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .item-name {
  8992. line-height: 1;
  8993. gap: 0.25em;
  8994. }
  8995. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .item-name h3 {
  8996. margin: 0;
  8997. padding: 0;
  8998. font-weight: 700;
  8999. }
  9000. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .item-controls {
  9001. grid-column: span 2;
  9002. }
  9003. .spellcasting-entry.preparation ol.spell-list > li .uses {
  9004. align-items: center;
  9005. display: flex;
  9006. gap: 0.25em;
  9007. line-height: 1;
  9008. }
  9009. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header input,
  9010. .spellcasting-entry.preparation ol.spell-list > li .uses input {
  9011. background: var(--alt);
  9012. border-radius: 3px;
  9013. border: 1px solid var(--sub);
  9014. color: var(--text-light);
  9015. font: var(--font-size-12) var(--sans-serif);
  9016. height: unset;
  9017. text-align: center;
  9018. width: 2em;
  9019. }
  9020. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .spell-slots-increment-reset,
  9021. .spellcasting-entry.preparation ol.spell-list > li .uses .spell-slots-increment-reset {
  9022. padding-left: 5px;
  9023. font-size: var(--font-size-10);
  9024. }
  9025. .spellcasting-entry.preparation ol.spell-list > li.spell {
  9026. border: none;
  9027. font-size: var(--font-size-13);
  9028. }
  9029. .spellcasting-entry.preparation ol.spell-list > li .level-prepared-toggle {
  9030. flex: 0;
  9031. font-size: 0.75rem;
  9032. color: var(--secondary);
  9033. }
  9034. .spellcasting-entry.preparation ol.spell-list > li .item-name {
  9035. align-items: center;
  9036. display: flex;
  9037. flex-wrap: nowrap;
  9038. justify-content: start;
  9039. justify-self: start;
  9040. min-height: 1.75rem;
  9041. }
  9042. .spellcasting-entry.preparation ol.spell-list > li .item-name h3 {
  9043. white-space: nowrap;
  9044. }
  9045. .spellcasting-entry.preparation ol.spell-list > li .item-name + span {
  9046. font-size: 0.75rem;
  9047. }
  9048. .spellcasting-entry.preparation ol.spell-list > li .item-name .focus-pool-input {
  9049. align-items: center;
  9050. display: flex;
  9051. flex-wrap: nowrap;
  9052. }
  9053. .spellcasting-entry.preparation ol.spell-list > li .item-name .slash {
  9054. font-size: 0.75rem;
  9055. }
  9056. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-slots,
  9057. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-max {
  9058. padding-top: 3px;
  9059. font-size: 0.75rem;
  9060. }
  9061. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-slots.infinity,
  9062. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-max.infinity {
  9063. position: relative;
  9064. top: -2px;
  9065. }
  9066. .spellcasting-entry.preparation ol.spell-list > li .item-name .item-image {
  9067. height: 1.5rem;
  9068. width: 1.5rem;
  9069. flex: 0 0 auto;
  9070. margin: 2px 0;
  9071. }
  9072. .spellcasting-entry.preparation ol.spell-list > li .item-name h4 {
  9073. margin: 0;
  9074. padding: 0;
  9075. font-size: var(--font-size-14);
  9076. letter-spacing: -0.075em;
  9077. line-height: 1;
  9078. margin-left: 8px;
  9079. cursor: pointer;
  9080. }
  9081. .spellcasting-entry.preparation ol.spell-list > li .item-name h4:hover {
  9082. color: var(--secondary);
  9083. }
  9084. .spellcasting-entry.preparation ol.spell-list > li .item-name .action-glyph {
  9085. margin-left: 4px;
  9086. font-size: small;
  9087. }
  9088. .spellcasting-entry.preparation ol.spell-list > li .item-name.empty {
  9089. grid-column: 1/span 4;
  9090. }
  9091. .spellcasting-entry.preparation ol.spell-list > li .spell-range {
  9092. grid-area: range;
  9093. padding-left: 0.2em;
  9094. }
  9095. .spellcasting-entry.preparation ol.spell-list > li .spell-components {
  9096. grid-area: components;
  9097. justify-self: right;
  9098. padding: 0 0.5em;
  9099. }
  9100. .spellcasting-entry.preparation ol.spell-list > li .spell-components .tag {
  9101. font: var(--font-size-12) var(--sans-serif-condensed);
  9102. }
  9103. .spellcasting-entry.preparation ol.spell-list > li .spell-cast {
  9104. grid-area: cast-spell;
  9105. display: flex;
  9106. justify-content: center;
  9107. }
  9108. .spellcasting-entry.preparation ol.spell-list > li .item-controls {
  9109. grid-area: controls;
  9110. display: flex;
  9111. justify-self: end;
  9112. padding-right: 0.25em;
  9113. }
  9114. .spellcasting-entry.preparation ol.spell-list > li button.cast-spell {
  9115. align-items: center;
  9116. background: var(--secondary);
  9117. border-radius: 2px;
  9118. border: black;
  9119. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  9120. color: var(--text-light);
  9121. cursor: pointer;
  9122. display: flex;
  9123. font: 700 0.55rem var(--sans-serif);
  9124. justify-self: center;
  9125. letter-spacing: 0.25px;
  9126. max-width: fit-content;
  9127. padding: 0.5em 1em;
  9128. text-transform: uppercase;
  9129. }
  9130. .spellcasting-entry.preparation ol.spell-list > li .item-summary {
  9131. grid-area: content;
  9132. width: 100%;
  9133. padding: 8px;
  9134. border-bottom: 1px solid var(--sub);
  9135. border-top: 1px solid #aca5a3;
  9136. background-color: var(--bg);
  9137. }
  9138. .spellcasting-entry.preparation ol.spell-list[data-category=spontaneous] .virtual {
  9139. position: relative;
  9140. }
  9141. .spellcasting-entry.preparation ol.spell-list[data-category=spontaneous] .virtual::before {
  9142. pointer-events: none;
  9143. content: "";
  9144. position: absolute;
  9145. height: 100%;
  9146. width: 100%;
  9147. background-color: rgba(0, 5, 255, 0.1137254902);
  9148. mix-blend-mode: saturation;
  9149. }
  9150. .spellcasting-entry.preparation ol.spell-list[data-category=spontaneous] .item:not(.virtual) + .virtual {
  9151. border-top: 1px solid rgba(0, 0, 0, 0.15);
  9152. }
  9153. .spellcasting-entry.preparation ol.spell-list .level-prepared-header {
  9154. font-size: 0.75rem;
  9155. color: var(--text-light);
  9156. margin: 0;
  9157. padding: 4px;
  9158. text-align: center;
  9159. background: var(--secondary);
  9160. position: relative;
  9161. }
  9162. .spellcasting-entry.preparation ol.spell-list .spell .item-name {
  9163. width: 100%;
  9164. }
  9165. .spellcasting-entry.preparation ol.spell-list input.toggle-signature-spell[type=checkbox] {
  9166. width: 12px;
  9167. height: 12px;
  9168. margin: 0 2px 0 0;
  9169. flex: 0 0 auto;
  9170. }
  9171. .spellcasting-entry.preparation ol.spell-list .spellbook-empty {
  9172. display: flex;
  9173. align-items: center;
  9174. min-height: 28px;
  9175. justify-content: flex-end;
  9176. }
  9177. .spellcasting-entry.preparation ol.spell-list .spellbook-empty h4 {
  9178. margin: 0;
  9179. white-space: nowrap;
  9180. margin-right: auto;
  9181. }
  9182. .spellcasting-entry.preparation ol.spell-list .spellbook-empty a {
  9183. flex: 0 1 0;
  9184. white-space: nowrap;
  9185. margin-left: 8px;
  9186. }
  9187. .spellcasting-entry.preparation form {
  9188. display: flex;
  9189. flex-direction: column;
  9190. height: 100%;
  9191. padding: 4px;
  9192. }
  9193. .spellcasting-entry.preparation .sheet-header {
  9194. align-items: baseline;
  9195. display: block;
  9196. flex: 0;
  9197. }
  9198. .spellcasting-entry.preparation .sheet-header h1 {
  9199. display: flex;
  9200. flex: 1;
  9201. overflow: hidden;
  9202. font-family: var(--serif-condensed);
  9203. font-weight: 700;
  9204. white-space: nowrap;
  9205. justify-content: space-between;
  9206. }
  9207. .spellcasting-entry.preparation .sheet-header p.hint {
  9208. margin: auto auto 0.5em;
  9209. }
  9210. .spellcasting-entry.preparation .sheet-header .item-controls {
  9211. flex: 0;
  9212. white-space: nowrap;
  9213. }
  9214. .spellcasting-entry.preparation .sheet-header .search {
  9215. margin-bottom: 0.5em;
  9216. }
  9217. .spellcasting-entry.preparation .sheet-content {
  9218. overflow: hidden scroll;
  9219. padding-bottom: 1em;
  9220. padding-right: 6px;
  9221. }
  9222. .spellcasting-entry.preparation .sheet-content .item-image {
  9223. cursor: pointer;
  9224. }
  9225. .spellcasting-entry.preparation .sheet-content [hidden] {
  9226. display: none;
  9227. }
  9228. .currency {
  9229. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  9230. align-items: center;
  9231. background-color: var(--sub);
  9232. display: flex;
  9233. font-size: var(--font-size-13);
  9234. list-style: none;
  9235. margin: 0;
  9236. padding: 3px;
  9237. }
  9238. .currency .label {
  9239. color: var(--color-text-light-0);
  9240. font-weight: 500;
  9241. margin: 0 10px 0 4px;
  9242. }
  9243. .currency .denomination {
  9244. align-items: center;
  9245. background-color: transparent;
  9246. border-left: 1px solid rgba(0, 0, 0, 0.2);
  9247. border-right: 1px solid rgba(255, 255, 255, 0.1);
  9248. color: var(--color-text-light-0);
  9249. display: flex;
  9250. flex-wrap: nowrap;
  9251. flex: 0 1 auto;
  9252. justify-content: start;
  9253. text-shadow: 0 0 3px rgba(0, 0, 0, 0.75);
  9254. width: 100%;
  9255. }
  9256. .currency .denomination:first-child {
  9257. border-left: none;
  9258. }
  9259. .currency .denomination:last-child {
  9260. border-right: none;
  9261. margin-right: 8px;
  9262. }
  9263. .currency .denomination label {
  9264. color: #ffe8d1;
  9265. text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.2), -1px -1px 1px rgba(0, 0, 0, 0.2);
  9266. font-family: var(--sans-serif);
  9267. font-size: var(--font-size-10);
  9268. text-transform: uppercase;
  9269. letter-spacing: 0.05em;
  9270. text-rendering: optimizeLegibility;
  9271. }
  9272. .currency .denomination span {
  9273. padding-left: 8px;
  9274. padding-right: 12px;
  9275. }
  9276. .currency .denomination.pp .currency-image {
  9277. background: url("../icons/equipment/treasure/currency/platinum-pieces.webp") no-repeat;
  9278. }
  9279. .currency .denomination.gp .currency-image {
  9280. background: url("../icons/equipment/treasure/currency/gold-pieces.webp") no-repeat;
  9281. }
  9282. .currency .denomination.sp .currency-image {
  9283. background: url("../icons/equipment/treasure/currency/silver-pieces.webp") no-repeat;
  9284. }
  9285. .currency .denomination.cp .currency-image {
  9286. background: url("../icons/equipment/treasure/currency/copper-pieces.webp") no-repeat;
  9287. }
  9288. .currency .denomination .currency-image {
  9289. box-shadow: 0 0 0 1px #9f725b, 0 0 0 2px var(--tertiary), 0 0 0 3px #956d58;
  9290. height: 24px;
  9291. width: 24px;
  9292. background-size: cover !important;
  9293. }
  9294. .currency li > button {
  9295. display: flex;
  9296. justify-content: center;
  9297. align-items: center;
  9298. margin: 0;
  9299. padding: 0;
  9300. background-color: var(--tertiary);
  9301. border-radius: 1px;
  9302. border: none;
  9303. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25), inset 0 0 0 1px rgba(255, 255, 255, 0.25), 0 0 3px rgba(0, 0, 0, 0.5);
  9304. color: rgba(0, 0, 0, 0.75);
  9305. font-size: var(--font-size-13);
  9306. font-weight: 600;
  9307. height: 24px;
  9308. line-height: 1;
  9309. margin-left: 2px;
  9310. width: 30px;
  9311. }
  9312. .currency li > button > i {
  9313. margin: 0;
  9314. padding: 0;
  9315. }
  9316. .currency li > button:disabled {
  9317. opacity: 0.6;
  9318. }
  9319. .currency li > button:hover:not(:disabled) {
  9320. background-color: var(--primary);
  9321. color: var(--color-text-light-0);
  9322. cursor: pointer;
  9323. }
  9324. .wealth {
  9325. font-family: var(--sans-serif);
  9326. font-size: var(--font-size-10);
  9327. text-transform: uppercase;
  9328. letter-spacing: 0.05em;
  9329. text-rendering: optimizeLegibility;
  9330. align-items: center;
  9331. background-color: var(--alt);
  9332. display: flex;
  9333. margin-bottom: 10px;
  9334. min-height: 22px;
  9335. justify-content: flex-end;
  9336. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  9337. }
  9338. .wealth h3 {
  9339. font-size: var(--font-size-13);
  9340. text-transform: capitalize;
  9341. text-shadow: 0 0 2px rgba(0, 0, 0, 0.75);
  9342. margin: 2px;
  9343. margin-left: 4px;
  9344. cursor: default;
  9345. }
  9346. .wealth h3:hover {
  9347. color: var(--color-text-light-0);
  9348. }
  9349. .wealth h3.item-name {
  9350. flex-grow: 1;
  9351. color: var(--color-text-light-0);
  9352. margin-bottom: 0;
  9353. font-weight: bold;
  9354. margin: 0 5px;
  9355. }
  9356. .wealth h3.item-name span {
  9357. margin-left: 5px;
  9358. font-weight: normal;
  9359. text-transform: uppercase;
  9360. }
  9361. .wealth ol {
  9362. padding-right: 0;
  9363. padding-bottom: 0;
  9364. margin-bottom: 0;
  9365. margin-right: 0;
  9366. }
  9367. /* Actor-type Imports */
  9368. .sheet.familiar .section-container {
  9369. display: flex;
  9370. flex-direction: column;
  9371. }
  9372. .sheet.familiar .section-container .section-header {
  9373. border: 1px solid var(--primary);
  9374. border-radius: 3px 3px 0px 0px;
  9375. background: var(--primary);
  9376. display: flex;
  9377. flex: 0;
  9378. width: 100%;
  9379. flex-direction: row;
  9380. justify-content: space-between;
  9381. align-items: baseline;
  9382. text-align: left;
  9383. color: var(--text-light);
  9384. font-size: var(--font-size-13);
  9385. padding: 0 8px;
  9386. line-height: 2em;
  9387. }
  9388. .sheet.familiar .section-container .section-header h4 {
  9389. flex: auto;
  9390. display: flex;
  9391. align-items: baseline;
  9392. gap: 4px;
  9393. margin-bottom: 0px;
  9394. text-transform: uppercase;
  9395. }
  9396. .sheet.familiar .section-container .section-header input {
  9397. color: inherit;
  9398. width: auto;
  9399. }
  9400. .sheet.familiar .section-container .section-header .controls {
  9401. gap: 0.5rem;
  9402. white-space: nowrap;
  9403. }
  9404. .sheet.familiar .section-container .section-body {
  9405. border: 1px solid var(--primary);
  9406. border-radius: 0px 0px 3px 3px;
  9407. display: flex;
  9408. flex: auto;
  9409. flex-wrap: wrap;
  9410. flex-direction: row;
  9411. align-items: baseline;
  9412. justify-content: flex-start;
  9413. width: 100%;
  9414. }
  9415. .sheet.familiar .section-container.headerless .section-body {
  9416. border-radius: 3px;
  9417. }
  9418. .sheet.familiar .actions-list,
  9419. .sheet.familiar .attacks-list {
  9420. margin: 0;
  9421. padding: 0;
  9422. width: 100%;
  9423. }
  9424. .sheet.familiar .actions-list .controls,
  9425. .sheet.familiar .attacks-list .controls {
  9426. align-items: baseline;
  9427. display: flex;
  9428. flex: 0;
  9429. flex-wrap: nowrap;
  9430. font-size: var(--font-size-12);
  9431. gap: 1px;
  9432. margin-left: auto;
  9433. }
  9434. .sheet.familiar .actions-list .controls .chat,
  9435. .sheet.familiar .attacks-list .controls .chat {
  9436. margin-right: 2px;
  9437. font-size: 0.9em;
  9438. }
  9439. .sheet.familiar .actions-list li.action .button-group,
  9440. .sheet.familiar .actions-list li.attack .button-group,
  9441. .sheet.familiar .attacks-list li.action .button-group,
  9442. .sheet.familiar .attacks-list li.attack .button-group {
  9443. display: flex;
  9444. gap: 0.25em;
  9445. justify-content: start;
  9446. min-width: 100%;
  9447. }
  9448. .sheet.familiar .actions-list li.action .button-group .flexrow,
  9449. .sheet.familiar .actions-list li.action .button-group .sub-section,
  9450. .sheet.familiar .actions-list li.attack .button-group .flexrow,
  9451. .sheet.familiar .actions-list li.attack .button-group .sub-section,
  9452. .sheet.familiar .attacks-list li.action .button-group .flexrow,
  9453. .sheet.familiar .attacks-list li.action .button-group .sub-section,
  9454. .sheet.familiar .attacks-list li.attack .button-group .flexrow,
  9455. .sheet.familiar .attacks-list li.attack .button-group .sub-section {
  9456. gap: 2px;
  9457. }
  9458. .sheet.familiar .actions-list li.action .button-group .sub-section,
  9459. .sheet.familiar .actions-list li.attack .button-group .sub-section,
  9460. .sheet.familiar .attacks-list li.action .button-group .sub-section,
  9461. .sheet.familiar .attacks-list li.attack .button-group .sub-section {
  9462. align-items: start;
  9463. display: flex;
  9464. flex-wrap: wrap;
  9465. justify-content: flex-start;
  9466. }
  9467. .sheet.familiar .actions-list li.action .button-group .sub-section h4,
  9468. .sheet.familiar .actions-list li.attack .button-group .sub-section h4,
  9469. .sheet.familiar .attacks-list li.action .button-group .sub-section h4,
  9470. .sheet.familiar .attacks-list li.attack .button-group .sub-section h4 {
  9471. margin-left: var(--font-size-12);
  9472. margin-right: var(--font-size-12);
  9473. }
  9474. .sheet.familiar .actions-list li.action .button-group button,
  9475. .sheet.familiar .actions-list li.attack .button-group button,
  9476. .sheet.familiar .attacks-list li.action .button-group button,
  9477. .sheet.familiar .attacks-list li.attack .button-group button {
  9478. align-items: center;
  9479. display: flex;
  9480. border-radius: 3px;
  9481. border: none;
  9482. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  9483. color: var(--color-text-light-0);
  9484. cursor: pointer;
  9485. font-size: var(--font-size-11);
  9486. height: var(--font-size-18);
  9487. justify-content: center;
  9488. line-height: var(--font-size-18);
  9489. margin: 0;
  9490. padding: 0 8px;
  9491. white-space: nowrap;
  9492. width: auto;
  9493. }
  9494. .sheet.familiar .actions-list li.action .button-group button:first-child,
  9495. .sheet.familiar .actions-list li.attack .button-group button:first-child,
  9496. .sheet.familiar .attacks-list li.action .button-group button:first-child,
  9497. .sheet.familiar .attacks-list li.attack .button-group button:first-child {
  9498. margin-left: 0px;
  9499. }
  9500. .sheet.familiar .actions-list li.action .button-group button:hover,
  9501. .sheet.familiar .actions-list li.attack .button-group button:hover,
  9502. .sheet.familiar .attacks-list li.action .button-group button:hover,
  9503. .sheet.familiar .attacks-list li.attack .button-group button:hover {
  9504. box-shadow: none;
  9505. text-shadow: 0 0 2px var(--color-text-light-0);
  9506. }
  9507. .sheet.familiar .actions-list li.action .button-group .attack-button,
  9508. .sheet.familiar .actions-list li.attack .button-group .attack-button,
  9509. .sheet.familiar .attacks-list li.action .button-group .attack-button,
  9510. .sheet.familiar .attacks-list li.attack .button-group .attack-button {
  9511. background-color: var(--secondary);
  9512. }
  9513. .sheet.familiar .actions-list li.action .button-group .damage-button,
  9514. .sheet.familiar .actions-list li.action .button-group .critical-button,
  9515. .sheet.familiar .actions-list li.attack .button-group .damage-button,
  9516. .sheet.familiar .actions-list li.attack .button-group .critical-button,
  9517. .sheet.familiar .attacks-list li.action .button-group .damage-button,
  9518. .sheet.familiar .attacks-list li.action .button-group .critical-button,
  9519. .sheet.familiar .attacks-list li.attack .button-group .damage-button,
  9520. .sheet.familiar .attacks-list li.attack .button-group .critical-button {
  9521. background-color: var(--primary);
  9522. }
  9523. .sheet.familiar .actions-list li.attack,
  9524. .sheet.familiar .attacks-list li.attack {
  9525. border-bottom: 1px solid var(--color-border-light-tertiary);
  9526. display: flex;
  9527. flex-direction: row;
  9528. justify-content: start;
  9529. gap: 0.25rem;
  9530. padding: 0.25rem 0;
  9531. }
  9532. .sheet.familiar .actions-list li.attack:last-child,
  9533. .sheet.familiar .attacks-list li.attack:last-child {
  9534. border-bottom: none;
  9535. }
  9536. .sheet.familiar .actions-list li.attack > h4,
  9537. .sheet.familiar .attacks-list li.attack > h4 {
  9538. align-items: center;
  9539. display: flex;
  9540. flex-wrap: wrap;
  9541. font-size: 0.9rem;
  9542. font-weight: 500;
  9543. gap: 2px;
  9544. margin: 0 4px 0 0;
  9545. white-space: nowrap;
  9546. }
  9547. .sheet.familiar .actions-list li.attack > h4 > span,
  9548. .sheet.familiar .actions-list li.attack > h4 > a,
  9549. .sheet.familiar .attacks-list li.attack > h4 > span,
  9550. .sheet.familiar .attacks-list li.attack > h4 > a {
  9551. display: flex;
  9552. gap: 3px;
  9553. line-height: 1.125rem;
  9554. margin-right: 4px;
  9555. }
  9556. .sheet.familiar .actions-list li.attack > .description,
  9557. .sheet.familiar .attacks-list li.attack > .description {
  9558. flex-basis: 100%;
  9559. }
  9560. .sheet.familiar .actions-list li.action,
  9561. .sheet.familiar .attacks-list li.action {
  9562. display: flex;
  9563. gap: 0.25rem;
  9564. }
  9565. .sheet.familiar .actions-list li.action:not(:last-child),
  9566. .sheet.familiar .attacks-list li.action:not(:last-child) {
  9567. border-bottom: 1px solid var(--color-border-light-tertiary);
  9568. }
  9569. .sheet.familiar .actions-list li.action > h4,
  9570. .sheet.familiar .attacks-list li.action > h4 {
  9571. align-items: center;
  9572. display: flex;
  9573. gap: 0.25rem;
  9574. flex: auto;
  9575. font-size: 0.9rem;
  9576. margin: 0;
  9577. }
  9578. .sheet.familiar .actions-list li.action > h4 > a,
  9579. .sheet.familiar .attacks-list li.action > h4 > a {
  9580. align-items: center;
  9581. display: flex;
  9582. gap: 2px;
  9583. }
  9584. .sheet.familiar .actions-list li.action .button-group > button.use-action,
  9585. .sheet.familiar .attacks-list li.action .button-group > button.use-action {
  9586. color: var(--color-text-light-0);
  9587. background-color: var(--secondary);
  9588. margin-right: 0.5rem;
  9589. }
  9590. .sheet.familiar .actions-list li.action .action-traits,
  9591. .sheet.familiar .attacks-list li.action .action-traits {
  9592. margin-left: var(--font-size-12);
  9593. }
  9594. .sheet.familiar .actions-list li.action .tracking,
  9595. .sheet.familiar .attacks-list li.action .tracking {
  9596. flex: 0;
  9597. align-items: center;
  9598. display: flex;
  9599. flex-direction: row;
  9600. flex-wrap: nowrap;
  9601. margin-left: auto;
  9602. margin-right: var(--font-size-16);
  9603. }
  9604. .sheet.familiar .actions-list li.action .tracking input,
  9605. .sheet.familiar .attacks-list li.action .tracking input {
  9606. background: none;
  9607. border: 0;
  9608. flex: 0 1 4rem;
  9609. flex: 1;
  9610. font-family: inherit;
  9611. font-size: 0.9rem;
  9612. height: auto;
  9613. padding: 0 3px;
  9614. text-align: center;
  9615. width: 0;
  9616. }
  9617. .sheet.familiar .actions-list li.action .tracking span,
  9618. .sheet.familiar .attacks-list li.action .tracking span {
  9619. white-space: nowrap;
  9620. }
  9621. .sheet.familiar .actions-list li.action .item-summary,
  9622. .sheet.familiar .attacks-list li.action .item-summary {
  9623. flex-basis: 100%;
  9624. }
  9625. .sheet.familiar form {
  9626. background: url("../assets/sheet/background.webp");
  9627. background-repeat: repeat-x, no-repeat;
  9628. background-size: cover;
  9629. background-attachment: local;
  9630. display: flex;
  9631. flex-direction: column;
  9632. height: 100%;
  9633. }
  9634. .sheet.familiar form > hr {
  9635. width: 100%;
  9636. }
  9637. .sheet.familiar input {
  9638. border: none;
  9639. border-radius: 0;
  9640. background-color: rgba(28, 28, 28, 0.1);
  9641. }
  9642. .sheet.familiar input:focus {
  9643. box-shadow: none;
  9644. }
  9645. .sheet.familiar select {
  9646. border: 1px solid transparent;
  9647. background: rgba(0, 0, 0, 0.05);
  9648. font-family: var(--body-serif);
  9649. font-size: var(--font-size-14);
  9650. font-weight: normal;
  9651. }
  9652. .sheet.familiar select:hover {
  9653. border: 1px solid black;
  9654. }
  9655. .sheet.familiar .familiar-sheet-header {
  9656. display: flex;
  9657. flex-direction: row;
  9658. padding: 4px 6px 0;
  9659. }
  9660. .sheet.familiar .familiar-sheet-header .image-container {
  9661. display: flex;
  9662. }
  9663. .sheet.familiar .familiar-sheet-header .image-container img.actor-image {
  9664. border-radius: 0;
  9665. flex: 0;
  9666. height: 100%;
  9667. min-width: 125px;
  9668. width: 125px;
  9669. }
  9670. .sheet.familiar .familiar-sheet-header .image-container [data-action=show-image] {
  9671. bottom: 2px;
  9672. right: 2px;
  9673. }
  9674. .sheet.familiar .familiar-sheet-header .header-content {
  9675. display: flex;
  9676. flex-direction: column;
  9677. border-radius: 0;
  9678. flex-grow: 1;
  9679. margin-left: 10px;
  9680. }
  9681. .sheet.familiar .familiar-sheet-header .header-content .charname {
  9682. display: flex;
  9683. flex-direction: row;
  9684. font-family: var(--sans-serif-condensed);
  9685. font-size: 1.75rem;
  9686. font-weight: 700;
  9687. width: 100%;
  9688. flex-wrap: nowrap;
  9689. align-items: baseline;
  9690. text-transform: capitalize;
  9691. gap: 0.25em;
  9692. }
  9693. .sheet.familiar .familiar-sheet-header .header-content .charname input {
  9694. font-weight: bold;
  9695. width: calc(100% - 6px);
  9696. border-bottom: 1px solid #d3ccbc;
  9697. text-transform: capitalize;
  9698. padding: 0;
  9699. margin-right: 5px;
  9700. font-variant: small-caps;
  9701. color: #323232;
  9702. }
  9703. .sheet.familiar .familiar-sheet-header .header-content .charname input::placeholder {
  9704. filter: opacity(0.5);
  9705. color: #1c1c1c;
  9706. }
  9707. .sheet.familiar .familiar-sheet-header .header-content .charname input:focus {
  9708. border-bottom: 1px solid #644f33;
  9709. }
  9710. .sheet.familiar .familiar-sheet-header .header-content .charname input:focus::placeholder {
  9711. color: transparent;
  9712. }
  9713. .sheet.familiar .familiar-sheet-header .header-content .charname .charname-value {
  9714. flex: 1 1;
  9715. }
  9716. .sheet.familiar .familiar-sheet-header .header-content .charname .familiar-title {
  9717. flex: 0 1;
  9718. text-align: right;
  9719. margin-right: 0.1em;
  9720. text-transform: uppercase;
  9721. }
  9722. .sheet.familiar .familiar-sheet-header .header-content .sub-header {
  9723. display: flex;
  9724. margin-bottom: 10px;
  9725. }
  9726. .sheet.familiar .familiar-sheet-header .header-content .sub-header .traits {
  9727. flex: 1;
  9728. }
  9729. .sheet.familiar .familiar-sheet-header .header-content .traits {
  9730. margin: 0.25em 0;
  9731. }
  9732. .sheet.familiar .familiar-sheet-header .header-content .traits span {
  9733. color: var(--text-light);
  9734. font-size: 0.75em;
  9735. font-weight: 700;
  9736. padding: 0.25em 0.5em;
  9737. letter-spacing: 1px;
  9738. text-transform: uppercase;
  9739. background-color: var(--primary);
  9740. border: 1px solid var(--tertiary);
  9741. }
  9742. .sheet.familiar .familiar-sheet-header .header-content .details-section {
  9743. display: flex;
  9744. flex-direction: row;
  9745. justify-content: space-between;
  9746. }
  9747. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section {
  9748. display: grid;
  9749. flex-direction: column;
  9750. height: max-content;
  9751. width: 150px;
  9752. grid-template-columns: min-content 1fr;
  9753. font-size: var(--font-size-14);
  9754. }
  9755. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section div {
  9756. white-space: nowrap;
  9757. }
  9758. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .label {
  9759. display: flex;
  9760. flex-direction: row;
  9761. align-items: center;
  9762. white-space: nowrap;
  9763. }
  9764. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .label h4 {
  9765. font-weight: bold;
  9766. margin: 0 0.25em 0 0;
  9767. padding-left: 6px;
  9768. }
  9769. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value {
  9770. display: flex;
  9771. flex-direction: row;
  9772. align-items: center;
  9773. padding-left: 4px;
  9774. }
  9775. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input {
  9776. width: 2em;
  9777. text-align: right;
  9778. padding-right: 3px;
  9779. border: 1px solid transparent;
  9780. background: none;
  9781. height: auto;
  9782. }
  9783. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input:hover, .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input:focus {
  9784. border: 1px solid black;
  9785. box-shadow: 0 0 10px #00005a;
  9786. }
  9787. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value .total-hp {
  9788. flex-grow: 1;
  9789. }
  9790. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .temp-hp {
  9791. display: flex;
  9792. margin-left: 8px;
  9793. align-items: baseline;
  9794. }
  9795. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .temp-hp input {
  9796. text-align: left;
  9797. }
  9798. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section {
  9799. display: flex;
  9800. flex-direction: column;
  9801. }
  9802. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list {
  9803. display: flex;
  9804. flex-direction: row;
  9805. justify-content: space-between;
  9806. gap: 12px;
  9807. }
  9808. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name,
  9809. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac {
  9810. display: flex;
  9811. flex-direction: column;
  9812. align-items: center;
  9813. column-gap: 0.5em;
  9814. }
  9815. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name .name,
  9816. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac .name {
  9817. font-weight: bold;
  9818. text-transform: capitalize;
  9819. }
  9820. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name .value,
  9821. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac .value {
  9822. font-style: normal;
  9823. }
  9824. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name .value i,
  9825. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac .value i {
  9826. margin-right: 2px;
  9827. }
  9828. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac {
  9829. border-right: 1px solid rgba(0, 0, 0, 0.15);
  9830. padding-right: 12px;
  9831. }
  9832. .sheet.familiar .familiar-sheet-header .header-content .dying-section {
  9833. display: flex;
  9834. gap: 10px;
  9835. justify-content: end;
  9836. }
  9837. .sheet.familiar .familiar-sheet-header .header-content .dying-section .name {
  9838. font-weight: bold;
  9839. }
  9840. .sheet.familiar .familiar-sheet-header .header-content .dying-section .dots {
  9841. display: flex;
  9842. gap: 4px;
  9843. align-items: baseline;
  9844. }
  9845. .sheet.familiar .familiar-sheet-header .header-content .dying-section .pips {
  9846. display: flex;
  9847. gap: 1px;
  9848. }
  9849. .sheet.familiar .main-section {
  9850. display: flex;
  9851. flex: 1;
  9852. flex-direction: row;
  9853. overflow: hidden;
  9854. }
  9855. .sheet.familiar .main-section .main-container {
  9856. overflow: hidden scroll;
  9857. flex-grow: 2;
  9858. }
  9859. .sheet.familiar .section-container {
  9860. margin: 6px 6px;
  9861. }
  9862. .sheet.familiar .section-container .section-body {
  9863. align-items: stretch;
  9864. flex-direction: column;
  9865. padding: 4px;
  9866. }
  9867. .sheet.familiar .section-container .section-body input {
  9868. font-family: var(--body-serif);
  9869. font-weight: bold;
  9870. width: calc(100% - 6px);
  9871. border-bottom: 1px solid #d3ccbc;
  9872. text-transform: capitalize;
  9873. }
  9874. .sheet.familiar .section-container .section-body input::placeholder {
  9875. filter: opacity(0.5);
  9876. color: #1c1c1c;
  9877. }
  9878. .sheet.familiar .section-container .section-body input:focus {
  9879. border-bottom: 1px solid #644f33;
  9880. }
  9881. .sheet.familiar .section-container .section-body input:focus::placeholder {
  9882. color: transparent;
  9883. }
  9884. .sheet.familiar .familiar-section {
  9885. flex-basis: 50%;
  9886. display: flex;
  9887. flex-direction: column;
  9888. }
  9889. .sheet.familiar .familiar-section .detail {
  9890. display: flex;
  9891. flex-direction: column;
  9892. flex-wrap: nowrap;
  9893. margin-top: 3px;
  9894. }
  9895. .sheet.familiar .familiar-section .detail .detail-label {
  9896. font-size: var(--font-size-10);
  9897. font-weight: 800;
  9898. line-height: 1;
  9899. text-transform: uppercase;
  9900. font-family: var(--sans-serif);
  9901. color: var(--primary);
  9902. white-space: nowrap;
  9903. margin-bottom: 3px;
  9904. }
  9905. .sheet.familiar .familiar-section .detail h4 {
  9906. font-size: var(--font-size-14);
  9907. font-family: var(--serif);
  9908. font-weight: bold;
  9909. background-color: rgba(0, 0, 0, 0.05);
  9910. padding-left: 2px;
  9911. margin: none;
  9912. }
  9913. .sheet.familiar .familiar-section .familiar-content {
  9914. display: flex;
  9915. flex-direction: row;
  9916. margin-bottom: 5px;
  9917. column-gap: 15px;
  9918. }
  9919. .sheet.familiar .familiar-section .familiar-content input {
  9920. border: none;
  9921. border-radius: 0;
  9922. }
  9923. .sheet.familiar .familiar-section .familiar-content input[type=text] {
  9924. background-color: rgba(0, 0, 0, 0.05);
  9925. }
  9926. .sheet.familiar .familiar-section .familiar-content input:focus {
  9927. box-shadow: none;
  9928. }
  9929. .sheet.familiar .familiar-section .familiar-content h3 {
  9930. background-color: rgba(0, 0, 0, 0.05);
  9931. height: 26px;
  9932. font-family: var(--body-serif);
  9933. font-size: var(--font-size-14);
  9934. padding: 8px 4px 6px;
  9935. line-height: 1;
  9936. }
  9937. .sheet.familiar .familiar-section .familiar-content .familiar-species {
  9938. flex-basis: 50%;
  9939. }
  9940. .sheet.familiar .familiar-section .familiar-content .familiar-size {
  9941. flex-basis: 50%;
  9942. }
  9943. .sheet.familiar .familiar-section .familiar-content .familiar-modifier {
  9944. flex-basis: 50%;
  9945. }
  9946. .sheet.familiar .familiar-section .familiar-content .familiar-modifier select {
  9947. font-weight: bold;
  9948. }
  9949. .sheet.familiar .familiar-section .familiar-content .familiar-senses {
  9950. flex-basis: 50%;
  9951. height: min-content;
  9952. }
  9953. .sheet.familiar .familiar-section .familiar-content .familiar-senses .tags {
  9954. margin: 0;
  9955. padding: 0;
  9956. }
  9957. .sheet.familiar .familiar-section .familiar-content .familiar-senses .tags ol {
  9958. margin: 0;
  9959. }
  9960. .sheet.familiar .familiar-section .familiar-content .familiar-speed {
  9961. flex-basis: 30%;
  9962. }
  9963. .sheet.familiar .skills-content {
  9964. display: flex;
  9965. flex-direction: column;
  9966. width: 150px;
  9967. gap: 10px;
  9968. }
  9969. .sheet.familiar .skills-content .skills-list {
  9970. display: flex;
  9971. column-gap: 0.25em;
  9972. row-gap: 0.25em;
  9973. flex-direction: column;
  9974. justify-content: center;
  9975. }
  9976. .sheet.familiar .skills-content .skills-list .skill-name {
  9977. display: flex;
  9978. flex-direction: row;
  9979. align-items: center;
  9980. border: 1px solid #999;
  9981. border-radius: 3px;
  9982. height: 20px;
  9983. cursor: pointer;
  9984. font-size: var(--font-size-14);
  9985. font-family: var(--serif);
  9986. }
  9987. .sheet.familiar .skills-content .skills-list .skill-name:hover {
  9988. padding: none;
  9989. border: 1px solid #323232;
  9990. }
  9991. .sheet.familiar .skills-content .skills-list .skill-name .name {
  9992. flex: 4;
  9993. }
  9994. .sheet.familiar .skills-content .skills-list .skill-name .score {
  9995. flex: 1;
  9996. text-align: center;
  9997. padding-left: 1em;
  9998. color: var(--primary);
  9999. font-weight: bold;
  10000. }
  10001. .sheet.familiar .skills-content .skills-attack {
  10002. flex: 1;
  10003. align-self: center;
  10004. border: 1px solid transparent;
  10005. cursor: pointer;
  10006. }
  10007. .sheet.familiar .skills-content .skills-attack:hover {
  10008. border-bottom: 1px solid #323232;
  10009. }
  10010. .sheet.familiar .actions-list .action {
  10011. padding-top: 4px;
  10012. padding-bottom: 4px;
  10013. }
  10014. .sheet.familiar .effects-list {
  10015. margin: 0;
  10016. padding: 0;
  10017. gap: 0.2em;
  10018. }
  10019. .sheet.familiar .effects-list .item {
  10020. display: flex;
  10021. flex-wrap: wrap;
  10022. align-items: center;
  10023. justify-content: space-between;
  10024. padding: 2px 4px 2px 12px;
  10025. width: 100%;
  10026. }
  10027. .sheet.familiar .effects-list .item p:empty {
  10028. display: none;
  10029. }
  10030. .sheet.familiar .effects-list .item .item-name {
  10031. display: flex;
  10032. align-items: center;
  10033. flex: 1;
  10034. }
  10035. .sheet.familiar .effects-list .item .item-name h4 {
  10036. cursor: pointer;
  10037. margin: 0;
  10038. }
  10039. .sheet.familiar .effects-list .item .item-name .item-image {
  10040. margin-right: 8px;
  10041. }
  10042. .sheet.familiar .effects-list .item .item-controls {
  10043. display: flex;
  10044. flex: 0;
  10045. font-size: var(--font-size-12);
  10046. gap: 1px;
  10047. white-space: nowrap;
  10048. }
  10049. .sheet.familiar .effects-list .item .item-controls a.info-only:hover {
  10050. cursor: default;
  10051. text-shadow: none;
  10052. }
  10053. .sheet.familiar .effects-list .item .item-controls a + a {
  10054. margin-left: 4px;
  10055. }
  10056. .sheet.familiar .effects-list .item .item-summary {
  10057. flex-basis: 100%;
  10058. }
  10059. .sheet.familiar .effects-list .item.unidentified {
  10060. border-radius: 1px;
  10061. outline: 1px dotted rgba(75, 74, 68, 0.5);
  10062. background: var(--visibility-gm-bg);
  10063. }
  10064. .sheet.familiar .effects-list .item .button-group {
  10065. display: flex;
  10066. justify-content: flex-end;
  10067. align-items: center;
  10068. flex-wrap: nowrap;
  10069. width: 50%;
  10070. flex: 0;
  10071. }
  10072. .sheet.familiar .effects-list .item .button-group button {
  10073. margin: 0;
  10074. border: none;
  10075. cursor: pointer;
  10076. font-family: var(--sans-serif);
  10077. font-size: var(--font-size-10);
  10078. text-transform: uppercase;
  10079. letter-spacing: 0.05em;
  10080. text-rendering: optimizeLegibility;
  10081. padding: 5px;
  10082. color: var(--text-light);
  10083. width: 70px;
  10084. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  10085. background: var(--secondary);
  10086. border-radius: 2px;
  10087. flex: 0;
  10088. white-space: nowrap;
  10089. margin-left: 4px;
  10090. flex: 0;
  10091. }
  10092. .sheet.familiar .effects-list .item .button-group button:hover {
  10093. box-shadow: none;
  10094. text-shadow: 0 0 2px white;
  10095. }
  10096. .sheet.familiar .effects-list .item {
  10097. margin: 0;
  10098. padding: 0;
  10099. margin: 0.25em 0;
  10100. }
  10101. .sheet.hazard .section-container {
  10102. display: flex;
  10103. flex-direction: column;
  10104. }
  10105. .sheet.hazard .section-container .section-header {
  10106. border: 1px solid var(--primary);
  10107. border-radius: 3px 3px 0px 0px;
  10108. background: var(--primary);
  10109. display: flex;
  10110. flex: 0;
  10111. width: 100%;
  10112. flex-direction: row;
  10113. justify-content: space-between;
  10114. align-items: baseline;
  10115. text-align: left;
  10116. color: var(--text-light);
  10117. font-size: var(--font-size-13);
  10118. padding: 0 8px;
  10119. line-height: 2em;
  10120. }
  10121. .sheet.hazard .section-container .section-header h4 {
  10122. flex: auto;
  10123. display: flex;
  10124. align-items: baseline;
  10125. gap: 4px;
  10126. margin-bottom: 0px;
  10127. text-transform: uppercase;
  10128. }
  10129. .sheet.hazard .section-container .section-header input {
  10130. color: inherit;
  10131. width: auto;
  10132. }
  10133. .sheet.hazard .section-container .section-header .controls {
  10134. gap: 0.5rem;
  10135. white-space: nowrap;
  10136. }
  10137. .sheet.hazard .section-container .section-body {
  10138. border: 1px solid var(--primary);
  10139. border-radius: 0px 0px 3px 3px;
  10140. display: flex;
  10141. flex: auto;
  10142. flex-wrap: wrap;
  10143. flex-direction: row;
  10144. align-items: baseline;
  10145. justify-content: flex-start;
  10146. width: 100%;
  10147. }
  10148. .sheet.hazard .section-container.headerless .section-body {
  10149. border-radius: 3px;
  10150. }
  10151. .sheet.hazard .actions-list,
  10152. .sheet.hazard .attacks-list {
  10153. margin: 0;
  10154. padding: 0;
  10155. width: 100%;
  10156. }
  10157. .sheet.hazard .actions-list .controls,
  10158. .sheet.hazard .attacks-list .controls {
  10159. align-items: baseline;
  10160. display: flex;
  10161. flex: 0;
  10162. flex-wrap: nowrap;
  10163. font-size: var(--font-size-12);
  10164. gap: 1px;
  10165. margin-left: auto;
  10166. }
  10167. .sheet.hazard .actions-list .controls .chat,
  10168. .sheet.hazard .attacks-list .controls .chat {
  10169. margin-right: 2px;
  10170. font-size: 0.9em;
  10171. }
  10172. .sheet.hazard .actions-list li.action .button-group,
  10173. .sheet.hazard .actions-list li.attack .button-group,
  10174. .sheet.hazard .attacks-list li.action .button-group,
  10175. .sheet.hazard .attacks-list li.attack .button-group {
  10176. display: flex;
  10177. gap: 0.25em;
  10178. justify-content: start;
  10179. min-width: 100%;
  10180. }
  10181. .sheet.hazard .actions-list li.action .button-group .flexrow,
  10182. .sheet.hazard .actions-list li.action .button-group .sub-section,
  10183. .sheet.hazard .actions-list li.attack .button-group .flexrow,
  10184. .sheet.hazard .actions-list li.attack .button-group .sub-section,
  10185. .sheet.hazard .attacks-list li.action .button-group .flexrow,
  10186. .sheet.hazard .attacks-list li.action .button-group .sub-section,
  10187. .sheet.hazard .attacks-list li.attack .button-group .flexrow,
  10188. .sheet.hazard .attacks-list li.attack .button-group .sub-section {
  10189. gap: 2px;
  10190. }
  10191. .sheet.hazard .actions-list li.action .button-group .sub-section,
  10192. .sheet.hazard .actions-list li.attack .button-group .sub-section,
  10193. .sheet.hazard .attacks-list li.action .button-group .sub-section,
  10194. .sheet.hazard .attacks-list li.attack .button-group .sub-section {
  10195. align-items: start;
  10196. display: flex;
  10197. flex-wrap: wrap;
  10198. justify-content: flex-start;
  10199. }
  10200. .sheet.hazard .actions-list li.action .button-group .sub-section h4,
  10201. .sheet.hazard .actions-list li.attack .button-group .sub-section h4,
  10202. .sheet.hazard .attacks-list li.action .button-group .sub-section h4,
  10203. .sheet.hazard .attacks-list li.attack .button-group .sub-section h4 {
  10204. margin-left: var(--font-size-12);
  10205. margin-right: var(--font-size-12);
  10206. }
  10207. .sheet.hazard .actions-list li.action .button-group button,
  10208. .sheet.hazard .actions-list li.attack .button-group button,
  10209. .sheet.hazard .attacks-list li.action .button-group button,
  10210. .sheet.hazard .attacks-list li.attack .button-group button {
  10211. align-items: center;
  10212. display: flex;
  10213. border-radius: 3px;
  10214. border: none;
  10215. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  10216. color: var(--color-text-light-0);
  10217. cursor: pointer;
  10218. font-size: var(--font-size-11);
  10219. height: var(--font-size-18);
  10220. justify-content: center;
  10221. line-height: var(--font-size-18);
  10222. margin: 0;
  10223. padding: 0 8px;
  10224. white-space: nowrap;
  10225. width: auto;
  10226. }
  10227. .sheet.hazard .actions-list li.action .button-group button:first-child,
  10228. .sheet.hazard .actions-list li.attack .button-group button:first-child,
  10229. .sheet.hazard .attacks-list li.action .button-group button:first-child,
  10230. .sheet.hazard .attacks-list li.attack .button-group button:first-child {
  10231. margin-left: 0px;
  10232. }
  10233. .sheet.hazard .actions-list li.action .button-group button:hover,
  10234. .sheet.hazard .actions-list li.attack .button-group button:hover,
  10235. .sheet.hazard .attacks-list li.action .button-group button:hover,
  10236. .sheet.hazard .attacks-list li.attack .button-group button:hover {
  10237. box-shadow: none;
  10238. text-shadow: 0 0 2px var(--color-text-light-0);
  10239. }
  10240. .sheet.hazard .actions-list li.action .button-group .attack-button,
  10241. .sheet.hazard .actions-list li.attack .button-group .attack-button,
  10242. .sheet.hazard .attacks-list li.action .button-group .attack-button,
  10243. .sheet.hazard .attacks-list li.attack .button-group .attack-button {
  10244. background-color: var(--secondary);
  10245. }
  10246. .sheet.hazard .actions-list li.action .button-group .damage-button,
  10247. .sheet.hazard .actions-list li.action .button-group .critical-button,
  10248. .sheet.hazard .actions-list li.attack .button-group .damage-button,
  10249. .sheet.hazard .actions-list li.attack .button-group .critical-button,
  10250. .sheet.hazard .attacks-list li.action .button-group .damage-button,
  10251. .sheet.hazard .attacks-list li.action .button-group .critical-button,
  10252. .sheet.hazard .attacks-list li.attack .button-group .damage-button,
  10253. .sheet.hazard .attacks-list li.attack .button-group .critical-button {
  10254. background-color: var(--primary);
  10255. }
  10256. .sheet.hazard .actions-list li.attack,
  10257. .sheet.hazard .attacks-list li.attack {
  10258. border-bottom: 1px solid var(--color-border-light-tertiary);
  10259. display: flex;
  10260. flex-direction: row;
  10261. justify-content: start;
  10262. gap: 0.25rem;
  10263. padding: 0.25rem 0;
  10264. }
  10265. .sheet.hazard .actions-list li.attack:last-child,
  10266. .sheet.hazard .attacks-list li.attack:last-child {
  10267. border-bottom: none;
  10268. }
  10269. .sheet.hazard .actions-list li.attack > h4,
  10270. .sheet.hazard .attacks-list li.attack > h4 {
  10271. align-items: center;
  10272. display: flex;
  10273. flex-wrap: wrap;
  10274. font-size: 0.9rem;
  10275. font-weight: 500;
  10276. gap: 2px;
  10277. margin: 0 4px 0 0;
  10278. white-space: nowrap;
  10279. }
  10280. .sheet.hazard .actions-list li.attack > h4 > span,
  10281. .sheet.hazard .actions-list li.attack > h4 > a,
  10282. .sheet.hazard .attacks-list li.attack > h4 > span,
  10283. .sheet.hazard .attacks-list li.attack > h4 > a {
  10284. display: flex;
  10285. gap: 3px;
  10286. line-height: 1.125rem;
  10287. margin-right: 4px;
  10288. }
  10289. .sheet.hazard .actions-list li.attack > .description,
  10290. .sheet.hazard .attacks-list li.attack > .description {
  10291. flex-basis: 100%;
  10292. }
  10293. .sheet.hazard .actions-list li.action,
  10294. .sheet.hazard .attacks-list li.action {
  10295. display: flex;
  10296. gap: 0.25rem;
  10297. }
  10298. .sheet.hazard .actions-list li.action:not(:last-child),
  10299. .sheet.hazard .attacks-list li.action:not(:last-child) {
  10300. border-bottom: 1px solid var(--color-border-light-tertiary);
  10301. }
  10302. .sheet.hazard .actions-list li.action > h4,
  10303. .sheet.hazard .attacks-list li.action > h4 {
  10304. align-items: center;
  10305. display: flex;
  10306. gap: 0.25rem;
  10307. flex: auto;
  10308. font-size: 0.9rem;
  10309. margin: 0;
  10310. }
  10311. .sheet.hazard .actions-list li.action > h4 > a,
  10312. .sheet.hazard .attacks-list li.action > h4 > a {
  10313. align-items: center;
  10314. display: flex;
  10315. gap: 2px;
  10316. }
  10317. .sheet.hazard .actions-list li.action .button-group > button.use-action,
  10318. .sheet.hazard .attacks-list li.action .button-group > button.use-action {
  10319. color: var(--color-text-light-0);
  10320. background-color: var(--secondary);
  10321. margin-right: 0.5rem;
  10322. }
  10323. .sheet.hazard .actions-list li.action .action-traits,
  10324. .sheet.hazard .attacks-list li.action .action-traits {
  10325. margin-left: var(--font-size-12);
  10326. }
  10327. .sheet.hazard .actions-list li.action .tracking,
  10328. .sheet.hazard .attacks-list li.action .tracking {
  10329. flex: 0;
  10330. align-items: center;
  10331. display: flex;
  10332. flex-direction: row;
  10333. flex-wrap: nowrap;
  10334. margin-left: auto;
  10335. margin-right: var(--font-size-16);
  10336. }
  10337. .sheet.hazard .actions-list li.action .tracking input,
  10338. .sheet.hazard .attacks-list li.action .tracking input {
  10339. background: none;
  10340. border: 0;
  10341. flex: 0 1 4rem;
  10342. flex: 1;
  10343. font-family: inherit;
  10344. font-size: 0.9rem;
  10345. height: auto;
  10346. padding: 0 3px;
  10347. text-align: center;
  10348. width: 0;
  10349. }
  10350. .sheet.hazard .actions-list li.action .tracking span,
  10351. .sheet.hazard .attacks-list li.action .tracking span {
  10352. white-space: nowrap;
  10353. }
  10354. .sheet.hazard .actions-list li.action .item-summary,
  10355. .sheet.hazard .attacks-list li.action .item-summary {
  10356. flex-basis: 100%;
  10357. }
  10358. .sheet.hazard ul,
  10359. .sheet.hazard ol {
  10360. margin: 0;
  10361. padding: 0;
  10362. list-style-type: none;
  10363. }
  10364. .sheet.hazard h1,
  10365. .sheet.hazard h2,
  10366. .sheet.hazard h3,
  10367. .sheet.hazard h4 {
  10368. margin: 0;
  10369. padding: 0;
  10370. border-bottom: none;
  10371. }
  10372. .sheet.hazard form {
  10373. display: flex;
  10374. flex-direction: column;
  10375. height: 100%;
  10376. }
  10377. .sheet.hazard form .tagify > span {
  10378. min-width: 20px;
  10379. }
  10380. .sheet.hazard form .tagify--hasMaxTags > span {
  10381. display: none;
  10382. }
  10383. .sheet.hazard .window-content {
  10384. margin: 0;
  10385. padding: 0;
  10386. }
  10387. .sheet.hazard input[type=text],
  10388. .sheet.hazard input[type=number] {
  10389. margin: 0;
  10390. padding: 0;
  10391. background: none;
  10392. border: 1px solid transparent;
  10393. }
  10394. .sheet.hazard input[type=text]:hover:not(:disabled), .sheet.hazard input[type=text]:focus,
  10395. .sheet.hazard input[type=number]:hover:not(:disabled),
  10396. .sheet.hazard input[type=number]:focus {
  10397. border: 1px solid black;
  10398. box-shadow: 0 0 10px #00005a;
  10399. }
  10400. .sheet.hazard select {
  10401. font-size: var(--font-size-12);
  10402. height: 2em;
  10403. }
  10404. .sheet.hazard .container {
  10405. display: flex;
  10406. background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
  10407. height: 100%;
  10408. overflow: hidden;
  10409. }
  10410. .sheet.hazard .content {
  10411. flex: 1;
  10412. padding-left: 5px;
  10413. padding-right: 5px;
  10414. padding: 0 5px 20px 5px;
  10415. overflow: hidden scroll;
  10416. }
  10417. .sheet.hazard form > header {
  10418. align-items: center;
  10419. background: url("../assets/sheet/header-bw.webp"), url("../assets/sheet/background.webp");
  10420. background-blend-mode: multiply;
  10421. background-color: #238580;
  10422. background-repeat: repeat-x, no-repeat;
  10423. background-size: cover;
  10424. box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  10425. color: var(--text-light);
  10426. display: flex;
  10427. font-family: var(--sans-serif);
  10428. font-weight: 600;
  10429. gap: 8px;
  10430. justify-content: space-between;
  10431. margin-bottom: 0.1em;
  10432. padding: 0 16px;
  10433. text-transform: uppercase;
  10434. width: 100%;
  10435. }
  10436. .sheet.hazard form > header .frame-container {
  10437. flex: 0 0 60px;
  10438. padding: 4px;
  10439. margin: 16px 0;
  10440. }
  10441. .sheet.hazard form > header .frame-container .frame {
  10442. width: 60px;
  10443. height: 60px;
  10444. }
  10445. .sheet.hazard form > header .frame-container .image-container [data-action=show-image] {
  10446. color: var(--color-text-dark-primary);
  10447. }
  10448. .sheet.hazard form > header .frame-container .actor-image {
  10449. object-fit: cover;
  10450. object-position: top;
  10451. border: none;
  10452. border-radius: 0;
  10453. max-height: 178px;
  10454. width: 100%;
  10455. border: none;
  10456. box-shadow: 0 0 0 1px #918c88, 0 0 0 2px #e1d8cf, 0 0 0 3px #a98f39, inset 0 0 8px rgba(0, 0, 0, 0.5), 0 0 8px black;
  10457. }
  10458. .sheet.hazard form > header .frame-container .edit-mode-button {
  10459. position: absolute;
  10460. width: 20px;
  10461. height: 20px;
  10462. bottom: -10px;
  10463. left: -10px;
  10464. border-radius: 10px;
  10465. background-color: white;
  10466. color: var(--text-dark);
  10467. cursor: pointer;
  10468. border: none;
  10469. box-shadow: 0 0 0 1px #918c88, 0 0 0 2px #e1d8cf, 0 0 0 3px #a98f39, inset 0 0 8px rgba(0, 0, 0, 0.5), 0 0 8px black;
  10470. display: flex;
  10471. justify-content: center;
  10472. align-items: center;
  10473. font-size: 1.05em;
  10474. }
  10475. .sheet.hazard form > header .details {
  10476. margin: 4px 0;
  10477. flex: 1;
  10478. }
  10479. .sheet.hazard form > header .details tags.tags.paizo-style .tagify__input::before {
  10480. color: var(--color-text-light-7);
  10481. }
  10482. .sheet.hazard form > header input[type=text],
  10483. .sheet.hazard form > header input[type=number] {
  10484. color: var(--text-light);
  10485. border: none;
  10486. border-bottom: 1px solid transparent;
  10487. }
  10488. .sheet.hazard form > header input[type=text]:hover:not(:disabled), .sheet.hazard form > header input[type=text]:focus,
  10489. .sheet.hazard form > header input[type=number]:hover:not(:disabled),
  10490. .sheet.hazard form > header input[type=number]:focus {
  10491. border: none;
  10492. border-bottom: 1px solid var(--text-light);
  10493. box-shadow: none;
  10494. }
  10495. .sheet.hazard form > header .title {
  10496. display: flex;
  10497. flex-direction: row;
  10498. align-items: baseline;
  10499. gap: 4px;
  10500. font-size: var(--font-size-28);
  10501. font-family: var(--serif-condensed);
  10502. font-weight: 700;
  10503. }
  10504. .sheet.hazard form > header .title .name {
  10505. flex: 1;
  10506. font-size: var(--font-size-32);
  10507. }
  10508. .sheet.hazard form > header .title .level {
  10509. width: 32px;
  10510. text-align: center;
  10511. }
  10512. .sheet.hazard .sidebar {
  10513. border-right: 1px solid #888;
  10514. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  10515. display: flex;
  10516. flex-direction: column;
  10517. gap: 8px;
  10518. height: 100%;
  10519. padding: 10px 8px 8px 8px;
  10520. width: 220px;
  10521. overflow: hidden scroll;
  10522. }
  10523. .sheet.hazard .sidebar .sidebar-title {
  10524. display: flex;
  10525. justify-content: space-between;
  10526. border-bottom: 1px solid black;
  10527. margin-bottom: 4px;
  10528. }
  10529. .sheet.hazard .sidebar .sidebar-title h2 {
  10530. font-size: var(--font-size-15);
  10531. }
  10532. .sheet.hazard .sidebar .valued-icon {
  10533. display: flex;
  10534. align-items: baseline;
  10535. }
  10536. .sheet.hazard .sidebar .valued-icon i {
  10537. margin-right: 4px;
  10538. }
  10539. .sheet.hazard .sidebar .valued-icon i + input {
  10540. margin-left: -1px;
  10541. }
  10542. .sheet.hazard .sidebar .health input {
  10543. width: 34px;
  10544. }
  10545. .sheet.hazard .sidebar .health input.current {
  10546. text-align: end;
  10547. }
  10548. .sheet.hazard .sidebar .armor-class input {
  10549. width: 25px;
  10550. text-align: right;
  10551. }
  10552. .sheet.hazard .sidebar .health-line {
  10553. display: flex;
  10554. flex-direction: row;
  10555. font-size: var(--font-size-16);
  10556. gap: 3px;
  10557. justify-content: center;
  10558. }
  10559. .sheet.hazard .sidebar .hp-details {
  10560. width: 100%;
  10561. }
  10562. .sheet.hazard .sidebar h2 {
  10563. font-weight: 500;
  10564. font-size: var(--font-size-16);
  10565. }
  10566. .sheet.hazard .sidebar .initiative {
  10567. display: flex;
  10568. font-size: var(--font-size-16);
  10569. }
  10570. .sheet.hazard .sidebar .initiative .roll-init {
  10571. display: flex;
  10572. align-items: center;
  10573. }
  10574. .sheet.hazard .sidebar .initiative .roll-init i {
  10575. margin-right: 4px;
  10576. }
  10577. .sheet.hazard .sidebar .sidebar-saves {
  10578. display: flex;
  10579. justify-content: space-between;
  10580. }
  10581. .sheet.hazard .sidebar .sidebar-saves .save {
  10582. align-items: center;
  10583. display: flex;
  10584. flex: 1;
  10585. flex-direction: column;
  10586. font-size: var(--font-size-16);
  10587. }
  10588. .sheet.hazard .sidebar .sidebar-saves input {
  10589. max-width: 50px;
  10590. text-align: center;
  10591. }
  10592. .sheet.hazard .sidebar .emits-sound .hint:hover {
  10593. text-shadow: 0 0 8px var(--color-shadow-primary);
  10594. }
  10595. .sheet.hazard .sidebar .rollable {
  10596. cursor: pointer;
  10597. }
  10598. .sheet.hazard .sidebar .rollable:hover {
  10599. text-shadow: 0 0 8px var(--color-shadow-primary);
  10600. }
  10601. .sheet.hazard .sidebar .rollable:hover i {
  10602. animation: rotation 2s infinite linear;
  10603. }
  10604. .sheet.hazard .section-container {
  10605. padding: 4px 6px 0;
  10606. }
  10607. .sheet.hazard .section-container .editor {
  10608. width: 100%;
  10609. }
  10610. .sheet.hazard .section-container .editor .tox {
  10611. width: 100%;
  10612. }
  10613. .sheet.hazard .section-container > .section-body {
  10614. padding: 4px;
  10615. }
  10616. .sheet.hazard .section-container.skills > .section-body .list {
  10617. display: flex;
  10618. flex-direction: row;
  10619. flex-wrap: wrap;
  10620. }
  10621. .sheet.hazard .section-container .actions-list,
  10622. .sheet.hazard .section-container .attacks-list {
  10623. border-bottom: 1px solid var(--alt);
  10624. }
  10625. .sheet.hazard .section-container .actions-list:last-child,
  10626. .sheet.hazard .section-container .attacks-list:last-child {
  10627. border-bottom: none;
  10628. }
  10629. .sheet.hazard .section-container .actions-list .action,
  10630. .sheet.hazard .section-container .attacks-list .action {
  10631. padding: 4px 0;
  10632. }
  10633. .sheet.hazard .section-container.publication {
  10634. margin-top: 0.5rem;
  10635. }
  10636. .sheet.hazard .section-container.publication .section-header {
  10637. background: none;
  10638. color: var(--color-pf-primary);
  10639. }
  10640. .sheet.hazard .section-container.publication .section-body {
  10641. align-items: baseline;
  10642. gap: 0.25em;
  10643. display: grid;
  10644. grid-template: "title title title" 2fr "authors license remaster" 3fr/60% 20% 20%;
  10645. border-top: none;
  10646. padding: 0.25rem 0.5rem;
  10647. }
  10648. .sheet.hazard .section-container.publication .section-body label {
  10649. font-weight: 500;
  10650. min-width: unset;
  10651. }
  10652. .sheet.hazard .section-container.publication .section-body input[type=text] {
  10653. height: 1.6rem;
  10654. }
  10655. .sheet.hazard .section-container.publication .section-body .title {
  10656. grid-area: title;
  10657. margin-right: 0;
  10658. }
  10659. .sheet.hazard .section-container.publication .section-body .authors {
  10660. grid-area: authors;
  10661. }
  10662. .sheet.hazard .section-container.publication .section-body .license {
  10663. grid-area: license;
  10664. }
  10665. .sheet.hazard .section-container.publication .section-body .license select {
  10666. margin-top: 1px;
  10667. }
  10668. .sheet.hazard .section-container.publication .section-body .remaster {
  10669. grid-area: remaster;
  10670. }
  10671. .sheet.hazard .section-container.publication .section-body .license,
  10672. .sheet.hazard .section-container.publication .section-body .remaster {
  10673. text-align: center;
  10674. }
  10675. .sheet.hazard .section-container.publication .section-body .license label,
  10676. .sheet.hazard .section-container.publication .section-body .remaster label {
  10677. padding: 0;
  10678. }
  10679. .sheet.hazard .section-container.publication .section-body input[type=text] {
  10680. background: rgba(0, 0, 0, 0.05);
  10681. }
  10682. .sheet.hazard .tox.tox-tinymce {
  10683. height: 200px !important;
  10684. }
  10685. .sheet.hazard .hazard-editor .editor .editor-edit {
  10686. display: none;
  10687. }
  10688. .app.npc-skills-editor form {
  10689. font-size: var(--font-size-12);
  10690. overflow: hidden;
  10691. }
  10692. .app.npc-skills-editor form > .scroll-container {
  10693. max-height: 500px;
  10694. overflow: hidden scroll;
  10695. }
  10696. .app.npc-skills-editor form ol {
  10697. list-style: none;
  10698. overflow: hidden;
  10699. padding: 0px;
  10700. width: 100%;
  10701. }
  10702. .app.npc-skills-editor form ol li {
  10703. align-items: center;
  10704. column-gap: 1rem;
  10705. display: grid;
  10706. grid-template-columns: auto 3rem 2rem;
  10707. grid-template-rows: auto;
  10708. padding: 0.25rem;
  10709. width: 100%;
  10710. }
  10711. .app.npc-skills-editor form ol li.skill:nth-child(even) {
  10712. background-color: #ede3c8;
  10713. }
  10714. .app.npc-skills-editor form ol li.skill:nth-child(odd) {
  10715. background-color: #f5efe0;
  10716. }
  10717. .app.npc-skills-editor form ol li.skill.header {
  10718. background-color: var(--color-pf-primary);
  10719. color: var(--text-light);
  10720. font-weight: 500;
  10721. padding: 4px;
  10722. text-transform: uppercase;
  10723. }
  10724. .app.npc-skills-editor form ol li.skill.header.lore {
  10725. background-color: var(--color-pf-secondary);
  10726. }
  10727. .app.npc-skills-editor form ol li.skill .item-controls {
  10728. text-align: right;
  10729. }
  10730. .app.npc-skills-editor form ol li.skill-selector button, .app.npc-skills-editor form ol li.lore-skill-creator button {
  10731. background-color: var(--color-pf-secondary);
  10732. border-radius: 3px;
  10733. border: 1px solid var(--color-pf-secondary-dark);
  10734. color: var(--text-light);
  10735. display: flex;
  10736. grid-column: span 2;
  10737. justify-content: center;
  10738. line-height: 1em;
  10739. padding: 4px;
  10740. white-space: nowrap;
  10741. }
  10742. .actor.npc.sheet form {
  10743. display: flex;
  10744. flex-direction: row;
  10745. align-items: flex-start;
  10746. }
  10747. .actor.npc.sheet form ol.spell-list {
  10748. margin: 0;
  10749. padding: 0;
  10750. border-bottom: 1px solid var(--color-border-light-2);
  10751. flex-basis: 100%;
  10752. gap: 1px;
  10753. position: relative;
  10754. width: 100%;
  10755. z-index: 1;
  10756. }
  10757. .actor.npc.sheet form ol.spell-list > li {
  10758. margin: 0;
  10759. padding: 0;
  10760. align-items: center;
  10761. background: none;
  10762. cursor: default;
  10763. display: grid;
  10764. grid: "name range components cast-spell controls" auto "content content content content content" auto/9fr 4fr 4fr 2fr 2.5fr;
  10765. justify-content: center;
  10766. padding: 0 0.3em 1px 0.35em;
  10767. }
  10768. .actor.npc.sheet form ol.spell-list > li[data-expended-state=true] h4 {
  10769. color: var(--color-disabled);
  10770. text-decoration: line-through;
  10771. }
  10772. .actor.npc.sheet form ol.spell-list > li[data-expended-state=true] .cast-spell {
  10773. background: var(--color-disabled);
  10774. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  10775. cursor: not-allowed;
  10776. }
  10777. .actor.npc.sheet form ol.spell-list > li:nth-child(odd) {
  10778. background-color: rgba(120, 100, 82, 0.1);
  10779. }
  10780. .actor.npc.sheet form ol.spell-list > li:last-child {
  10781. border-bottom: 1px solid var(--sub);
  10782. }
  10783. .actor.npc.sheet form ol.spell-list > li:last-child .item-image {
  10784. margin-bottom: 0;
  10785. margin-top: 2px;
  10786. }
  10787. .actor.npc.sheet form ol.spell-list > li.spell-level-header {
  10788. margin: 0;
  10789. padding: 0;
  10790. background: rgba(96, 88, 86, 0.25);
  10791. border: 1px solid var(--color-border-light-2);
  10792. border-radius: 2px;
  10793. color: var(--text-dark);
  10794. font: 500 var(--font-size-12) var(--sans-serif);
  10795. letter-spacing: 0.25px;
  10796. line-height: 1;
  10797. padding: 0 0.5em;
  10798. text-transform: uppercase;
  10799. }
  10800. .actor.npc.sheet form ol.spell-list > li.spell-level-header h3 {
  10801. text-transform: capitalize;
  10802. font-size: var(--font-size-13);
  10803. margin-left: 0;
  10804. padding: 4px 0;
  10805. }
  10806. .actor.npc.sheet form ol.spell-list > li.spell-level-header .item-name {
  10807. line-height: 1;
  10808. gap: 0.25em;
  10809. }
  10810. .actor.npc.sheet form ol.spell-list > li.spell-level-header .item-name h3 {
  10811. margin: 0;
  10812. padding: 0;
  10813. font-weight: 700;
  10814. }
  10815. .actor.npc.sheet form ol.spell-list > li.spell-level-header .item-controls {
  10816. grid-column: span 2;
  10817. }
  10818. .actor.npc.sheet form ol.spell-list > li .uses {
  10819. align-items: center;
  10820. display: flex;
  10821. gap: 0.25em;
  10822. line-height: 1;
  10823. }
  10824. .actor.npc.sheet form ol.spell-list > li.spell-level-header input,
  10825. .actor.npc.sheet form ol.spell-list > li .uses input {
  10826. background: var(--alt);
  10827. border-radius: 3px;
  10828. border: 1px solid var(--sub);
  10829. color: var(--text-light);
  10830. font: var(--font-size-12) var(--sans-serif);
  10831. height: unset;
  10832. text-align: center;
  10833. width: 2em;
  10834. }
  10835. .actor.npc.sheet form ol.spell-list > li.spell-level-header .spell-slots-increment-reset,
  10836. .actor.npc.sheet form ol.spell-list > li .uses .spell-slots-increment-reset {
  10837. padding-left: 5px;
  10838. font-size: var(--font-size-10);
  10839. }
  10840. .actor.npc.sheet form ol.spell-list > li.spell {
  10841. border: none;
  10842. font-size: var(--font-size-13);
  10843. }
  10844. .actor.npc.sheet form ol.spell-list > li .level-prepared-toggle {
  10845. flex: 0;
  10846. font-size: 0.75rem;
  10847. color: var(--secondary);
  10848. }
  10849. .actor.npc.sheet form ol.spell-list > li .item-name {
  10850. align-items: center;
  10851. display: flex;
  10852. flex-wrap: nowrap;
  10853. justify-content: start;
  10854. justify-self: start;
  10855. min-height: 1.75rem;
  10856. }
  10857. .actor.npc.sheet form ol.spell-list > li .item-name h3 {
  10858. white-space: nowrap;
  10859. }
  10860. .actor.npc.sheet form ol.spell-list > li .item-name + span {
  10861. font-size: 0.75rem;
  10862. }
  10863. .actor.npc.sheet form ol.spell-list > li .item-name .focus-pool-input {
  10864. align-items: center;
  10865. display: flex;
  10866. flex-wrap: nowrap;
  10867. }
  10868. .actor.npc.sheet form ol.spell-list > li .item-name .slash {
  10869. font-size: 0.75rem;
  10870. }
  10871. .actor.npc.sheet form ol.spell-list > li .item-name .spell-slots,
  10872. .actor.npc.sheet form ol.spell-list > li .item-name .spell-max {
  10873. padding-top: 3px;
  10874. font-size: 0.75rem;
  10875. }
  10876. .actor.npc.sheet form ol.spell-list > li .item-name .spell-slots.infinity,
  10877. .actor.npc.sheet form ol.spell-list > li .item-name .spell-max.infinity {
  10878. position: relative;
  10879. top: -2px;
  10880. }
  10881. .actor.npc.sheet form ol.spell-list > li .item-name .item-image {
  10882. height: 1.5rem;
  10883. width: 1.5rem;
  10884. flex: 0 0 auto;
  10885. margin: 2px 0;
  10886. }
  10887. .actor.npc.sheet form ol.spell-list > li .item-name h4 {
  10888. margin: 0;
  10889. padding: 0;
  10890. font-size: var(--font-size-14);
  10891. letter-spacing: -0.075em;
  10892. line-height: 1;
  10893. margin-left: 8px;
  10894. cursor: pointer;
  10895. }
  10896. .actor.npc.sheet form ol.spell-list > li .item-name h4:hover {
  10897. color: var(--secondary);
  10898. }
  10899. .actor.npc.sheet form ol.spell-list > li .item-name .action-glyph {
  10900. margin-left: 4px;
  10901. font-size: small;
  10902. }
  10903. .actor.npc.sheet form ol.spell-list > li .item-name.empty {
  10904. grid-column: 1/span 4;
  10905. }
  10906. .actor.npc.sheet form ol.spell-list > li .spell-range {
  10907. grid-area: range;
  10908. padding-left: 0.2em;
  10909. }
  10910. .actor.npc.sheet form ol.spell-list > li .spell-components {
  10911. grid-area: components;
  10912. justify-self: right;
  10913. padding: 0 0.5em;
  10914. }
  10915. .actor.npc.sheet form ol.spell-list > li .spell-components .tag {
  10916. font: var(--font-size-12) var(--sans-serif-condensed);
  10917. }
  10918. .actor.npc.sheet form ol.spell-list > li .spell-cast {
  10919. grid-area: cast-spell;
  10920. display: flex;
  10921. justify-content: center;
  10922. }
  10923. .actor.npc.sheet form ol.spell-list > li .item-controls {
  10924. grid-area: controls;
  10925. display: flex;
  10926. justify-self: end;
  10927. padding-right: 0.25em;
  10928. }
  10929. .actor.npc.sheet form ol.spell-list > li button.cast-spell {
  10930. align-items: center;
  10931. background: var(--secondary);
  10932. border-radius: 2px;
  10933. border: black;
  10934. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  10935. color: var(--text-light);
  10936. cursor: pointer;
  10937. display: flex;
  10938. font: 700 0.55rem var(--sans-serif);
  10939. justify-self: center;
  10940. letter-spacing: 0.25px;
  10941. max-width: fit-content;
  10942. padding: 0.5em 1em;
  10943. text-transform: uppercase;
  10944. }
  10945. .actor.npc.sheet form ol.spell-list > li .item-summary {
  10946. grid-area: content;
  10947. width: 100%;
  10948. padding: 8px;
  10949. border-bottom: 1px solid var(--sub);
  10950. border-top: 1px solid #aca5a3;
  10951. background-color: var(--bg);
  10952. }
  10953. .actor.npc.sheet form ol.spell-list[data-category=spontaneous] .virtual {
  10954. position: relative;
  10955. }
  10956. .actor.npc.sheet form ol.spell-list[data-category=spontaneous] .virtual::before {
  10957. pointer-events: none;
  10958. content: "";
  10959. position: absolute;
  10960. height: 100%;
  10961. width: 100%;
  10962. background-color: rgba(0, 5, 255, 0.1137254902);
  10963. mix-blend-mode: saturation;
  10964. }
  10965. .actor.npc.sheet form ol.spell-list[data-category=spontaneous] .item:not(.virtual) + .virtual {
  10966. border-top: 1px solid rgba(0, 0, 0, 0.15);
  10967. }
  10968. .actor.npc.sheet form ol.spell-list .level-prepared-header {
  10969. font-size: 0.75rem;
  10970. color: var(--text-light);
  10971. margin: 0;
  10972. padding: 4px;
  10973. text-align: center;
  10974. background: var(--secondary);
  10975. position: relative;
  10976. }
  10977. .actor.npc.sheet form ol.spell-list .spell .item-name {
  10978. width: 100%;
  10979. }
  10980. .actor.npc.sheet form ol.spell-list input.toggle-signature-spell[type=checkbox] {
  10981. width: 12px;
  10982. height: 12px;
  10983. margin: 0 2px 0 0;
  10984. flex: 0 0 auto;
  10985. }
  10986. .actor.npc.sheet form ol.spell-list .spellbook-empty {
  10987. display: flex;
  10988. align-items: center;
  10989. min-height: 28px;
  10990. justify-content: flex-end;
  10991. }
  10992. .actor.npc.sheet form ol.spell-list .spellbook-empty h4 {
  10993. margin: 0;
  10994. white-space: nowrap;
  10995. margin-right: auto;
  10996. }
  10997. .actor.npc.sheet form ol.spell-list .spellbook-empty a {
  10998. flex: 0 1 0;
  10999. white-space: nowrap;
  11000. margin-left: 8px;
  11001. }
  11002. .actor.npc.sheet form .npc-sheet-header {
  11003. display: flex;
  11004. flex: 1 0 auto;
  11005. flex-direction: column;
  11006. }
  11007. .actor.npc.sheet form .npc-sheet-header .name {
  11008. font-family: var(--sans-serif-condensed);
  11009. font-size: 1.75rem;
  11010. font-weight: 700;
  11011. width: 100%;
  11012. flex-wrap: nowrap;
  11013. }
  11014. .actor.npc.sheet form .npc-sheet-header .name input {
  11015. font-weight: inherit;
  11016. height: 2rem;
  11017. }
  11018. .actor.npc.sheet form .npc-sheet-header .name .name-value {
  11019. font-variant: small-caps;
  11020. margin-left: 6px;
  11021. margin-right: 1.125rem;
  11022. }
  11023. .actor.npc.sheet form .npc-sheet-header .name .level-label {
  11024. flex: 0;
  11025. text-align: right;
  11026. margin-right: 0.1em;
  11027. text-transform: uppercase;
  11028. }
  11029. .actor.npc.sheet form .npc-sheet-header .name input.level {
  11030. flex: 0 0 2.5rem;
  11031. text-align: center;
  11032. }
  11033. .actor.npc.sheet form .npc-sheet-header .rarity-alignment-size {
  11034. display: flex;
  11035. flex-direction: row;
  11036. justify-content: space-between;
  11037. }
  11038. .actor.npc.sheet form hr {
  11039. margin: 10px 6px 10px 0;
  11040. }
  11041. .actor.npc.sheet form select {
  11042. background: none;
  11043. }
  11044. .actor.npc.sheet form .sidebar {
  11045. flex: 10rem 0 0;
  11046. height: 100%;
  11047. overflow: hidden scroll;
  11048. padding-right: 0.25rem;
  11049. }
  11050. .actor.npc.sheet form .sidebar .image-container img.actor-image {
  11051. border: none;
  11052. border-radius: 8px;
  11053. }
  11054. .actor.npc.sheet form .sidebar .armor-section .armor-value {
  11055. flex: 0;
  11056. text-align: right;
  11057. font-weight: 700;
  11058. padding-right: 4px;
  11059. }
  11060. .actor.npc.sheet form .sidebar .health-section .hit-points,
  11061. .actor.npc.sheet form .sidebar .shield-section .hit-points {
  11062. display: flex;
  11063. flex-direction: row;
  11064. flex: 0;
  11065. margin-left: auto;
  11066. }
  11067. .actor.npc.sheet form .sidebar .health-section .hit-points input.current,
  11068. .actor.npc.sheet form .sidebar .shield-section .hit-points input.current {
  11069. width: 36px;
  11070. text-align: right;
  11071. padding-right: 3px;
  11072. }
  11073. .actor.npc.sheet form .sidebar .health-section .hit-points .slash,
  11074. .actor.npc.sheet form .sidebar .health-section .hit-points .max,
  11075. .actor.npc.sheet form .sidebar .shield-section .hit-points .slash,
  11076. .actor.npc.sheet form .sidebar .shield-section .hit-points .max {
  11077. align-items: center;
  11078. display: flex;
  11079. }
  11080. .actor.npc.sheet form .sidebar .health-section .hit-points .max,
  11081. .actor.npc.sheet form .sidebar .shield-section .hit-points .max {
  11082. font-weight: 700;
  11083. margin-right: 4px;
  11084. text-align: center;
  11085. }
  11086. .actor.npc.sheet form .sidebar .health-section .hit-points .max.lt10,
  11087. .actor.npc.sheet form .sidebar .shield-section .hit-points .max.lt10 {
  11088. width: 8px;
  11089. }
  11090. .actor.npc.sheet form .sidebar .health-section .hit-points .max.lt100,
  11091. .actor.npc.sheet form .sidebar .shield-section .hit-points .max.lt100 {
  11092. width: 24px;
  11093. }
  11094. .actor.npc.sheet form .sidebar .health-section .hit-points .max.lt1000,
  11095. .actor.npc.sheet form .sidebar .shield-section .hit-points .max.lt1000 {
  11096. width: 36px;
  11097. }
  11098. .actor.npc.sheet form .sidebar .shield-section .shield-details {
  11099. display: flex;
  11100. flex: auto;
  11101. flex-direction: row;
  11102. justify-content: flex-start;
  11103. align-items: baseline;
  11104. }
  11105. .actor.npc.sheet form .sidebar .shield-section .shield-details .label {
  11106. flex: 0;
  11107. font-weight: bold;
  11108. }
  11109. .actor.npc.sheet form .sidebar .shield-section .shield-details .value {
  11110. flex: auto;
  11111. font-weight: normal;
  11112. margin-left: 6px !important;
  11113. }
  11114. .actor.npc.sheet form .sidebar .shield-section.broken {
  11115. color: rgba(0, 0, 0, 0.4);
  11116. }
  11117. .actor.npc.sheet form .sidebar .shield-section.broken .shield-label {
  11118. color: rgba(0, 0, 0, 0.4);
  11119. }
  11120. .actor.npc.sheet form .sidebar .shield-section.broken .shield-label h4 {
  11121. text-decoration: line-through;
  11122. }
  11123. .actor.npc.sheet form .sidebar .shield-section.broken .shield-value {
  11124. color: rgba(0, 0, 0, 0.4);
  11125. }
  11126. .actor.npc.sheet form .sidebar .shield-section.broken .shield-value .shield-current {
  11127. color: rgba(0, 0, 0, 0.4);
  11128. }
  11129. .actor.npc.sheet form .sidebar .shield-section.broken .shield-value .shield-max {
  11130. color: rgba(0, 0, 0, 0.4);
  11131. }
  11132. .actor.npc.sheet form .sidebar .speed-section {
  11133. text-align: left;
  11134. }
  11135. .actor.npc.sheet form .sidebar .speed-section .land-speed-value {
  11136. flex: 0 0 30px;
  11137. text-align: right;
  11138. }
  11139. .actor.npc.sheet form .sidebar .speed-section .land-speed .speed-details {
  11140. flex: 1;
  11141. }
  11142. .actor.npc.sheet form .sidebar .speed-section .other-speeds {
  11143. display: flex;
  11144. justify-content: left;
  11145. align-items: left;
  11146. width: 100%;
  11147. flex-wrap: wrap;
  11148. }
  11149. .actor.npc.sheet form .sidebar .saves {
  11150. margin-top: 12px;
  11151. display: flex;
  11152. flex-direction: row;
  11153. width: 100%;
  11154. flex: 1 0 auto;
  11155. font-size: 1.1rem;
  11156. }
  11157. .actor.npc.sheet form .sidebar .saves .container {
  11158. display: flex;
  11159. flex-direction: column;
  11160. text-align: center;
  11161. }
  11162. .actor.npc.sheet form .sidebar .saves .container label {
  11163. font-weight: 600;
  11164. }
  11165. .actor.npc.sheet form .sidebar .saves .container input.modifier {
  11166. text-align: center;
  11167. z-index: 1;
  11168. }
  11169. .actor.npc.sheet form .side-bar-section {
  11170. display: flex;
  11171. flex: auto;
  11172. flex-direction: column;
  11173. justify-content: flex-start;
  11174. align-items: flex-start;
  11175. }
  11176. .actor.npc.sheet form .side-bar-section .controls {
  11177. padding-right: 4px;
  11178. }
  11179. .actor.npc.sheet form .side-bar-section.initiative a.roll-init {
  11180. display: flex;
  11181. flex-wrap: nowrap;
  11182. font-weight: 700;
  11183. margin-left: auto;
  11184. margin-bottom: 2px;
  11185. padding-right: 0.5em;
  11186. }
  11187. .actor.npc.sheet form .side-bar-section.initiative a.roll-init i.fa-dice-d20 {
  11188. font-size: 1rem;
  11189. margin-right: 0.2em;
  11190. }
  11191. .actor.npc.sheet form .side-bar-section.initiative select {
  11192. font-size: var(--font-size-11);
  11193. text-transform: unset;
  11194. }
  11195. .actor.npc.sheet form .side-bar-section .value0 {
  11196. color: darkgrey;
  11197. border-bottom: 1px darkgrey solid;
  11198. }
  11199. .actor.npc.sheet form .side-bar-section .value0 input {
  11200. color: darkgrey;
  11201. }
  11202. .actor.npc.sheet form .side-bar-section-content {
  11203. display: flex;
  11204. width: 100%;
  11205. flex-direction: row;
  11206. flex-wrap: wrap;
  11207. justify-content: flex-start;
  11208. align-items: flex-start;
  11209. padding-top: 2px;
  11210. }
  11211. .actor.npc.sheet form .side-bar-section-header {
  11212. display: flex;
  11213. width: 100%;
  11214. font-size: 1rem;
  11215. border-bottom: 1px solid;
  11216. border-color: #7a7971;
  11217. margin-top: 10px;
  11218. margin-bottom: 2px;
  11219. align-items: baseline;
  11220. }
  11221. .actor.npc.sheet form .side-bar-section-header .side-bar-label {
  11222. display: flex;
  11223. flex: auto;
  11224. flex-direction: row;
  11225. align-items: center;
  11226. }
  11227. .actor.npc.sheet form .side-bar-section-header .side-bar-label .fa {
  11228. font-size: 0.8rem;
  11229. }
  11230. .actor.npc.sheet form .side-bar-section-header .side-bar-label h4,
  11231. .actor.npc.sheet form .side-bar-section-header .side-bar-label label {
  11232. font-size: 0.8rem;
  11233. margin-bottom: 0px;
  11234. padding-left: 2px;
  11235. }
  11236. .actor.npc.sheet form .side-bar-section-header .side-bar-label input.modifier {
  11237. font-size: 0.9rem;
  11238. }
  11239. .actor.npc.sheet form .sheet-body {
  11240. flex: auto;
  11241. }
  11242. .actor.npc.sheet form .sheet-body .tab {
  11243. overflow: hidden scroll;
  11244. }
  11245. .actor.npc.sheet form .sheet-body .tab .identification-skills ul {
  11246. display: inline;
  11247. list-style-type: none;
  11248. padding: 0;
  11249. }
  11250. .actor.npc.sheet form .sheet-body .tab .identification-skills ul li {
  11251. display: inline;
  11252. }
  11253. .actor.npc.sheet form .sheet-body .tab .identification-skills ul li:not(:last-of-type):after {
  11254. content: ",";
  11255. }
  11256. .actor.npc.sheet form .sheet-body .inventory {
  11257. flex-direction: column;
  11258. overflow-y: hidden;
  11259. padding-bottom: 1.25rem;
  11260. }
  11261. .actor.npc.sheet form .sheet-body .inventory.active {
  11262. display: flex;
  11263. }
  11264. .actor.npc.sheet form .sheet-body .inventory .inventory-section {
  11265. max-height: calc(100% - 1rem);
  11266. }
  11267. .actor.npc.sheet form .sheet-body .inventory .inventory-section .inventory-header {
  11268. background-color: var(--primary-background);
  11269. }
  11270. .actor.npc.sheet form .sheet-body .entries-list {
  11271. list-style: none;
  11272. padding: 2px;
  11273. margin: 0;
  11274. }
  11275. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry {
  11276. display: block;
  11277. width: 100%;
  11278. margin: 0px;
  11279. border: 1px solid var(--sub);
  11280. border-radius: 4px;
  11281. }
  11282. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry:not(:first-child) {
  11283. margin-top: 0.5rem;
  11284. }
  11285. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header {
  11286. align-items: baseline;
  11287. background-color: var(--primary);
  11288. border-radius: 3px 3px 0 0;
  11289. color: var(--text-light);
  11290. display: flex;
  11291. flex-direction: row;
  11292. flex-wrap: nowrap;
  11293. gap: 0.25em;
  11294. justify-content: space-between;
  11295. padding: 4px 0.5em;
  11296. }
  11297. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .drag-handle {
  11298. cursor: move;
  11299. }
  11300. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header h4.name {
  11301. flex: 1;
  11302. margin: 0 4px 0 0;
  11303. padding-right: 6px;
  11304. width: max-content;
  11305. }
  11306. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header h4.name input {
  11307. color: var(--text-light);
  11308. max-width: 100%;
  11309. font-weight: 500;
  11310. border: none;
  11311. }
  11312. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header h4.name input:focus, .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header h4.name input:hover {
  11313. box-shadow: none;
  11314. }
  11315. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header h4.name input:read-only {
  11316. pointer-events: none;
  11317. }
  11318. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field {
  11319. flex: 0;
  11320. display: flex;
  11321. flex-direction: row;
  11322. flex-wrap: nowrap;
  11323. justify-content: flex-start;
  11324. align-items: baseline;
  11325. }
  11326. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field label {
  11327. margin-left: 2px;
  11328. flex: 1;
  11329. }
  11330. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field input {
  11331. margin-left: 4px;
  11332. }
  11333. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input,
  11334. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input {
  11335. flex: 1 0 32px;
  11336. text-align: center;
  11337. background-color: var(--text-light);
  11338. font-weight: bold;
  11339. width: 32px;
  11340. }
  11341. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select {
  11342. background: rgba(255, 255, 255, 0.5);
  11343. font-size: var(--font-size-10);
  11344. max-width: 55px;
  11345. padding: 2px;
  11346. }
  11347. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .item-controls {
  11348. display: flex;
  11349. justify-content: space-between;
  11350. }
  11351. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .item-controls a {
  11352. padding: 2px;
  11353. }
  11354. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input {
  11355. background: var(--text-light);
  11356. border: 1px solid transparent;
  11357. color: var(--text-dark);
  11358. flex: 1 0 2rem;
  11359. font-weight: 700;
  11360. height: 18px;
  11361. text-align: center;
  11362. width: 2rem;
  11363. }
  11364. .actor.npc.sheet form .sheet-body .footer {
  11365. display: flex;
  11366. flex: 1;
  11367. justify-content: center;
  11368. margin-top: 12px;
  11369. }
  11370. .actor.npc.sheet form .sheet-body .footer button.spellcasting-create {
  11371. align-items: center;
  11372. justify-content: center;
  11373. display: flex;
  11374. gap: 0.25rem;
  11375. margin: 0 0.5rem;
  11376. min-height: 1rem;
  11377. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11378. background: var(--primary);
  11379. color: var(--text-light);
  11380. white-space: nowrap;
  11381. border-radius: 3px;
  11382. border: none;
  11383. }
  11384. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list {
  11385. gap: 0.2em;
  11386. padding-left: 0px;
  11387. padding-right: 5px;
  11388. }
  11389. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item {
  11390. display: flex;
  11391. flex-wrap: wrap;
  11392. align-items: center;
  11393. justify-content: space-between;
  11394. padding: 2px 4px 2px 12px;
  11395. width: 100%;
  11396. }
  11397. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item p:empty {
  11398. display: none;
  11399. }
  11400. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-name {
  11401. display: flex;
  11402. align-items: center;
  11403. flex: 1;
  11404. }
  11405. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-name h4 {
  11406. cursor: pointer;
  11407. margin: 0;
  11408. }
  11409. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-name .item-image {
  11410. margin-right: 8px;
  11411. }
  11412. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-controls {
  11413. display: flex;
  11414. flex: 0;
  11415. font-size: var(--font-size-12);
  11416. gap: 1px;
  11417. white-space: nowrap;
  11418. }
  11419. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-controls a.info-only:hover {
  11420. cursor: default;
  11421. text-shadow: none;
  11422. }
  11423. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-controls a + a {
  11424. margin-left: 4px;
  11425. }
  11426. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-summary {
  11427. flex-basis: 100%;
  11428. }
  11429. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item.unidentified {
  11430. border-radius: 1px;
  11431. outline: 1px dotted rgba(75, 74, 68, 0.5);
  11432. background: var(--visibility-gm-bg);
  11433. }
  11434. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .button-group {
  11435. display: flex;
  11436. justify-content: flex-end;
  11437. align-items: center;
  11438. flex-wrap: nowrap;
  11439. width: 50%;
  11440. flex: 0;
  11441. }
  11442. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .button-group button {
  11443. margin: 0;
  11444. border: none;
  11445. cursor: pointer;
  11446. font-family: var(--sans-serif);
  11447. font-size: var(--font-size-10);
  11448. text-transform: uppercase;
  11449. letter-spacing: 0.05em;
  11450. text-rendering: optimizeLegibility;
  11451. padding: 5px;
  11452. color: var(--text-light);
  11453. width: 70px;
  11454. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11455. background: var(--secondary);
  11456. border-radius: 2px;
  11457. flex: 0;
  11458. white-space: nowrap;
  11459. margin-left: 4px;
  11460. flex: 0;
  11461. }
  11462. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .button-group button:hover {
  11463. box-shadow: none;
  11464. text-shadow: 0 0 2px white;
  11465. }
  11466. .actor.npc.sheet form .sheet-body .section-container {
  11467. display: flex;
  11468. flex-direction: column;
  11469. }
  11470. .actor.npc.sheet form .sheet-body .section-container .section-header {
  11471. border: 1px solid var(--primary);
  11472. border-radius: 3px 3px 0px 0px;
  11473. background: var(--primary);
  11474. display: flex;
  11475. flex: 0;
  11476. width: 100%;
  11477. flex-direction: row;
  11478. justify-content: space-between;
  11479. align-items: baseline;
  11480. text-align: left;
  11481. color: var(--text-light);
  11482. font-size: var(--font-size-13);
  11483. padding: 0 8px;
  11484. line-height: 2em;
  11485. }
  11486. .actor.npc.sheet form .sheet-body .section-container .section-header h4 {
  11487. flex: auto;
  11488. display: flex;
  11489. align-items: baseline;
  11490. gap: 4px;
  11491. margin-bottom: 0px;
  11492. text-transform: uppercase;
  11493. }
  11494. .actor.npc.sheet form .sheet-body .section-container .section-header input {
  11495. color: inherit;
  11496. width: auto;
  11497. }
  11498. .actor.npc.sheet form .sheet-body .section-container .section-header .controls {
  11499. gap: 0.5rem;
  11500. white-space: nowrap;
  11501. }
  11502. .actor.npc.sheet form .sheet-body .section-container .section-body {
  11503. border: 1px solid var(--primary);
  11504. border-radius: 0px 0px 3px 3px;
  11505. display: flex;
  11506. flex: auto;
  11507. flex-wrap: wrap;
  11508. flex-direction: row;
  11509. align-items: baseline;
  11510. justify-content: flex-start;
  11511. width: 100%;
  11512. }
  11513. .actor.npc.sheet form .sheet-body .section-container.headerless .section-body {
  11514. border-radius: 3px;
  11515. }
  11516. .actor.npc.sheet form .sheet-body .actions-list,
  11517. .actor.npc.sheet form .sheet-body .attacks-list {
  11518. margin: 0;
  11519. padding: 0;
  11520. width: 100%;
  11521. }
  11522. .actor.npc.sheet form .sheet-body .actions-list .controls,
  11523. .actor.npc.sheet form .sheet-body .attacks-list .controls {
  11524. align-items: baseline;
  11525. display: flex;
  11526. flex: 0;
  11527. flex-wrap: nowrap;
  11528. font-size: var(--font-size-12);
  11529. gap: 1px;
  11530. margin-left: auto;
  11531. }
  11532. .actor.npc.sheet form .sheet-body .actions-list .controls .chat,
  11533. .actor.npc.sheet form .sheet-body .attacks-list .controls .chat {
  11534. margin-right: 2px;
  11535. font-size: 0.9em;
  11536. }
  11537. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group,
  11538. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group,
  11539. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group,
  11540. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group {
  11541. display: flex;
  11542. gap: 0.25em;
  11543. justify-content: start;
  11544. min-width: 100%;
  11545. }
  11546. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .flexrow,
  11547. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .sub-section,
  11548. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .flexrow,
  11549. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .sub-section,
  11550. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .flexrow,
  11551. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .sub-section,
  11552. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .flexrow,
  11553. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .sub-section {
  11554. gap: 2px;
  11555. }
  11556. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .sub-section,
  11557. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .sub-section,
  11558. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .sub-section,
  11559. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .sub-section {
  11560. align-items: start;
  11561. display: flex;
  11562. flex-wrap: wrap;
  11563. justify-content: flex-start;
  11564. }
  11565. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .sub-section h4,
  11566. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .sub-section h4,
  11567. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .sub-section h4,
  11568. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .sub-section h4 {
  11569. margin-left: var(--font-size-12);
  11570. margin-right: var(--font-size-12);
  11571. }
  11572. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group button,
  11573. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group button,
  11574. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group button,
  11575. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group button {
  11576. align-items: center;
  11577. display: flex;
  11578. border-radius: 3px;
  11579. border: none;
  11580. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11581. color: var(--color-text-light-0);
  11582. cursor: pointer;
  11583. font-size: var(--font-size-11);
  11584. height: var(--font-size-18);
  11585. justify-content: center;
  11586. line-height: var(--font-size-18);
  11587. margin: 0;
  11588. padding: 0 8px;
  11589. white-space: nowrap;
  11590. width: auto;
  11591. }
  11592. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group button:first-child,
  11593. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group button:first-child,
  11594. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group button:first-child,
  11595. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group button:first-child {
  11596. margin-left: 0px;
  11597. }
  11598. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group button:hover,
  11599. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group button:hover,
  11600. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group button:hover,
  11601. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group button:hover {
  11602. box-shadow: none;
  11603. text-shadow: 0 0 2px var(--color-text-light-0);
  11604. }
  11605. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .attack-button,
  11606. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .attack-button,
  11607. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .attack-button,
  11608. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .attack-button {
  11609. background-color: var(--secondary);
  11610. }
  11611. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .damage-button,
  11612. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .critical-button,
  11613. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .damage-button,
  11614. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .critical-button,
  11615. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .damage-button,
  11616. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .critical-button,
  11617. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .damage-button,
  11618. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .critical-button {
  11619. background-color: var(--primary);
  11620. }
  11621. .actor.npc.sheet form .sheet-body .actions-list li.attack,
  11622. .actor.npc.sheet form .sheet-body .attacks-list li.attack {
  11623. border-bottom: 1px solid var(--color-border-light-tertiary);
  11624. display: flex;
  11625. flex-direction: row;
  11626. justify-content: start;
  11627. gap: 0.25rem;
  11628. padding: 0.25rem 0;
  11629. }
  11630. .actor.npc.sheet form .sheet-body .actions-list li.attack:last-child,
  11631. .actor.npc.sheet form .sheet-body .attacks-list li.attack:last-child {
  11632. border-bottom: none;
  11633. }
  11634. .actor.npc.sheet form .sheet-body .actions-list li.attack > h4,
  11635. .actor.npc.sheet form .sheet-body .attacks-list li.attack > h4 {
  11636. align-items: center;
  11637. display: flex;
  11638. flex-wrap: wrap;
  11639. font-size: 0.9rem;
  11640. font-weight: 500;
  11641. gap: 2px;
  11642. margin: 0 4px 0 0;
  11643. white-space: nowrap;
  11644. }
  11645. .actor.npc.sheet form .sheet-body .actions-list li.attack > h4 > span,
  11646. .actor.npc.sheet form .sheet-body .actions-list li.attack > h4 > a,
  11647. .actor.npc.sheet form .sheet-body .attacks-list li.attack > h4 > span,
  11648. .actor.npc.sheet form .sheet-body .attacks-list li.attack > h4 > a {
  11649. display: flex;
  11650. gap: 3px;
  11651. line-height: 1.125rem;
  11652. margin-right: 4px;
  11653. }
  11654. .actor.npc.sheet form .sheet-body .actions-list li.attack > .description,
  11655. .actor.npc.sheet form .sheet-body .attacks-list li.attack > .description {
  11656. flex-basis: 100%;
  11657. }
  11658. .actor.npc.sheet form .sheet-body .actions-list li.action,
  11659. .actor.npc.sheet form .sheet-body .attacks-list li.action {
  11660. display: flex;
  11661. gap: 0.25rem;
  11662. }
  11663. .actor.npc.sheet form .sheet-body .actions-list li.action:not(:last-child),
  11664. .actor.npc.sheet form .sheet-body .attacks-list li.action:not(:last-child) {
  11665. border-bottom: 1px solid var(--color-border-light-tertiary);
  11666. }
  11667. .actor.npc.sheet form .sheet-body .actions-list li.action > h4,
  11668. .actor.npc.sheet form .sheet-body .attacks-list li.action > h4 {
  11669. align-items: center;
  11670. display: flex;
  11671. gap: 0.25rem;
  11672. flex: auto;
  11673. font-size: 0.9rem;
  11674. margin: 0;
  11675. }
  11676. .actor.npc.sheet form .sheet-body .actions-list li.action > h4 > a,
  11677. .actor.npc.sheet form .sheet-body .attacks-list li.action > h4 > a {
  11678. align-items: center;
  11679. display: flex;
  11680. gap: 2px;
  11681. }
  11682. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group > button.use-action,
  11683. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group > button.use-action {
  11684. color: var(--color-text-light-0);
  11685. background-color: var(--secondary);
  11686. margin-right: 0.5rem;
  11687. }
  11688. .actor.npc.sheet form .sheet-body .actions-list li.action .action-traits,
  11689. .actor.npc.sheet form .sheet-body .attacks-list li.action .action-traits {
  11690. margin-left: var(--font-size-12);
  11691. }
  11692. .actor.npc.sheet form .sheet-body .actions-list li.action .tracking,
  11693. .actor.npc.sheet form .sheet-body .attacks-list li.action .tracking {
  11694. flex: 0;
  11695. align-items: center;
  11696. display: flex;
  11697. flex-direction: row;
  11698. flex-wrap: nowrap;
  11699. margin-left: auto;
  11700. margin-right: var(--font-size-16);
  11701. }
  11702. .actor.npc.sheet form .sheet-body .actions-list li.action .tracking input,
  11703. .actor.npc.sheet form .sheet-body .attacks-list li.action .tracking input {
  11704. background: none;
  11705. border: 0;
  11706. flex: 0 1 4rem;
  11707. flex: 1;
  11708. font-family: inherit;
  11709. font-size: 0.9rem;
  11710. height: auto;
  11711. padding: 0 3px;
  11712. text-align: center;
  11713. width: 0;
  11714. }
  11715. .actor.npc.sheet form .sheet-body .actions-list li.action .tracking span,
  11716. .actor.npc.sheet form .sheet-body .attacks-list li.action .tracking span {
  11717. white-space: nowrap;
  11718. }
  11719. .actor.npc.sheet form .sheet-body .actions-list li.action .item-summary,
  11720. .actor.npc.sheet form .sheet-body .attacks-list li.action .item-summary {
  11721. flex-basis: 100%;
  11722. }
  11723. .actor.npc.sheet form input.adjustable:not(:focus),
  11724. .actor.npc.sheet form span.adjustable,
  11725. .actor.npc.sheet form div.adjustable {
  11726. display: inline;
  11727. text-align: right;
  11728. }
  11729. .actor.npc.sheet form input.adjustable:not(:focus).adjusted-higher,
  11730. .actor.npc.sheet form span.adjustable.adjusted-higher,
  11731. .actor.npc.sheet form div.adjustable.adjusted-higher {
  11732. color: #009988;
  11733. }
  11734. .actor.npc.sheet form input.adjustable:not(:focus).adjusted-lower,
  11735. .actor.npc.sheet form span.adjustable.adjusted-lower,
  11736. .actor.npc.sheet form div.adjustable.adjusted-lower {
  11737. color: #cc3311;
  11738. }
  11739. .actor.npc.sheet form .disabled {
  11740. color: var(--color-disabled);
  11741. border-color: var(--color-disabled);
  11742. }
  11743. .actor.npc.sheet form .disabled:hover, .actor.npc.sheet form .disabled.active {
  11744. color: var(--color-rarity-common);
  11745. border-color: #7a7971;
  11746. }
  11747. .actor.npc.sheet form .trait {
  11748. flex: auto 0 0;
  11749. padding: 4px;
  11750. background: var(--primary);
  11751. border: 2px solid var(--color-border-trait);
  11752. color: var(--color-text-trait);
  11753. font-size: 0.9em;
  11754. font-weight: 500;
  11755. text-transform: uppercase;
  11756. }
  11757. .actor.npc.sheet form .effects-list {
  11758. display: flex;
  11759. flex: 1 0 auto;
  11760. flex-direction: row;
  11761. flex-wrap: wrap;
  11762. width: 100%;
  11763. }
  11764. .actor.npc.sheet form .effects-list .separator {
  11765. flex: 0 0 1px;
  11766. height: 32px;
  11767. margin-right: 4px;
  11768. border-left: 2px solid var(--color-rarity-common);
  11769. }
  11770. .actor.npc.sheet form .effects-list > .effect {
  11771. display: flex;
  11772. flex: 0 0 32px;
  11773. height: 32px;
  11774. margin-right: 4px;
  11775. margin-bottom: 4px;
  11776. border-bottom: none !important;
  11777. }
  11778. .actor.npc.sheet form .effects-list > .effect .item-image {
  11779. background-size: cover;
  11780. border: 1px solid var(--color-rarity-common);
  11781. border-bottom: 1px solid var(--color-rarity-common);
  11782. border-radius: 3px;
  11783. width: 32px;
  11784. }
  11785. .actor.npc.sheet form .effects-list > .effect .item-image:hover {
  11786. border: 1px solid var(--text-light);
  11787. border-radius: 3px;
  11788. }
  11789. .actor.npc.sheet form .actions-options .actions-option {
  11790. display: flex;
  11791. align-items: center;
  11792. width: 100%;
  11793. }
  11794. .actor.npc.sheet form .actions-options .actions-option label {
  11795. width: 100%;
  11796. }
  11797. .actor.npc.sheet form .actions-options .actions-option label * {
  11798. vertical-align: middle;
  11799. }
  11800. .actor.npc.sheet form .actions-options .actions-option label input {
  11801. margin: 0;
  11802. padding: 0;
  11803. }
  11804. .actor.npc.sheet form .actions-options .actions-option select {
  11805. background: none;
  11806. margin-left: 0.25em;
  11807. text-transform: none;
  11808. }
  11809. .actor.npc.sheet form .actions-list {
  11810. display: flex;
  11811. flex-direction: column;
  11812. gap: 0.25rem;
  11813. padding: 0.1rem 0.25rem;
  11814. }
  11815. .actor.npc.sheet form .actions-list .action {
  11816. width: 100%;
  11817. }
  11818. .actor.npc.sheet form .labelled-field {
  11819. display: flex;
  11820. flex-direction: row;
  11821. align-items: baseline;
  11822. }
  11823. .actor.npc.sheet form .labelled-field label,
  11824. .actor.npc.sheet form .labelled-field .rollable {
  11825. flex: 1;
  11826. font-weight: 600;
  11827. }
  11828. .actor.npc.sheet form .labelled-field input[type=text],
  11829. .actor.npc.sheet form .labelled-field input[type=number] {
  11830. flex: 0;
  11831. font-weight: normal;
  11832. margin: 1px 4px;
  11833. margin-left: auto;
  11834. min-width: 2.5em;
  11835. padding-right: 1px;
  11836. text-align: right;
  11837. }
  11838. .actor.npc.sheet form .labelled-field.hp-temp > label {
  11839. margin-right: 0.5em;
  11840. }
  11841. .actor.npc.sheet form .top-sections {
  11842. display: flex;
  11843. flex-direction: row;
  11844. justify-content: flex-start;
  11845. align-items: flex-start;
  11846. }
  11847. .actor.npc.sheet form .top-sections .skills {
  11848. flex: 3;
  11849. align-self: stretch;
  11850. }
  11851. .actor.npc.sheet form .top-sections .senses {
  11852. flex: 2;
  11853. }
  11854. .actor.npc.sheet form .top-sections .senses .perception {
  11855. width: 100%;
  11856. }
  11857. .actor.npc.sheet form .top-sections .senses .perception label {
  11858. flex-basis: 5em;
  11859. }
  11860. .actor.npc.sheet form .top-sections .senses .perception input {
  11861. flex: 0 0 24px;
  11862. z-index: 1;
  11863. }
  11864. .actor.npc.sheet form .top-sections .ability-scores {
  11865. flex: 2;
  11866. flex-direction: column;
  11867. }
  11868. .actor.npc.sheet form .top-sections .ability-scores .list {
  11869. display: grid;
  11870. padding-left: 0.75em;
  11871. grid-template-columns: repeat(3, minmax(0, 1fr));
  11872. }
  11873. .actor.npc.sheet form .top-sections .ability-scores .list input {
  11874. flex: 0 0 24px;
  11875. margin-right: 1em;
  11876. z-index: 1;
  11877. }
  11878. .actor.npc.sheet form .section-container {
  11879. padding: 0.25rem 0.25rem 0 0;
  11880. }
  11881. .actor.npc.sheet form .section-container .section-body {
  11882. padding: 0.25rem;
  11883. }
  11884. .actor.npc.sheet form .section-container.headerless .section-body {
  11885. border-radius: 3px;
  11886. }
  11887. .actor.npc.sheet form .section-container.skills > .section-body .list {
  11888. display: flex;
  11889. flex-direction: row;
  11890. flex-wrap: wrap;
  11891. }
  11892. .actor.npc.sheet form .section-container.recall-knowledge .section-header {
  11893. align-items: center;
  11894. }
  11895. .actor.npc.sheet form .section-container.recall-knowledge .section-header .breakdown {
  11896. width: auto;
  11897. cursor: pointer;
  11898. font-size: var(--font-size-9);
  11899. line-height: var(--font-size-15);
  11900. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11901. background: var(--secondary);
  11902. color: var(--text-light);
  11903. font-family: var(--sans-serif);
  11904. text-transform: uppercase;
  11905. border-radius: 3px;
  11906. border: none;
  11907. padding: 2px 4px 0;
  11908. }
  11909. .actor.npc.sheet form .section-container.recall-knowledge .section-header .breakdown:hover {
  11910. box-shadow: none;
  11911. text-shadow: 0 0 2px white;
  11912. }
  11913. .actor.npc.sheet form .section-container.languages {
  11914. flex: 1;
  11915. }
  11916. .actor.npc.sheet form select {
  11917. flex: auto 0 0;
  11918. padding: 4px;
  11919. height: auto;
  11920. font-weight: 500;
  11921. }
  11922. .actor.npc.sheet form select option {
  11923. color: var(--text-light);
  11924. background-color: var(--alt);
  11925. }
  11926. .actor.npc.sheet form .adjustments {
  11927. align-items: center;
  11928. display: flex;
  11929. justify-content: end;
  11930. }
  11931. .actor.npc.sheet form .adjustments .adjustment.active {
  11932. background-color: var(--primary);
  11933. color: var(--text-light);
  11934. }
  11935. .actor.npc.sheet form .adjustments .adjustment:not(.active) {
  11936. background-color: var(--color-disabled);
  11937. color: var(--color-text-trait);
  11938. }
  11939. .actor.npc.sheet form .npc-body {
  11940. padding-left: 5px;
  11941. display: flex;
  11942. flex: auto;
  11943. flex-direction: column;
  11944. height: 100%;
  11945. width: 100%;
  11946. overflow-y: hidden;
  11947. }
  11948. .actor.npc.sheet form .notes.active {
  11949. display: flex;
  11950. flex-direction: column;
  11951. gap: 0.5rem;
  11952. padding-bottom: 0.5rem;
  11953. padding-right: 0.75rem;
  11954. }
  11955. .actor.npc.sheet form .notes .notes-section {
  11956. display: flex;
  11957. flex-direction: column;
  11958. }
  11959. .actor.npc.sheet form .notes .notes-section > h4 {
  11960. color: var(--primary);
  11961. font-family: var(--sans-serif);
  11962. font-size: var(--font-size-11);
  11963. font-weight: 700;
  11964. line-height: 1;
  11965. margin: 0 2px 0 0;
  11966. padding: 4px;
  11967. text-transform: uppercase;
  11968. white-space: nowrap;
  11969. }
  11970. .actor.npc.sheet form .notes .notes-section > .notes-text {
  11971. padding: 0 4px 4px;
  11972. color: var(--text-dark);
  11973. flex-grow: 1;
  11974. }
  11975. .actor.npc.sheet form .notes .notes-section > .notes-text .editor {
  11976. height: 100%;
  11977. }
  11978. .actor.npc.sheet form .notes .notes-section > .notes-text .editor .editor-content {
  11979. min-height: 75px;
  11980. }
  11981. .actor.npc.sheet form .notes .notes-section > .notes-text .editor .editor-edit {
  11982. background: var(--primary);
  11983. color: var(--text-light);
  11984. }
  11985. .actor.npc.sheet form .notes .notes-section > .notes-text .editor a.editor-edit {
  11986. padding: 2px 2px 2px 4px;
  11987. }
  11988. .actor.npc.sheet form .notes .notes-section.publication {
  11989. margin-top: auto;
  11990. }
  11991. .actor.npc.sheet form .notes .notes-section.publication .notes-text {
  11992. align-items: baseline;
  11993. gap: 0.25em;
  11994. display: grid;
  11995. grid-template: "title title title" 2fr "authors license remaster" 3fr/60% 20% 20%;
  11996. }
  11997. .actor.npc.sheet form .notes .notes-section.publication .notes-text label {
  11998. font-weight: 500;
  11999. min-width: unset;
  12000. }
  12001. .actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text] {
  12002. height: 1.6rem;
  12003. }
  12004. .actor.npc.sheet form .notes .notes-section.publication .notes-text .title {
  12005. grid-area: title;
  12006. margin-right: 0;
  12007. }
  12008. .actor.npc.sheet form .notes .notes-section.publication .notes-text .authors {
  12009. grid-area: authors;
  12010. }
  12011. .actor.npc.sheet form .notes .notes-section.publication .notes-text .license {
  12012. grid-area: license;
  12013. }
  12014. .actor.npc.sheet form .notes .notes-section.publication .notes-text .license select {
  12015. margin-top: 1px;
  12016. }
  12017. .actor.npc.sheet form .notes .notes-section.publication .notes-text .remaster {
  12018. grid-area: remaster;
  12019. }
  12020. .actor.npc.sheet form .notes .notes-section.publication .notes-text .license,
  12021. .actor.npc.sheet form .notes .notes-section.publication .notes-text .remaster {
  12022. text-align: center;
  12023. }
  12024. .actor.npc.sheet form .notes .notes-section.publication .notes-text .license label,
  12025. .actor.npc.sheet form .notes .notes-section.publication .notes-text .remaster label {
  12026. padding: 0;
  12027. }
  12028. .actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text] {
  12029. background: rgba(0, 0, 0, 0.05);
  12030. padding: 1px 3px;
  12031. }
  12032. .actor.npc.sheet form .notes .tox {
  12033. min-height: 20em;
  12034. }
  12035. .actor.npc.sheet form.dead .profile {
  12036. background-size: cover;
  12037. background-color: #dbd9cd;
  12038. box-sizing: border-box;
  12039. border: 1px solid black;
  12040. border-radius: 2px;
  12041. }
  12042. .actor.npc.sheet form.dead .profile > img {
  12043. border: none;
  12044. width: 100%;
  12045. opacity: 0.33;
  12046. }
  12047. .actor.npc.sheet form.dead h2.name {
  12048. margin-top: 3px;
  12049. text-align: center;
  12050. border-bottom: none;
  12051. }
  12052. .actor.npc.sheet form.simple .sheet-body {
  12053. overflow-y: auto;
  12054. }
  12055. .actor.npc.sheet.simple {
  12056. min-height: 500px;
  12057. }
  12058. .sheet.actor.loot form {
  12059. display: flex;
  12060. flex-direction: row;
  12061. height: 100%;
  12062. }
  12063. .sheet.actor.loot form section.sidebar {
  12064. display: flex;
  12065. flex-direction: column;
  12066. width: 200px;
  12067. height: 100%;
  12068. border-right: 1px solid var(--color-text-light-7);
  12069. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  12070. }
  12071. .sheet.actor.loot form section.sidebar > * {
  12072. flex: 0;
  12073. }
  12074. .sheet.actor.loot form section.sidebar .image-container {
  12075. display: flex;
  12076. }
  12077. .sheet.actor.loot form section.sidebar .image-container > img.actor-image {
  12078. flex: none;
  12079. border: none;
  12080. border-bottom: 1px solid var(--color-text-light-7);
  12081. }
  12082. .sheet.actor.loot form section.sidebar .image-container [data-action=show-image] {
  12083. bottom: 3px;
  12084. right: 2px;
  12085. }
  12086. .sheet.actor.loot form section.sidebar .gm-settings {
  12087. border-bottom: 1px solid var(--color-text-light-7);
  12088. display: flex;
  12089. flex-direction: column;
  12090. padding: 0.25rem;
  12091. }
  12092. .sheet.actor.loot form section.sidebar .gm-settings .loot-distribution {
  12093. display: flex;
  12094. flex-direction: column;
  12095. gap: 2px;
  12096. }
  12097. .sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button {
  12098. background-color: var(--tertiary);
  12099. }
  12100. .sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button:not(:hover) {
  12101. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  12102. }
  12103. .sheet.actor.loot form section.sidebar .gm-settings label {
  12104. font-weight: 500;
  12105. }
  12106. .sheet.actor.loot form section.sidebar .sidebar-meta {
  12107. border-top: 1px solid var(--color-text-light-7);
  12108. }
  12109. .sheet.actor.loot form section.sidebar .hidden-when-empty,
  12110. .sheet.actor.loot form section.sidebar .bulk {
  12111. align-self: end;
  12112. }
  12113. .sheet.actor.loot form section.sidebar .bulk {
  12114. line-height: 1.5em;
  12115. margin-right: 8px;
  12116. }
  12117. .sheet.actor.loot form section.sidebar > .editor,
  12118. .sheet.actor.loot form section.sidebar .description {
  12119. flex-basis: auto;
  12120. min-height: 40px;
  12121. flex: 1;
  12122. }
  12123. .sheet.actor.loot form section.sidebar > .editor > .tox-tinymce .tox-edit-area {
  12124. min-height: 120px;
  12125. }
  12126. .sheet.actor.loot form section.sidebar .description,
  12127. .sheet.actor.loot form section.sidebar .editor-content {
  12128. padding: 0.25rem;
  12129. overflow: hidden scroll;
  12130. }
  12131. .sheet.actor.loot form .sheet-header {
  12132. display: flex;
  12133. flex-direction: row;
  12134. align-items: center;
  12135. gap: 0.2rem;
  12136. padding-top: 0.25rem;
  12137. border-bottom: 1px solid var(--color-text-light-7);
  12138. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  12139. }
  12140. .sheet.actor.loot form .sheet-header h1 {
  12141. margin: 0;
  12142. border: none;
  12143. flex: 1;
  12144. padding-left: 0.5rem;
  12145. }
  12146. .sheet.actor.loot form .sheet-header h1 > input {
  12147. height: 40px;
  12148. width: 100%;
  12149. margin: 2px;
  12150. border: none;
  12151. }
  12152. .sheet.actor.loot form .sheet-header h1,
  12153. .sheet.actor.loot form .sheet-header input {
  12154. font-family: var(--serif-condensed);
  12155. font-size: var(--font-size-36);
  12156. font-weight: 700;
  12157. }
  12158. .sheet.actor.loot form .sheet-header .sheet-type i {
  12159. padding: 0 0.25rem 0 0.5rem;
  12160. font-size: var(--font-size-16);
  12161. }
  12162. .sheet.actor.loot form .sheet-header .tags {
  12163. align-items: center;
  12164. display: flex;
  12165. flex: 0 0 auto;
  12166. margin-left: auto;
  12167. margin-right: 0.5em;
  12168. }
  12169. .sheet.actor.loot form .sheet-header .tags .tag {
  12170. color: var(--text-light);
  12171. font-size: var(--font-size-16);
  12172. height: unset;
  12173. padding: 0.1em 0.4em;
  12174. }
  12175. .sheet.actor.loot form .sheet-header .tags .tag option {
  12176. background-color: #5e0000;
  12177. color: inherit;
  12178. font-size: inherit;
  12179. }
  12180. .sheet.actor.loot form .sheet-header .currency {
  12181. margin-bottom: 8px;
  12182. }
  12183. .sheet.actor.loot form .sheet-body {
  12184. padding: 0.5rem;
  12185. }
  12186. .sheet.actor.loot form section.content {
  12187. display: flex;
  12188. flex-direction: column;
  12189. flex: 1;
  12190. height: 100%;
  12191. }
  12192. .sheet.actor.loot form section.content .inventory {
  12193. overflow: hidden;
  12194. }
  12195. .sheet.actor.loot form section.content .inventory .inventory-list {
  12196. --border-color: var(--secondary-background);
  12197. margin-bottom: 2px;
  12198. }
  12199. .sheet.actor.loot form section.content .inventory .inventory-list .item-controls {
  12200. flex: 0 0 4rem;
  12201. }
  12202. .sheet.actor.loot form section.content .inventory .inventory-list .item-controls a.item-toggle-equip {
  12203. display: none;
  12204. }
  12205. .sheet.actor.loot form section.content .inventory .inventory-header {
  12206. background: var(--primary-background);
  12207. color: var(--text-light);
  12208. }
  12209. .loot-actor-popup {
  12210. flex: unset;
  12211. }
  12212. .loot-actor-popup .confirm-button {
  12213. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  12214. width: calc(100% - 6px);
  12215. height: 2.5em;
  12216. margin-top: 1em;
  12217. background-color: var(--tertiary);
  12218. }
  12219. .loot-actor-popup .checkboxes label {
  12220. display: block;
  12221. padding-right: 10px;
  12222. padding-left: 22px;
  12223. text-indent: -22px;
  12224. }
  12225. .loot-actor-popup .checkboxes input {
  12226. vertical-align: middle;
  12227. }
  12228. .loot-actor-popup .checkboxes label span {
  12229. vertical-align: middle;
  12230. }
  12231. .sheet.party {
  12232. --color-border: rgba(0, 0, 0, 0.28);
  12233. /** White background navigation with little decorations on the left and right */
  12234. }
  12235. .sheet.party form {
  12236. display: flex;
  12237. flex-direction: column;
  12238. height: 100%;
  12239. background: url("../assets/sheet/background.webp");
  12240. background-repeat: no-repeat;
  12241. background-size: cover;
  12242. background-attachment: local;
  12243. }
  12244. .sheet.party form > header {
  12245. background: url("../assets/sheet/header-bw.webp"), url("../assets/sheet/background.webp");
  12246. background-repeat: repeat-x, no-repeat;
  12247. background-size: cover;
  12248. background-color: #2f9d50;
  12249. background-blend-mode: multiply;
  12250. color: var(--text-light);
  12251. width: 100%;
  12252. font-family: var(--sans-serif);
  12253. text-transform: uppercase;
  12254. font-weight: 600;
  12255. display: flex;
  12256. justify-content: space-between;
  12257. align-items: center;
  12258. padding: 0 0.75rem;
  12259. gap: 8px;
  12260. box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  12261. }
  12262. .sheet.party form > header .frame-container {
  12263. flex: 0 0 60px;
  12264. padding: 4px;
  12265. margin: 0.75rem 0;
  12266. }
  12267. .sheet.party form > header .frame-container .frame {
  12268. position: relative;
  12269. width: 2.5rem;
  12270. height: 2.5rem;
  12271. }
  12272. .sheet.party form > header .frame-container .player-image {
  12273. object-fit: cover;
  12274. object-position: top;
  12275. border: none;
  12276. border-radius: 0;
  12277. width: 100%;
  12278. cursor: pointer;
  12279. border: none;
  12280. box-shadow: 0 0 0 1px #918c88, 0 0 0 2px #e1d8cf, 0 0 0 3px #a98f39, inset 0 0 8px rgba(0, 0, 0, 0.5), 0 0 8px black;
  12281. }
  12282. .sheet.party form > header input[type=text],
  12283. .sheet.party form > header input[type=number] {
  12284. color: var(--text-light);
  12285. border: none;
  12286. border-bottom: 1px solid transparent;
  12287. }
  12288. .sheet.party form > header input[type=text]:not(:disabled):hover, .sheet.party form > header input[type=text]:focus,
  12289. .sheet.party form > header input[type=number]:not(:disabled):hover,
  12290. .sheet.party form > header input[type=number]:focus {
  12291. border: none;
  12292. border-bottom: 1px solid var(--text-light);
  12293. box-shadow: none;
  12294. }
  12295. .sheet.party form > header .details {
  12296. margin: 4px 0;
  12297. flex: 1;
  12298. }
  12299. .sheet.party form > header .details {
  12300. display: grid;
  12301. grid: "name type" 1fr "name visibility" auto/1fr auto;
  12302. align-items: center;
  12303. gap: 0 0.5rem;
  12304. font-family: var(--serif-condensed);
  12305. font-size: var(--font-size-28);
  12306. font-weight: 700;
  12307. }
  12308. .sheet.party form > header .details .name {
  12309. grid-area: name;
  12310. flex: 1;
  12311. font-size: var(--font-size-32);
  12312. }
  12313. .sheet.party form > header .details .actor-type {
  12314. grid-area: type;
  12315. text-align: end;
  12316. }
  12317. .sheet.party form > header .details .visibility {
  12318. grid-area: visibility;
  12319. font-size: var(--font-size-14);
  12320. opacity: 0.8;
  12321. }
  12322. .sheet.party form > header .details .visibility i {
  12323. font-size: 0.9em;
  12324. margin-right: 0.125rem;
  12325. }
  12326. .sheet.party nav.sheet-navigation {
  12327. display: inline-flex;
  12328. justify-content: center;
  12329. align-items: center;
  12330. height: 20px;
  12331. background: var(--secondary);
  12332. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  12333. transition: all 0.1s ease-out;
  12334. box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
  12335. border-top: 1px solid rgba(255, 255, 255, 0.1);
  12336. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  12337. position: relative;
  12338. }
  12339. .sheet.party nav.sheet-navigation .navigation-title {
  12340. color: var(--text-light);
  12341. margin-right: auto;
  12342. padding-left: 1em;
  12343. white-space: nowrap;
  12344. width: 7em;
  12345. }
  12346. .sheet.party nav.sheet-navigation > a {
  12347. display: flex;
  12348. justify-content: center;
  12349. align-items: center;
  12350. margin: 0 6px;
  12351. font-size: var(--font-size-12);
  12352. }
  12353. .sheet.party nav.sheet-navigation .item {
  12354. height: 24px;
  12355. width: 24px;
  12356. border-radius: 50%;
  12357. z-index: 1;
  12358. transition: all 0.1s ease-out;
  12359. color: var(--tertiary);
  12360. fill: var(--tertiary);
  12361. background-image: url("../assets/sheet/nav-item-inactive.webp");
  12362. background-size: contain;
  12363. /* prettier-ignore */
  12364. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25);
  12365. }
  12366. .sheet.party nav.sheet-navigation .item.active {
  12367. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25), 0 0 8px var(--tertiary);
  12368. }
  12369. .sheet.party nav.sheet-navigation .item:last-child {
  12370. margin-right: 10px;
  12371. }
  12372. .sheet.party nav.sheet-navigation .item:hover, .sheet.party nav.sheet-navigation .item.active {
  12373. z-index: 2;
  12374. transform: scale(1.2);
  12375. color: var(--text-light);
  12376. fill: var(--text-light);
  12377. background-image: url("../assets/sheet/nav-item.webp");
  12378. }
  12379. .sheet.party nav.sheet-navigation .item .fas {
  12380. padding-bottom: 0;
  12381. }
  12382. .sheet.party nav.sheet-navigation .item:hover .pfs-icon {
  12383. filter: drop-shadow(0 0 8px var(--color-shadow-primary));
  12384. }
  12385. .sheet.party nav.sheet-navigation .item .action-icon {
  12386. font-family: "Pathfinder2eActions", sans-serif;
  12387. font-size: 1rem;
  12388. }
  12389. .sheet.party nav.sub-nav {
  12390. margin: 0;
  12391. padding: 0;
  12392. display: flex;
  12393. flex-wrap: nowrap;
  12394. justify-content: center;
  12395. align-items: center;
  12396. list-style: none;
  12397. background-color: var(--bg);
  12398. box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  12399. width: 100%;
  12400. flex: 0 0 2.5rem;
  12401. }
  12402. .sheet.party nav.sub-nav::before, .sheet.party nav.sub-nav::after {
  12403. content: "";
  12404. width: 37px;
  12405. height: 16px;
  12406. background: url("../assets/sheet/sub-nav-decoration.webp");
  12407. margin: 0 16px;
  12408. }
  12409. .sheet.party nav.sub-nav::after {
  12410. transform: scaleX(-100%);
  12411. }
  12412. .sheet.party nav.sub-nav a,
  12413. .sheet.party nav.sub-nav .tab {
  12414. border-left: 1px solid rgba(255, 255, 255, 0.3);
  12415. border-right: 1px solid rgba(0, 0, 0, 0.2);
  12416. color: var(--alt);
  12417. cursor: pointer;
  12418. display: block;
  12419. font: 400 var(--font-size-16) var(--serif);
  12420. flex: 1;
  12421. margin: 0 0.25rem;
  12422. max-width: 30%;
  12423. text-align: center;
  12424. text-decoration: none;
  12425. transition: all 0.1s ease-out;
  12426. }
  12427. .sheet.party nav.sub-nav a.active,
  12428. .sheet.party nav.sub-nav .tab.active {
  12429. color: var(--primary);
  12430. font-weight: 600;
  12431. }
  12432. .sheet.party nav.sub-nav a:first-child,
  12433. .sheet.party nav.sub-nav .tab:first-child {
  12434. border-left: none;
  12435. }
  12436. .sheet.party nav.sub-nav a:last-child,
  12437. .sheet.party nav.sub-nav .tab:last-child {
  12438. border-right: none;
  12439. }
  12440. .sheet.party nav.sub-nav a:hover,
  12441. .sheet.party nav.sub-nav .tab:hover {
  12442. text-shadow: 0 0 3px rgba(255, 255, 255, 0.5);
  12443. }
  12444. .sheet.party .tab nav.sub-nav {
  12445. padding-right: 20px;
  12446. }
  12447. .sheet.party .actor-link {
  12448. cursor: pointer;
  12449. }
  12450. .sheet.party .readonly {
  12451. pointer-events: none;
  12452. }
  12453. .sheet.party .readonly a,
  12454. .sheet.party .readonly button {
  12455. pointer-events: none;
  12456. }
  12457. .sheet.party .container {
  12458. height: 100%;
  12459. overflow: hidden;
  12460. }
  12461. .sheet.party .content {
  12462. overflow: hidden scroll;
  12463. flex: 1;
  12464. }
  12465. .sheet.party .tab.active {
  12466. display: flex;
  12467. height: 100%;
  12468. }
  12469. .sheet.party .item-list.directory-list {
  12470. gap: 0.2em;
  12471. margin: 0;
  12472. padding: 0;
  12473. display: flex;
  12474. flex-direction: column;
  12475. width: 100%;
  12476. }
  12477. .sheet.party .item-list.directory-list .item {
  12478. display: flex;
  12479. flex-wrap: wrap;
  12480. align-items: center;
  12481. justify-content: space-between;
  12482. padding: 2px 4px 2px 12px;
  12483. width: 100%;
  12484. }
  12485. .sheet.party .item-list.directory-list .item p:empty {
  12486. display: none;
  12487. }
  12488. .sheet.party .item-list.directory-list .item .item-name {
  12489. display: flex;
  12490. align-items: center;
  12491. flex: 1;
  12492. }
  12493. .sheet.party .item-list.directory-list .item .item-name h4 {
  12494. cursor: pointer;
  12495. margin: 0;
  12496. }
  12497. .sheet.party .item-list.directory-list .item .item-name .item-image {
  12498. margin-right: 8px;
  12499. }
  12500. .sheet.party .item-list.directory-list .item .item-controls {
  12501. display: flex;
  12502. flex: 0;
  12503. font-size: var(--font-size-12);
  12504. gap: 1px;
  12505. white-space: nowrap;
  12506. }
  12507. .sheet.party .item-list.directory-list .item .item-controls a.info-only:hover {
  12508. cursor: default;
  12509. text-shadow: none;
  12510. }
  12511. .sheet.party .item-list.directory-list .item .item-controls a + a {
  12512. margin-left: 4px;
  12513. }
  12514. .sheet.party .item-list.directory-list .item .item-summary {
  12515. flex-basis: 100%;
  12516. }
  12517. .sheet.party .item-list.directory-list .item.unidentified {
  12518. border-radius: 1px;
  12519. outline: 1px dotted rgba(75, 74, 68, 0.5);
  12520. background: var(--visibility-gm-bg);
  12521. }
  12522. .sheet.party .item-list.directory-list .item .button-group {
  12523. display: flex;
  12524. justify-content: flex-end;
  12525. align-items: center;
  12526. flex-wrap: nowrap;
  12527. width: 50%;
  12528. flex: 0;
  12529. }
  12530. .sheet.party .item-list.directory-list .item .button-group button {
  12531. margin: 0;
  12532. border: none;
  12533. cursor: pointer;
  12534. font-family: var(--sans-serif);
  12535. font-size: var(--font-size-10);
  12536. text-transform: uppercase;
  12537. letter-spacing: 0.05em;
  12538. text-rendering: optimizeLegibility;
  12539. padding: 5px;
  12540. color: var(--text-light);
  12541. width: 70px;
  12542. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  12543. background: var(--secondary);
  12544. border-radius: 2px;
  12545. flex: 0;
  12546. white-space: nowrap;
  12547. margin-left: 4px;
  12548. flex: 0;
  12549. }
  12550. .sheet.party .item-list.directory-list .item .button-group button:hover {
  12551. box-shadow: none;
  12552. text-shadow: 0 0 2px white;
  12553. }
  12554. .sheet.party .item-list.directory-list .item {
  12555. margin: 2px 0;
  12556. border: solid transparent;
  12557. border-width: 0 0 1px;
  12558. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  12559. }
  12560. .sheet.party .item-list.directory-list .item .item-summary {
  12561. margin-top: 8px;
  12562. }
  12563. .sheet.party header.content-header {
  12564. align-items: center;
  12565. background-color: var(--sub);
  12566. color: var(--text-light);
  12567. display: flex;
  12568. font-weight: 600;
  12569. margin-bottom: 0.5rem;
  12570. padding: 0 0.5rem;
  12571. line-height: 2.375rem;
  12572. }
  12573. .sheet.party header.content-header .buttons {
  12574. align-items: center;
  12575. display: flex;
  12576. margin-left: auto;
  12577. }
  12578. .sheet.party header.content-header button {
  12579. background-color: var(--tertiary);
  12580. border: 1px solid var(--alt-dark);
  12581. border-radius: 0;
  12582. color: var(--alt-dark);
  12583. min-width: 2.375rem;
  12584. height: 1.875rem;
  12585. margin: 0;
  12586. }
  12587. .sheet.party header.content-header button + button {
  12588. margin-left: -1px;
  12589. }
  12590. .sheet.party header.content-header button:hover {
  12591. z-index: 1;
  12592. }
  12593. .sheet.party .sidebar {
  12594. overflow: hidden scroll;
  12595. border-right: 1px solid #888;
  12596. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  12597. display: flex;
  12598. flex-direction: column;
  12599. gap: 8px;
  12600. height: 100%;
  12601. padding: 0.5rem;
  12602. width: 13.5rem;
  12603. }
  12604. .sheet.party .sidebar .box-list {
  12605. margin: 0;
  12606. padding: 0;
  12607. display: flex;
  12608. color: var(--alt-dark);
  12609. flex-direction: column;
  12610. font-family: var(--sans-serif);
  12611. gap: 0.5rem;
  12612. list-style-type: none;
  12613. }
  12614. .sheet.party .sidebar .box {
  12615. border: 1px solid var(--color-border);
  12616. box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.18);
  12617. font-family: var(--sans-serif);
  12618. border-radius: 3px;
  12619. font-size: var(--font-size-12);
  12620. }
  12621. .sheet.party .sidebar .box .summary-data > div {
  12622. align-items: center;
  12623. display: flex;
  12624. margin: 0.5rem;
  12625. }
  12626. .sheet.party .sidebar .box .summary-data > div label {
  12627. flex: 1;
  12628. font-weight: 600;
  12629. }
  12630. .sheet.party .sidebar .box .actor-link img {
  12631. border: none;
  12632. width: 2rem;
  12633. height: 2rem;
  12634. object-fit: contain;
  12635. }
  12636. .sheet.party .sidebar .box .name {
  12637. font-weight: 700;
  12638. overflow: hidden;
  12639. text-overflow: ellipsis;
  12640. white-space: nowrap;
  12641. }
  12642. .sheet.party .sidebar .box header,
  12643. .sheet.party .sidebar .box footer {
  12644. position: relative;
  12645. margin: -1px;
  12646. padding: 0 0.25rem;
  12647. }
  12648. .sheet.party .sidebar .box header {
  12649. background-color: var(--sub);
  12650. border-radius: 3px 3px 0 0;
  12651. color: var(--text-light);
  12652. font-weight: 700;
  12653. height: 1.125rem;
  12654. line-height: 1.125rem;
  12655. }
  12656. .sheet.party .sidebar .box footer {
  12657. background-color: var(--bg-dark);
  12658. border-radius: 0 0 3px 3px;
  12659. border: 1px solid var(--color-border);
  12660. border-top: none;
  12661. color: var(--sub);
  12662. font-weight: 500;
  12663. height: 1rem;
  12664. line-height: 1rem;
  12665. }
  12666. .sheet.party .tag-light {
  12667. --tag-color: var(--color-proficiency-untrained);
  12668. align-items: center;
  12669. border-radius: 2px;
  12670. border: 1px solid var(--tag-color);
  12671. color: var(--tag-color);
  12672. display: flex;
  12673. font: 700 var(--font-size-13)/1.25rem var(--sans-serif);
  12674. font-variant: all-small-caps;
  12675. gap: 0.125rem;
  12676. height: 1.25rem;
  12677. margin: 0;
  12678. padding: 0 0.25rem;
  12679. white-space: nowrap;
  12680. width: auto;
  12681. }
  12682. .sheet.party .tag-light .mod {
  12683. font-weight: 500;
  12684. }
  12685. .sheet.party [data-tab=inventory] .inventory-members .box .content {
  12686. align-items: center;
  12687. display: flex;
  12688. padding: 0.5rem;
  12689. overflow: hidden;
  12690. }
  12691. .sheet.party [data-tab=inventory] .inventory-members .box .content img {
  12692. grid-area: image;
  12693. margin-right: 0.4rem;
  12694. }
  12695. .sheet.party [data-tab=inventory] .inventory-members .box .content .sub-data {
  12696. display: flex;
  12697. flex-direction: column;
  12698. gap: 0.125rem;
  12699. }
  12700. .sheet.party [data-tab=inventory] .inventory-members .box footer {
  12701. align-items: center;
  12702. display: flex;
  12703. gap: 0.25rem;
  12704. }
  12705. .sheet.party [data-tab=inventory] .inventory-members .box footer i {
  12706. font-size: 0.8em;
  12707. }
  12708. .sheet.party [data-tab=inventory] .inventory-members .box .inventory-data {
  12709. display: flex;
  12710. gap: 0.25rem;
  12711. padding: 2px 3px;
  12712. font-size: var(--font-size-12);
  12713. }
  12714. .sheet.party [data-tab=inventory] .inventory {
  12715. flex: 1;
  12716. padding: 0.5rem 4px 0.5em 0.5em;
  12717. display: flex;
  12718. flex-direction: column;
  12719. height: 100%;
  12720. }
  12721. .sheet.party [data-tab=inventory] .inventory .item-controls {
  12722. max-width: 3.5rem;
  12723. }
  12724. .sheet.party [data-tab=overview] .content {
  12725. padding-top: 0.5rem;
  12726. padding-bottom: 0.25rem;
  12727. }
  12728. .sheet.party [data-tab=overview] .summary {
  12729. border-image-repeat: repeat;
  12730. border-image-slice: 11;
  12731. border-image-source: url("../assets/sheet/frame-elegant.svg");
  12732. border-image-width: 14px;
  12733. border-style: double;
  12734. display: flex;
  12735. flex-direction: column;
  12736. padding: 0.375rem 0.5rem;
  12737. margin: 0.25rem 1rem 0.25rem 12px;
  12738. }
  12739. .sheet.party [data-tab=overview] .summary nav {
  12740. color: var(--alt-dark);
  12741. display: flex;
  12742. gap: 0.25rem;
  12743. line-height: 1.25em;
  12744. margin-bottom: 0.375rem;
  12745. align-items: center;
  12746. }
  12747. .sheet.party [data-tab=overview] .summary nav button {
  12748. border: none;
  12749. font-size: var(--font-size-14);
  12750. font-weight: 500;
  12751. padding: 0 0.5rem;
  12752. white-space: nowrap;
  12753. width: auto;
  12754. }
  12755. .sheet.party [data-tab=overview] .summary nav button.active {
  12756. background: var(--secondary);
  12757. color: var(--text-light);
  12758. }
  12759. .sheet.party [data-tab=overview] .summary nav label {
  12760. margin-left: auto;
  12761. margin-right: 0.25rem;
  12762. }
  12763. .sheet.party [data-tab=overview] .summary .tags,
  12764. .sheet.party [data-tab=overview] .summary .skills {
  12765. margin: 0;
  12766. }
  12767. .sheet.party [data-tab=overview] .summary [hidden] {
  12768. display: none;
  12769. }
  12770. .sheet.party [data-tab=overview] .skills {
  12771. display: flex;
  12772. flex-wrap: wrap;
  12773. gap: 0.25rem;
  12774. }
  12775. .sheet.party [data-tab=overview] .skills .tag-light[data-rank="1"] {
  12776. --tag-color: var(--color-proficiency-trained);
  12777. }
  12778. .sheet.party [data-tab=overview] .skills .tag-light[data-rank="2"] {
  12779. --tag-color: var(--color-proficiency-expert);
  12780. }
  12781. .sheet.party [data-tab=overview] .skills .tag-light[data-rank="3"] {
  12782. --tag-color: var(--color-proficiency-master);
  12783. }
  12784. .sheet.party [data-tab=overview] .skills .tag-light[data-rank="4"] {
  12785. --tag-color: var(--color-proficiency-legendary);
  12786. }
  12787. .sheet.party [data-tab=overview] .skills .perception {
  12788. color: var(--text-light);
  12789. background-color: var(--tag-color);
  12790. }
  12791. .sheet.party [data-tab=overview] .member {
  12792. display: flex;
  12793. flex-direction: row;
  12794. font-family: var(--sans-serif);
  12795. padding: 0.5rem 1rem;
  12796. position: relative;
  12797. height: 7.375rem;
  12798. }
  12799. .sheet.party [data-tab=overview] .member:not(:last-child):after {
  12800. content: "";
  12801. background-color: rgba(68, 55, 48, 0.1);
  12802. width: 100%;
  12803. height: 1px;
  12804. position: absolute;
  12805. bottom: 0;
  12806. }
  12807. .sheet.party [data-tab=overview] .member > .portrait {
  12808. margin-right: 8px;
  12809. min-width: 5.5rem;
  12810. position: relative;
  12811. }
  12812. .sheet.party [data-tab=overview] .member > .portrait img {
  12813. position: absolute;
  12814. border: none;
  12815. height: 100%;
  12816. width: 100%;
  12817. object-fit: contain;
  12818. }
  12819. .sheet.party [data-tab=overview] .member > .portrait .health-bar {
  12820. background-color: var(--sub);
  12821. bottom: 0;
  12822. color: var(--text-light);
  12823. font-size: var(--font-size-12);
  12824. font-weight: 500;
  12825. height: 1.25rem;
  12826. line-height: 1.25rem;
  12827. position: absolute;
  12828. width: 100%;
  12829. }
  12830. .sheet.party [data-tab=overview] .member > .portrait .health-bar .bar {
  12831. position: absolute;
  12832. top: 0;
  12833. left: 0;
  12834. bottom: 0;
  12835. background-color: var(--primary);
  12836. box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.2);
  12837. }
  12838. .sheet.party [data-tab=overview] .member > .portrait .health-bar .temp {
  12839. background-color: var(--secondary);
  12840. top: -0.25rem;
  12841. height: 0.25rem;
  12842. }
  12843. .sheet.party [data-tab=overview] .member > .portrait .health-bar span {
  12844. padding-left: 0.25rem;
  12845. position: relative;
  12846. }
  12847. .sheet.party [data-tab=overview] .member > .data {
  12848. width: 100%;
  12849. }
  12850. .sheet.party [data-tab=overview] .member > .data header {
  12851. border-left: 1px solid #c9bfa9;
  12852. display: grid;
  12853. grid: "name hero-points" "blurb hero-points"/auto max-content;
  12854. margin-bottom: 0.25rem;
  12855. padding-left: 0.5rem;
  12856. }
  12857. .sheet.party [data-tab=overview] .member > .data header .name {
  12858. align-items: center;
  12859. display: flex;
  12860. font: 600 var(--font-size-18)/1 var(--serif);
  12861. grid-area: name;
  12862. }
  12863. .sheet.party [data-tab=overview] .member > .data header .name i {
  12864. font-size: 0.8em;
  12865. margin-left: 0.125rem;
  12866. }
  12867. .sheet.party [data-tab=overview] .member > .data header .blurb {
  12868. align-items: center;
  12869. color: var(--alt-dark);
  12870. display: flex;
  12871. font: 500 var(--font-size-14)/var(--font-size-14) var(--sans-serif);
  12872. font-variant: all-small-caps;
  12873. gap: 0.25rem;
  12874. grid-area: blurb;
  12875. position: relative;
  12876. }
  12877. .sheet.party [data-tab=overview] .member > .data header .blurb hr.vr {
  12878. border: 1px solid var(--color-border);
  12879. height: 0.5rem;
  12880. position: relative;
  12881. top: 1px;
  12882. }
  12883. .sheet.party [data-tab=overview] .member > .data header .hero-points {
  12884. align-items: end;
  12885. display: flex;
  12886. gap: 3px;
  12887. grid-area: hero-points;
  12888. width: fit-content;
  12889. }
  12890. .sheet.party [data-tab=overview] .member > .data header .hero-points > * {
  12891. width: 1.5rem;
  12892. height: 1.5rem;
  12893. }
  12894. .sheet.party [data-tab=overview] .member > .data header .hero-points .empty {
  12895. border: 2px dashed rgba(0, 0, 0, 0.5);
  12896. border-radius: 50%;
  12897. }
  12898. .sheet.party [data-tab=overview] .member > .data header .hero-points img {
  12899. border: none;
  12900. }
  12901. .sheet.party [data-tab=overview] .member > .data .main-stats {
  12902. display: flex;
  12903. gap: 0.5rem;
  12904. margin: 0.125rem 0 0.25rem 0;
  12905. }
  12906. .sheet.party [data-tab=overview] .member > .data .main-stats > section {
  12907. border: 1px solid var(--color-border);
  12908. border-radius: 2px;
  12909. height: 2.625rem;
  12910. display: flex;
  12911. align-items: center;
  12912. justify-content: space-between;
  12913. flex: 1 1 0;
  12914. }
  12915. .sheet.party [data-tab=overview] .member > .data .main-stats .score {
  12916. display: flex;
  12917. flex-direction: column;
  12918. align-items: center;
  12919. justify-content: center;
  12920. font-size: var(--font-size-18);
  12921. }
  12922. .sheet.party [data-tab=overview] .member > .data .main-stats .score label {
  12923. font-size: var(--font-size-10);
  12924. font-weight: 500;
  12925. }
  12926. .sheet.party [data-tab=overview] .member > .data .main-stats .ac {
  12927. border: none;
  12928. position: relative;
  12929. flex: 0 0 2.25rem;
  12930. }
  12931. .sheet.party [data-tab=overview] .member > .data .main-stats .ac::before {
  12932. content: " ";
  12933. position: absolute;
  12934. inset: 0;
  12935. background: url("../assets/sheet/shield-clear.svg") no-repeat center center;
  12936. background-size: contain;
  12937. }
  12938. .sheet.party [data-tab=overview] .member > .data .main-stats .ac .value {
  12939. color: var(--color-proficiency-trained);
  12940. font-weight: 700;
  12941. }
  12942. .sheet.party [data-tab=overview] .member > .data .main-stats .saving-throws {
  12943. flex: 0 0 9.5rem;
  12944. }
  12945. .sheet.party [data-tab=overview] .member > .data .main-stats .saving-throws .score {
  12946. flex: 1;
  12947. font-weight: 500;
  12948. }
  12949. .sheet.party [data-tab=overview] .member > .data .main-stats .senses {
  12950. align-items: center;
  12951. flex: 1.4;
  12952. overflow: hidden;
  12953. }
  12954. .sheet.party [data-tab=overview] .member > .data .main-stats .senses .value {
  12955. align-items: center;
  12956. display: flex;
  12957. font-size: var(--font-size-12);
  12958. gap: 0.125rem;
  12959. overflow-x: auto;
  12960. max-width: 100%;
  12961. padding: 0 0.5rem;
  12962. padding-bottom: 7px;
  12963. margin-bottom: -7px;
  12964. }
  12965. .sheet.party [data-tab=overview] .member > .data .main-stats .senses .value [data-acuity=imprecise],
  12966. .sheet.party [data-tab=overview] .member > .data .main-stats .senses .value [data-acuity=vague] {
  12967. border-style: dashed;
  12968. }
  12969. .sheet.party [data-tab=exploration] .exploration-members .actor-link {
  12970. display: flex;
  12971. align-items: center;
  12972. gap: 0.25rem;
  12973. }
  12974. .sheet.party [data-tab=exploration] .exploration-members .member .sub-data {
  12975. display: flex;
  12976. flex-direction: row;
  12977. background-color: rgba(68, 55, 48, 0.1);
  12978. font-size: var(--font-size-11);
  12979. font-weight: 500;
  12980. }
  12981. .sheet.party [data-tab=exploration] .exploration-members .member .sub-data > span {
  12982. flex: 1;
  12983. text-align: center;
  12984. padding: 0.2rem;
  12985. }
  12986. .sheet.party [data-tab=exploration] .exploration-members .member .sub-data > span:not(:last-child) {
  12987. border-right: 1px solid rgba(68, 55, 48, 0.1);
  12988. }
  12989. .sheet.party [data-tab=exploration] .exploration-members .member footer.health-bar {
  12990. background-color: var(--sub);
  12991. color: var(--text-light);
  12992. }
  12993. .sheet.party [data-tab=exploration] .exploration-members .member footer.health-bar .bar {
  12994. position: absolute;
  12995. top: 0;
  12996. left: 0;
  12997. bottom: 0;
  12998. background-color: var(--primary);
  12999. border-radius: 0 0 3px 3px;
  13000. box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.2);
  13001. }
  13002. .sheet.party [data-tab=exploration] .exploration-members .member footer.health-bar span {
  13003. position: relative;
  13004. }
  13005. .sheet.party [data-tab=exploration] .content {
  13006. padding: 0.5rem;
  13007. }
  13008. .sheet.party [data-tab=exploration] .activities {
  13009. display: flex;
  13010. flex-direction: column;
  13011. gap: 0.5rem;
  13012. }
  13013. .sheet.party [data-tab=exploration] .activities .member-activity {
  13014. border-image-repeat: repeat;
  13015. border-image-slice: 11;
  13016. border-image-source: url("../assets/sheet/frame-elegant.svg");
  13017. border-image-width: 14px;
  13018. border-style: double;
  13019. display: flex;
  13020. align-items: center;
  13021. }
  13022. .sheet.party [data-tab=exploration] .activities .member-activity img {
  13023. object-fit: contain;
  13024. border: none;
  13025. }
  13026. .sheet.party [data-tab=exploration] .activities .member-activity .actor-image {
  13027. flex: 0 0 auto;
  13028. }
  13029. .sheet.party [data-tab=exploration] .activities .member-activity .actor-image img {
  13030. width: 4rem;
  13031. height: 4rem;
  13032. margin: 0.375rem;
  13033. display: flex;
  13034. align-items: center;
  13035. justify-content: center;
  13036. }
  13037. .sheet.party [data-tab=exploration] .activities .member-activity .actor-image img i {
  13038. color: var(--text-dark);
  13039. font-size: var(--font-size-30);
  13040. }
  13041. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries {
  13042. display: flex;
  13043. flex-direction: column;
  13044. gap: 0.125rem;
  13045. overflow: hidden;
  13046. }
  13047. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity {
  13048. align-items: center;
  13049. display: flex;
  13050. gap: 0 0.5rem;
  13051. margin-left: 0.25rem;
  13052. white-space: nowrap;
  13053. }
  13054. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity .name {
  13055. font-weight: 500;
  13056. }
  13057. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity .tags {
  13058. flex-wrap: nowrap;
  13059. overflow: hidden;
  13060. }
  13061. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity.single {
  13062. align-items: start;
  13063. flex-direction: column;
  13064. }
  13065. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity.single .name {
  13066. font-size: var(--font-size-16);
  13067. }
  13068. .sheet.party [data-tab=exploration] .activities .member-activity .empty {
  13069. align-items: center;
  13070. cursor: pointer;
  13071. display: flex;
  13072. font-family: var(--serif);
  13073. gap: 0.5rem;
  13074. }
  13075. .sheet.party [data-tab=exploration] .activities .member-activity .empty div {
  13076. margin: 0;
  13077. }
  13078. .sheet.party [data-tab=exploration] .activities .member-activity .empty .icon {
  13079. border: 1px dashed var(--color-border);
  13080. border-radius: 50%;
  13081. display: flex;
  13082. align-items: center;
  13083. justify-content: center;
  13084. font-size: var(--font-size-14);
  13085. height: 2.125rem;
  13086. width: 2.125rem;
  13087. }
  13088. .sheet.party [data-tab=exploration] .activities .member-activity .empty .name {
  13089. color: var(--primary-dark);
  13090. font-size: var(--font-size-16);
  13091. line-height: 1em;
  13092. }
  13093. .sheet.party [data-tab=exploration] .activities .member-activity .empty .hint {
  13094. color: var(--alt-dark);
  13095. line-height: 1em;
  13096. }
  13097. .sheet.party [data-tab=orphaned] .item-list {
  13098. margin: 16px;
  13099. }
  13100. .sheet.kingdom {
  13101. --paper-bg: rgba(221, 216, 200, 0.4);
  13102. --drop-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  13103. --gold: #ffd700;
  13104. --color-divider: rgba(68, 55, 48, 0.2);
  13105. /** White background navigation with little decorations on the left and right */
  13106. }
  13107. .sheet.kingdom form {
  13108. display: flex;
  13109. flex-direction: column;
  13110. height: 100%;
  13111. background: url("../assets/sheet/background.webp");
  13112. background-repeat: no-repeat;
  13113. background-size: cover;
  13114. background-attachment: local;
  13115. }
  13116. .sheet.kingdom form > header {
  13117. background: url("../assets/sheet/header-bw.webp"), url("../assets/sheet/background.webp");
  13118. background-repeat: repeat-x, no-repeat;
  13119. background-size: cover;
  13120. background-color: #66bc1a;
  13121. background-blend-mode: multiply;
  13122. color: var(--text-light);
  13123. width: 100%;
  13124. font-family: var(--sans-serif);
  13125. font-weight: 600;
  13126. display: flex;
  13127. justify-content: space-between;
  13128. align-items: center;
  13129. padding: 0 0.75rem;
  13130. gap: 0.75rem;
  13131. box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  13132. }
  13133. .sheet.kingdom form > header .frame-container {
  13134. padding: 4px;
  13135. margin: 0.75rem 0;
  13136. }
  13137. .sheet.kingdom form > header .frame-container .frame {
  13138. position: relative;
  13139. width: 3.25rem;
  13140. height: 3.25rem;
  13141. }
  13142. .sheet.kingdom form > header .frame-container .player-image {
  13143. object-fit: cover;
  13144. object-position: top;
  13145. border: none;
  13146. border-radius: 0;
  13147. width: 3.25rem;
  13148. height: 3.25rem;
  13149. cursor: pointer;
  13150. border: none;
  13151. box-shadow: 0 0 0 1px #918c88, 0 0 0 2px #e1d8cf, 0 0 0 3px #a98f39, inset 0 0 8px rgba(0, 0, 0, 0.5), 0 0 8px black;
  13152. }
  13153. .sheet.kingdom form > header .details {
  13154. display: grid;
  13155. grid-template: "title title title title level" auto "capital size rp fame level" auto/1fr auto auto auto auto;
  13156. align-items: center;
  13157. gap: 0 4px;
  13158. font-size: var(--font-size-22);
  13159. font-family: var(--serif-condensed);
  13160. font-weight: 700;
  13161. margin: 4px 0;
  13162. flex: 1;
  13163. }
  13164. .sheet.kingdom form > header .details input[type=text],
  13165. .sheet.kingdom form > header .details input[type=number] {
  13166. color: var(--text-light);
  13167. border: none;
  13168. border-bottom: 1px solid transparent;
  13169. padding: 0;
  13170. height: unset;
  13171. }
  13172. .sheet.kingdom form > header .details input[type=text]:hover, .sheet.kingdom form > header .details input[type=text]:focus,
  13173. .sheet.kingdom form > header .details input[type=number]:hover,
  13174. .sheet.kingdom form > header .details input[type=number]:focus {
  13175. border: none;
  13176. border-bottom: 1px solid var(--text-light);
  13177. box-shadow: none;
  13178. }
  13179. .sheet.kingdom form > header .details input[type=text]::placeholder,
  13180. .sheet.kingdom form > header .details input[type=number]::placeholder {
  13181. color: #bbb;
  13182. opacity: 0.4;
  13183. }
  13184. .sheet.kingdom form > header .details .title {
  13185. display: flex;
  13186. grid-area: title;
  13187. gap: 1rem;
  13188. font-size: var(--font-size-30);
  13189. }
  13190. .sheet.kingdom form > header .details label {
  13191. align-items: baseline;
  13192. display: flex;
  13193. gap: 0.5rem;
  13194. white-space: nowrap;
  13195. }
  13196. .sheet.kingdom form > header .details label span {
  13197. color: var(--gold);
  13198. font-size: 0.8em;
  13199. text-transform: uppercase;
  13200. }
  13201. .sheet.kingdom form > header .details .capital {
  13202. grid-area: capital;
  13203. }
  13204. .sheet.kingdom form > header .details .size {
  13205. grid-area: size;
  13206. margin-left: 0.5rem;
  13207. }
  13208. .sheet.kingdom form > header .details .size input {
  13209. width: 3ch;
  13210. text-align: center;
  13211. }
  13212. .sheet.kingdom form > header .details .resource-points {
  13213. grid-area: rp;
  13214. margin-left: 1rem;
  13215. }
  13216. .sheet.kingdom form > header .details .resource-points input {
  13217. width: 3ch;
  13218. text-align: center;
  13219. }
  13220. .sheet.kingdom form > header .details .fame {
  13221. align-items: center;
  13222. display: flex;
  13223. grid-area: fame;
  13224. margin-left: 0.25rem;
  13225. }
  13226. .sheet.kingdom form > header .details .fame .pips {
  13227. font-size: var(--font-size-12);
  13228. }
  13229. .sheet.kingdom form > header .details .level {
  13230. grid-area: level;
  13231. }
  13232. .sheet.kingdom form > header section.level {
  13233. display: flex;
  13234. justify-content: flex-start;
  13235. margin-left: 1rem;
  13236. text-transform: uppercase;
  13237. }
  13238. .sheet.kingdom form > header section.level .level {
  13239. position: relative;
  13240. display: flex;
  13241. justify-content: center;
  13242. align-items: center;
  13243. flex-direction: column;
  13244. height: 43px;
  13245. width: 40px;
  13246. background: url("../assets/sheet/level-badge.webp") no-repeat;
  13247. background-size: 40px 43px;
  13248. z-index: 2;
  13249. font-size: 0;
  13250. padding-top: 2px;
  13251. }
  13252. .sheet.kingdom form > header section.level .level label {
  13253. color: var(--sidebar-label);
  13254. font-family: var(--sans-serif);
  13255. font-size: var(--font-size-10);
  13256. text-transform: uppercase;
  13257. letter-spacing: 0.05em;
  13258. text-rendering: optimizeLegibility;
  13259. line-height: 1.5;
  13260. }
  13261. .sheet.kingdom form > header section.level .level input {
  13262. font-family: var(--serif);
  13263. font-size: var(--font-size-22);
  13264. font-weight: 400;
  13265. color: var(--text-light);
  13266. line-height: calc(1em + 1px);
  13267. height: 24px;
  13268. }
  13269. .sheet.kingdom form > header section.level .level label,
  13270. .sheet.kingdom form > header section.level .level input {
  13271. margin-left: 1px;
  13272. text-align: center;
  13273. }
  13274. .sheet.kingdom form > header section.level .exp-data {
  13275. display: flex;
  13276. flex-direction: column;
  13277. justify-content: flex-end;
  13278. position: relative;
  13279. width: 6rem;
  13280. }
  13281. .sheet.kingdom form > header section.level .exp-data .exp-input {
  13282. font-size: var(--font-size-13);
  13283. height: 1.5em;
  13284. margin-bottom: 0.5rem;
  13285. }
  13286. .sheet.kingdom form > header section.level .exp-data .exp-input input {
  13287. color: var(--text-light);
  13288. font-family: var(--sans-serif);
  13289. text-align: right;
  13290. width: 3em;
  13291. }
  13292. .sheet.kingdom form > header section.level .exp-data .exp-input .slash {
  13293. color: var(--sidebar-label);
  13294. }
  13295. .sheet.kingdom form > header section.level .exp-data progress {
  13296. background-color: unset;
  13297. border: 1px solid rgba(255, 255, 255, 0.1);
  13298. border-left: none;
  13299. bottom: 7px;
  13300. box-shadow: 0 0 2px var(--sidebar-label);
  13301. height: 5px;
  13302. left: -9px;
  13303. position: relative;
  13304. width: 100%;
  13305. }
  13306. .sheet.kingdom form > header section.level .exp-data progress::-moz-progress-bar {
  13307. background: var(--sidebar-title);
  13308. }
  13309. .sheet.kingdom form > header section.level .exp-data progress::-webkit-progress-bar {
  13310. background: rgba(0, 0, 0, 0.2);
  13311. }
  13312. .sheet.kingdom form > header section.level .exp-data progress::-webkit-progress-value {
  13313. background: var(--sidebar-title);
  13314. }
  13315. .sheet.kingdom nav.sheet-navigation {
  13316. display: inline-flex;
  13317. justify-content: center;
  13318. align-items: center;
  13319. height: 20px;
  13320. background: var(--secondary);
  13321. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  13322. transition: all 0.1s ease-out;
  13323. box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
  13324. border-top: 1px solid rgba(255, 255, 255, 0.1);
  13325. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  13326. position: relative;
  13327. }
  13328. .sheet.kingdom nav.sheet-navigation .navigation-title {
  13329. color: var(--text-light);
  13330. margin-right: auto;
  13331. padding-left: 1em;
  13332. white-space: nowrap;
  13333. width: 7em;
  13334. }
  13335. .sheet.kingdom nav.sheet-navigation > a {
  13336. display: flex;
  13337. justify-content: center;
  13338. align-items: center;
  13339. margin: 0 6px;
  13340. font-size: var(--font-size-12);
  13341. }
  13342. .sheet.kingdom nav.sheet-navigation .item {
  13343. height: 24px;
  13344. width: 24px;
  13345. border-radius: 50%;
  13346. z-index: 1;
  13347. transition: all 0.1s ease-out;
  13348. color: var(--tertiary);
  13349. fill: var(--tertiary);
  13350. background-image: url("../assets/sheet/nav-item-inactive.webp");
  13351. background-size: contain;
  13352. /* prettier-ignore */
  13353. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25);
  13354. }
  13355. .sheet.kingdom nav.sheet-navigation .item.active {
  13356. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25), 0 0 8px var(--tertiary);
  13357. }
  13358. .sheet.kingdom nav.sheet-navigation .item:last-child {
  13359. margin-right: 10px;
  13360. }
  13361. .sheet.kingdom nav.sheet-navigation .item:hover, .sheet.kingdom nav.sheet-navigation .item.active {
  13362. z-index: 2;
  13363. transform: scale(1.2);
  13364. color: var(--text-light);
  13365. fill: var(--text-light);
  13366. background-image: url("../assets/sheet/nav-item.webp");
  13367. }
  13368. .sheet.kingdom nav.sheet-navigation .item .fas {
  13369. padding-bottom: 0;
  13370. }
  13371. .sheet.kingdom nav.sheet-navigation .item:hover .pfs-icon {
  13372. filter: drop-shadow(0 0 8px var(--color-shadow-primary));
  13373. }
  13374. .sheet.kingdom nav.sheet-navigation .item .action-icon {
  13375. font-family: "Pathfinder2eActions", sans-serif;
  13376. font-size: 1rem;
  13377. }
  13378. .sheet.kingdom nav.sub-nav {
  13379. margin: 0;
  13380. padding: 0;
  13381. display: flex;
  13382. flex-wrap: nowrap;
  13383. justify-content: center;
  13384. align-items: center;
  13385. list-style: none;
  13386. background-color: var(--bg);
  13387. box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  13388. width: 100%;
  13389. flex: 0 0 2.5rem;
  13390. }
  13391. .sheet.kingdom nav.sub-nav::before, .sheet.kingdom nav.sub-nav::after {
  13392. content: "";
  13393. width: 37px;
  13394. height: 16px;
  13395. background: url("../assets/sheet/sub-nav-decoration.webp");
  13396. margin: 0 16px;
  13397. }
  13398. .sheet.kingdom nav.sub-nav::after {
  13399. transform: scaleX(-100%);
  13400. }
  13401. .sheet.kingdom nav.sub-nav a,
  13402. .sheet.kingdom nav.sub-nav .tab {
  13403. border-left: 1px solid rgba(255, 255, 255, 0.3);
  13404. border-right: 1px solid rgba(0, 0, 0, 0.2);
  13405. color: var(--alt);
  13406. cursor: pointer;
  13407. display: block;
  13408. font: 400 var(--font-size-16) var(--serif);
  13409. flex: 1;
  13410. margin: 0 0.25rem;
  13411. max-width: 30%;
  13412. text-align: center;
  13413. text-decoration: none;
  13414. transition: all 0.1s ease-out;
  13415. }
  13416. .sheet.kingdom nav.sub-nav a.active,
  13417. .sheet.kingdom nav.sub-nav .tab.active {
  13418. color: var(--primary);
  13419. font-weight: 600;
  13420. }
  13421. .sheet.kingdom nav.sub-nav a:first-child,
  13422. .sheet.kingdom nav.sub-nav .tab:first-child {
  13423. border-left: none;
  13424. }
  13425. .sheet.kingdom nav.sub-nav a:last-child,
  13426. .sheet.kingdom nav.sub-nav .tab:last-child {
  13427. border-right: none;
  13428. }
  13429. .sheet.kingdom nav.sub-nav a:hover,
  13430. .sheet.kingdom nav.sub-nav .tab:hover {
  13431. text-shadow: 0 0 3px rgba(255, 255, 255, 0.5);
  13432. }
  13433. .sheet.kingdom .tab nav.sub-nav {
  13434. padding-right: 20px;
  13435. }
  13436. .sheet.kingdom .container {
  13437. height: 100%;
  13438. overflow: hidden;
  13439. }
  13440. .sheet.kingdom input.adjusted-higher {
  13441. color: #009988;
  13442. }
  13443. .sheet.kingdom input.adjusted-lower {
  13444. color: #cc3311;
  13445. }
  13446. .sheet.kingdom .content {
  13447. overflow: hidden scroll;
  13448. flex: 1;
  13449. }
  13450. .sheet.kingdom .tab.active {
  13451. display: flex;
  13452. height: 100%;
  13453. }
  13454. .sheet.kingdom [hidden] {
  13455. display: none !important;
  13456. }
  13457. .sheet.kingdom .drag-gap {
  13458. visibility: hidden;
  13459. }
  13460. .sheet.kingdom .sidebar {
  13461. overflow: hidden scroll;
  13462. border-right: 1px solid #888;
  13463. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  13464. display: flex;
  13465. flex-direction: column;
  13466. gap: 8px;
  13467. height: 100%;
  13468. padding: 0.5rem;
  13469. width: 13.5rem;
  13470. }
  13471. .sheet.kingdom .sidebar .box {
  13472. border: 1px solid rgba(0, 0, 0, 0.28);
  13473. filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.18));
  13474. font-family: var(--sans-serif);
  13475. border-radius: 3px;
  13476. font-size: var(--font-size-12);
  13477. }
  13478. .sheet.kingdom .sidebar .box header,
  13479. .sheet.kingdom .sidebar .box footer {
  13480. margin: -1px;
  13481. padding: 0.25rem;
  13482. }
  13483. .sheet.kingdom .sidebar .box header {
  13484. background-color: var(--sub);
  13485. border-radius: 3px 3px 0 0;
  13486. color: var(--text-light);
  13487. font-weight: 700;
  13488. }
  13489. .sheet.kingdom .sidebar .box footer {
  13490. background-color: var(--bg-dark);
  13491. border-radius: 0 0 3px 3px;
  13492. color: var(--sub);
  13493. border: 1px solid rgba(0, 0, 0, 0.28);
  13494. border-top: none;
  13495. }
  13496. .sheet.kingdom .tag-light {
  13497. --tag-color: var(--color-proficiency-untrained);
  13498. border: 1px solid var(--tag-color);
  13499. border-radius: 2px;
  13500. color: var(--tag-color);
  13501. padding: 0 4px 0.1em 4px;
  13502. height: 1.25rem;
  13503. white-space: nowrap;
  13504. font-size: var(--font-size-13);
  13505. font-variant: all-small-caps;
  13506. font-weight: 500;
  13507. display: flex;
  13508. align-items: center;
  13509. }
  13510. .sheet.kingdom .directory-list {
  13511. padding: 0;
  13512. margin: 0;
  13513. }
  13514. .sheet.kingdom .directory-list h4 {
  13515. padding: 0;
  13516. margin: 0;
  13517. }
  13518. .sheet.kingdom .effects .directory-list {
  13519. gap: 0.2em;
  13520. display: flex;
  13521. flex-direction: column;
  13522. width: 100%;
  13523. }
  13524. .sheet.kingdom .effects .directory-list .item {
  13525. display: flex;
  13526. flex-wrap: wrap;
  13527. align-items: center;
  13528. justify-content: space-between;
  13529. padding: 2px 4px 2px 12px;
  13530. width: 100%;
  13531. }
  13532. .sheet.kingdom .effects .directory-list .item p:empty {
  13533. display: none;
  13534. }
  13535. .sheet.kingdom .effects .directory-list .item .item-name {
  13536. display: flex;
  13537. align-items: center;
  13538. flex: 1;
  13539. }
  13540. .sheet.kingdom .effects .directory-list .item .item-name h4 {
  13541. cursor: pointer;
  13542. margin: 0;
  13543. }
  13544. .sheet.kingdom .effects .directory-list .item .item-name .item-image {
  13545. margin-right: 8px;
  13546. }
  13547. .sheet.kingdom .effects .directory-list .item .item-controls {
  13548. display: flex;
  13549. flex: 0;
  13550. font-size: var(--font-size-12);
  13551. gap: 1px;
  13552. white-space: nowrap;
  13553. }
  13554. .sheet.kingdom .effects .directory-list .item .item-controls a.info-only:hover {
  13555. cursor: default;
  13556. text-shadow: none;
  13557. }
  13558. .sheet.kingdom .effects .directory-list .item .item-controls a + a {
  13559. margin-left: 4px;
  13560. }
  13561. .sheet.kingdom .effects .directory-list .item .item-summary {
  13562. flex-basis: 100%;
  13563. }
  13564. .sheet.kingdom .effects .directory-list .item.unidentified {
  13565. border-radius: 1px;
  13566. outline: 1px dotted rgba(75, 74, 68, 0.5);
  13567. background: var(--visibility-gm-bg);
  13568. }
  13569. .sheet.kingdom .effects .directory-list .item .button-group {
  13570. display: flex;
  13571. justify-content: flex-end;
  13572. align-items: center;
  13573. flex-wrap: nowrap;
  13574. width: 50%;
  13575. flex: 0;
  13576. }
  13577. .sheet.kingdom .effects .directory-list .item .button-group button {
  13578. margin: 0;
  13579. border: none;
  13580. cursor: pointer;
  13581. font-family: var(--sans-serif);
  13582. font-size: var(--font-size-10);
  13583. text-transform: uppercase;
  13584. letter-spacing: 0.05em;
  13585. text-rendering: optimizeLegibility;
  13586. padding: 5px;
  13587. color: var(--text-light);
  13588. width: 70px;
  13589. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  13590. background: var(--secondary);
  13591. border-radius: 2px;
  13592. flex: 0;
  13593. white-space: nowrap;
  13594. margin-left: 4px;
  13595. flex: 0;
  13596. }
  13597. .sheet.kingdom .effects .directory-list .item .button-group button:hover {
  13598. box-shadow: none;
  13599. text-shadow: 0 0 2px white;
  13600. }
  13601. .sheet.kingdom .effects .directory-list .item {
  13602. margin: 2px 0;
  13603. border: solid transparent;
  13604. border-width: 0 0 1px;
  13605. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  13606. }
  13607. .sheet.kingdom .effects .directory-list .item .item-summary {
  13608. margin-top: 8px;
  13609. }
  13610. .sheet.kingdom h3.header {
  13611. position: relative;
  13612. margin-top: 0.75em;
  13613. font-size: var(--font-size-16);
  13614. font-family: var(--serif);
  13615. font-weight: 600;
  13616. color: var(--primary);
  13617. line-height: 1;
  13618. border-bottom: 1px solid var(--color-border-divider);
  13619. }
  13620. .sheet.kingdom h3.header > button, .sheet.kingdom h3.header > .controls {
  13621. position: absolute;
  13622. bottom: -1px;
  13623. right: 0;
  13624. }
  13625. .sheet.kingdom h3.header .controls {
  13626. display: flex;
  13627. }
  13628. .sheet.kingdom h3.header button {
  13629. background: transparent;
  13630. border-radius: 2px 2px 0 0;
  13631. border: 1px solid var(--color-border-divider);
  13632. color: var(--primary);
  13633. cursor: pointer;
  13634. font-family: var(--sans-serif);
  13635. font-size: var(--font-size-12);
  13636. font-weight: 500;
  13637. height: 20px;
  13638. line-height: var(--font-size-12);
  13639. margin: 0;
  13640. outline: none;
  13641. text-transform: uppercase;
  13642. width: auto;
  13643. }
  13644. .sheet.kingdom button.small-button,
  13645. .sheet.kingdom select.proficiency,
  13646. .sheet.kingdom span.proficiency {
  13647. font-family: var(--sans-serif);
  13648. font-size: var(--font-size-10);
  13649. text-transform: uppercase;
  13650. letter-spacing: 0.05em;
  13651. text-rendering: optimizeLegibility;
  13652. align-items: center;
  13653. background: var(--color-proficiency-untrained);
  13654. border: 1px solid rgba(0, 0, 0, 0.5);
  13655. border-radius: 2px;
  13656. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  13657. color: var(--text-light);
  13658. display: flex;
  13659. font-weight: 500;
  13660. height: unset;
  13661. justify-content: center;
  13662. line-height: unset;
  13663. padding: 1px 2px 1px 2px;
  13664. }
  13665. .sheet.kingdom .proficiency {
  13666. text-align-last: center;
  13667. appearance: none;
  13668. }
  13669. .sheet.kingdom .proficiency.readonly {
  13670. pointer-events: none;
  13671. }
  13672. .sheet.kingdom .proficiency option[value="0"] {
  13673. background: var(--color-proficiency-untrained);
  13674. }
  13675. .sheet.kingdom .proficiency[data-rank="1"],
  13676. .sheet.kingdom .proficiency option[value="1"] {
  13677. background: var(--color-proficiency-trained);
  13678. }
  13679. .sheet.kingdom .proficiency[data-rank="2"],
  13680. .sheet.kingdom .proficiency option[value="2"] {
  13681. background: var(--color-proficiency-expert);
  13682. }
  13683. .sheet.kingdom .proficiency[data-rank="3"],
  13684. .sheet.kingdom .proficiency option[value="3"] {
  13685. background: var(--color-proficiency-master);
  13686. }
  13687. .sheet.kingdom .proficiency[data-rank="4"],
  13688. .sheet.kingdom .proficiency option[value="4"] {
  13689. background: var(--color-proficiency-legendary);
  13690. }
  13691. .sheet.kingdom select.proficiency {
  13692. cursor: pointer;
  13693. }
  13694. .sheet.kingdom .tab.active[data-tab=main] {
  13695. overflow: hidden scroll;
  13696. flex-direction: column;
  13697. }
  13698. .sheet.kingdom .tab.active[data-tab=main] input[type=text],
  13699. .sheet.kingdom .tab.active[data-tab=main] input[type=number] {
  13700. border: none;
  13701. }
  13702. .sheet.kingdom .tab.active[data-tab=main] .content {
  13703. display: grid;
  13704. grid-template: "leaders resources" 1fr "leaders abilities" min-content/0.9fr 1fr;
  13705. width: 100%;
  13706. gap: 0 1rem;
  13707. padding: 0.5rem;
  13708. flex: 0 0 auto;
  13709. }
  13710. .sheet.kingdom .tab.active[data-tab=main] .leaders {
  13711. grid-area: leaders;
  13712. }
  13713. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader {
  13714. display: grid;
  13715. grid-template-areas: "img name" "img label";
  13716. grid-template-columns: auto 1fr;
  13717. grid-template-rows: 1fr auto;
  13718. }
  13719. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader:not(:last-child) {
  13720. margin-bottom: 0.375rem;
  13721. }
  13722. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .image {
  13723. border: none;
  13724. border-radius: 2px;
  13725. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  13726. grid-area: img;
  13727. width: 2.75rem;
  13728. height: 2.75rem;
  13729. z-index: 1;
  13730. }
  13731. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .image img {
  13732. border: none;
  13733. width: 100%;
  13734. height: 100%;
  13735. }
  13736. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .name {
  13737. grid-area: name;
  13738. background: rgba(0, 0, 0, 0.025);
  13739. padding: 0 8px;
  13740. border: 0;
  13741. height: auto;
  13742. line-height: 1.5em;
  13743. height: 1.5em;
  13744. align-self: end;
  13745. display: flex;
  13746. justify-content: space-between;
  13747. }
  13748. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .details {
  13749. grid-area: label;
  13750. align-self: flex-end;
  13751. align-items: center;
  13752. display: flex;
  13753. justify-content: space-between;
  13754. background: var(--paper-bg);
  13755. box-shadow: var(--drop-shadow);
  13756. font-size: var(--font-size-12);
  13757. padding: 0 8px;
  13758. position: relative;
  13759. margin-bottom: 1px;
  13760. height: 1.5rem;
  13761. }
  13762. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .details .role {
  13763. font-variant: small-caps;
  13764. font-weight: 500;
  13765. }
  13766. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .invested,
  13767. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .vacant {
  13768. font-size: var(--font-size-12);
  13769. }
  13770. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .invested input,
  13771. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .vacant input {
  13772. margin: 0;
  13773. width: 1em;
  13774. height: 1em;
  13775. }
  13776. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .invested i,
  13777. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .vacant i {
  13778. font-size: 1.2em;
  13779. }
  13780. .sheet.kingdom .tab.active[data-tab=main] .resources {
  13781. grid-area: resources;
  13782. }
  13783. .sheet.kingdom .tab.active[data-tab=main] .resources input[type=number] {
  13784. width: 3ch;
  13785. text-align: center;
  13786. padding-left: 0;
  13787. padding-right: 0;
  13788. }
  13789. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-data {
  13790. background: var(--paper-bg);
  13791. box-shadow: var(--drop-shadow);
  13792. display: grid;
  13793. grid-template: "resource resource" min-content "commodities stats" 1fr/auto 1fr;
  13794. }
  13795. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-data .resource-dice {
  13796. grid-area: resource;
  13797. }
  13798. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-data .commodities {
  13799. grid-area: commodities;
  13800. }
  13801. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-data .stats {
  13802. grid-area: stats;
  13803. }
  13804. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-dice {
  13805. align-items: center;
  13806. border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  13807. display: flex;
  13808. gap: 0.25rem;
  13809. padding: 0 0.5rem;
  13810. }
  13811. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-dice .rollable {
  13812. flex: 1;
  13813. }
  13814. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-dice input {
  13815. width: 2ch;
  13816. text-align: center;
  13817. }
  13818. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities,
  13819. .sheet.kingdom .tab.active[data-tab=main] .resources .stats {
  13820. padding: 0.25rem 0.5rem;
  13821. white-space: nowrap;
  13822. }
  13823. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities > label, .sheet.kingdom .tab.active[data-tab=main] .resources .commodities > div,
  13824. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities input[type=number],
  13825. .sheet.kingdom .tab.active[data-tab=main] .resources .stats > label,
  13826. .sheet.kingdom .tab.active[data-tab=main] .resources .stats > div,
  13827. .sheet.kingdom .tab.active[data-tab=main] .resources .stats input[type=number] {
  13828. height: 1.5em;
  13829. line-height: 1.5em;
  13830. }
  13831. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities > label .number, .sheet.kingdom .tab.active[data-tab=main] .resources .commodities > div .number,
  13832. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities input[type=number] .number,
  13833. .sheet.kingdom .tab.active[data-tab=main] .resources .stats > label .number,
  13834. .sheet.kingdom .tab.active[data-tab=main] .resources .stats > div .number,
  13835. .sheet.kingdom .tab.active[data-tab=main] .resources .stats input[type=number] .number {
  13836. display: inline-block;
  13837. width: 3ch;
  13838. text-align: center;
  13839. }
  13840. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities .commodity {
  13841. align-items: center;
  13842. display: flex;
  13843. gap: 0.25rem;
  13844. }
  13845. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities .commodity .type {
  13846. width: 4.25rem;
  13847. }
  13848. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities .commodity .value-max {
  13849. align-items: center;
  13850. display: flex;
  13851. gap: 0.125rem;
  13852. flex: 1;
  13853. }
  13854. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities .commodity .value-max input {
  13855. width: 2ch;
  13856. }
  13857. .sheet.kingdom .tab.active[data-tab=main] .resources .stats {
  13858. justify-self: end;
  13859. text-align: end;
  13860. }
  13861. .sheet.kingdom .tab.active[data-tab=main] .ability-scores {
  13862. grid-area: abilities;
  13863. flex: 0;
  13864. }
  13865. .sheet.kingdom .tab.active[data-tab=main] .ability-scores input {
  13866. height: auto;
  13867. }
  13868. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability {
  13869. display: flex;
  13870. flex-direction: row;
  13871. align-items: end;
  13872. width: 100%;
  13873. }
  13874. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability:not(:last-child) {
  13875. margin-bottom: 0.375rem;
  13876. }
  13877. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .score {
  13878. display: flex;
  13879. flex-direction: column;
  13880. justify-content: center;
  13881. align-items: center;
  13882. background: var(--paper-bg);
  13883. box-shadow: var(--drop-shadow);
  13884. width: 4.5rem;
  13885. text-align: center;
  13886. padding: 0.375rem 0;
  13887. z-index: 1;
  13888. }
  13889. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .score .value {
  13890. font-size: var(--font-size-20);
  13891. }
  13892. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section {
  13893. display: flex;
  13894. flex-wrap: wrap;
  13895. flex: 1;
  13896. box-shadow: var(--drop-shadow);
  13897. }
  13898. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section > .stat {
  13899. display: flex;
  13900. flex-direction: column;
  13901. text-align: center;
  13902. flex: 1;
  13903. }
  13904. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section .ruin-value {
  13905. display: flex;
  13906. gap: 2px;
  13907. justify-content: center;
  13908. }
  13909. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section .ruin-value input {
  13910. width: 3ch;
  13911. }
  13912. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section .progress {
  13913. flex-basis: 100%;
  13914. margin: 0;
  13915. padding: 0;
  13916. height: 8px;
  13917. border-top: 1px solid rgba(0, 0, 0, 0.15);
  13918. margin-top: 0.125rem;
  13919. background: #ddd;
  13920. }
  13921. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section .progress::after {
  13922. display: block;
  13923. content: " ";
  13924. background-color: var(--color-border-highlight-alt);
  13925. width: calc(100% * var(--value) / var(--max));
  13926. max-width: 100%;
  13927. height: 100%;
  13928. }
  13929. .sheet.kingdom .tab.active[data-tab=activities] {
  13930. display: flex;
  13931. flex-direction: row;
  13932. padding: 0 1rem;
  13933. height: 100%;
  13934. }
  13935. .sheet.kingdom .tab.active[data-tab=activities] .skills,
  13936. .sheet.kingdom .tab.active[data-tab=activities] .actions {
  13937. display: flex;
  13938. height: 100%;
  13939. flex-direction: column;
  13940. }
  13941. .sheet.kingdom .tab.active[data-tab=activities] .skill-list,
  13942. .sheet.kingdom .tab.active[data-tab=activities] .actions-list {
  13943. overflow: hidden scroll;
  13944. margin-bottom: 0.25rem;
  13945. }
  13946. .sheet.kingdom .tab.active[data-tab=activities] .skills {
  13947. padding-right: 0.5rem;
  13948. }
  13949. .sheet.kingdom .tab.active[data-tab=activities] .skills .control-dc {
  13950. align-items: center;
  13951. background: var(--paper-bg);
  13952. box-shadow: var(--drop-shadow);
  13953. display: flex;
  13954. gap: 8px;
  13955. margin: 0.5rem 0;
  13956. }
  13957. .sheet.kingdom .tab.active[data-tab=activities] .skills .control-dc .mod {
  13958. color: var(--secondary);
  13959. display: inline-block;
  13960. font-family: var(--serif);
  13961. font-size: 1.25em;
  13962. font-weight: bold;
  13963. min-width: 3rem;
  13964. text-align: right;
  13965. }
  13966. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill {
  13967. display: flex;
  13968. align-items: center;
  13969. padding: 1px 0;
  13970. padding-right: 0.5rem;
  13971. gap: 8px;
  13972. }
  13973. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .mod {
  13974. display: flex;
  13975. color: var(--primary);
  13976. font-family: var(--serif);
  13977. font-weight: 600;
  13978. font-size: 1.25em;
  13979. line-height: 1em;
  13980. min-width: 3rem;
  13981. padding: 3px 0;
  13982. }
  13983. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .mod i {
  13984. color: var(--text-dark);
  13985. font-size: 0.8em;
  13986. margin-right: 2px;
  13987. }
  13988. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .name {
  13989. flex: 1;
  13990. color: var(--alt-dark);
  13991. }
  13992. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .name.selected {
  13993. color: var(--text-dark);
  13994. font-weight: 600;
  13995. }
  13996. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill:not(:last-child) {
  13997. border-bottom: 1px solid var(--color-divider);
  13998. }
  13999. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .button-group {
  14000. display: flex;
  14001. padding-left: 0.25rem;
  14002. }
  14003. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .button-group .proficiency {
  14004. min-width: 11ch;
  14005. }
  14006. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .button-group .small-button {
  14007. flex: 0;
  14008. }
  14009. .sheet.kingdom .tab.active[data-tab=activities] .actions {
  14010. flex: 1;
  14011. }
  14012. .sheet.kingdom .tab.active[data-tab=activities] .actions h3.header .filters {
  14013. float: right;
  14014. margin: -0.125rem 0 0.125rem auto;
  14015. }
  14016. .sheet.kingdom .tab.active[data-tab=activities] .actions h3.header .filters .choice {
  14017. cursor: pointer;
  14018. opacity: 0.6;
  14019. transition: opacity 0.2s ease-in-out;
  14020. }
  14021. .sheet.kingdom .tab.active[data-tab=activities] .actions h3.header .filters .choice.active {
  14022. opacity: 1;
  14023. }
  14024. .sheet.kingdom .tab.active[data-tab=activities] .actions h3.header .filters .choice:hover {
  14025. box-shadow: 0 0 5px var(--primary);
  14026. }
  14027. .sheet.kingdom .tab.active[data-tab=activities] .actions .phase-summary {
  14028. background: var(--paper-bg);
  14029. box-shadow: var(--drop-shadow);
  14030. margin: 0 12px 0.5rem 2px;
  14031. padding: 0.25rem 0.5rem;
  14032. }
  14033. .sheet.kingdom .tab.active[data-tab=activities] .actions .phase-summary header {
  14034. font-size: 1.2em;
  14035. font-weight: bold;
  14036. color: var(--color-text-dark-input);
  14037. margin-top: 0.25rem;
  14038. }
  14039. .sheet.kingdom .tab.active[data-tab=activities] .actions .action {
  14040. align-items: center;
  14041. display: flex;
  14042. flex-wrap: wrap;
  14043. padding: 4px;
  14044. width: 100%;
  14045. gap: 0.5rem;
  14046. padding-right: 0.5rem;
  14047. }
  14048. .sheet.kingdom .tab.active[data-tab=activities] .actions .action:not(:last-child) {
  14049. border-bottom: 1px solid var(--color-divider);
  14050. }
  14051. .sheet.kingdom .tab.active[data-tab=activities] .actions .action .item-name {
  14052. align-items: center;
  14053. cursor: pointer;
  14054. display: flex;
  14055. flex: 1;
  14056. }
  14057. .sheet.kingdom .tab.active[data-tab=activities] .actions .action .item-summary {
  14058. flex-basis: 100%;
  14059. margin-bottom: 0.5rem;
  14060. }
  14061. .sheet.kingdom .tab.active[data-tab=activities] .actions .action .item-summary .tags {
  14062. display: none;
  14063. }
  14064. .sheet.kingdom .tab.active[data-tab=activities] .actions .action .tags {
  14065. margin-left: 0.25rem;
  14066. }
  14067. .sheet.kingdom .tab.active[data-tab=world] {
  14068. padding: 0.75rem;
  14069. }
  14070. .sheet.kingdom .tab.active[data-tab=world] input[type=text],
  14071. .sheet.kingdom .tab.active[data-tab=world] input[type=number] {
  14072. border: none;
  14073. height: 1.5em;
  14074. line-height: 1.5em;
  14075. }
  14076. .sheet.kingdom .tab.active[data-tab=world] .content {
  14077. padding-right: 0.5rem;
  14078. margin-right: 0.5rem;
  14079. }
  14080. .sheet.kingdom .tab.active[data-tab=world] .settlement {
  14081. display: flex;
  14082. align-items: center;
  14083. flex-wrap: wrap;
  14084. gap: 0 1rem;
  14085. padding: 0.25rem 0.25rem 0.25rem 0;
  14086. }
  14087. .sheet.kingdom .tab.active[data-tab=world] .settlement:not(.expanded, :last-child) {
  14088. border-bottom: 1px solid var(--color-divider);
  14089. }
  14090. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name {
  14091. flex: 1;
  14092. display: flex;
  14093. white-space: nowrap;
  14094. display: flex;
  14095. align-items: center;
  14096. gap: 0.25rem;
  14097. }
  14098. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name h4 {
  14099. cursor: pointer;
  14100. min-height: 1em;
  14101. }
  14102. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .level {
  14103. display: flex;
  14104. align-items: center;
  14105. }
  14106. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .level input[type=number] {
  14107. width: 3ch;
  14108. text-align: center;
  14109. padding: 0;
  14110. }
  14111. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .name {
  14112. flex: 1;
  14113. font-size: var(--font-size-16);
  14114. }
  14115. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name select {
  14116. margin-left: 2rem;
  14117. }
  14118. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .level {
  14119. font-size: var(--font-size-16);
  14120. margin-left: 0.5rem;
  14121. }
  14122. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .level input {
  14123. width: 3ch;
  14124. text-align: center;
  14125. }
  14126. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary {
  14127. flex-basis: 100%;
  14128. background: var(--paper-bg);
  14129. box-shadow: var(--drop-shadow);
  14130. margin-top: 0.5rem;
  14131. }
  14132. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data {
  14133. display: flex;
  14134. justify-content: space-between;
  14135. margin: 0 0.125rem 0 0;
  14136. border-bottom: 1px solid var(--color-divider);
  14137. }
  14138. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data > section {
  14139. flex: 1 0 auto;
  14140. padding: 0.5rem;
  14141. }
  14142. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data > section + section {
  14143. border-left: 1px solid var(--color-divider);
  14144. }
  14145. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data input[type=number] {
  14146. width: 3ch;
  14147. text-align: center;
  14148. padding: 0;
  14149. }
  14150. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data input[type=checkbox] {
  14151. margin: 0;
  14152. width: 1rem;
  14153. height: 1rem;
  14154. }
  14155. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data label,
  14156. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data div.value {
  14157. align-items: center;
  14158. display: flex;
  14159. gap: 0.25rem;
  14160. line-height: 1.5em;
  14161. }
  14162. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data .stats {
  14163. display: flex;
  14164. flex-direction: column;
  14165. justify-content: center;
  14166. }
  14167. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data .storage-items {
  14168. display: grid;
  14169. grid-template-columns: repeat(2, 1fr);
  14170. column-gap: 0.25rem;
  14171. }
  14172. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data .storage-items label {
  14173. display: flex;
  14174. align-items: center;
  14175. justify-content: space-between;
  14176. }
  14177. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary > .details {
  14178. padding: 0.5rem;
  14179. }
  14180. .sheet.kingdom .tab.active[data-tab=world] .settlement .editor {
  14181. display: flex;
  14182. flex-direction: column;
  14183. }
  14184. .sheet.kingdom .tab.active[data-tab=world] .settlement .editor .tox {
  14185. flex: 1;
  14186. min-height: 16rem;
  14187. }
  14188. .sheet.kingdom .tab.active[data-tab=world] aside {
  14189. background: var(--paper-bg);
  14190. box-shadow: var(--drop-shadow);
  14191. padding: 0.5rem;
  14192. display: flex;
  14193. flex-direction: column;
  14194. gap: 1rem;
  14195. }
  14196. .sheet.kingdom .tab.active[data-tab=world] aside input[type=number] {
  14197. width: 3ch;
  14198. text-align: center;
  14199. padding: 0;
  14200. }
  14201. .sheet.kingdom .tab.active[data-tab=world] aside section .row,
  14202. .sheet.kingdom .tab.active[data-tab=world] aside section label {
  14203. display: flex;
  14204. align-items: center;
  14205. gap: 0.25rem;
  14206. }
  14207. .sheet.kingdom .tab.active[data-tab=world] aside .work-sites .value span {
  14208. min-width: 7rem;
  14209. }
  14210. .sheet.kingdom .tab.active[data-tab=world] aside .other-data label {
  14211. width: 100%;
  14212. justify-content: space-between;
  14213. }
  14214. .sheet.kingdom .tab.active[data-tab=features] .content {
  14215. padding: 12px;
  14216. padding-bottom: 1em;
  14217. font-family: var(--body-serif);
  14218. }
  14219. .sheet.kingdom .tab.active[data-tab=features] .feat-section {
  14220. padding-bottom: 1em;
  14221. }
  14222. .sheet.kingdom .tab.active[data-tab=features] .feat-item {
  14223. display: grid;
  14224. grid: "name ctrl" min-content "content content" min-content/1fr min-content;
  14225. align-items: center;
  14226. padding: 2px 0;
  14227. }
  14228. .sheet.kingdom .tab.active[data-tab=features] .feat-item:nth-child(odd) {
  14229. background-color: rgba(120, 100, 82, 0.1);
  14230. }
  14231. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name,
  14232. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-controls {
  14233. margin: 0;
  14234. }
  14235. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name {
  14236. grid-area: name;
  14237. display: flex;
  14238. flex: 1;
  14239. align-items: center;
  14240. width: 100%;
  14241. }
  14242. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name .feat-slot-title {
  14243. display: flex;
  14244. font-family: var(--serif);
  14245. font-size: 1.1em;
  14246. font-weight: 600;
  14247. color: var(--secondary);
  14248. justify-content: center;
  14249. width: 20px;
  14250. margin-left: 6px;
  14251. }
  14252. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name .item-placeholder {
  14253. margin-left: 40px;
  14254. margin-right: 4px;
  14255. }
  14256. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name h4 {
  14257. cursor: pointer;
  14258. display: flex;
  14259. align-items: center;
  14260. font-family: var(--serif);
  14261. }
  14262. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name h4:hover {
  14263. color: var(--primary);
  14264. text-shadow: 0 0 3px var(--tertiary);
  14265. }
  14266. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name .item-image {
  14267. margin-left: 8px;
  14268. margin-right: 8px;
  14269. }
  14270. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-controls {
  14271. align-items: center;
  14272. display: flex;
  14273. font-size: var(--font-size-12);
  14274. grid-area: ctrl;
  14275. height: 100%;
  14276. white-space: nowrap;
  14277. width: 100%;
  14278. }
  14279. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-controls a:last-child {
  14280. margin-right: 6px;
  14281. }
  14282. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-summary {
  14283. flex: 100%;
  14284. grid-area: content;
  14285. padding: 0 8px 8px;
  14286. margin: 4px 0 0 4px;
  14287. }
  14288. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts {
  14289. font-family: var(--font-primary);
  14290. }
  14291. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts section {
  14292. align-items: center;
  14293. display: flex;
  14294. gap: 4px;
  14295. }
  14296. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts section .abilities {
  14297. display: flex;
  14298. gap: 3px;
  14299. }
  14300. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts strong {
  14301. line-height: 1.5em;
  14302. }
  14303. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts .tag {
  14304. border-radius: 4px;
  14305. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3);
  14306. line-height: unset;
  14307. padding: 0.15em;
  14308. font-size: 0.9em;
  14309. }
  14310. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items {
  14311. grid-column: span 2;
  14312. border-left: 3px dotted #786452;
  14313. display: flex;
  14314. margin: 1px 0 0 45px;
  14315. padding: 0;
  14316. flex-basis: 100%;
  14317. flex-direction: column;
  14318. }
  14319. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li {
  14320. align-items: center;
  14321. display: flex;
  14322. flex-wrap: wrap;
  14323. gap: 2px;
  14324. margin: 2px 0;
  14325. padding-bottom: 1px;
  14326. }
  14327. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li:last-child {
  14328. padding-bottom: 0;
  14329. }
  14330. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li .item-name .feat-slot-title {
  14331. width: 0;
  14332. }
  14333. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li .item-name img {
  14334. margin-left: 0;
  14335. }
  14336. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li .item-controls {
  14337. flex: 0;
  14338. }
  14339. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li ol.nested-items {
  14340. margin-left: 25px;
  14341. }
  14342. .sheet.kingdom .tab.active[data-tab=ongoing] {
  14343. padding: 0.75rem;
  14344. gap: 1rem;
  14345. }
  14346. .sheet.kingdom .tab.active[data-tab=ongoing] .events {
  14347. flex: 1;
  14348. display: flex;
  14349. flex-direction: column;
  14350. gap: 0.5rem;
  14351. }
  14352. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc {
  14353. display: flex;
  14354. gap: 1ch;
  14355. background: var(--paper-bg);
  14356. box-shadow: var(--drop-shadow);
  14357. line-height: 1.5em;
  14358. padding: 0.5rem 1rem;
  14359. }
  14360. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc,
  14361. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc input {
  14362. font-size: var(--font-size-18);
  14363. }
  14364. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc input {
  14365. width: 3ch;
  14366. background: none;
  14367. border: none;
  14368. padding: 0;
  14369. }
  14370. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc .dc {
  14371. margin-left: auto;
  14372. }
  14373. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-details {
  14374. background: var(--paper-bg);
  14375. box-shadow: var(--drop-shadow);
  14376. display: flex;
  14377. flex: 1;
  14378. flex-direction: column;
  14379. padding: 0.5rem;
  14380. overflow: auto;
  14381. }
  14382. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-details .editor {
  14383. flex: 1;
  14384. }
  14385. .sheet.kingdom .tab.active[data-tab=ongoing] aside {
  14386. width: 18rem;
  14387. }
  14388. .sheet.kingdom .tab.active[data-tab=ongoing] aside > h3.header {
  14389. margin-top: 0;
  14390. }
  14391. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list {
  14392. gap: 0.2em;
  14393. }
  14394. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item {
  14395. display: flex;
  14396. flex-wrap: wrap;
  14397. align-items: center;
  14398. justify-content: space-between;
  14399. padding: 2px 4px 2px 12px;
  14400. width: 100%;
  14401. }
  14402. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item p:empty {
  14403. display: none;
  14404. }
  14405. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-name {
  14406. display: flex;
  14407. align-items: center;
  14408. flex: 1;
  14409. }
  14410. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-name h4 {
  14411. cursor: pointer;
  14412. margin: 0;
  14413. }
  14414. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-name .item-image {
  14415. margin-right: 8px;
  14416. }
  14417. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-controls {
  14418. display: flex;
  14419. flex: 0;
  14420. font-size: var(--font-size-12);
  14421. gap: 1px;
  14422. white-space: nowrap;
  14423. }
  14424. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-controls a.info-only:hover {
  14425. cursor: default;
  14426. text-shadow: none;
  14427. }
  14428. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-controls a + a {
  14429. margin-left: 4px;
  14430. }
  14431. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-summary {
  14432. flex-basis: 100%;
  14433. }
  14434. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item.unidentified {
  14435. border-radius: 1px;
  14436. outline: 1px dotted rgba(75, 74, 68, 0.5);
  14437. background: var(--visibility-gm-bg);
  14438. }
  14439. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .button-group {
  14440. display: flex;
  14441. justify-content: flex-end;
  14442. align-items: center;
  14443. flex-wrap: nowrap;
  14444. width: 50%;
  14445. flex: 0;
  14446. }
  14447. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .button-group button {
  14448. margin: 0;
  14449. border: none;
  14450. cursor: pointer;
  14451. font-family: var(--sans-serif);
  14452. font-size: var(--font-size-10);
  14453. text-transform: uppercase;
  14454. letter-spacing: 0.05em;
  14455. text-rendering: optimizeLegibility;
  14456. padding: 5px;
  14457. color: var(--text-light);
  14458. width: 70px;
  14459. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  14460. background: var(--secondary);
  14461. border-radius: 2px;
  14462. flex: 0;
  14463. white-space: nowrap;
  14464. margin-left: 4px;
  14465. flex: 0;
  14466. }
  14467. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .button-group button:hover {
  14468. box-shadow: none;
  14469. text-shadow: 0 0 2px white;
  14470. }
  14471. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item {
  14472. padding-left: 0;
  14473. }
  14474. .sheet.kingdom-builder .window-content {
  14475. padding: 0;
  14476. overflow: hidden;
  14477. }
  14478. .sheet.kingdom-builder h3 {
  14479. font-family: var(--sans-serif);
  14480. }
  14481. .sheet.kingdom-builder form {
  14482. display: flex;
  14483. flex-direction: column;
  14484. background: url("../assets/sheet/background.webp");
  14485. background-repeat: no-repeat;
  14486. background-size: cover;
  14487. background-attachment: local;
  14488. }
  14489. .sheet.kingdom-builder form > nav {
  14490. display: flex;
  14491. font-family: var(--serif-condensed);
  14492. font-size: var(--font-size-22);
  14493. margin-top: 0.125rem;
  14494. align-items: flex-end;
  14495. width: 100%;
  14496. }
  14497. .sheet.kingdom-builder form > nav a {
  14498. border-radius: 3px 3px 0 0;
  14499. padding: 0.25rem 0.5rem;
  14500. white-space: nowrap;
  14501. flex: 1;
  14502. text-align: center;
  14503. position: relative;
  14504. }
  14505. .sheet.kingdom-builder form > nav a:not(.active) {
  14506. margin-top: 1px;
  14507. border-bottom: 1px solid var(--alt-dark);
  14508. }
  14509. .sheet.kingdom-builder form > nav a.active {
  14510. border: 1px solid var(--alt-dark);
  14511. border-bottom-color: transparent;
  14512. margin-left: -1px;
  14513. margin-right: -1px;
  14514. }
  14515. .sheet.kingdom-builder form > nav a .complete {
  14516. font-size: 0.8em;
  14517. }
  14518. .sheet.kingdom-builder form > nav:before, .sheet.kingdom-builder form > nav:after {
  14519. content: "";
  14520. width: 0.25rem;
  14521. border-bottom: 1px solid var(--alt-dark);
  14522. }
  14523. .sheet.kingdom-builder .container {
  14524. height: 100%;
  14525. overflow: hidden;
  14526. }
  14527. .sheet.kingdom-builder .tab.active {
  14528. display: flex;
  14529. flex: 1;
  14530. }
  14531. .sheet.kingdom-builder button.complete {
  14532. color: var(--text-light);
  14533. background: var(--secondary);
  14534. height: 35px;
  14535. width: 131px;
  14536. border: 1px solid var(--tertiary);
  14537. }
  14538. .sheet.kingdom-builder button.complete:disabled {
  14539. background: var(--sub);
  14540. pointer-events: none;
  14541. opacity: 0.75;
  14542. }
  14543. .sheet.kingdom-builder .build-element {
  14544. display: flex;
  14545. flex-direction: column;
  14546. flex: 1;
  14547. }
  14548. .sheet.kingdom-builder .build-element .choices {
  14549. display: flex;
  14550. margin: 0.5rem 0.25rem;
  14551. }
  14552. .sheet.kingdom-builder .build-element .choices .choice {
  14553. display: flex;
  14554. cursor: pointer;
  14555. flex: 1 1 0;
  14556. flex-direction: column;
  14557. align-items: center;
  14558. margin: 0.5rem 0;
  14559. text-align: center;
  14560. white-space: nowrap;
  14561. }
  14562. .sheet.kingdom-builder .build-element .choices .choice img {
  14563. border-radius: 3px;
  14564. width: 2.5rem;
  14565. height: 2.5rem;
  14566. object-fit: contain;
  14567. }
  14568. .sheet.kingdom-builder .build-element .choices .choice.selected, .sheet.kingdom-builder .build-element .choices .choice:hover {
  14569. text-shadow: 0 0 8px var(--color-shadow-primary);
  14570. }
  14571. .sheet.kingdom-builder .build-element .choices .choice.selected img, .sheet.kingdom-builder .build-element .choices .choice:hover img {
  14572. box-shadow: 0 0 8px var(--color-shadow-primary);
  14573. }
  14574. .sheet.kingdom-builder .build-element .build-entry-boosts {
  14575. font-family: var(--font-primary);
  14576. }
  14577. .sheet.kingdom-builder .build-element .build-entry-boosts section {
  14578. align-items: center;
  14579. display: flex;
  14580. gap: 4px;
  14581. }
  14582. .sheet.kingdom-builder .build-element .build-entry-boosts section .abilities {
  14583. display: flex;
  14584. gap: 3px;
  14585. }
  14586. .sheet.kingdom-builder .build-element .build-entry-boosts strong {
  14587. line-height: 1.5em;
  14588. }
  14589. .sheet.kingdom-builder .build-element .build-entry-boosts .tag {
  14590. border-radius: 4px;
  14591. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3);
  14592. line-height: unset;
  14593. padding: 0.15em;
  14594. font-size: 0.9em;
  14595. }
  14596. .sheet.kingdom-builder .build-element .selection {
  14597. display: flex;
  14598. flex: 1;
  14599. flex-direction: column;
  14600. margin: 0.5rem;
  14601. }
  14602. .sheet.kingdom-builder .build-element .selection .text {
  14603. display: flex;
  14604. flex-direction: column;
  14605. flex: 1;
  14606. overflow: hidden;
  14607. }
  14608. .sheet.kingdom-builder .build-element .selection .text h3 {
  14609. display: flex;
  14610. justify-content: space-between;
  14611. }
  14612. .sheet.kingdom-builder .build-element .selection .text .description {
  14613. overflow-y: auto;
  14614. overflow-x: hidden;
  14615. height: 8rem;
  14616. }
  14617. .sheet.kingdom-builder .build-element .selection footer {
  14618. display: flex;
  14619. width: 100%;
  14620. align-items: end;
  14621. min-height: 4.5em;
  14622. }
  14623. .sheet.kingdom-builder .build-element .selection footer .build-entry-boosts {
  14624. flex: 1;
  14625. }
  14626. .sheet.kingdom-builder .build-element .selection footer button {
  14627. flex: 0;
  14628. white-space: nowrap;
  14629. }
  14630. .sheet.kingdom-builder .build-element .selection a[disabled] {
  14631. opacity: 0.7;
  14632. cursor: unset;
  14633. text-shadow: unset;
  14634. }
  14635. .sheet.kingdom-builder .build-element .selection {
  14636. padding: 0.5rem;
  14637. background-color: #eee;
  14638. box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  14639. }
  14640. .sheet.kingdom-builder .ability-builder {
  14641. padding: 6px;
  14642. width: 100%;
  14643. }
  14644. .sheet.kingdom-builder .ability-builder h3 {
  14645. font: 400 var(--font-size-24) var(--serif-condensed);
  14646. line-height: var(--font-size-24);
  14647. }
  14648. .sheet.kingdom-builder .ability-builder h4 {
  14649. font: 400 var(--font-size-10) var(--sans-serif);
  14650. text-transform: uppercase;
  14651. color: #605856;
  14652. }
  14653. .sheet.kingdom-builder .ability-builder button:focus:not(:focus-visible) {
  14654. box-shadow: none;
  14655. }
  14656. .sheet.kingdom-builder .ability-builder .row {
  14657. display: flex;
  14658. align-items: center;
  14659. }
  14660. .sheet.kingdom-builder .ability-builder .row .row-heading {
  14661. width: 220px;
  14662. }
  14663. .sheet.kingdom-builder .ability-builder .row.not-eligible {
  14664. pointer-events: none;
  14665. filter: blur(1px);
  14666. opacity: 0.6;
  14667. }
  14668. .sheet.kingdom-builder .ability-builder .row.not-eligible .remaining {
  14669. visibility: hidden;
  14670. }
  14671. .sheet.kingdom-builder .ability-builder .row .abilities {
  14672. display: grid;
  14673. grid-template-columns: repeat(4, 1fr);
  14674. grid-template-rows: auto;
  14675. flex: 1;
  14676. }
  14677. .sheet.kingdom-builder .ability-builder .row .full-row {
  14678. display: flex;
  14679. flex: 1;
  14680. justify-content: center;
  14681. }
  14682. .sheet.kingdom-builder .ability-builder header.row {
  14683. align-items: normal;
  14684. padding-top: 10px;
  14685. margin-bottom: 0.5rem;
  14686. }
  14687. .sheet.kingdom-builder .ability-builder header.row .row-column {
  14688. display: block;
  14689. }
  14690. .sheet.kingdom-builder .ability-builder header.row .abilities {
  14691. align-items: normal;
  14692. }
  14693. .sheet.kingdom-builder .ability-builder .row-heading {
  14694. display: grid;
  14695. grid-template-columns: 42px 1fr auto;
  14696. grid-template-areas: "img description remaining";
  14697. align-items: center;
  14698. }
  14699. .sheet.kingdom-builder .ability-builder .row-heading h3 {
  14700. grid-column: 1/4;
  14701. align-self: start;
  14702. font-size: var(--font-size-24);
  14703. }
  14704. .sheet.kingdom-builder .ability-builder .row-heading .hint-container {
  14705. grid-column: 1/4;
  14706. }
  14707. .sheet.kingdom-builder .ability-builder .row-heading img {
  14708. grid-area: img;
  14709. border: 0;
  14710. }
  14711. .sheet.kingdom-builder .ability-builder .row-heading div.label {
  14712. grid-area: description;
  14713. display: flex;
  14714. flex-direction: column;
  14715. overflow: hidden;
  14716. white-space: nowrap;
  14717. text-overflow: ellipsis;
  14718. margin-right: 10px;
  14719. }
  14720. .sheet.kingdom-builder .ability-builder .row-heading div.remaining {
  14721. grid-area: remaining;
  14722. display: flex;
  14723. margin-right: 10px;
  14724. width: 1.6rem;
  14725. height: 1.6rem;
  14726. border-radius: 50%;
  14727. background: rgba(68, 55, 48, 0.1);
  14728. align-self: center;
  14729. align-items: center;
  14730. justify-content: center;
  14731. text-align: center;
  14732. }
  14733. .sheet.kingdom-builder .ability-builder .row-heading div.remaining.extra {
  14734. animation: glow 0.75s infinite alternate;
  14735. }
  14736. @keyframes glow {
  14737. from {
  14738. box-shadow: 0 0 1px 1px #ffb351;
  14739. }
  14740. to {
  14741. box-shadow: 0 0 3px 3px #ffb351;
  14742. }
  14743. }
  14744. .sheet.kingdom-builder .ability-builder .row-column {
  14745. align-items: center;
  14746. display: flex;
  14747. flex-direction: column;
  14748. justify-content: center;
  14749. text-align: center;
  14750. }
  14751. .sheet.kingdom-builder .ability-builder .row-column button {
  14752. align-items: center;
  14753. border: 1px solid var(--button-color);
  14754. color: var(--button-color);
  14755. display: flex;
  14756. font-size: var(--font-size-12);
  14757. justify-content: space-around;
  14758. outline: none;
  14759. margin: 0;
  14760. padding: 0.1em 0 0;
  14761. position: relative;
  14762. text-transform: uppercase;
  14763. width: 6em;
  14764. height: 1.5em;
  14765. }
  14766. .sheet.kingdom-builder .ability-builder .row-column button.boost {
  14767. margin-top: auto;
  14768. --button-color: #316549;
  14769. --button-locked-color: #1b3c2a;
  14770. }
  14771. .sheet.kingdom-builder .ability-builder .row-column button.flaw {
  14772. margin-bottom: auto;
  14773. --button-color: #5e0000;
  14774. --button-locked-color: #5e0000;
  14775. }
  14776. .sheet.kingdom-builder .ability-builder .row-column button:disabled {
  14777. pointer-events: none;
  14778. background: rgba(0, 0, 0, 0.04);
  14779. opacity: 0.4;
  14780. }
  14781. .sheet.kingdom-builder .ability-builder .row-column button.selected {
  14782. background: var(--button-color);
  14783. }
  14784. .sheet.kingdom-builder .ability-builder .row-column button:hover {
  14785. cursor: pointer;
  14786. box-shadow: 0 0 5px var(--button-color);
  14787. }
  14788. .sheet.kingdom-builder .ability-builder .row-column button:hover.key-ability.selected {
  14789. box-shadow: none;
  14790. cursor: default;
  14791. }
  14792. .sheet.kingdom-builder .ability-builder .row-column button:hover:disabled {
  14793. background: rgba(0, 0, 0, 0.04);
  14794. box-shadow: none;
  14795. cursor: not-allowed;
  14796. }
  14797. .sheet.kingdom-builder .ability-builder .row-column button i.fas {
  14798. font-size: var(--font-size-10);
  14799. left: 0.5em;
  14800. position: absolute;
  14801. text-align: left;
  14802. }
  14803. .sheet.kingdom-builder .ability-builder .row-column button.hidden {
  14804. pointer-events: none;
  14805. visibility: hidden;
  14806. }
  14807. .sheet.kingdom-builder .ability-builder .row-column button.locked {
  14808. pointer-events: none;
  14809. background: var(--button-locked-color);
  14810. border-color: var(--button-locked-color);
  14811. }
  14812. .sheet.kingdom-builder .ability-builder .row-column button.locked, .sheet.kingdom-builder .ability-builder .row-column button.selected {
  14813. color: var(--text-light);
  14814. }
  14815. .sheet.kingdom-builder .ability-builder .row-column div + .boost,
  14816. .sheet.kingdom-builder .ability-builder .row-column button + .boost {
  14817. margin-top: 4px;
  14818. }
  14819. .sheet.kingdom-builder .ability-builder .summary-row .row-heading {
  14820. display: block;
  14821. }
  14822. .sheet.kingdom-builder .ability-builder .summary-row .hint-container {
  14823. background: rgba(211, 204, 188, 0.4);
  14824. padding: 12px;
  14825. margin-right: 10px;
  14826. border: 1px solid rgb(211, 204, 188);
  14827. border-radius: 3px;
  14828. align-self: end;
  14829. }
  14830. .sheet.kingdom-builder .ability-builder .summary-row .hint-container h3 {
  14831. color: var(--primary);
  14832. font-variant: small-caps;
  14833. font-size: var(--font-size-20);
  14834. line-height: var(--font-size-16);
  14835. font-family: var(--sans-serif-condensed);
  14836. font-weight: 500;
  14837. }
  14838. .sheet.kingdom-builder .ability-builder .summary-row .hint-container p {
  14839. font-style: italic;
  14840. font-size: var(--font-size-12);
  14841. line-height: var(--font-size-14);
  14842. font-family: var(--sans-serif);
  14843. font-weight: 500;
  14844. margin-bottom: 3px;
  14845. }
  14846. .sheet.kingdom-builder .ability-builder .summary-row .hint-container label {
  14847. display: flex;
  14848. align-items: center;
  14849. margin-top: 8px;
  14850. }
  14851. .sheet.kingdom-builder .ability-builder .summary-row .hint-container .aspiration {
  14852. display: flex;
  14853. gap: 8px;
  14854. }
  14855. .sheet.kingdom-builder .ability-builder .summary-row .hint-container .aspiration select {
  14856. flex: 1;
  14857. }
  14858. .sheet.kingdom-builder .ability-builder .summary-row .abilities {
  14859. grid-template-rows: auto auto;
  14860. }
  14861. .sheet.kingdom-builder .ability-builder .summary-row .row-column {
  14862. display: flex;
  14863. flex-direction: column;
  14864. padding-top: 10px;
  14865. }
  14866. .sheet.kingdom-builder .ability-builder .summary-row .row-column .value {
  14867. height: 40px;
  14868. font: 700 var(--font-size-24) var(--serif);
  14869. line-height: var(--font-size-30);
  14870. }
  14871. .sheet.kingdom-builder .ability-builder .summary-row .row-column input {
  14872. width: calc(100% - 20px);
  14873. flex-grow: 0;
  14874. height: 30px;
  14875. color: var(--text-dark);
  14876. font: 500 var(--font-size-24) var(--serif);
  14877. border: 0;
  14878. border-bottom: 1px solid #d3ccbc;
  14879. border-radius: 0;
  14880. background-color: transparent;
  14881. margin: 0 10px 10px 10px;
  14882. text-align: center;
  14883. }
  14884. .sheet.kingdom-builder .ability-builder .summary-row .row-column input::placeholder {
  14885. filter: opacity(0.5);
  14886. }
  14887. .sheet.kingdom-builder .ability-builder .summary-row .row-column input:focus {
  14888. border-bottom: 1px solid var(--alt);
  14889. }
  14890. .sheet.kingdom-builder .ability-builder .summary-row .row-column input[type=number] {
  14891. padding-bottom: 0;
  14892. padding-left: 4px;
  14893. }
  14894. .sheet.kingdom-builder .ability-builder .summary-row div.complete {
  14895. grid-row: 2;
  14896. grid-column: 1/7;
  14897. display: flex;
  14898. align-items: flex-end;
  14899. justify-content: flex-end;
  14900. margin-top: 10px;
  14901. margin-left: auto;
  14902. }
  14903. .sheet.kingdom-builder .ability-builder .title {
  14904. color: var(--primary);
  14905. font: 500 var(--font-size-10) var(--sans-serif-condensed);
  14906. line-height: var(--font-size-10);
  14907. text-transform: uppercase;
  14908. }
  14909. .sheet.kingdom-builder .ability-builder .description {
  14910. font: 600 var(--font-size-16) var(--serif);
  14911. }
  14912. .sheet.kingdom-builder .ability-builder .extra {
  14913. display: flex;
  14914. align-items: center;
  14915. font-size: var(--font-size-12);
  14916. margin-top: -0.25rem;
  14917. }
  14918. .sheet.kingdom-builder .ability-builder .extra .fas {
  14919. margin-left: 0.125rem;
  14920. }
  14921. .sheet.kingdom-builder .ability-builder .extra input[type=checkbox] {
  14922. height: var(--font-size-12);
  14923. margin: 0;
  14924. }
  14925. .pf2e.chat-card.kingdom {
  14926. --color-confirmation: #2c4f0d;
  14927. }
  14928. .pf2e.chat-card.kingdom .confirmation {
  14929. align-items: center;
  14930. color: var(--color-confirmation);
  14931. display: flex;
  14932. border: 1px dashed var(--color-confirmation);
  14933. font-size: 1.2em;
  14934. gap: 0.5rem;
  14935. justify-content: center;
  14936. padding: 0.25rem 0;
  14937. }
  14938. /* Mystification data revealed to GMs */
  14939. .gm-mystified-data {
  14940. opacity: 0.75;
  14941. }
  14942. #compendium-browser > section.window-content > .content-box,
  14943. #license-viewer > section.window-content > .content-box {
  14944. flex: 1;
  14945. overflow: hidden;
  14946. height: inherit;
  14947. }
  14948. #compendium-browser > section.window-content > .content-box div[class^=slider-],
  14949. #license-viewer > section.window-content > .content-box div[class^=slider-] {
  14950. height: 10px;
  14951. width: 80%;
  14952. border: 1px solid black;
  14953. }
  14954. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base,
  14955. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base {
  14956. background: #dddddd;
  14957. }
  14958. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle,
  14959. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle {
  14960. background: none;
  14961. border: none;
  14962. box-shadow: none;
  14963. color: var(--text-light);
  14964. cursor: grab;
  14965. font-size: var(--font-size-16);
  14966. height: 14px;
  14967. right: -7px;
  14968. text-shadow: 0 0 4px black;
  14969. top: -4px;
  14970. width: 14px;
  14971. }
  14972. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle:active,
  14973. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle:active {
  14974. cursor: grabbing;
  14975. }
  14976. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle.handle,
  14977. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle.handle {
  14978. background: #c85019;
  14979. border-radius: 2px;
  14980. border: 1px solid black;
  14981. box-shadow: 1px 1px 4px black;
  14982. }
  14983. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle::before, #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle::after,
  14984. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle::before,
  14985. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle::after {
  14986. background: none;
  14987. }
  14988. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle .noUi-touch-area,
  14989. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle .noUi-touch-area {
  14990. cursor: pointer;
  14991. }
  14992. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-tooltip,
  14993. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-tooltip {
  14994. display: none;
  14995. }
  14996. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-active .noUi-tooltip,
  14997. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-active .noUi-tooltip {
  14998. display: block;
  14999. background-color: rgba(0, 0, 0, 0.9);
  15000. color: var(--text-light);
  15001. line-height: 18px;
  15002. padding: 6px 14px;
  15003. }
  15004. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-connect.range_selected,
  15005. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-connect.range_selected {
  15006. background: rgba(255, 255, 240, 0.8);
  15007. }
  15008. #compendium-browser > section.window-content > .content-box > nav,
  15009. #license-viewer > section.window-content > .content-box > nav {
  15010. border-style: solid;
  15011. border-image-outset: 0;
  15012. border-width: 9px;
  15013. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  15014. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  15015. flex: 0;
  15016. width: 100%;
  15017. display: inline-flex;
  15018. justify-content: space-evenly;
  15019. align-items: center;
  15020. background: var(--secondary);
  15021. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  15022. }
  15023. #compendium-browser > section.window-content > .content-box > nav > a,
  15024. #license-viewer > section.window-content > .content-box > nav > a {
  15025. color: var(--sidebar-label);
  15026. padding: 4px 0;
  15027. font-family: var(--sans-serif);
  15028. font-size: var(--font-size-12);
  15029. position: relative;
  15030. }
  15031. #compendium-browser > section.window-content > .content-box > nav > a.active::after,
  15032. #license-viewer > section.window-content > .content-box > nav > a.active::after {
  15033. bottom: -2px;
  15034. right: 39%;
  15035. position: absolute;
  15036. content: "";
  15037. width: 0;
  15038. height: 0;
  15039. border-left: 4px solid transparent;
  15040. border-right: 4px solid transparent;
  15041. border-top: 4px solid var(--sidebar-label);
  15042. }
  15043. #compendium-browser > section.window-content > .content-box .compendium-browser-settings,
  15044. #license-viewer > section.window-content > .content-box .compendium-browser-settings {
  15045. height: 100%;
  15046. }
  15047. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form,
  15048. #license-viewer > section.window-content > .content-box .compendium-browser-settings form {
  15049. display: flex;
  15050. height: 88%;
  15051. flex-direction: column;
  15052. margin-bottom: 10px;
  15053. }
  15054. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section,
  15055. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section {
  15056. border: 1px solid #bbb;
  15057. border-radius: 5px;
  15058. margin-top: 5px;
  15059. padding: 2px;
  15060. /* Checkbox */
  15061. }
  15062. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section h3,
  15063. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section h3 {
  15064. margin: 0;
  15065. cursor: pointer;
  15066. }
  15067. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section dt,
  15068. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section dt {
  15069. width: 10%;
  15070. }
  15071. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section dt > input[type=checkbox],
  15072. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section dt > input[type=checkbox] {
  15073. transform: none;
  15074. flex: none;
  15075. height: auto;
  15076. margin: 3px 3px;
  15077. }
  15078. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section dd,
  15079. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section dd {
  15080. width: 88%;
  15081. }
  15082. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form dl,
  15083. #license-viewer > section.window-content > .content-box .compendium-browser-settings form dl {
  15084. margin: 5px 0;
  15085. }
  15086. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form dt,
  15087. #license-viewer > section.window-content > .content-box .compendium-browser-settings form dt {
  15088. display: inline-block;
  15089. width: 40%;
  15090. padding-left: 5px;
  15091. }
  15092. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form dd,
  15093. #license-viewer > section.window-content > .content-box .compendium-browser-settings form dd {
  15094. display: inline-block;
  15095. width: 58%;
  15096. margin-left: 0;
  15097. }
  15098. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container,
  15099. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container {
  15100. overflow-y: auto;
  15101. display: flex;
  15102. flex-wrap: wrap;
  15103. }
  15104. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container .tab[data-tab].active,
  15105. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container .tab[data-tab].active {
  15106. display: flex;
  15107. flex-direction: row;
  15108. flex-wrap: wrap;
  15109. justify-content: center;
  15110. width: 100%;
  15111. }
  15112. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container .single-column,
  15113. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container .single-column {
  15114. width: 100%;
  15115. }
  15116. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container h2,
  15117. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container h2 {
  15118. margin-top: 1em;
  15119. margin-bottom: 0.5em;
  15120. width: 100%;
  15121. }
  15122. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container div,
  15123. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container div {
  15124. width: 365px;
  15125. margin-right: 1em;
  15126. }
  15127. #compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav,
  15128. #license-viewer > section.window-content > .content-box .compendium-browser-settings > nav {
  15129. border-style: solid;
  15130. border-image-outset: 0;
  15131. border-width: 9px;
  15132. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  15133. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  15134. flex: 0;
  15135. width: 100%;
  15136. display: inline-flex;
  15137. justify-content: space-evenly;
  15138. align-items: center;
  15139. background: var(--secondary);
  15140. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  15141. }
  15142. #compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav > a,
  15143. #license-viewer > section.window-content > .content-box .compendium-browser-settings > nav > a {
  15144. color: var(--sidebar-label);
  15145. padding: 4px 0;
  15146. font-family: var(--sans-serif);
  15147. font-size: var(--font-size-12);
  15148. position: relative;
  15149. }
  15150. #compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav > a.active::after,
  15151. #license-viewer > section.window-content > .content-box .compendium-browser-settings > nav > a.active::after {
  15152. bottom: -2px;
  15153. right: 39%;
  15154. position: absolute;
  15155. content: "";
  15156. width: 0;
  15157. height: 0;
  15158. border-left: 4px solid transparent;
  15159. border-right: 4px solid transparent;
  15160. border-top: 4px solid var(--sidebar-label);
  15161. }
  15162. #compendium-browser > section.window-content > .content-box .compendium-browser-settings nav,
  15163. #license-viewer > section.window-content > .content-box .compendium-browser-settings nav {
  15164. border-width: unset;
  15165. }
  15166. #compendium-browser > section.window-content > .content-box .compendium-browser-settings button.save-settings,
  15167. #license-viewer > section.window-content > .content-box .compendium-browser-settings button.save-settings {
  15168. background: rgba(0, 0, 0, 0.1);
  15169. border: 2px groove var(--color-border-light-highlight);
  15170. }
  15171. #compendium-browser > section.window-content > .content-box .spell-browser,
  15172. #license-viewer > section.window-content > .content-box .spell-browser {
  15173. display: flex;
  15174. min-height: 100px;
  15175. height: 100%;
  15176. /* Sort and filter areas */
  15177. }
  15178. #compendium-browser > section.window-content > .content-box .spell-browser .control-area,
  15179. #license-viewer > section.window-content > .content-box .spell-browser .control-area {
  15180. position: sticky;
  15181. display: block;
  15182. min-width: 320px;
  15183. width: 320px;
  15184. padding-right: 5px;
  15185. overflow: auto;
  15186. }
  15187. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer,
  15188. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer,
  15189. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer,
  15190. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer {
  15191. border: 1px solid #bbb;
  15192. border-radius: 5px;
  15193. margin-top: 5px;
  15194. padding: 2px;
  15195. }
  15196. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer div.title,
  15197. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer div.title,
  15198. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer div.title,
  15199. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer div.title {
  15200. display: flex;
  15201. flex-direction: row;
  15202. justify-content: space-between;
  15203. height: 22px;
  15204. }
  15205. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer div.title h3,
  15206. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer div.title h3,
  15207. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer div.title h3,
  15208. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer div.title h3 {
  15209. margin: 0;
  15210. cursor: pointer;
  15211. }
  15212. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer div.title button,
  15213. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer div.title button,
  15214. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer div.title button,
  15215. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer div.title button {
  15216. width: fit-content;
  15217. line-height: 22px;
  15218. }
  15219. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer button.clear-filters,
  15220. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer button.clear-filters,
  15221. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer button.clear-filters,
  15222. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer button.clear-filters {
  15223. margin-bottom: 5px;
  15224. }
  15225. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer > dl dt > input[type=checkbox],
  15226. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer > dl dt > input[type=checkbox],
  15227. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer > dl dt > input[type=checkbox],
  15228. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer > dl dt > input[type=checkbox] {
  15229. transform: none;
  15230. flex: none;
  15231. height: auto;
  15232. margin: 3px 3px;
  15233. }
  15234. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer > dl dd > a.direction,
  15235. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer > dl dd > a.direction,
  15236. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer > dl dd > a.direction,
  15237. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer > dl dd > a.direction {
  15238. padding: 2px;
  15239. }
  15240. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer dt,
  15241. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer dt {
  15242. width: 10%;
  15243. }
  15244. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer dd,
  15245. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer dd {
  15246. width: 82%;
  15247. }
  15248. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer .filter-conjunction input[type=radio],
  15249. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer .filter-conjunction input[type=radio] {
  15250. margin: 0 5px 0 3px;
  15251. }
  15252. #compendium-browser > section.window-content > .content-box .spell-browser .rangecontainer div,
  15253. #license-viewer > section.window-content > .content-box .spell-browser .rangecontainer div {
  15254. text-align: center;
  15255. margin-top: 5px;
  15256. }
  15257. #compendium-browser > section.window-content > .content-box .spell-browser .rangecontainer input,
  15258. #license-viewer > section.window-content > .content-box .spell-browser .rangecontainer input {
  15259. width: 45%;
  15260. }
  15261. #compendium-browser > section.window-content > .content-box .spell-browser .slidercontainer-flex,
  15262. #license-viewer > section.window-content > .content-box .spell-browser .slidercontainer-flex {
  15263. display: flex;
  15264. justify-content: space-around;
  15265. align-items: baseline;
  15266. }
  15267. #compendium-browser > section.window-content > .content-box .spell-browser .slidercontainer-flex label,
  15268. #license-viewer > section.window-content > .content-box .spell-browser .slidercontainer-flex label {
  15269. width: 10px;
  15270. }
  15271. #compendium-browser > section.window-content > .content-box .spell-browser dl,
  15272. #license-viewer > section.window-content > .content-box .spell-browser dl {
  15273. margin: 5px 0;
  15274. }
  15275. #compendium-browser > section.window-content > .content-box .spell-browser dt,
  15276. #license-viewer > section.window-content > .content-box .spell-browser dt {
  15277. display: inline-block;
  15278. padding-left: 5px;
  15279. }
  15280. #compendium-browser > section.window-content > .content-box .spell-browser dd,
  15281. #license-viewer > section.window-content > .content-box .spell-browser dd {
  15282. display: inline-block;
  15283. text-transform: capitalize;
  15284. }
  15285. #compendium-browser > section.window-content > .content-box .spell-browser dd select,
  15286. #license-viewer > section.window-content > .content-box .spell-browser dd select {
  15287. margin-left: 0.5em;
  15288. width: 6em;
  15289. }
  15290. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list,
  15291. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list {
  15292. display: flex;
  15293. flex-direction: column;
  15294. height: 100%;
  15295. margin: 0;
  15296. padding: 0;
  15297. width: 100%;
  15298. overflow: visible scroll;
  15299. }
  15300. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li,
  15301. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li {
  15302. align-items: center;
  15303. gap: 0.25rem;
  15304. padding: 0.125rem 0.25rem;
  15305. }
  15306. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li:nth-child(odd),
  15307. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li:nth-child(odd) {
  15308. background-color: rgba(0, 0, 0, 0.12);
  15309. }
  15310. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > *,
  15311. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > * {
  15312. align-items: center;
  15313. display: flex;
  15314. height: 2rem;
  15315. justify-content: center;
  15316. }
  15317. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .image,
  15318. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .image {
  15319. max-width: 2rem;
  15320. }
  15321. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .name,
  15322. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .name {
  15323. justify-content: start;
  15324. }
  15325. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .level,
  15326. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .level {
  15327. flex-grow: 1;
  15328. font-weight: 900;
  15329. max-width: 1.5em;
  15330. }
  15331. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .price,
  15332. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .price {
  15333. flex: none;
  15334. justify-content: end;
  15335. margin-right: var(--font-size-10);
  15336. min-width: 5em;
  15337. }
  15338. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .end,
  15339. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .end {
  15340. margin-right: 0.5em;
  15341. }
  15342. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li:hover,
  15343. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li:hover {
  15344. background-color: rgba(255, 255, 255, 0.25);
  15345. cursor: grab;
  15346. }
  15347. #compendium-browser > section.window-content > .content-box .spell-browser #tagfilter input,
  15348. #license-viewer > section.window-content > .content-box .spell-browser #tagfilter input {
  15349. width: 100%;
  15350. }
  15351. #compendium-browser > section.window-content > .content-box .spell-browser .hint,
  15352. #license-viewer > section.window-content > .content-box .spell-browser .hint {
  15353. font-size: var(--font-size-12);
  15354. border: 1px solid rgba(0, 255, 5, 0.2784313725);
  15355. border-radius: 5px;
  15356. padding: 3px;
  15357. }
  15358. #compendium-browser > section.window-content > .content-box .spell-browser .spacer,
  15359. #license-viewer > section.window-content > .content-box .spell-browser .spacer {
  15360. display: inline-block;
  15361. min-width: 5px;
  15362. }
  15363. #compendium-browser > section.window-content > .content-box .spell-browser .spacer-large,
  15364. #license-viewer > section.window-content > .content-box .spell-browser .spacer-large {
  15365. display: inline-block;
  15366. min-width: 15px;
  15367. }
  15368. #compendium-browser > section.window-content > .content-box .spell-browser .equipment-controls,
  15369. #license-viewer > section.window-content > .content-box .spell-browser .equipment-controls {
  15370. margin-left: 0.25em;
  15371. margin-right: 0.25em;
  15372. max-width: 1em;
  15373. width: 1em;
  15374. }
  15375. #compendium-browser > section.window-content > .content-box .spell-browser .list-buttons,
  15376. #license-viewer > section.window-content > .content-box .spell-browser .list-buttons {
  15377. position: absolute;
  15378. bottom: 3px;
  15379. right: 22px;
  15380. width: 54%;
  15381. display: flex;
  15382. justify-content: space-between;
  15383. }
  15384. #compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button,
  15385. #license-viewer > section.window-content > .content-box .spell-browser .list-buttons button {
  15386. line-height: 19px;
  15387. background: rgb(255, 255, 240);
  15388. }
  15389. #compendium-browser > section.window-content > .content-box > section.content,
  15390. #license-viewer > section.window-content > .content-box > section.content {
  15391. height: 96%;
  15392. }
  15393. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active,
  15394. #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active {
  15395. height: inherit;
  15396. }
  15397. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active > div,
  15398. #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active > div {
  15399. display: grid;
  15400. grid-template-columns: 320px auto;
  15401. }
  15402. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active > div .control-area,
  15403. #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active > div .control-area {
  15404. grid-column-start: 1;
  15405. }
  15406. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active > div ul,
  15407. #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active > div ul {
  15408. grid-column-start: 2;
  15409. }
  15410. #compendium-browser > section.window-content > .content-box > section.content > .tab.settings.active,
  15411. #license-viewer > section.window-content > .content-box > section.content > .tab.settings.active {
  15412. height: 98%;
  15413. }
  15414. .pf2e.item.sheet h3 {
  15415. border-bottom: none;
  15416. }
  15417. .pf2e.item.sheet button > i {
  15418. margin-right: 0;
  15419. }
  15420. .pf2e.item.sheet .sheet-header {
  15421. display: flex;
  15422. flex: 0 0 70px;
  15423. align-items: bottom;
  15424. width: 100%;
  15425. padding-bottom: 6px;
  15426. border-bottom: 1px solid var(--secondary-background);
  15427. }
  15428. .pf2e.item.sheet .sheet-header img {
  15429. border: none;
  15430. object-fit: contain;
  15431. flex: 0 0 64px;
  15432. margin-right: 6px;
  15433. }
  15434. .pf2e.item.sheet .sheet-header .details {
  15435. display: flex;
  15436. flex-wrap: wrap;
  15437. align-items: baseline;
  15438. }
  15439. .pf2e.item.sheet .sheet-header .details input,
  15440. .pf2e.item.sheet .sheet-header .details .level {
  15441. font-family: var(--serif-condensed);
  15442. font-size: var(--font-size-36);
  15443. font-weight: 700;
  15444. }
  15445. .pf2e.item.sheet .sheet-header input[type=text],
  15446. .pf2e.item.sheet .sheet-header input[type=number] {
  15447. border: none;
  15448. height: var(--font-size-34);
  15449. }
  15450. .pf2e.item.sheet .sheet-header input[type=text]:hover, .pf2e.item.sheet .sheet-header input[type=text]:focus,
  15451. .pf2e.item.sheet .sheet-header input[type=number]:hover,
  15452. .pf2e.item.sheet .sheet-header input[type=number]:focus {
  15453. box-shadow: none;
  15454. }
  15455. .pf2e.item.sheet .sheet-header input[name=name] {
  15456. flex: 1;
  15457. }
  15458. .pf2e.item.sheet .sheet-header .level {
  15459. flex: 0;
  15460. white-space: nowrap;
  15461. margin-left: auto;
  15462. padding-left: 8px;
  15463. }
  15464. .pf2e.item.sheet .sheet-header .level i {
  15465. font-size: 0.6em;
  15466. vertical-align: middle;
  15467. }
  15468. .pf2e.item.sheet .sheet-header .level input {
  15469. width: 40px;
  15470. text-align: center;
  15471. }
  15472. .pf2e.item.sheet .sheet-header .feat-action-cost {
  15473. font-size: 2.5rem;
  15474. margin-top: -0.6rem;
  15475. margin-bottom: -0.3rem;
  15476. padding-left: 0.4rem;
  15477. }
  15478. .pf2e.item.sheet .sheet-header .paizo-style {
  15479. flex-basis: 100%;
  15480. width: 0;
  15481. border: none;
  15482. margin-top: 2px;
  15483. padding-left: 0;
  15484. padding-right: 0;
  15485. }
  15486. .pf2e.item.sheet .sheet-body {
  15487. height: calc(100% - 35px);
  15488. overflow: hidden;
  15489. display: flex;
  15490. flex-direction: column;
  15491. flex-wrap: nowrap;
  15492. }
  15493. .pf2e.item.sheet.action form .drop-zone {
  15494. align-items: center;
  15495. border: 1px solid var(--color-border-light-tertiary);
  15496. display: flex;
  15497. gap: 0.25rem;
  15498. max-width: fit-content;
  15499. padding: 0 4px 0 0;
  15500. }
  15501. .pf2e.item.sheet.action form .drop-zone.empty {
  15502. font-weight: normal;
  15503. min-width: 12rem;
  15504. padding: 4px;
  15505. }
  15506. .pf2e.item.sheet.action form .drop-zone.empty .name {
  15507. font-style: italic;
  15508. flex: 1;
  15509. text-align: center;
  15510. }
  15511. .pf2e.item.sheet.action form .drop-zone picture,
  15512. .pf2e.item.sheet.action form .drop-zone img {
  15513. border: 1px solid var(--color-border-dark);
  15514. border-radius: 2px;
  15515. box-sizing: border-box;
  15516. display: block;
  15517. float: left;
  15518. height: 24px;
  15519. width: 24px;
  15520. }
  15521. .pf2e.item.sheet.action form .drop-zone a.content-link {
  15522. align-items: center;
  15523. border: none;
  15524. border-right: 1px solid var(--color-border-light-2);
  15525. display: flex;
  15526. gap: 0.5em;
  15527. min-width: 9rem;
  15528. padding: 4px;
  15529. }
  15530. .pf2e.item.sheet.action form .drop-zone a.delete {
  15531. display: flex;
  15532. }
  15533. .pf2e.item.sheet.affliction form .affliction-stage .link:not(.linked) {
  15534. opacity: 0.6;
  15535. color: #a00;
  15536. }
  15537. .pf2e.item.sheet.affliction form .affliction-stage .formula-row {
  15538. align-items: center;
  15539. display: flex;
  15540. gap: 4px;
  15541. }
  15542. .pf2e.item.sheet.deity form .tab.details .checkbox-pair {
  15543. align-items: center;
  15544. display: flex;
  15545. }
  15546. .pf2e.item.sheet.deity form .tab.details .checkbox-pair span {
  15547. font-weight: 400;
  15548. }
  15549. .pf2e.item.sheet.effect form .sheet-content .sidebar .inventory-details .form-group select {
  15550. max-width: fit-content;
  15551. }
  15552. .pf2e.item.sheet.effect form .sheet-content .sidebar .inventory-details .form-group .form-group.duration label {
  15553. max-width: fit-content;
  15554. padding-right: 0.1em;
  15555. }
  15556. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row {
  15557. align-items: center;
  15558. display: flex;
  15559. gap: 4px;
  15560. width: 100%;
  15561. }
  15562. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row label {
  15563. cursor: pointer;
  15564. max-width: unset;
  15565. }
  15566. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row input[type=radio] {
  15567. margin: 0;
  15568. top: 0;
  15569. }
  15570. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row .badge-value {
  15571. margin-right: 0.1rem;
  15572. width: 3ch;
  15573. font-weight: bold;
  15574. text-align: end;
  15575. }
  15576. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row input[type=text] {
  15577. flex: 1;
  15578. text-align: end;
  15579. }
  15580. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-header {
  15581. display: flex;
  15582. align-items: center;
  15583. justify-content: space-between;
  15584. margin: 0.5em 0 0.25em 0;
  15585. }
  15586. .pf2e.item.sheet.effect form .sheet-content .sidebar .add-badge {
  15587. display: flex;
  15588. align-items: center;
  15589. }
  15590. .pf2e.item.sheet.effect form .sheet-content .sidebar .add-badge select {
  15591. flex: 1;
  15592. max-width: unset;
  15593. }
  15594. .pf2e.item.sheet.effect form .sheet-content .sidebar .add-badge button {
  15595. flex: 0;
  15596. line-height: 1.2em;
  15597. }
  15598. .pf2e.item.sheet.feat form .drop-zone {
  15599. align-items: center;
  15600. border: 1px solid var(--color-border-light-tertiary);
  15601. display: flex;
  15602. gap: 0.25rem;
  15603. max-width: fit-content;
  15604. padding: 0 4px 0 0;
  15605. }
  15606. .pf2e.item.sheet.feat form .drop-zone.empty {
  15607. font-weight: normal;
  15608. min-width: 12rem;
  15609. padding: 4px;
  15610. }
  15611. .pf2e.item.sheet.feat form .drop-zone.empty .name {
  15612. font-style: italic;
  15613. flex: 1;
  15614. text-align: center;
  15615. }
  15616. .pf2e.item.sheet.feat form .drop-zone picture,
  15617. .pf2e.item.sheet.feat form .drop-zone img {
  15618. border: 1px solid var(--color-border-dark);
  15619. border-radius: 2px;
  15620. box-sizing: border-box;
  15621. display: block;
  15622. float: left;
  15623. height: 24px;
  15624. width: 24px;
  15625. }
  15626. .pf2e.item.sheet.feat form .drop-zone a.content-link {
  15627. align-items: center;
  15628. border: none;
  15629. border-right: 1px solid var(--color-border-light-2);
  15630. display: flex;
  15631. gap: 0.5em;
  15632. min-width: 9rem;
  15633. padding: 4px;
  15634. }
  15635. .pf2e.item.sheet.feat form .drop-zone a.delete {
  15636. display: flex;
  15637. }
  15638. .pf2e.item.sheet.feat form .tab.details .form-group > label {
  15639. min-width: fit-content;
  15640. margin-right: 1em;
  15641. }
  15642. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry {
  15643. flex-wrap: nowrap;
  15644. width: 100%;
  15645. white-space: nowrap;
  15646. max-width: 100%;
  15647. }
  15648. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry label {
  15649. flex: 0;
  15650. }
  15651. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone {
  15652. background-color: rgba(0, 0, 0, 0.05);
  15653. border-radius: 2px;
  15654. border: 1px dotted var(--alt-dark);
  15655. display: flex;
  15656. font-weight: normal;
  15657. justify-content: center;
  15658. margin: 2px 3px 0 auto;
  15659. max-width: 8em;
  15660. padding: 3px;
  15661. position: relative;
  15662. }
  15663. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone span {
  15664. display: inline-block;
  15665. overflow: hidden;
  15666. text-overflow: ellipsis;
  15667. }
  15668. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone.ancestry-ref-broken {
  15669. background-color: rgba(255, 0, 0, 0.15);
  15670. border-color: var(--primary);
  15671. }
  15672. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone a.remove-ancestry {
  15673. display: none;
  15674. position: absolute;
  15675. right: -0.5em;
  15676. top: -0.25em;
  15677. }
  15678. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone a.remove-ancestry:hover {
  15679. display: flex;
  15680. }
  15681. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone:hover a.remove-ancestry {
  15682. display: flex;
  15683. }
  15684. .pf2e.item.sheet.kit form .kit-list ul.kit-items {
  15685. padding: 0;
  15686. }
  15687. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item {
  15688. display: grid;
  15689. grid-template-columns: 26px 30px auto 10px;
  15690. align-items: center;
  15691. }
  15692. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item:nth-of-type(even) {
  15693. background-color: rgba(120, 100, 82, 0.1);
  15694. }
  15695. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item .kit-item-name {
  15696. line-height: 1em;
  15697. height: 1em;
  15698. }
  15699. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item .kit-item-name .fa.fa-globe {
  15700. padding: 0 3px;
  15701. float: right;
  15702. }
  15703. .pf2e.item.sheet.kit form .kit-list ul.kit-items ul {
  15704. padding-left: 0.5em;
  15705. margin-top: 0;
  15706. grid-column: 1/5;
  15707. }
  15708. .pf2e.item.sheet.kit form .kit-list ul.kit-items ul:empty {
  15709. display: none;
  15710. }
  15711. .pf2e.item.sheet.melee form .sheet-body .tab.details .form-group.attack-modifier label,
  15712. .pf2e.item.sheet.melee form .sheet-body .tab.details li.damage-partial form-group label {
  15713. max-width: fit-content;
  15714. }
  15715. .pf2e.item.sheet.melee form .sheet-body .tab.details .form-group.attack-modifier input,
  15716. .pf2e.item.sheet.melee form .sheet-body .tab.details li.damage-partial form-group input {
  15717. max-width: 6ch;
  15718. }
  15719. .pf2e.item.sheet.melee form .sheet-body .tab.details ol.form-list li.damage-partial {
  15720. align-items: center;
  15721. display: flex;
  15722. gap: 1em;
  15723. }
  15724. .pf2e.item.sheet.melee form .sheet-body .tab.details ol.form-list li.damage-partial input {
  15725. max-width: 12ch;
  15726. }
  15727. .pf2e.item.sheet.melee form .sheet-body .tab.details ol.form-list li.damage-partial .type {
  15728. gap: 0.25em;
  15729. }
  15730. .pf2e.item.sheet.melee form .sheet-body .tab.details ol.form-list li.damage-partial .remove-partial {
  15731. margin: 0 0.5em 0 auto;
  15732. }
  15733. .pf2e.item.sheet.spell form .damage-formulas {
  15734. margin-top: 8px;
  15735. }
  15736. .pf2e.item.sheet.spell form .damage-formulas .form-fields {
  15737. gap: 2px;
  15738. margin-top: 4px;
  15739. }
  15740. .pf2e.item.sheet.spell form .damage-formulas input[type=checkbox] {
  15741. margin-left: 2px;
  15742. }
  15743. .pf2e.item.sheet.spell form .damage-formulas .traits-list {
  15744. display: flex;
  15745. margin-top: 2px;
  15746. }
  15747. .pf2e.item.sheet.spell form .damage-formulas .tag {
  15748. float: none;
  15749. }
  15750. .pf2e.item.sheet.spell form button[data-action=damage-add] {
  15751. margin-top: 4px;
  15752. }
  15753. .pf2e.item.sheet.spell form .variants .variant {
  15754. display: grid;
  15755. grid-template-columns: 1fr 1fr 0.2fr;
  15756. }
  15757. .pf2e.item.sheet.spell form .variants .variant .item-controls {
  15758. justify-self: end;
  15759. }
  15760. .pf2e.item.sheet.weapon form .tab.details label {
  15761. min-width: 9em;
  15762. }
  15763. .pf2e.item.sheet.weapon form .tab.details .precious-material select {
  15764. width: 19.5em;
  15765. }
  15766. .pf2e.item.sheet form {
  15767. display: flex;
  15768. flex-direction: column;
  15769. flex-wrap: nowrap;
  15770. width: 100%;
  15771. height: 100%;
  15772. overflow: hidden;
  15773. }
  15774. .pf2e.item.sheet form .item-ref-group ul.item-refs {
  15775. border: 1px solid var(--color-border-light-2);
  15776. border-radius: 3px;
  15777. padding: 0;
  15778. }
  15779. .pf2e.item.sheet form .item-ref-group ul.item-refs.empty {
  15780. background-color: rgba(120, 100, 82, 0.1);
  15781. height: 28px;
  15782. }
  15783. .pf2e.item.sheet form .item-ref-group ul.item-refs > li {
  15784. align-items: center;
  15785. display: grid;
  15786. grid-template-columns: 26px auto 2em 1em;
  15787. padding: 1px;
  15788. }
  15789. .pf2e.item.sheet form .item-ref-group ul.item-refs > li:nth-of-type(even) {
  15790. background-color: rgba(120, 100, 82, 0.1);
  15791. }
  15792. .pf2e.item.sheet form .item-ref-group ul.item-refs > li .name {
  15793. display: block;
  15794. margin-left: 0.25em;
  15795. line-height: 1em;
  15796. height: 1em;
  15797. }
  15798. .pf2e.item.sheet form .item-ref-group ul.item-refs > li .name .fa.fa-globe {
  15799. padding: 0 3px;
  15800. float: right;
  15801. }
  15802. .pf2e.item.sheet form .item-ref-group ul.item-refs > li .level {
  15803. font-weight: bold;
  15804. height: 1.25em;
  15805. text-align: center;
  15806. }
  15807. .pf2e.item.sheet form .item-ref-group ul.item-refs > li a.remove {
  15808. padding: 0 2px;
  15809. }
  15810. .pf2e.item.sheet form .item-ref-group ul.item-refs ul {
  15811. grid-column: 1/5;
  15812. margin-top: 0;
  15813. padding-left: 0.5em;
  15814. }
  15815. .pf2e.item.sheet form .item-ref-group ul.item-refs ul:empty {
  15816. display: none;
  15817. }
  15818. .pf2e.item.sheet form .item-ref-list {
  15819. align-items: start;
  15820. }
  15821. .pf2e.item.sheet form .form-group.form-group-trait {
  15822. height: auto;
  15823. margin: 2px 0;
  15824. }
  15825. .pf2e.item.sheet form .form-group.form-group-trait label {
  15826. vertical-align: top;
  15827. }
  15828. .pf2e.item.sheet form .form-group.form-group-trait > ul.abc-traits-list {
  15829. list-style: none;
  15830. margin: 0;
  15831. padding: 0;
  15832. display: flex;
  15833. flex-wrap: wrap;
  15834. }
  15835. .pf2e.item.sheet form .form-group.form-group-trait > ul.abc-traits-list span.tag {
  15836. float: none;
  15837. }
  15838. .pf2e.item.sheet form .form-group.other-weapons input {
  15839. flex: 2;
  15840. }
  15841. .pf2e.item.sheet form .form-group.other-weapons select {
  15842. flex: 1;
  15843. }
  15844. .pf2e.item.sheet form .form-group.additional-language input {
  15845. flex: 0.5;
  15846. }
  15847. .pf2e.item.sheet form .form-group.additional-language span {
  15848. flex: 2.5;
  15849. padding-left: 4px;
  15850. }
  15851. .pf2e.item.sheet form .item-activations {
  15852. padding: 8px 8px 0;
  15853. overflow: hidden scroll;
  15854. }
  15855. .pf2e.item.sheet form .item-activations .activation + .activation, .pf2e.item.sheet form .item-activations .activation + button {
  15856. margin-top: 0.5em;
  15857. }
  15858. .pf2e.item.sheet form .item-activations .activation .editor {
  15859. min-height: 28px;
  15860. }
  15861. .pf2e.item.sheet form .item-activations header {
  15862. font-size: 1.05em;
  15863. margin-bottom: 0.25em;
  15864. line-height: 1.25em;
  15865. }
  15866. .pf2e.item.sheet form .item-activations .activation-time {
  15867. flex: 1;
  15868. height: 20px;
  15869. }
  15870. .pf2e.item.sheet form .item-activations .frequency {
  15871. flex: 1;
  15872. gap: 4px;
  15873. padding-right: 6px;
  15874. }
  15875. .pf2e.item.sheet form .item-activations .frequency input[type=number] {
  15876. border: none;
  15877. background: none;
  15878. text-align: right;
  15879. margin: 0 0 0 24px;
  15880. }
  15881. .pf2e.item.sheet form .item-activations .frequency > select:first-child {
  15882. margin-left: 24px;
  15883. }
  15884. .pf2e.item.sheet form .item-activations .frequency.empty {
  15885. text-align: right;
  15886. }
  15887. .pf2e.item.sheet form .item-activations .tags {
  15888. margin-top: 4px;
  15889. }
  15890. .pf2e.item.sheet form .item-activations .tags label {
  15891. margin-right: 3px;
  15892. }
  15893. .pf2e.item.sheet form .item-activations .tox {
  15894. min-height: 150px;
  15895. }
  15896. .pf2e.item.sheet form .identify-popup {
  15897. min-width: 300px;
  15898. }
  15899. .pf2e.item.sheet form .sheet-body .tab.mystification.active .mystification-status select {
  15900. max-width: fit-content;
  15901. margin-right: auto;
  15902. }
  15903. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified {
  15904. display: flex;
  15905. align-items: center;
  15906. gap: 0.5rem;
  15907. flex-wrap: wrap;
  15908. }
  15909. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified > * {
  15910. display: flex;
  15911. }
  15912. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified img {
  15913. height: 42px;
  15914. width: 42px;
  15915. }
  15916. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified input {
  15917. width: 50%;
  15918. }
  15919. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified .editor {
  15920. min-height: 100px;
  15921. width: 100%;
  15922. }
  15923. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified .tox.tox-tinymce {
  15924. min-height: 200px;
  15925. }
  15926. .pf2e.item.sheet form .tab.active.rules select {
  15927. font-size: var(--font-size-12);
  15928. height: 1.36rem;
  15929. width: auto;
  15930. }
  15931. .pf2e.item.sheet form .tab.active.rules select span {
  15932. padding: 0;
  15933. }
  15934. .pf2e.item.sheet form .tab.active.rules fieldset {
  15935. border-radius: 5px;
  15936. border: 1px solid var(--secondary-background);
  15937. padding: 0.25em;
  15938. }
  15939. .pf2e.item.sheet form .tab.active.rules fieldset legend {
  15940. font-weight: 500;
  15941. }
  15942. .pf2e.item.sheet form .tab.active.rules .nerd-details {
  15943. margin-bottom: 10px;
  15944. }
  15945. .pf2e.item.sheet form .tab.active.rules .nerd-details .form-group {
  15946. margin: 0;
  15947. }
  15948. .pf2e.item.sheet form .tab.active.rules .nerd-details label {
  15949. align-items: center;
  15950. display: flex;
  15951. flex: 0 0 70px;
  15952. line-height: 1.5em;
  15953. margin-right: 4px;
  15954. min-width: 8em;
  15955. }
  15956. .pf2e.item.sheet form .tab.active.rules .nerd-details label i.fa-info-circle {
  15957. margin-left: auto;
  15958. margin-right: 0.5em;
  15959. }
  15960. .pf2e.item.sheet form .tab.active.rules .rules {
  15961. padding-top: 7px;
  15962. padding-right: 7px;
  15963. }
  15964. .pf2e.item.sheet form .tab.active.rules .rules .add-rule-element {
  15965. text-align: right;
  15966. }
  15967. .pf2e.item.sheet form .tab.active.rules .rules textarea {
  15968. padding: 4px;
  15969. min-height: 60px;
  15970. resize: vertical;
  15971. }
  15972. .pf2e.item.sheet form .tab.active.rules .create-rule-element {
  15973. display: flex;
  15974. align-items: center;
  15975. white-space: nowrap;
  15976. gap: 6px;
  15977. justify-content: flex-end;
  15978. }
  15979. .pf2e.item.sheet form .tab.active.rules .rule-editing {
  15980. display: flex;
  15981. flex-direction: column;
  15982. height: 100%;
  15983. gap: 5px;
  15984. }
  15985. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor {
  15986. flex: 1;
  15987. background-color: white;
  15988. overflow: hidden;
  15989. }
  15990. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor .cm-scroller {
  15991. overflow: hidden scroll;
  15992. overflow: scroll;
  15993. }
  15994. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor button {
  15995. width: auto;
  15996. line-height: normal;
  15997. }
  15998. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor input[type=checkbox] {
  15999. width: auto;
  16000. height: auto;
  16001. }
  16002. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor label {
  16003. display: inline;
  16004. }
  16005. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor .cm-search .cm-textfield {
  16006. width: 100px;
  16007. }
  16008. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor ::selection {
  16009. color: var(--text-dark);
  16010. }
  16011. .pf2e.item.sheet form .tab.active.rules .rule-editing .item-controls {
  16012. margin: 0;
  16013. }
  16014. .pf2e.item.sheet form .tab.active.rules .rule-form {
  16015. --form-field-height: normal;
  16016. border-bottom: 1px solid var(--color-border-light-primary);
  16017. padding-bottom: 0.5rem;
  16018. margin-bottom: 0.5rem;
  16019. }
  16020. .pf2e.item.sheet form .tab.active.rules .rule-form.drag-preview {
  16021. background: url(../ui/parchment.jpg) repeat;
  16022. }
  16023. .pf2e.item.sheet form .tab.active.rules .rule-form.drag-gap {
  16024. visibility: hidden;
  16025. }
  16026. .pf2e.item.sheet form .tab.active.rules .rule-form input::placeholder {
  16027. opacity: 0.9;
  16028. }
  16029. .pf2e.item.sheet form .tab.active.rules .rule-form label {
  16030. align-items: center;
  16031. display: flex;
  16032. gap: 4px;
  16033. font-weight: 500;
  16034. white-space: nowrap;
  16035. }
  16036. .pf2e.item.sheet form .tab.active.rules .rule-form label:not(:first-child) {
  16037. padding-left: 2px;
  16038. }
  16039. .pf2e.item.sheet form .tab.active.rules .rule-form label input,
  16040. .pf2e.item.sheet form .tab.active.rules .rule-form label tags {
  16041. flex: 1;
  16042. }
  16043. .pf2e.item.sheet form .tab.active.rules .rule-form label input[type=checkbox] {
  16044. width: 1rem;
  16045. height: 1rem;
  16046. flex-basis: auto;
  16047. }
  16048. .pf2e.item.sheet form .tab.active.rules .rule-form label input[type=checkbox]:first-child:last-child {
  16049. margin-left: auto;
  16050. justify-self: flex-end;
  16051. }
  16052. .pf2e.item.sheet form .tab.active.rules .rule-form select.short {
  16053. flex: 0 0 auto;
  16054. }
  16055. .pf2e.item.sheet form .tab.active.rules .rule-form .content-link {
  16056. display: flex;
  16057. flex: 0 0 auto;
  16058. flex-direction: row;
  16059. align-items: center;
  16060. gap: 3px;
  16061. }
  16062. .pf2e.item.sheet form .tab.active.rules .rule-form .content-link img {
  16063. width: 16px;
  16064. height: 16px;
  16065. }
  16066. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header {
  16067. display: flex;
  16068. align-items: center;
  16069. margin-bottom: 0.25rem;
  16070. }
  16071. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header .drag-handle {
  16072. cursor: grab;
  16073. font-weight: normal;
  16074. margin-right: 0.375rem;
  16075. padding: 0.125rem;
  16076. }
  16077. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header h3 {
  16078. flex: 1;
  16079. margin: 0;
  16080. }
  16081. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header h3.unrecognized {
  16082. color: #880000;
  16083. }
  16084. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header .priority {
  16085. margin-right: 0.75rem;
  16086. }
  16087. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header .priority input {
  16088. width: 4ch;
  16089. }
  16090. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header .item-controls {
  16091. margin-left: auto;
  16092. }
  16093. .pf2e.item.sheet form .tab.active.rules .rule-form .form-fields [data-action] {
  16094. flex: 0 0 auto;
  16095. }
  16096. .pf2e.item.sheet form .tab.active.rules .rule-form .range {
  16097. display: flex;
  16098. gap: 3px;
  16099. align-items: center;
  16100. }
  16101. .pf2e.item.sheet form .tab.active.rules .rule-form .range input {
  16102. width: 40px;
  16103. }
  16104. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input {
  16105. align-items: center;
  16106. display: flex;
  16107. flex: 2;
  16108. justify-content: center;
  16109. }
  16110. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .attachment,
  16111. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input input,
  16112. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .tags {
  16113. z-index: 0;
  16114. }
  16115. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .attachment:hover, .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .attachment:focus,
  16116. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input input:hover,
  16117. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input input:focus,
  16118. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .tags:hover,
  16119. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .tags:focus {
  16120. z-index: 1;
  16121. }
  16122. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .attachment {
  16123. display: flex;
  16124. justify-content: center;
  16125. align-items: center;
  16126. padding: 0 6px;
  16127. margin: 0;
  16128. line-height: unset;
  16129. flex: 0 0 auto;
  16130. width: auto;
  16131. min-width: 68px;
  16132. align-self: stretch;
  16133. border: 1px solid #aaa;
  16134. border-right: none;
  16135. border-radius: 3px 0 0 3px;
  16136. }
  16137. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .file-picker {
  16138. line-height: unset;
  16139. }
  16140. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input input,
  16141. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input tags {
  16142. border-top-left-radius: 0;
  16143. border-bottom-left-radius: 0;
  16144. margin: 0;
  16145. flex: 1;
  16146. }
  16147. .pf2e.item.sheet form .tab.active.rules .rule-form .brackets {
  16148. margin-left: 9.5em;
  16149. }
  16150. .pf2e.item.sheet form .tab.active.rules .rule-form .brackets .bracket {
  16151. align-items: center;
  16152. display: flex;
  16153. gap: 4px;
  16154. }
  16155. .pf2e.item.sheet form .tab.active.rules .rule-form .brackets .bracket .value {
  16156. flex: 1;
  16157. }
  16158. .pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs {
  16159. border-bottom: 1px solid var(--secondary-background);
  16160. }
  16161. .pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 {
  16162. display: flex;
  16163. justify-content: space-evenly;
  16164. width: 100%;
  16165. margin-top: 0.5em;
  16166. font-weight: 200;
  16167. }
  16168. .pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs a.active {
  16169. font-weight: 600;
  16170. text-decoration: underline;
  16171. }
  16172. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container {
  16173. display: flex;
  16174. justify-content: center;
  16175. align-items: center;
  16176. width: 100%;
  16177. height: 4em;
  16178. }
  16179. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone {
  16180. display: flex;
  16181. justify-content: center;
  16182. align-items: center;
  16183. width: 40%;
  16184. height: 3.5em;
  16185. border: 1px solid var(--color-border-light-primary);
  16186. border-radius: 3px;
  16187. color: #222;
  16188. background-color: #ddd;
  16189. cursor: default;
  16190. padding: 1px 6px;
  16191. font-family: var(--font-primary);
  16192. font-size: var(--font-size-14);
  16193. line-height: 28px;
  16194. }
  16195. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone i {
  16196. border: 1px solid #bbb;
  16197. border-radius: 2px;
  16198. align-items: center;
  16199. display: flex;
  16200. height: 1.6em;
  16201. justify-content: center;
  16202. margin-right: 0.5em;
  16203. width: 1.6em;
  16204. }
  16205. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone i:after {
  16206. font-size: var(--font-size-20);
  16207. }
  16208. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone span {
  16209. color: var(--text-dark);
  16210. }
  16211. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .grid-item {
  16212. display: grid;
  16213. grid: 1fr/5em 1fr;
  16214. }
  16215. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .grid-item.long-label {
  16216. grid: 1fr/9em 1fr;
  16217. }
  16218. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .checkbox {
  16219. display: flex;
  16220. justify-content: flex-end;
  16221. }
  16222. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .item-controls {
  16223. justify-content: flex-end;
  16224. }
  16225. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .item-controls a {
  16226. margin: 2px 5px 0 0;
  16227. }
  16228. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .stacked {
  16229. display: grid;
  16230. grid-template-columns: 1fr 1fr;
  16231. column-gap: 0.5rem;
  16232. }
  16233. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .column-span-two {
  16234. grid-column: span 2;
  16235. }
  16236. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .resolvable {
  16237. grid-column: span 2;
  16238. display: flex;
  16239. align-items: center;
  16240. }
  16241. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .brackets-container {
  16242. grid-column: span 3;
  16243. }
  16244. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] label {
  16245. min-width: 5em;
  16246. font-weight: 500;
  16247. }
  16248. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] label.short {
  16249. max-width: 5em;
  16250. }
  16251. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] label.with-hint {
  16252. margin-right: 5px;
  16253. }
  16254. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] fieldset {
  16255. grid-column: span 2;
  16256. padding-bottom: 0.4rem;
  16257. }
  16258. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .brackets {
  16259. margin-left: 6em;
  16260. }
  16261. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] hr {
  16262. grid-column: span 2;
  16263. width: 100%;
  16264. }
  16265. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] {
  16266. height: 90px;
  16267. overflow-y: auto;
  16268. }
  16269. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .item-container {
  16270. grid-column: span 2;
  16271. display: grid;
  16272. grid: 1fr/5em 10fr 1fr;
  16273. }
  16274. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .item-container a.content-link {
  16275. display: flex;
  16276. align-items: center;
  16277. gap: 0.5em;
  16278. width: fit-content;
  16279. min-width: 12rem;
  16280. height: 2em;
  16281. padding: 4px;
  16282. }
  16283. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .item-container a.content-link img {
  16284. border: 1px solid var(--color-border-dark);
  16285. border-radius: 2px;
  16286. box-sizing: border-box;
  16287. display: block;
  16288. float: left;
  16289. height: 24px;
  16290. width: 24px;
  16291. }
  16292. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .item-container a.content-link span {
  16293. text-wrap: wrap;
  16294. }
  16295. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .three-items {
  16296. grid-column: span 2;
  16297. display: grid;
  16298. grid: 1fr/5em 8fr 7em 5fr 6em 1fr;
  16299. margin-top: 5px;
  16300. }
  16301. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .three-items select {
  16302. width: fit-content;
  16303. min-width: 10em;
  16304. }
  16305. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .saves-container {
  16306. display: grid;
  16307. grid: 1fr/5em 8.8fr;
  16308. align-items: center;
  16309. row-gap: 5px;
  16310. }
  16311. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .saves-container select {
  16312. width: fit-content;
  16313. min-width: 10em;
  16314. }
  16315. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .rules-drop-container {
  16316. grid-column: span 2;
  16317. }
  16318. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .translation input {
  16319. width: 5em;
  16320. }
  16321. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] input[type=checkbox] {
  16322. margin-left: unset;
  16323. }
  16324. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items {
  16325. display: flex;
  16326. justify-content: space-between;
  16327. gap: 0.5em;
  16328. }
  16329. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items > label {
  16330. min-width: unset;
  16331. width: fit-content;
  16332. }
  16333. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker {
  16334. align-items: center;
  16335. display: flex;
  16336. width: 16rem;
  16337. white-space: nowrap;
  16338. }
  16339. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker input[type=text] {
  16340. flex: 1;
  16341. }
  16342. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker input[type=color] {
  16343. flex: 2;
  16344. height: 94%;
  16345. }
  16346. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker input[type=color]:disabled {
  16347. background: rgba(0, 0, 0, 0.05);
  16348. border: 1px solid transparent;
  16349. }
  16350. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker .user {
  16351. flex: 0;
  16352. gap: 0;
  16353. justify-content: start;
  16354. }
  16355. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker .user input[type=checkbox] {
  16356. flex: 0;
  16357. margin-left: 0;
  16358. }
  16359. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker .user span {
  16360. font-size: small;
  16361. }
  16362. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items {
  16363. display: grid;
  16364. grid-template-columns: 5em 2.5fr 1fr;
  16365. align-items: center;
  16366. }
  16367. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items.long-label {
  16368. grid: 1fr/9em 2.5fr 1fr;
  16369. }
  16370. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items input[type=color] {
  16371. min-width: 7em;
  16372. }
  16373. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items.image-path {
  16374. grid-column: span 2;
  16375. grid: 1fr/9em 8fr 1fr;
  16376. }
  16377. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items.image-path button.file-picker {
  16378. margin: unset;
  16379. }
  16380. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Note] {
  16381. display: flex;
  16382. flex-direction: column;
  16383. gap: 2px;
  16384. }
  16385. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] {
  16386. display: grid;
  16387. grid: "label content" 1fr/1fr 1fr;
  16388. column-gap: 5px;
  16389. }
  16390. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] fieldset.radii {
  16391. display: flex;
  16392. flex-direction: column;
  16393. grid-column: span 2;
  16394. }
  16395. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] fieldset.radii .brackets {
  16396. margin-left: 6.5em;
  16397. }
  16398. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] label {
  16399. display: flex;
  16400. flex: unset;
  16401. margin-left: 5px;
  16402. margin-right: 5px;
  16403. }
  16404. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] label.short {
  16405. min-width: 5em;
  16406. }
  16407. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] .column-span-two {
  16408. grid-column: span 2;
  16409. }
  16410. .pf2e.item.sheet form label {
  16411. display: block;
  16412. }
  16413. .pf2e.item.sheet form input:not(:disabled) {
  16414. color: var(--color-text-dark-input);
  16415. }
  16416. .pf2e.item.sheet form .mce-panel span {
  16417. display: inherit;
  16418. }
  16419. .pf2e.item.sheet form.editable .rollable:hover {
  16420. color: var(--text-dark);
  16421. text-shadow: 0 0 10px #00005a;
  16422. cursor: pointer;
  16423. }
  16424. .pf2e.item.sheet form .tab {
  16425. flex: 1;
  16426. }
  16427. .pf2e.item.sheet form:has(.tab.active.rules) .sidebar-summary {
  16428. visibility: hidden;
  16429. }
  16430. .pf2e.item.sheet form:has(.tab.active.rules) section.sidebar {
  16431. display: none;
  16432. }
  16433. .pf2e.item.sheet form .tag-legacy {
  16434. float: left;
  16435. margin: 0 2px 2px 0;
  16436. padding: 0 3px;
  16437. font-size: var(--font-size-10);
  16438. line-height: 16px;
  16439. border: 1px solid #999;
  16440. border-radius: 3px;
  16441. white-space: normal;
  16442. font-weight: 500;
  16443. }
  16444. .pf2e.item.sheet form p.hint {
  16445. font-family: var(--font-primary);
  16446. font-weight: normal;
  16447. }
  16448. .pf2e.item.sheet form .item-controls {
  16449. display: flex;
  16450. margin: 0 0 0 4px;
  16451. align-items: baseline;
  16452. gap: 2px;
  16453. }
  16454. .pf2e.item.sheet form i.fa-info-circle {
  16455. cursor: help;
  16456. }
  16457. .pf2e.item.sheet form > nav {
  16458. display: flex;
  16459. align-items: baseline;
  16460. border-bottom: 1px solid var(--secondary-background);
  16461. flex: 0 0 30px;
  16462. line-height: 30px;
  16463. margin-bottom: 0.5rem;
  16464. }
  16465. .pf2e.item.sheet form > nav a {
  16466. flex: 1 1 auto;
  16467. }
  16468. .pf2e.item.sheet form > nav a.active {
  16469. text-decoration: underline;
  16470. }
  16471. .pf2e.item.sheet form > nav .sidebar-summary {
  16472. flex: 0 0 220px;
  16473. margin: 0;
  16474. text-align: center;
  16475. }
  16476. .pf2e.item.sheet form > nav .sheet-tabs {
  16477. font-weight: 500;
  16478. margin: 0;
  16479. flex: 1;
  16480. align-items: baseline;
  16481. }
  16482. .pf2e.item.sheet form > nav .sheet-tabs > .list-row {
  16483. font-size: var(--font-size-12);
  16484. text-align: center;
  16485. }
  16486. .pf2e.item.sheet form > nav .sheet-tabs > .list-row:last-of-type {
  16487. padding-right: 4px;
  16488. }
  16489. .pf2e.item.sheet form > nav .sheet-tabs > .list-row.active {
  16490. font-weight: 600;
  16491. }
  16492. .pf2e.item.sheet form .sheet-content {
  16493. width: 100%;
  16494. display: flex;
  16495. flex-direction: row;
  16496. flex-wrap: wrap;
  16497. justify-content: flex-start;
  16498. height: calc(100% - 35px);
  16499. overflow: hidden;
  16500. }
  16501. .pf2e.item.sheet form .sheet-content > * {
  16502. flex: 1;
  16503. }
  16504. .pf2e.item.sheet form .sheet-content > section.sidebar,
  16505. .pf2e.item.sheet form .sheet-content > .sheet-body {
  16506. height: calc(100% - 10px);
  16507. overflow-y: auto;
  16508. }
  16509. .pf2e.item.sheet form .sheet-content section.sidebar {
  16510. flex: 0 0 220px;
  16511. display: flex;
  16512. flex-direction: column;
  16513. flex-wrap: nowrap;
  16514. }
  16515. .pf2e.item.sheet form .sheet-content section.sidebar > * {
  16516. flex: 1;
  16517. }
  16518. .pf2e.item.sheet form .sheet-content section.sidebar .item-summary {
  16519. font-family: var(--serif-condensed);
  16520. font-weight: 700;
  16521. flex: 0 0 28px;
  16522. line-height: 28px;
  16523. text-align: center;
  16524. font-size: var(--font-size-18);
  16525. color: #444;
  16526. }
  16527. .pf2e.item.sheet form .sheet-content section.sidebar ol.item-tags {
  16528. padding-left: 0;
  16529. flex: 0;
  16530. list-style: none;
  16531. }
  16532. .pf2e.item.sheet form .sheet-content section.sidebar ol.item-tags .tag {
  16533. align-items: center;
  16534. justify-content: center;
  16535. width: 100%;
  16536. }
  16537. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details,
  16538. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details {
  16539. overflow: hidden scroll;
  16540. padding: 0 4px 0 0;
  16541. }
  16542. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details label,
  16543. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details label {
  16544. font-weight: 500;
  16545. max-width: 6em;
  16546. white-space: nowrap;
  16547. }
  16548. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group,
  16549. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group {
  16550. margin: 3px 0;
  16551. }
  16552. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group input,
  16553. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group input {
  16554. text-align: right;
  16555. }
  16556. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group input.left-of-select,
  16557. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group input.left-of-select {
  16558. min-width: 4ch;
  16559. padding-right: 0.25em;
  16560. }
  16561. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group select,
  16562. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group select {
  16563. max-width: 12em;
  16564. }
  16565. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group.longtext,
  16566. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group.longtext {
  16567. height: fit-content;
  16568. align-items: start;
  16569. margin: 0 0 0.5em 0;
  16570. }
  16571. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group.longtext label,
  16572. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group.longtext label {
  16573. max-width: 6em;
  16574. white-space: normal;
  16575. line-height: unset;
  16576. }
  16577. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group.longtext .editor-content,
  16578. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group.longtext .editor-content {
  16579. min-height: 3em;
  16580. }
  16581. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group.longtext .editor-content > p,
  16582. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group.longtext .editor-content > p {
  16583. font-weight: 400;
  16584. margin: 0;
  16585. }
  16586. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .price-fields,
  16587. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .price-fields {
  16588. display: flex;
  16589. gap: 4px;
  16590. }
  16591. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .price-fields input[name="system.price.per"],
  16592. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .price-fields input[name="system.price.per"] {
  16593. width: 22px;
  16594. }
  16595. .pf2e.item.sheet form .sheet-content section.sidebar select {
  16596. font-family: inherit;
  16597. font-size: 0.85em;
  16598. height: 1.8em;
  16599. }
  16600. .pf2e.item.sheet form .sheet-content section.sidebar button {
  16601. padding-top: 0;
  16602. padding-bottom: 0;
  16603. white-space: nowrap;
  16604. }
  16605. .pf2e.item.sheet form .sheet-content input[type=text], .pf2e.item.sheet form .sheet-content input[type=number] {
  16606. border: 1px solid transparent;
  16607. height: calc(100% - 2px);
  16608. margin: 1px 0;
  16609. width: calc(100% - 2px);
  16610. }
  16611. .pf2e.item.sheet form .sheet-content select {
  16612. background: rgba(255, 255, 255, 0.5);
  16613. }
  16614. .pf2e.item.sheet form .sheet-content button:hover:not(:disabled), .pf2e.item.sheet form .sheet-content button:focus,
  16615. .pf2e.item.sheet form .sheet-content input:not([type=range]):hover:not(:disabled),
  16616. .pf2e.item.sheet form .sheet-content input:not([type=range]):focus,
  16617. .pf2e.item.sheet form .sheet-content select:hover:not(:disabled),
  16618. .pf2e.item.sheet form .sheet-content select:focus {
  16619. border-color: var(--color-border-dark-1);
  16620. box-shadow: 0 0 5px var(--secondary);
  16621. }
  16622. .pf2e.item.sheet form .sheet-body input[type=text],
  16623. .pf2e.item.sheet form .sheet-body input[type=number] {
  16624. padding: 3px;
  16625. }
  16626. .pf2e.item.sheet form .sheet-body input[type=text]:not(:disabled),
  16627. .pf2e.item.sheet form .sheet-body input[type=number]:not(:disabled) {
  16628. background: rgba(255, 255, 255, 0.5);
  16629. border: 1px solid var(--color-text-light-5);
  16630. }
  16631. .pf2e.item.sheet form .sheet-body .tab.active {
  16632. overflow: hidden scroll;
  16633. padding-left: 0.5rem;
  16634. }
  16635. .pf2e.item.sheet form .sheet-body .tab.active.description {
  16636. display: flex;
  16637. flex-direction: column;
  16638. gap: 3px;
  16639. height: 100%;
  16640. padding: 0 0.25em;
  16641. }
  16642. .pf2e.item.sheet form .sheet-body .tab.active.description > * {
  16643. display: flex;
  16644. overflow: hidden;
  16645. }
  16646. .pf2e.item.sheet form .sheet-body .tab.active.description .editor {
  16647. min-height: 2.5em;
  16648. flex: 1;
  16649. }
  16650. .pf2e.item.sheet form .sheet-body .tab.active.description.editing {
  16651. overflow: hidden;
  16652. }
  16653. .pf2e.item.sheet form .sheet-body .tab.active.description.editing > section {
  16654. flex: 1;
  16655. }
  16656. .pf2e.item.sheet form .sheet-body .tab.active.description .gm-notes {
  16657. background-color: var(--visibility-gm-bg);
  16658. border: 1px dotted rgba(75, 74, 68, 0.5);
  16659. padding: 0 0.25em;
  16660. flex: 0 0 auto;
  16661. }
  16662. .pf2e.item.sheet form .sheet-body .tab.active.description .gm-notes:not(.has-content) {
  16663. display: none;
  16664. }
  16665. .pf2e.item.sheet form .sheet-body .tab.active.description .main {
  16666. flex: 1 0 auto;
  16667. }
  16668. .pf2e.item.sheet form .sheet-body .tab.active.description .editor {
  16669. display: flex;
  16670. flex-direction: column;
  16671. }
  16672. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes,
  16673. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit {
  16674. font-size: 1.33em;
  16675. background: rgb(205, 205, 205);
  16676. }
  16677. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes i,
  16678. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit i {
  16679. width: 1em;
  16680. text-align: center;
  16681. }
  16682. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes {
  16683. border-radius: 4px;
  16684. border: 1px solid var(--color-border-dark-1);
  16685. box-shadow: 0 0 1px var(--color-shadow-dark);
  16686. display: none;
  16687. padding: 1px 2px;
  16688. position: absolute;
  16689. right: 35px;
  16690. top: 5px;
  16691. }
  16692. .pf2e.item.sheet form .sheet-body .tab.active.description .editor:hover a.add-gm-notes {
  16693. display: block;
  16694. }
  16695. .pf2e.item.sheet form .sheet-body .tab.active.description .editor .tox {
  16696. flex: 1;
  16697. }
  16698. .pf2e.item.sheet form .sheet-body .tab.active.details {
  16699. padding: 0.5rem 0.5rem 0;
  16700. }
  16701. .pf2e.item.sheet form .sheet-body .tab.active.details label {
  16702. color: var(--color-text-dark-2);
  16703. font-weight: 500;
  16704. padding-right: 0.5em;
  16705. white-space: nowrap;
  16706. }
  16707. .pf2e.item.sheet form .sheet-body .tab.active.details label.no-data {
  16708. color: var(--color-text-dark-4);
  16709. }
  16710. .pf2e.item.sheet form .sheet-body .tab.active.details select {
  16711. font-size: var(--font-size-12);
  16712. height: 1.5rem;
  16713. padding-right: 1em;
  16714. }
  16715. .pf2e.item.sheet form .sheet-body .tab.active.details .tags .tag {
  16716. font-size: var(--font-size-10);
  16717. }
  16718. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data {
  16719. align-items: baseline;
  16720. gap: 0.25em;
  16721. display: grid;
  16722. grid-template: "title title title" 2fr "authors license remaster" 3fr/60% 20% 20%;
  16723. }
  16724. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data label {
  16725. font-weight: 500;
  16726. min-width: unset;
  16727. }
  16728. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data input[type=text] {
  16729. height: 1.6rem;
  16730. }
  16731. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .title {
  16732. grid-area: title;
  16733. margin-right: 0;
  16734. }
  16735. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .authors {
  16736. grid-area: authors;
  16737. }
  16738. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license {
  16739. grid-area: license;
  16740. }
  16741. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select {
  16742. margin-top: 1px;
  16743. }
  16744. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .remaster {
  16745. grid-area: remaster;
  16746. }
  16747. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license,
  16748. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .remaster {
  16749. text-align: center;
  16750. }
  16751. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license label,
  16752. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .remaster label {
  16753. padding: 0;
  16754. }
  16755. .pf2e.item.sheet form .sheet-body fieldset {
  16756. border: 1px solid var(--color-border-medium);
  16757. border-radius: 2px;
  16758. margin-bottom: 0.5rem;
  16759. padding: 0 0.5em 0.25em;
  16760. }
  16761. .pf2e.item.sheet form .sheet-body fieldset legend {
  16762. font-weight: 600;
  16763. }
  16764. .pf2e.item.sheet form .sheet-body fieldset.basics {
  16765. border-color: transparent;
  16766. padding: 0;
  16767. }
  16768. .pf2e.item.sheet form .sheet-body .editor {
  16769. --space-s: 0.25em;
  16770. --space-m: 0.5em;
  16771. --space-l: 1em;
  16772. --space-xl: 1.5em;
  16773. --space-2xl: 2em;
  16774. --radius: 3px;
  16775. }
  16776. .pf2e.item.sheet form .sheet-body .editor p {
  16777. min-height: unset;
  16778. }
  16779. .pf2e.item.sheet form .sheet-body .editor :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  16780. margin-top: 1em;
  16781. }
  16782. .pf2e.item.sheet form .sheet-body .editor .inline-header {
  16783. display: flex;
  16784. align-items: center;
  16785. gap: var(--space-l);
  16786. background-color: var(--alt);
  16787. font-family: var(--sans-serif);
  16788. color: var(--text-light);
  16789. padding: 0;
  16790. font-size: 0.8em;
  16791. font-weight: 400;
  16792. border: none;
  16793. }
  16794. .pf2e.item.sheet form .sheet-body .editor .inline-header strong {
  16795. display: inline-flex;
  16796. padding: 0 var(--space-m);
  16797. background-color: var(--primary);
  16798. min-width: 15ch;
  16799. border-right: 1px solid rgba(0, 0, 0, 0.4);
  16800. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  16801. font-weight: 400;
  16802. }
  16803. .pf2e.item.sheet form .sheet-body .editor .inline-header + p {
  16804. margin-top: var(--space-s);
  16805. }
  16806. .pf2e.item.sheet form .sheet-body .editor .info {
  16807. background-color: var(--secondary);
  16808. padding: var(--space-m);
  16809. color: var(--text-light);
  16810. margin-left: auto;
  16811. margin-right: auto;
  16812. padding: 0;
  16813. border-radius: var(--radius);
  16814. font-family: var(--sans-serif);
  16815. padding-bottom: var(--space-m);
  16816. }
  16817. .pf2e.item.sheet form .sheet-body .editor .info > * + * {
  16818. margin-top: var(--space-m);
  16819. }
  16820. .pf2e.item.sheet form .sheet-body .editor .info + * {
  16821. margin-top: var(--space-xl);
  16822. }
  16823. .pf2e.item.sheet form .sheet-body .editor .info + .pf2e.item.sheet form .sheet-body .editor .info {
  16824. margin-top: var(--space-s);
  16825. }
  16826. .pf2e.item.sheet form .sheet-body .editor .info h4 {
  16827. font-size: 0.9em;
  16828. font-weight: 400;
  16829. line-height: 1.2;
  16830. font-family: var(--sans-serif);
  16831. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  16832. padding: var(--space-m) var(--space-l);
  16833. position: relative;
  16834. display: flex;
  16835. align-items: center;
  16836. justify-content: space-between;
  16837. color: var(--text-light);
  16838. }
  16839. .pf2e.item.sheet form .sheet-body .editor .info h4::after {
  16840. font-family: "Font Awesome 6";
  16841. content: "\f05a";
  16842. font-weight: 900;
  16843. margin-right: var(--space-s);
  16844. }
  16845. .pf2e.item.sheet form .sheet-body .editor .info p {
  16846. font-size: 0.8em;
  16847. margin: 0;
  16848. padding: 0 var(--space-l);
  16849. }
  16850. .pf2e.item.sheet form .sheet-body .editor .info p:first-of-type {
  16851. padding-top: var(--space-m);
  16852. border-top: 1px solid rgba(255, 255, 255, 0.1);
  16853. }
  16854. .pf2e.item.sheet form .sheet-body .editor .traits {
  16855. display: flex;
  16856. flex-wrap: wrap;
  16857. padding: 0;
  16858. }
  16859. .pf2e.item.sheet form .sheet-body .editor .traits p {
  16860. display: inline-flex;
  16861. padding: 0.16rem 0.25rem;
  16862. margin: 0;
  16863. background-color: var(--primary);
  16864. border: 2px solid var(--color-border-trait);
  16865. color: var(--text-light);
  16866. font: 500 var(--font-size-10) var(--sans-serif);
  16867. text-transform: uppercase;
  16868. }
  16869. .pf2e.item.sheet form .sheet-body .editor .statblock {
  16870. font-family: var(--sans-serif-condensed);
  16871. color: var(--text-dark);
  16872. line-height: 1.2;
  16873. margin-bottom: var(--space-m);
  16874. }
  16875. .pf2e.item.sheet form .sheet-body .editor .statblock > * + * {
  16876. margin-top: var(--space-s);
  16877. margin-bottom: 0;
  16878. }
  16879. .pf2e.item.sheet form .sheet-body .editor .statblock p {
  16880. --indent: var(--space-l);
  16881. margin-left: var(--indent);
  16882. position: relative;
  16883. }
  16884. .pf2e.item.sheet form .sheet-body .editor .statblock p strong:first-of-type {
  16885. margin-left: calc(var(--indent) * -1);
  16886. }
  16887. .pf2e.item.sheet form .sheet-body .editor .statblock p .trait:first-of-type {
  16888. margin-left: calc(var(--indent) * -1 - 2px);
  16889. }
  16890. .pf2e.item.sheet form .sheet-body .editor .statblock span.pf2-icon {
  16891. line-height: 1;
  16892. }
  16893. .pf2e.item.sheet form .sheet-body .editor .statblock h1,
  16894. .pf2e.item.sheet form .sheet-body .editor .statblock h2,
  16895. .pf2e.item.sheet form .sheet-body .editor .statblock h3,
  16896. .pf2e.item.sheet form .sheet-body .editor .statblock h4 {
  16897. display: flex;
  16898. align-items: baseline;
  16899. justify-content: space-between;
  16900. border-bottom: 1px solid var(--color-border-dark);
  16901. text-transform: uppercase;
  16902. letter-spacing: -0.05em;
  16903. font-family: var(--sans-serif-condensed);
  16904. font-weight: 700;
  16905. }
  16906. .pf2e.item.sheet form .sheet-body .editor .statblock hr {
  16907. border: none;
  16908. border-bottom: 1px solid var(--color-border-dark);
  16909. }
  16910. .pf2e.item.sheet form .sheet-body .editor .message {
  16911. font-family: var(--journal-cursive);
  16912. font-size: 2em;
  16913. line-height: 1.2;
  16914. }
  16915. .pf2e.item.sheet form h3 .item-controls,
  16916. .pf2e.item.sheet form header .item-controls {
  16917. float: right;
  16918. }
  16919. .pf2e.item.sheet form .form-list {
  16920. border-radius: 5px;
  16921. border: 1px solid var(--secondary-background);
  16922. list-style-type: none;
  16923. margin: 0.5em 0;
  16924. padding: 0.25em;
  16925. }
  16926. .pf2e.item.sheet form .form-list:first-child {
  16927. margin-top: 0;
  16928. }
  16929. .pf2e.item.sheet form .form-list h3 {
  16930. font-weight: 600;
  16931. font-size: 1.05em;
  16932. margin-bottom: 0.25em;
  16933. }
  16934. .pf2e.item.sheet form .form-list.subsection {
  16935. padding: 0;
  16936. }
  16937. .pf2e.item.sheet form .form-list.subsection > * {
  16938. padding: 0.25rem;
  16939. }
  16940. .pf2e.item.sheet form .form-list.subsection > header {
  16941. align-items: baseline;
  16942. background-color: var(--secondary);
  16943. border-radius: 5px 5px 0 0;
  16944. color: var(--text-light);
  16945. display: flex;
  16946. justify-content: space-between;
  16947. margin: -1px -1px 0 -1px;
  16948. padding: 1px;
  16949. }
  16950. .pf2e.item.sheet form .form-list.subsection > header h3,
  16951. .pf2e.item.sheet form .form-list.subsection > header .item-controls {
  16952. padding: 0.25rem;
  16953. margin-bottom: 0;
  16954. }
  16955. .pf2e.item.sheet form .two-by-two {
  16956. display: grid;
  16957. grid-template-columns: 1fr 1fr;
  16958. column-gap: 0.25rem;
  16959. }
  16960. .pf2e.item.sheet form .two-by-two .item-controls {
  16961. margin-left: 2px;
  16962. gap: 0;
  16963. }
  16964. .pf2e.item.sheet form .form-group.scalable {
  16965. height: auto;
  16966. min-height: 1.5rem;
  16967. }
  16968. .pf2e.item.sheet form .form-group.scalable ul.traits-list {
  16969. list-style-type: none;
  16970. }
  16971. .pf2e.item.sheet form .form-group > label:not(.large) {
  16972. max-width: 11em;
  16973. }
  16974. .pf2e.item.sheet form .form-group > label.short {
  16975. max-width: 9em;
  16976. }
  16977. .pf2e.item.sheet form .form-group .item-controls {
  16978. flex: 0 1 auto;
  16979. }
  16980. .pf2e.item.sheet form .form-group input.adjusted-higher:not(:focus) {
  16981. font-weight: 700;
  16982. color: #009988;
  16983. }
  16984. .pf2e.item.sheet form .form-group input.adjusted-lower:not(:focus) {
  16985. font-weight: 700;
  16986. color: #cc3311;
  16987. }
  16988. .pf2e.item.sheet form .details-container,
  16989. .pf2e.item.sheet form .dice-data {
  16990. display: grid;
  16991. grid: "dice die type"/40px 60px auto;
  16992. }
  16993. .pf2e.item.sheet form .effects-container {
  16994. display: grid;
  16995. grid: "effect number"/auto 40px;
  16996. }
  16997. .pf2e.item.sheet form .details-container-two-columns {
  16998. display: grid;
  16999. grid: "size type"/50% 50%;
  17000. }
  17001. .pf2e.item.sheet form .details-container-three-columns {
  17002. display: grid;
  17003. grid-template-columns: 1fr 1fr 1fr;
  17004. }
  17005. .pf2e.item.sheet form .form-fields > label {
  17006. display: flex;
  17007. align-items: center;
  17008. white-space: nowrap;
  17009. }
  17010. .pf2e.item.sheet form .form-fields select {
  17011. flex: 1;
  17012. width: auto;
  17013. }
  17014. .pf2e.item.sheet form .toggle-button-list {
  17015. display: flex;
  17016. gap: 2px;
  17017. margin: 4px 0;
  17018. }
  17019. .pf2e.item.sheet form .toggle-button-list button {
  17020. margin: 0;
  17021. font-size: var(--font-size-10);
  17022. line-height: 16px;
  17023. display: flex;
  17024. align-items: center;
  17025. white-space: nowrap;
  17026. padding: 3px 4px;
  17027. }
  17028. .pf2e.item.sheet form .consumable-details {
  17029. flex: 0 0 24px;
  17030. }
  17031. .pf2e.item.sheet form .consumable-details label {
  17032. font-weight: bold;
  17033. }
  17034. .pf2e.item.sheet form .consumable-details input {
  17035. flex: 0 0 24px;
  17036. margin-right: 6px;
  17037. text-align: right;
  17038. }
  17039. .pf2e.item.sheet form .consumable-details span {
  17040. line-height: 24px;
  17041. }
  17042. .pf2e.item.sheet form .consumable-details .max-charges {
  17043. flex: 0 0 16px;
  17044. text-align: center;
  17045. }
  17046. .pf2e.item.sheet form .consumable-charges label {
  17047. flex: 0 0 144px;
  17048. }
  17049. .pf2e.item.sheet form .consumable-charges input {
  17050. flex: 0 0 64px;
  17051. text-align: center;
  17052. }
  17053. .pf2e.item.sheet form .consumable-charges span.flex0 {
  17054. line-height: 24px;
  17055. }
  17056. .pf2e.item.sheet form .feat-uses select {
  17057. flex: 2;
  17058. margin-right: 5px;
  17059. }
  17060. .pf2e.item.sheet form .feat-uses input {
  17061. flex: 1;
  17062. text-align: center;
  17063. }
  17064. .pf2e.item.sheet form .feat-uses span.sep {
  17065. flex: 0 0 16px;
  17066. line-height: 24px;
  17067. font-size: var(--font-size-14);
  17068. text-align: center;
  17069. }
  17070. .pf2e.item.sheet form .spell-components input {
  17071. margin-left: 0;
  17072. }
  17073. .pf2e.item.sheet form .spell-components label {
  17074. padding-right: 6px;
  17075. }
  17076. .pf2e.item.sheet form input.adjusted:not(:focus) {
  17077. font-weight: 700;
  17078. color: #009988;
  17079. }
  17080. .pf2e.item.sheet form .frequency {
  17081. align-items: baseline;
  17082. display: flex;
  17083. gap: 0.2rem;
  17084. text-align: end;
  17085. }
  17086. .pf2e.item.sheet form .frequency.empty {
  17087. justify-content: flex-end;
  17088. }
  17089. .pf2e.item.sheet form .frequency select {
  17090. flex: 1 1 auto;
  17091. }
  17092. .pf2e.item.sheet form .frequency a {
  17093. align-self: center;
  17094. }
  17095. .persistent-damage-dialog {
  17096. /** Work around Font Awesome styling bug present as of version 6.2 */
  17097. }
  17098. .persistent-damage-dialog i.fa-fw {
  17099. min-width: 1em;
  17100. }
  17101. .persistent-damage-dialog h3 {
  17102. display: flex;
  17103. align-items: baseline;
  17104. justify-content: space-between;
  17105. }
  17106. .persistent-damage-dialog h3 a {
  17107. float: right;
  17108. font-size: 0.8em;
  17109. }
  17110. .persistent-damage-dialog h3 a:hover i {
  17111. animation: rotation 2s infinite linear;
  17112. }
  17113. .persistent-damage-dialog .entries {
  17114. display: flex;
  17115. flex-direction: column;
  17116. gap: 0.125rem;
  17117. }
  17118. .persistent-damage-dialog .entries:not(.new) {
  17119. margin-bottom: 0.5rem;
  17120. }
  17121. .persistent-damage-dialog .persistent-entry {
  17122. display: flex;
  17123. align-items: baseline;
  17124. gap: 0.25rem;
  17125. }
  17126. .persistent-damage-dialog .persistent-entry.inactive .input-fields input span,
  17127. .persistent-damage-dialog .persistent-entry.inactive .input-fields input i, .persistent-damage-dialog .persistent-entry.inactive .input-fields input:not(:focus),
  17128. .persistent-damage-dialog .persistent-entry.inactive .input-fields select span,
  17129. .persistent-damage-dialog .persistent-entry.inactive .input-fields select i,
  17130. .persistent-damage-dialog .persistent-entry.inactive .input-fields select:not(:focus),
  17131. .persistent-damage-dialog .persistent-entry.inactive .input-fields label:not(:focus-within) span,
  17132. .persistent-damage-dialog .persistent-entry.inactive .input-fields label:not(:focus-within) i,
  17133. .persistent-damage-dialog .persistent-entry.inactive .input-fields label:not(:focus-within):not(:focus) {
  17134. opacity: 0.7;
  17135. text-decoration: line-through;
  17136. }
  17137. .persistent-damage-dialog .persistent-entry a {
  17138. padding: 0.25em;
  17139. }
  17140. .persistent-damage-dialog .persistent-entry .input-fields {
  17141. display: flex;
  17142. gap: 0.25rem;
  17143. align-items: baseline;
  17144. select-height: var(--form-field-height);
  17145. }
  17146. .persistent-damage-dialog .persistent-entry .input-fields label {
  17147. display: flex;
  17148. align-items: baseline;
  17149. gap: 0.19rem;
  17150. height: 100%;
  17151. }
  17152. .persistent-damage-dialog .persistent-entry .input-fields .dc {
  17153. width: 2.5rem;
  17154. }
  17155. .persistent-damage-dialog .persistent-entry .input-fields .invalid {
  17156. box-shadow: 0 0 5px 0px red;
  17157. border-color: red;
  17158. }
  17159. #darkness-adjuster {
  17160. background: none;
  17161. box-shadow: 0 0 10px black;
  17162. height: 38px !important;
  17163. }
  17164. #darkness-adjuster .window-header {
  17165. display: none;
  17166. }
  17167. #darkness-adjuster .window-content {
  17168. background: rgba(0, 0, 0, 0.5);
  17169. border: 1px solid black;
  17170. border-radius: 5px;
  17171. padding: 6px 12px 0;
  17172. }
  17173. #darkness-adjuster .slider {
  17174. height: 6px;
  17175. }
  17176. #darkness-adjuster .slider .noUi-base {
  17177. background: #ecc1b3;
  17178. cursor: pointer;
  17179. }
  17180. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle {
  17181. background: none;
  17182. border: none;
  17183. box-shadow: none;
  17184. color: var(--text-light);
  17185. font-size: var(--font-size-16);
  17186. height: 14px;
  17187. width: 14px;
  17188. top: -5px;
  17189. right: -7px;
  17190. text-shadow: 0 0 4px black;
  17191. }
  17192. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.threshold_bright-light, #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.threshold_darkness {
  17193. pointer-events: none;
  17194. }
  17195. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.threshold_darkness {
  17196. font-size: var(--font-size-14);
  17197. }
  17198. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.darkness-level {
  17199. background: #c85019;
  17200. border: 1px solid black;
  17201. border-radius: 2px;
  17202. box-shadow: 1px 1px 4px black;
  17203. height: 12px;
  17204. width: 12px;
  17205. right: -6px;
  17206. top: -4px;
  17207. }
  17208. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.darkness-level .noUi-touch-area {
  17209. cursor: grab;
  17210. }
  17211. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.darkness-level:active .noUi-touch-area {
  17212. cursor: grabbing;
  17213. }
  17214. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle::before, #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle::after {
  17215. background: none;
  17216. }
  17217. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle i.fa-solid {
  17218. cursor: default;
  17219. left: -1px;
  17220. opacity: 0.6;
  17221. position: absolute;
  17222. top: 0;
  17223. }
  17224. #darkness-adjuster .slider .noUi-base .noUi-connect.range_bright-light {
  17225. background: #fdfbd3;
  17226. }
  17227. #darkness-adjuster .slider .noUi-base .noUi-connect.range_darkness {
  17228. background: #16193a;
  17229. }
  17230. #darkness-adjuster .slider .noUi-pips {
  17231. height: 12px;
  17232. }
  17233. #darkness-adjuster .slider .noUi-pips .noUi-marker.noUi-marker-large {
  17234. height: 12px;
  17235. }
  17236. #darkness-adjuster .slider .noUi-pips .noUi-value {
  17237. display: none;
  17238. }
  17239. #darkness-adjuster .synchronized .slider .noUi-base {
  17240. cursor: not-allowed;
  17241. }
  17242. #darkness-adjuster .synchronized .slider .message {
  17243. display: flex;
  17244. justify-content: center;
  17245. position: relative;
  17246. top: 0.5em;
  17247. width: 100%;
  17248. }
  17249. #darkness-adjuster .synchronized .slider .message span {
  17250. color: var(--color-text-light-1);
  17251. text-shadow: 1px 1px black;
  17252. z-index: 1;
  17253. }
  17254. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle {
  17255. cursor: not-allowed;
  17256. }
  17257. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle.darkness-level {
  17258. background: var(--color-disabled);
  17259. border: none;
  17260. box-shadow: none;
  17261. }
  17262. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle.darkness-level .noUi-touch-area, #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle.darkness-level:active .noUi-touch-area {
  17263. cursor: inherit;
  17264. }
  17265. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle i.fas {
  17266. cursor: inherit;
  17267. }
  17268. #darkness-adjuster .synchronized .slider .noUi-pips {
  17269. visibility: hidden;
  17270. }
  17271. .scene-sheet nav .action-glyph {
  17272. font-size: var(--font-size-15);
  17273. }
  17274. .scene-sheet span.range-value.disabled {
  17275. border: none;
  17276. color: #777;
  17277. }
  17278. .scene-sheet button.automation-settings {
  17279. align-self: end;
  17280. display: flex;
  17281. margin: -1px 0 -1px 4px;
  17282. padding: 0.3125rem 0.5em;
  17283. }
  17284. .scene-sheet button.automation-settings > i {
  17285. margin: 0;
  17286. }
  17287. .app.token-sheet .tab.active[data-tab=appearance] fieldset {
  17288. border: 1px solid var(--color-border-light-primary);
  17289. }
  17290. .app.token-sheet .tab.active[data-tab=appearance] fieldset > legend {
  17291. font-size: var(--font-size-15);
  17292. color: #333;
  17293. }
  17294. .app.token-sheet .tab.active[data-tab=appearance] fieldset input[type=number] {
  17295. max-width: 60px;
  17296. text-align: center;
  17297. }
  17298. .app.token-sheet .tab.active[data-tab=appearance] fieldset input[type=number]:disabled {
  17299. border: none;
  17300. color: var(--color-text-dark-6);
  17301. }
  17302. .app.token-sheet .tab.active[data-tab=appearance] fieldset select.alternate-images {
  17303. max-width: 20em;
  17304. }
  17305. .app.token-sheet .tab.active[data-tab=appearance] fieldset:last-child {
  17306. margin: 6px 0;
  17307. }
  17308. .app.token-sheet .tab[data-tab=vision] .disabled[data-tab] {
  17309. color: var(--color-text-dark-6);
  17310. pointer-events: none;
  17311. }
  17312. .app.token-sheet .tab[data-tab=vision] a.managed-by-rbv {
  17313. padding-left: 0.33em;
  17314. }
  17315. .app.token-sheet .form-group.children-disabled .range-value {
  17316. border: none;
  17317. background-color: rgba(0, 0, 0, 0.05);
  17318. color: #777;
  17319. }
  17320. #homebrew-settings section.window-content {
  17321. display: block;
  17322. }
  17323. #homebrew-settings section.window-content .form-group.setting {
  17324. display: inherit;
  17325. }
  17326. #homebrew-settings section.window-content .form-group.setting tags {
  17327. background-color: rgba(0, 0, 0, 0.05);
  17328. border: 1px solid #7a7971;
  17329. border-radius: 3px;
  17330. }
  17331. #homebrew-settings section.window-content .form-group.setting tags.tagify--focus {
  17332. border: 1px solid #7a7971;
  17333. box-shadow: 0 0 5px red;
  17334. }
  17335. #homebrew-settings section.window-content .form-group.setting .homebrew {
  17336. --tag-text-color--edit: #111;
  17337. --tag-pad: 0.2em 0.4em;
  17338. --tag-remove-bg: var(--tag-hover);
  17339. --tag-remove-btn-bg--hover: black;
  17340. font-size: var(--font-size-13);
  17341. min-width: 0;
  17342. }
  17343. #homebrew-settings section.window-content .form-group.buttons {
  17344. margin-top: 0.5em;
  17345. }
  17346. .damage-types th,
  17347. .damage-types td {
  17348. white-space: nowrap;
  17349. }
  17350. .damage-types th:not(:last-child),
  17351. .damage-types td:not(:last-child) {
  17352. padding-right: 0.25rem;
  17353. }
  17354. .damage-types .icon-preview {
  17355. display: flex;
  17356. align-items: center;
  17357. gap: 0.125rem;
  17358. }
  17359. .damage-types .delete-cell {
  17360. text-align: end;
  17361. width: 1rem;
  17362. }
  17363. .damage-types .delete-cell i {
  17364. padding: 0.125rem 0.25rem;
  17365. cursor: pointer;
  17366. }
  17367. #variant-rules-settings form .form-group.abp select {
  17368. flex: 0;
  17369. }
  17370. #variant-rules-settings form .proficiency-modifiers {
  17371. column-gap: 0.5em;
  17372. display: grid;
  17373. grid-template: "untrained trained expert master legendary" auto "hint hint hint hint hint" auto/1fr 1fr 1fr 1fr 1fr;
  17374. }
  17375. #variant-rules-settings form .proficiency-modifiers .hint {
  17376. grid-area: hint;
  17377. }
  17378. #variant-rules-settings form .proficiency-modifiers .modifier label {
  17379. font-size: var(--font-size-12);
  17380. }
  17381. #world-clock-settings form .form-group .form-fields {
  17382. flex-grow: 1;
  17383. }
  17384. #world-clock-settings form .form-group button.reset-world-time {
  17385. flex: 1;
  17386. }
  17387. #game-details > .system-links {
  17388. gap: 0.5rem;
  17389. margin-bottom: 0.35rem;
  17390. }
  17391. #game-details > .system-links > a[href] {
  17392. flex: 0;
  17393. font-size: var(--font-size-12);
  17394. text-transform: uppercase;
  17395. }
  17396. #game-details > .system-links > a[href]:hover {
  17397. text-shadow: 0 0 8px var(--color-text-hyperlink);
  17398. }
  17399. #client-settings form .form-group > label {
  17400. flex: 2.5;
  17401. }
  17402. .settings-menu form .form-group > label {
  17403. flex: 2.5;
  17404. }
  17405. .settings-menu .instructions {
  17406. text-align: center;
  17407. }
  17408. #metagame-settings form .form-group > label {
  17409. flex: 3;
  17410. }
  17411. .select-craft-item-dialog .drop-item-zone {
  17412. display: flex;
  17413. align-items: center;
  17414. margin: 0 2px 5px;
  17415. }
  17416. .select-craft-item-dialog .item-icon {
  17417. height: 32px;
  17418. width: 32px;
  17419. margin-right: 3px;
  17420. }
  17421. .select-craft-item-dialog .button-panel {
  17422. display: flex;
  17423. }
  17424. .select-repair-item-dialog .drop-item-zone {
  17425. display: flex;
  17426. align-items: center;
  17427. margin: 0 2px 5px;
  17428. }
  17429. .select-repair-item-dialog .item-icon {
  17430. height: 32px;
  17431. width: 32px;
  17432. margin-right: 3px;
  17433. }
  17434. .select-repair-item-dialog .button-panel {
  17435. display: flex;
  17436. }
  17437. .app.choice-set-prompt .window-content h3 {
  17438. display: flex;
  17439. justify-content: center;
  17440. }
  17441. .app.choice-set-prompt .window-content button,
  17442. .app.choice-set-prompt .window-content select {
  17443. display: flex;
  17444. margin: 4px auto;
  17445. }
  17446. .app.choice-set-prompt .window-content .choices {
  17447. max-width: max-content;
  17448. justify-items: center;
  17449. margin: auto;
  17450. }
  17451. .app.choice-set-prompt .window-content .choices.select-menu {
  17452. min-width: 18em;
  17453. }
  17454. .app.choice-set-prompt .window-content .choices.select-menu tags {
  17455. background-color: rgba(0, 0, 0, 0.05);
  17456. border: 1px solid var(--color-border-light-tertiary);
  17457. border-radius: 3px;
  17458. height: 2rem;
  17459. width: 100%;
  17460. }
  17461. .app.choice-set-prompt .window-content .choices.select-menu tags .tagify__input {
  17462. align-items: center;
  17463. display: flex;
  17464. height: 100%;
  17465. margin: 0;
  17466. }
  17467. .app.choice-set-prompt .window-content .choices button,
  17468. .app.choice-set-prompt .window-content .choices .drop-zone {
  17469. cursor: pointer;
  17470. max-width: 100%;
  17471. }
  17472. .app.choice-set-prompt .window-content .choices button:not(.with-image),
  17473. .app.choice-set-prompt .window-content .choices .drop-zone:not(.with-image) {
  17474. min-width: 120px;
  17475. justify-content: center;
  17476. }
  17477. .app.choice-set-prompt .window-content .choices button.with-image,
  17478. .app.choice-set-prompt .window-content .choices .drop-zone.with-image {
  17479. align-items: center;
  17480. }
  17481. .app.choice-set-prompt .window-content .choices button.with-image img,
  17482. .app.choice-set-prompt .window-content .choices .drop-zone.with-image img {
  17483. border: 1px solid #444;
  17484. height: 1.6em;
  17485. margin-right: 0.5em;
  17486. }
  17487. .app.choice-set-prompt .window-content .choices .choice-buttons {
  17488. align-items: center;
  17489. display: flex;
  17490. flex-direction: column;
  17491. }
  17492. .app.choice-set-prompt .window-content .choices .choice-buttons .choice {
  17493. align-items: center;
  17494. display: flex;
  17495. gap: 0.5em;
  17496. width: 100%;
  17497. }
  17498. .app.choice-set-prompt .window-content .choices .choice-buttons .choice.select {
  17499. margin-bottom: 0.5rem;
  17500. }
  17501. .app.choice-set-prompt .window-content .choices .choice-buttons .choice a.item-info {
  17502. align-items: center;
  17503. border-radius: 2px;
  17504. border: 1px solid var(--color-text-light-primary);
  17505. display: flex;
  17506. height: var(--font-size-20);
  17507. justify-content: center;
  17508. min-width: var(--font-size-20);
  17509. }
  17510. .app.choice-set-prompt .window-content .choices .choice-buttons .choice a.item-info.disabled {
  17511. color: var(--color-disabled);
  17512. cursor: default;
  17513. }
  17514. .app.choice-set-prompt .window-content .choices .choice-buttons .choice a.item-info.disabled:hover, .app.choice-set-prompt .window-content .choices .choice-buttons .choice a.item-info.disabled:active {
  17515. text-shadow: none;
  17516. }
  17517. .app.choice-set-prompt .window-content .choices .drop-zone {
  17518. border: 1px solid var(--color-border-light-primary);
  17519. border-radius: 3px;
  17520. color: #222;
  17521. cursor: default;
  17522. display: flex;
  17523. padding: 1px 6px;
  17524. font-family: var(--font-primary);
  17525. font-size: var(--font-size-14);
  17526. line-height: 28px;
  17527. }
  17528. .app.choice-set-prompt .window-content .choices .drop-zone i {
  17529. border: 1px solid #bbb;
  17530. border-radius: 2px;
  17531. align-items: center;
  17532. display: flex;
  17533. height: 1.6em;
  17534. justify-content: center;
  17535. margin-right: 0.5em;
  17536. width: 1.6em;
  17537. }
  17538. .app.choice-set-prompt .window-content .choices .drop-zone i:after {
  17539. font-size: var(--font-size-20);
  17540. }
  17541. .app.choice-set-prompt .window-content .choices .drop-zone span {
  17542. color: var(--text-dark);
  17543. flex: 1;
  17544. }
  17545. .compendium-migration-status .content {
  17546. min-width: 15rem;
  17547. }
  17548. .compendium-migration-status table * {
  17549. user-select: text;
  17550. }
  17551. .compendium-migration-status table * th, .compendium-migration-status table * td {
  17552. padding: 0.25em 0.5em;
  17553. white-space: nowrap;
  17554. }
  17555. .compendium-migration-status table * th {
  17556. padding-left: 1em;
  17557. text-align: end;
  17558. }
  17559. .compendium-migration-status table * td {
  17560. width: 100%;
  17561. }
  17562. .compendium-migration-status .empty {
  17563. opacity: 0.8;
  17564. }
  17565. .compendium-migration-status .updated {
  17566. border: 1px dashed var(--alt);
  17567. line-height: 28px;
  17568. text-align: center;
  17569. }
  17570. .compendium-migration-status .migrate {
  17571. display: flex;
  17572. padding: 0.125rem;
  17573. }
  17574. .compendium-migration-status .migrate > * {
  17575. flex: 1;
  17576. }
  17577. #effects-panel {
  17578. pointer-events: initial;
  17579. position: absolute;
  17580. top: 5px;
  17581. right: 0;
  17582. }
  17583. #effects-panel .effect-item {
  17584. display: flex;
  17585. justify-content: end;
  17586. height: 52px;
  17587. }
  17588. #effects-panel .effect-item[data-badge-type=formula] .icon {
  17589. cursor: pointer;
  17590. }
  17591. #effects-panel .effect-item[data-badge-type=formula] .icon:hover::before {
  17592. content: "\f6cf";
  17593. background: rgba(0, 0, 0, 0.5);
  17594. font-family: "Font Awesome 5 Free";
  17595. font-weight: 900;
  17596. font-size: var(--font-size-26);
  17597. color: var(--text-light);
  17598. position: absolute;
  17599. width: 100%;
  17600. height: 100%;
  17601. display: flex;
  17602. align-items: center;
  17603. justify-content: center;
  17604. padding-bottom: 4px;
  17605. }
  17606. #effects-panel .effect-item:hover .effect-info {
  17607. display: flex;
  17608. align-items: end;
  17609. flex-direction: column;
  17610. }
  17611. #effects-panel .effect-item .effect-info {
  17612. background-color: rgba(0, 0, 0, 0.75);
  17613. color: var(--color-text-light-2);
  17614. display: none;
  17615. gap: 3px;
  17616. height: min-content;
  17617. margin-right: 0.5em;
  17618. max-width: 350px;
  17619. padding: 0.25em 0.5rem;
  17620. }
  17621. #effects-panel .effect-item .effect-info h1 {
  17622. margin: 0;
  17623. padding: 0;
  17624. border: none;
  17625. display: flex;
  17626. font-size: var(--font-size-14);
  17627. padding-top: 0.25em;
  17628. text-align: right;
  17629. }
  17630. #effects-panel .effect-item .effect-info h1 a[data-action=send-to-chat] i {
  17631. font-size: var(--font-size-13);
  17632. margin-left: 2px;
  17633. }
  17634. #effects-panel .effect-item .effect-info > a.inline-check {
  17635. font-size: var(--font-size-13);
  17636. font-weight: normal;
  17637. line-height: normal;
  17638. vertical-align: middle;
  17639. }
  17640. #effects-panel .effect-item .effect-info .tags {
  17641. justify-content: end;
  17642. }
  17643. #effects-panel .effect-item .effect-info .tags .tag {
  17644. margin-bottom: 0;
  17645. }
  17646. #effects-panel .effect-item .effect-info .tags .tag + .tag, #effects-panel .effect-item .effect-info .tags .tag:first-child {
  17647. margin-left: 3px;
  17648. margin-right: -2px;
  17649. }
  17650. #effects-panel .effect-item .effect-info .instructions,
  17651. #effects-panel .effect-item .effect-info .description {
  17652. font-size: var(--font-size-12);
  17653. }
  17654. #effects-panel .effect-item .effect-info .instructions {
  17655. display: flex;
  17656. flex-direction: column;
  17657. gap: 2px;
  17658. text-align: right;
  17659. }
  17660. #effects-panel .effect-item .effect-info .description {
  17661. background: rgba(0, 0, 0, 0.7);
  17662. max-height: 16em;
  17663. overflow-y: auto;
  17664. padding: 0 0.5em;
  17665. text-align: left;
  17666. }
  17667. #effects-panel .effect-item .effect-info .description a,
  17668. #effects-panel .effect-item .effect-info .description span[data-pf2-effect-area] {
  17669. color: var(--color-text-dark-primary);
  17670. }
  17671. #effects-panel .effect-item > .icon {
  17672. border: 1px solid rgba(0, 0, 0, 0.5);
  17673. box-shadow: 0 0 0 1px #c0c0c0, 0 0 0 2px #808080;
  17674. align-items: center;
  17675. background-repeat: no-repeat;
  17676. background-size: contain;
  17677. box-shadow: 0 0 0 1px #c0c0c0, 0 0 0 2px #808080, inset 0 0 4px rgba(0, 0, 0, 0.5);
  17678. color: transparent;
  17679. display: flex;
  17680. justify-content: center;
  17681. position: relative;
  17682. margin: 2px 0;
  17683. height: 48px;
  17684. width: 48px;
  17685. }
  17686. #effects-panel .effect-item > .icon.aura {
  17687. border-radius: 50%;
  17688. box-shadow: 0px 0px 10px 5px white;
  17689. }
  17690. #effects-panel .effect-item > .icon.unidentified {
  17691. filter: drop-shadow(0 0 8px var(--visibility-gm-bg));
  17692. }
  17693. #effects-panel .effect-item > .icon .expired {
  17694. position: absolute;
  17695. left: 0;
  17696. bottom: -1px;
  17697. width: 100%;
  17698. padding: 2px 1px;
  17699. font-family: var(--sans-serif);
  17700. font-size: var(--font-size-10);
  17701. text-transform: uppercase;
  17702. letter-spacing: 0.05em;
  17703. text-rendering: optimizeLegibility;
  17704. color: var(--text-light);
  17705. background-color: var(--primary);
  17706. }
  17707. #effects-panel .effect-item > .icon .linked {
  17708. position: absolute;
  17709. display: inline-block;
  17710. bottom: -1px;
  17711. right: -1px;
  17712. padding: 0px 2px;
  17713. color: var(--text-light);
  17714. background-color: rgba(0, 0, 0, 0.75);
  17715. }
  17716. #effects-panel .effect-item > .icon .value-wrapper {
  17717. position: absolute;
  17718. bottom: -1px;
  17719. left: -1px;
  17720. max-width: calc(100% + 2px);
  17721. padding: 0px 2px;
  17722. color: var(--text-light);
  17723. background-color: rgba(0, 0, 0, 0.75);
  17724. font-size: var(--font-size-13);
  17725. letter-spacing: -0.05em;
  17726. white-space: nowrap;
  17727. overflow: hidden;
  17728. }
  17729. #effects-panel .effect-item > .icon .value-wrapper .value {
  17730. overflow: hidden;
  17731. text-overflow: ellipsis;
  17732. }
  17733. #effects-panel .effect-item > .icon .value-wrapper .value strong {
  17734. display: inline-block;
  17735. padding-right: 1px;
  17736. }
  17737. #effects-panel > hr {
  17738. margin-right: 0;
  17739. width: 48px;
  17740. }
  17741. .journal-entry-page .journal-page-content {
  17742. --space-s: 0.25em;
  17743. --space-m: 0.5em;
  17744. --space-l: 1em;
  17745. --space-xl: 1.5em;
  17746. --space-2xl: 2em;
  17747. --radius: 3px;
  17748. }
  17749. .journal-entry-page .journal-page-content p {
  17750. min-height: unset;
  17751. }
  17752. .journal-entry-page .journal-page-content :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  17753. margin-top: 1em;
  17754. }
  17755. .journal-entry-page .journal-page-content .inline-header {
  17756. display: flex;
  17757. align-items: center;
  17758. gap: var(--space-l);
  17759. background-color: var(--alt);
  17760. font-family: var(--sans-serif);
  17761. color: var(--text-light);
  17762. padding: 0;
  17763. font-size: 0.8em;
  17764. font-weight: 400;
  17765. border: none;
  17766. }
  17767. .journal-entry-page .journal-page-content .inline-header strong {
  17768. display: inline-flex;
  17769. padding: 0 var(--space-m);
  17770. background-color: var(--primary);
  17771. min-width: 15ch;
  17772. border-right: 1px solid rgba(0, 0, 0, 0.4);
  17773. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  17774. font-weight: 400;
  17775. }
  17776. .journal-entry-page .journal-page-content .inline-header + p {
  17777. margin-top: var(--space-s);
  17778. }
  17779. .journal-entry-page .journal-page-content .info {
  17780. background-color: var(--secondary);
  17781. padding: var(--space-m);
  17782. color: var(--text-light);
  17783. margin-left: auto;
  17784. margin-right: auto;
  17785. padding: 0;
  17786. border-radius: var(--radius);
  17787. font-family: var(--sans-serif);
  17788. padding-bottom: var(--space-m);
  17789. }
  17790. .journal-entry-page .journal-page-content .info > * + * {
  17791. margin-top: var(--space-m);
  17792. }
  17793. .journal-entry-page .journal-page-content .info + * {
  17794. margin-top: var(--space-xl);
  17795. }
  17796. .journal-entry-page .journal-page-content .info + .journal-entry-page .journal-page-content .info {
  17797. margin-top: var(--space-s);
  17798. }
  17799. .journal-entry-page .journal-page-content .info h4 {
  17800. font-size: 0.9em;
  17801. font-weight: 400;
  17802. line-height: 1.2;
  17803. font-family: var(--sans-serif);
  17804. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  17805. padding: var(--space-m) var(--space-l);
  17806. position: relative;
  17807. display: flex;
  17808. align-items: center;
  17809. justify-content: space-between;
  17810. color: var(--text-light);
  17811. }
  17812. .journal-entry-page .journal-page-content .info h4::after {
  17813. font-family: "Font Awesome 6";
  17814. content: "\f05a";
  17815. font-weight: 900;
  17816. margin-right: var(--space-s);
  17817. }
  17818. .journal-entry-page .journal-page-content .info p {
  17819. font-size: 0.8em;
  17820. margin: 0;
  17821. padding: 0 var(--space-l);
  17822. }
  17823. .journal-entry-page .journal-page-content .info p:first-of-type {
  17824. padding-top: var(--space-m);
  17825. border-top: 1px solid rgba(255, 255, 255, 0.1);
  17826. }
  17827. .journal-entry-page .journal-page-content .traits {
  17828. display: flex;
  17829. flex-wrap: wrap;
  17830. padding: 0;
  17831. }
  17832. .journal-entry-page .journal-page-content .traits p {
  17833. display: inline-flex;
  17834. padding: 0.16rem 0.25rem;
  17835. margin: 0;
  17836. background-color: var(--primary);
  17837. border: 2px solid var(--color-border-trait);
  17838. color: var(--text-light);
  17839. font: 500 var(--font-size-10) var(--sans-serif);
  17840. text-transform: uppercase;
  17841. }
  17842. .journal-entry-page .journal-page-content .statblock {
  17843. font-family: var(--sans-serif-condensed);
  17844. color: var(--text-dark);
  17845. line-height: 1.2;
  17846. margin-bottom: var(--space-m);
  17847. }
  17848. .journal-entry-page .journal-page-content .statblock > * + * {
  17849. margin-top: var(--space-s);
  17850. margin-bottom: 0;
  17851. }
  17852. .journal-entry-page .journal-page-content .statblock p {
  17853. --indent: var(--space-l);
  17854. margin-left: var(--indent);
  17855. position: relative;
  17856. }
  17857. .journal-entry-page .journal-page-content .statblock p strong:first-of-type {
  17858. margin-left: calc(var(--indent) * -1);
  17859. }
  17860. .journal-entry-page .journal-page-content .statblock p .trait:first-of-type {
  17861. margin-left: calc(var(--indent) * -1 - 2px);
  17862. }
  17863. .journal-entry-page .journal-page-content .statblock span.pf2-icon {
  17864. line-height: 1;
  17865. }
  17866. .journal-entry-page .journal-page-content .statblock h1,
  17867. .journal-entry-page .journal-page-content .statblock h2,
  17868. .journal-entry-page .journal-page-content .statblock h3,
  17869. .journal-entry-page .journal-page-content .statblock h4 {
  17870. display: flex;
  17871. align-items: baseline;
  17872. justify-content: space-between;
  17873. border-bottom: 1px solid var(--color-border-dark);
  17874. text-transform: uppercase;
  17875. letter-spacing: -0.05em;
  17876. font-family: var(--sans-serif-condensed);
  17877. font-weight: 700;
  17878. }
  17879. .journal-entry-page .journal-page-content .statblock hr {
  17880. border: none;
  17881. border-bottom: 1px solid var(--color-border-dark);
  17882. }
  17883. .journal-entry-page .journal-page-content .message {
  17884. font-family: var(--journal-cursive);
  17885. font-size: 2em;
  17886. line-height: 1.2;
  17887. }
  17888. .journal-entry-page .journal-page-content .fumble-deck h1 {
  17889. font-family: var(--font-primary);
  17890. font-size: 1.75em;
  17891. font-weight: bold;
  17892. line-height: normal;
  17893. text-transform: uppercase;
  17894. color: var(--text-dark);
  17895. border: 2px solid;
  17896. border-radius: 15px;
  17897. padding: 0 0 0 1.5em;
  17898. background-size: 1.22em;
  17899. background-repeat: no-repeat;
  17900. background-color: #e5bf85;
  17901. position: relative;
  17902. top: 1em;
  17903. width: 80%;
  17904. }
  17905. .journal-entry-page .journal-page-content .fumble-deck h1:first-child {
  17906. background-image: url("../icons/equipment/weapons/gnome-hooked-hammer.webp");
  17907. }
  17908. .journal-entry-page .journal-page-content .fumble-deck h1:nth-of-type(2) {
  17909. background-image: url("../icons/equipment/weapons/longbow.webp");
  17910. }
  17911. .journal-entry-page .journal-page-content .fumble-deck h1:nth-of-type(3) {
  17912. background-image: url("../icons/equipment/weapons/fist.webp");
  17913. }
  17914. .journal-entry-page .journal-page-content .fumble-deck h1:nth-of-type(4) {
  17915. background-image: url("../icons/spells/chain-lightning.webp");
  17916. }
  17917. .journal-entry-page .journal-page-content .fumble-deck blockquote {
  17918. font-family: var(--font-primary);
  17919. border-left: none;
  17920. background-color: #000059;
  17921. color: var(--text-light);
  17922. font-size: 120%;
  17923. margin-left: 0.7em;
  17924. padding: 1.2em 1.25em 0.75em;
  17925. border-radius: 8px;
  17926. }
  17927. .journal-entry-page .journal-page-content .fumble-deck blockquote a {
  17928. color: var(--text-dark);
  17929. }
  17930. .journal-entry-page .journal-page-content .fumble-deck blockquote span.with-repost {
  17931. color: var(--text-dark);
  17932. }
  17933. .journal-entry-page .journal-page-content .fumble-deck code {
  17934. font-family: var(--font-primary);
  17935. font-weight: bold;
  17936. font-size: 100%;
  17937. line-height: normal;
  17938. background-image: url("../assets/critfumble-banner.webp");
  17939. background-size: 100% 100%;
  17940. box-shadow: 5px 5px 10px 3px #282a2d;
  17941. display: inline-block;
  17942. float: right;
  17943. text-align: center;
  17944. margin-top: -1.75em;
  17945. margin-right: 0.75em;
  17946. width: 7em;
  17947. padding: 0.5em;
  17948. }
  17949. .journal-entry-page .journal-page-content .critical-deck h1 {
  17950. font-family: var(--font-primary);
  17951. font-size: 1.75em;
  17952. font-weight: bold;
  17953. line-height: normal;
  17954. text-transform: uppercase;
  17955. color: var(--text-dark);
  17956. border: 2px solid;
  17957. border-radius: 15px;
  17958. padding: 0 0 0 1.5em;
  17959. background-size: 1.22em;
  17960. background-repeat: no-repeat;
  17961. background-color: #e5bf85;
  17962. position: relative;
  17963. top: 1em;
  17964. width: 80%;
  17965. }
  17966. .journal-entry-page .journal-page-content .critical-deck h1:first-child {
  17967. background-image: url("../icons/equipment/weapons/light-hammer.webp");
  17968. }
  17969. .journal-entry-page .journal-page-content .critical-deck h1:nth-of-type(2) {
  17970. background-image: url("../../../icons/weapons/polearms/javelin.webp");
  17971. }
  17972. .journal-entry-page .journal-page-content .critical-deck h1:nth-of-type(3) {
  17973. background-image: url("../../../icons/weapons/axes/axe-battle-worn.webp");
  17974. }
  17975. .journal-entry-page .journal-page-content .critical-deck h1:nth-of-type(4) {
  17976. background-image: url("../../../icons/weapons/thrown/bomb-fuse-cloth-pink.webp");
  17977. }
  17978. .journal-entry-page .journal-page-content .critical-deck blockquote {
  17979. font-family: var(--font-primary);
  17980. border-left: none;
  17981. background: rgb(14, 40, 17);
  17982. background: radial-gradient(circle, rgb(14, 40, 17) 10%, rgb(20, 59, 25) 50%, rgb(14, 40, 17) 90%);
  17983. color: var(--text-light);
  17984. font-size: 120%;
  17985. margin-left: 0.7em;
  17986. padding: 1.2em 1.25em 0.75em;
  17987. border-radius: 8px;
  17988. }
  17989. .journal-entry-page .journal-page-content .critical-deck blockquote a {
  17990. color: var(--text-dark);
  17991. }
  17992. .journal-entry-page .journal-page-content .critical-deck blockquote span.with-repost {
  17993. color: var(--text-dark);
  17994. }
  17995. .journal-entry-page .journal-page-content .critical-deck code {
  17996. font-family: var(--font-primary);
  17997. font-weight: bold;
  17998. font-size: 100%;
  17999. line-height: normal;
  18000. background-image: url("../assets/critfumble-banner.webp");
  18001. background-size: 100% 100%;
  18002. box-shadow: 5px 5px 10px 3px #282a2d;
  18003. display: inline-block;
  18004. float: right;
  18005. text-align: center;
  18006. margin-top: -1.75em;
  18007. margin-right: 0.75em;
  18008. width: 9em;
  18009. padding: 0.5em;
  18010. }
  18011. #migration-summary > .window-content > h3 {
  18012. margin: auto;
  18013. }
  18014. #migration-summary > .window-content > .dialog-content > table i.fa-check {
  18015. color: green;
  18016. }
  18017. #migration-summary > .window-content > .dialog-content > table i.fa-times {
  18018. color: red;
  18019. }
  18020. #migration-summary > .window-content > .dialog-content > table td {
  18021. text-align: center;
  18022. }
  18023. #migration-summary > .window-content > .dialog-buttons {
  18024. display: flex;
  18025. }
  18026. #migration-summary > .window-content > .dialog-buttons:disabled::hover {
  18027. box-shadow: none;
  18028. }
  18029. #upw-viewer .window-content {
  18030. background: no-repeat right url("../assets/upw-logo.webp") black;
  18031. }
  18032. #upw-viewer .window-content .content {
  18033. color: #eee;
  18034. width: 435px;
  18035. font-size: larger;
  18036. }
  18037. #upw-viewer .window-content .content a[href] {
  18038. color: #8b6cae;
  18039. font-size: large;
  18040. display: block;
  18041. text-align: center;
  18042. }
  18043. #world-clock section.window-content {
  18044. font-size: 1rem;
  18045. }
  18046. #world-clock section.window-content h1 {
  18047. font-size: inherit;
  18048. text-align: center;
  18049. }
  18050. #world-clock section.window-content .input-grid {
  18051. align-items: center;
  18052. display: flex;
  18053. flex-wrap: wrap;
  18054. font-size: 0.8rem;
  18055. justify-content: space-evenly;
  18056. }
  18057. #world-clock section.window-content .input-grid > * {
  18058. flex-basis: 32%;
  18059. height: 1.5rem;
  18060. line-height: 20px;
  18061. }
  18062. #world-clock section.window-content .input-grid .sign {
  18063. font-family: var(--sans-serif-monospace);
  18064. font-size: inherit;
  18065. }
  18066. #world-clock section.window-content .input-grid button {
  18067. align-items: center;
  18068. display: flex;
  18069. font-size: inherit;
  18070. justify-content: center;
  18071. margin: 1px;
  18072. }
  18073. #world-clock section.window-content .input-grid button img {
  18074. border: none;
  18075. height: 1.5em;
  18076. }
  18077. #world-clock section.window-content .input-grid .time-of-day {
  18078. display: flex;
  18079. flex-basis: 100%;
  18080. margin: 0 3px;
  18081. }
  18082. #world-clock section.window-content .input-grid .time-of-day img.midnight {
  18083. height: 1.05rem;
  18084. }
  18085. .tags {
  18086. align-items: center;
  18087. display: flex;
  18088. flex-wrap: wrap;
  18089. gap: 2px;
  18090. list-style-type: none;
  18091. margin-bottom: 2px;
  18092. padding-left: 0;
  18093. }
  18094. .tags .tag,
  18095. .tags .tag option {
  18096. font-family: var(--sans-serif);
  18097. font-size: var(--font-size-10);
  18098. text-transform: uppercase;
  18099. letter-spacing: 0.05em;
  18100. text-rendering: optimizeLegibility;
  18101. align-items: center;
  18102. background-color: var(--primary);
  18103. border-radius: 2px;
  18104. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  18105. color: var(--color-text-trait);
  18106. display: inline-flex;
  18107. font-weight: 500;
  18108. padding: 0.3em;
  18109. }
  18110. .tags .tag.tag_secondary,
  18111. .tags .tag option.tag_secondary {
  18112. background-color: var(--secondary);
  18113. }
  18114. .tags .tag.tag_tertiary,
  18115. .tags .tag option.tag_tertiary {
  18116. background-color: var(--tertiary);
  18117. }
  18118. .tags .tag.tag_alt,
  18119. .tags .tag option.tag_alt {
  18120. background-color: var(--alt);
  18121. }
  18122. .tags .tag.tag_material,
  18123. .tags .tag option.tag_material {
  18124. background-color: var(--alt-dark);
  18125. }
  18126. .tags .tag.tag_transparent,
  18127. .tags .tag option.tag_transparent {
  18128. background-color: transparent;
  18129. border-radius: 4px;
  18130. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3);
  18131. color: var(--color-text-dark-secondary);
  18132. font-family: var(--font-primary);
  18133. line-height: 1.6em;
  18134. padding: 0 0.5em;
  18135. text-transform: none;
  18136. }
  18137. .tags .tag.rarity.common, .tags .tag.rarity[value=common],
  18138. .tags .tag.rarity > option[value=common],
  18139. .tags .tag option.rarity.common,
  18140. .tags .tag option.rarity[value=common],
  18141. .tags .tag option.rarity > option[value=common] {
  18142. background-color: var(--color-rarity-common);
  18143. }
  18144. .tags .tag.rarity.uncommon, .tags .tag.rarity[value=uncommon],
  18145. .tags .tag.rarity > option[value=uncommon],
  18146. .tags .tag option.rarity.uncommon,
  18147. .tags .tag option.rarity[value=uncommon],
  18148. .tags .tag option.rarity > option[value=uncommon] {
  18149. background-color: var(--color-rarity-uncommon);
  18150. }
  18151. .tags .tag.rarity.rare, .tags .tag.rarity[value=rare],
  18152. .tags .tag.rarity > option[value=rare],
  18153. .tags .tag option.rarity.rare,
  18154. .tags .tag option.rarity[value=rare],
  18155. .tags .tag option.rarity > option[value=rare] {
  18156. background-color: var(--color-rarity-rare);
  18157. }
  18158. .tags .tag.rarity.unique, .tags .tag.rarity[value=unique],
  18159. .tags .tag.rarity > option[value=unique],
  18160. .tags .tag option.rarity.unique,
  18161. .tags .tag option.rarity[value=unique],
  18162. .tags .tag option.rarity > option[value=unique] {
  18163. background-color: var(--color-rarity-unique);
  18164. }
  18165. .tags .tag.mystified,
  18166. .tags .tag option.mystified {
  18167. opacity: 0.7;
  18168. }
  18169. .tags.paizo-style {
  18170. border: none;
  18171. border-radius: 3px;
  18172. gap: 0;
  18173. padding: 0.5em 0.05em;
  18174. }
  18175. .tags.paizo-style tag,
  18176. .tags.paizo-style .tag,
  18177. .tags.paizo-style select.tag {
  18178. background-color: var(--color-bg-trait);
  18179. border: solid var(--color-border-trait);
  18180. box-shadow: none;
  18181. margin: 0;
  18182. }
  18183. .tags.paizo-style tag x,
  18184. .tags.paizo-style .tag x,
  18185. .tags.paizo-style select.tag x {
  18186. align-items: start;
  18187. margin: 0;
  18188. }
  18189. .tags.paizo-style tag__removeBtn,
  18190. .tags.paizo-style .tag__removeBtn,
  18191. .tags.paizo-style select.tag__removeBtn {
  18192. align-items: baseline;
  18193. }
  18194. .tags.paizo-style tag,
  18195. .tags.paizo-style select.tag {
  18196. border-width: 2px 3px 2px 2px;
  18197. }
  18198. .tags.paizo-style tag:first-child,
  18199. .tags.paizo-style select.tag:first-child {
  18200. border-left-width: 5px;
  18201. }
  18202. .tags.paizo-style tag:last-child,
  18203. .tags.paizo-style select.tag:last-child {
  18204. border-right-width: 5px;
  18205. }
  18206. .tags.paizo-style tag:last-of-type {
  18207. border-right-width: 5px;
  18208. }
  18209. .tags.paizo-style .tag {
  18210. border-width: 1px 2px 1px 1px;
  18211. }
  18212. .tags.paizo-style .tag:first-child {
  18213. border-left-width: 3px;
  18214. }
  18215. .tags.paizo-style .tag:last-child {
  18216. border-right-width: 3px;
  18217. }
  18218. .tags.paizo-style .tag.alignment {
  18219. background-color: var(--color-bg-alignment);
  18220. }
  18221. .tags.paizo-style .tag.size {
  18222. background-color: var(--color-bg-size);
  18223. }
  18224. .tags.paizo-style tag > div {
  18225. border-radius: 0;
  18226. display: flex;
  18227. font: 500 var(--font-size-10) var(--sans-serif);
  18228. padding: 0 0.09rem 0 0.25rem;
  18229. }
  18230. .tags.paizo-style tag > div .tagify__tag-text {
  18231. text-transform: uppercase;
  18232. }
  18233. .tags.paizo-style hr.vr {
  18234. height: 1.25em;
  18235. margin: 1px 2px;
  18236. }
  18237. .tags.paizo-style[disabled] {
  18238. filter: none;
  18239. }
  18240. .tags.paizo-style[disabled] tag > div::before {
  18241. animation: none !important;
  18242. }
  18243. .tags.paizo-style[disabled] > .tagify__input {
  18244. display: none;
  18245. }
  18246. .chat-message .tags {
  18247. line-height: normal;
  18248. }
  18249. tags.tags.paizo-style {
  18250. background-color: rgba(0, 0, 0, 0.075);
  18251. padding: 0;
  18252. --tag-bg: var(--color-bg-trait);
  18253. --tag-hover: var(--color-bg-trait);
  18254. --tag-remove-btn-color: var(--color-text-trait);
  18255. --tag-text-color: var(--color-text-trait);
  18256. --tags-border-color: var(--color-border-trait);
  18257. --tags-focus-border-color: var(--color-border-trait);
  18258. --tags-hover-border-color: var(--color-border-trait);
  18259. --readonly-striped: 0;
  18260. }
  18261. tags.tags.paizo-style .tagify__input {
  18262. margin: 0;
  18263. padding: 0.1em 0.5em;
  18264. }
  18265. tags.tags.paizo-style .tagify__input::before {
  18266. align-items: center;
  18267. color: var(--color-text-dark-secondary);
  18268. display: flex;
  18269. font: 500 var(--font-size-10) var(--sans-serif);
  18270. letter-spacing: 0.05em;
  18271. margin: 0;
  18272. min-height: 22px;
  18273. text-rendering: optimizeLegibility;
  18274. text-transform: uppercase;
  18275. width: fit-content;
  18276. }
  18277. tags.tags.paizo-style .conjunction-not .tagify__tag-text {
  18278. text-decoration: line-through;
  18279. text-decoration-color: var(--color-text-trait);
  18280. }
  18281. tags.tags.paizo-style tag {
  18282. height: var(--font-size-27);
  18283. }
  18284. tags.tags.paizo-style tag[readonly=true] {
  18285. padding-right: 2px;
  18286. }
  18287. tags.tagify.pf2e-tagify {
  18288. --tag-bg: var(--color-text-light-3);
  18289. --tags-border-color: var(--color-text-light-5);
  18290. --tags-hover-border-color: var(--color-text-light-5);
  18291. align-items: center;
  18292. background-color: rgba(255, 255, 255, 0.5);
  18293. border-radius: 3px;
  18294. gap: 3px;
  18295. padding: 2px;
  18296. }
  18297. tags.tagify.pf2e-tagify:hover {
  18298. box-shadow: 0 0 10px #00005a;
  18299. }
  18300. tags.tagify.pf2e-tagify tag {
  18301. margin: 0;
  18302. padding: 1px;
  18303. }
  18304. tags.tagify.pf2e-tagify tag x {
  18305. margin: 0;
  18306. }
  18307. tags.tagify.pf2e-tagify tag > div {
  18308. padding: 2px;
  18309. }
  18310. tags.tagify.pf2e-tagify tag > div .tagify__tag-text {
  18311. font-weight: normal;
  18312. }
  18313. tags.tagify.pf2e-tagify tag .tagify__tag__removeBtn {
  18314. align-items: baseline;
  18315. }
  18316. tags.tagify.pf2e-tagify .tagify__input {
  18317. margin: 0;
  18318. }
  18319. tags.pf2e-tagify.tagify--hasMaxTags > span,
  18320. tags.tags.paizo-style.tagify--hasMaxTags > span {
  18321. display: none;
  18322. }
  18323. tags.pf2e-tagify:not(.tagify--select) > span,
  18324. tags.tags.paizo-style:not(.tagify--select) > span {
  18325. min-width: 20px;
  18326. }
  18327. .damage-tag {
  18328. white-space: nowrap;
  18329. margin: 0 1px 1px 0;
  18330. padding: 0 3px;
  18331. font-size: var(--font-size-10);
  18332. line-height: 16px;
  18333. border: 1px solid #999;
  18334. border-radius: 3px;
  18335. }
  18336. .damage-tag-base {
  18337. color: var(--text-light);
  18338. background: rgba(0, 0, 0, 0.45);
  18339. }
  18340. .damage-tag-modifier {
  18341. background: rgba(0, 0, 0, 0.05);
  18342. }
  18343. .tagify {
  18344. --tag-inset-shadow-size: 10em;
  18345. }
  18346. .tagify__tag__removeBtn {
  18347. overflow: visible;
  18348. }
  18349. #generate-check-prompt {
  18350. height: auto !important;
  18351. }
  18352. #generate-check-prompt .dialog-content > nav a.active {
  18353. text-decoration: underline;
  18354. }
  18355. #generate-check-prompt .dialog-content section.check-prompt-content .form-group.secret {
  18356. justify-content: end;
  18357. text-align: right;
  18358. }
  18359. #generate-check-prompt .dialog-content section.check-prompt-content .roll-options {
  18360. display: none;
  18361. }
  18362. #generate-check-prompt .dialog-content section.check-prompt-content a.add-roll-options i.fa-plus {
  18363. display: inline;
  18364. }
  18365. #generate-check-prompt .dialog-content section.check-prompt-content a.add-roll-options i.fa-minus {
  18366. display: none;
  18367. }
  18368. #generate-check-prompt .dialog-content section.check-prompt-content input#check-prompt-secret,
  18369. #generate-check-prompt .dialog-content section.check-prompt-content input#check-prompt-basic-save {
  18370. margin-right: 0;
  18371. }
  18372. #generate-check-prompt .dialog-content section.check-prompt-content.show-roll-options .roll-options {
  18373. display: block;
  18374. }
  18375. #generate-check-prompt .dialog-content section.check-prompt-content.show-roll-options a.add-roll-options i.fa-plus {
  18376. display: none;
  18377. }
  18378. #generate-check-prompt .dialog-content section.check-prompt-content.show-roll-options a.add-roll-options i.fa-minus {
  18379. display: inline;
  18380. }
  18381. #generate-check-prompt .dialog-content select {
  18382. height: var(--form-field-height);
  18383. text-transform: capitalize;
  18384. }
  18385. #generate-check-prompt .dialog-content tags.tagify {
  18386. background-color: rgba(0, 0, 0, 0.075);
  18387. border: 1px solid var(--color-border-light-tertiary);
  18388. border-radius: 3px;
  18389. }
  18390. #generate-check-prompt .dialog-buttons {
  18391. flex: 0 1 auto;
  18392. }
  18393. .travel-duration h2 {
  18394. margin-top: 10px;
  18395. margin-bottom: 30px;
  18396. }
  18397. .travel-duration table td {
  18398. padding: 5px 10px;
  18399. }
  18400. .travel-duration table td.centered {
  18401. text-align: center;
  18402. }
  18403. .travel-duration .journey-input {
  18404. display: grid;
  18405. column-gap: 5px;
  18406. grid: "size type"/50px 1fr 1fr;
  18407. }
  18408. .travel-duration .fraction-input {
  18409. text-align: center;
  18410. }
  18411. .travel-duration .fraction-input input {
  18412. width: 30px;
  18413. }
  18414. .travel-duration .speed-input {
  18415. width: 30px;
  18416. }