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.

18418 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. @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-30: 1.875rem;
  545. --font-size-34: 2.125rem;
  546. --font-size-36: 2.25rem;
  547. --font-size-42: 2.625rem;
  548. /** Font families */
  549. --body-serif: Gelasio, Georgia, serif;
  550. --sans-serif: Roboto, sans-serif;
  551. --sans-serif-condensed: "Roboto Condensed", var(--sans-serif);
  552. --sans-serif-monospace: "Roboto Mono", monospace;
  553. --serif: Eczar, Georgia, serif;
  554. --serif-condensed: "Modesto Condensed", serif;
  555. --journal-cursive: "La Belle Aurore", cursive;
  556. --journal-serif: "Vollkorn", var(--serif);
  557. }
  558. /* ----------------------------------------- */
  559. /* Color definitions */
  560. /* ----------------------------------------- */
  561. /* Colors */
  562. /* Global */
  563. /* used for mini headers, alternate primary color */
  564. /* compliments the primary color, usually used in combination */
  565. /* for all other uses */
  566. /* Lighter / Darker */
  567. /* Text */
  568. /* ----------------------------------------- */
  569. /* Color schemes */
  570. /* ----------------------------------------- */
  571. /* Degrees of success */
  572. /* Value adjustments (e.g. weak/elite) */
  573. /* ----------------------------------------- */
  574. /* CSS Custom Properties */
  575. /* ----------------------------------------- */
  576. :root {
  577. /* Global */
  578. --color-pf-primary: #5e0000;
  579. --color-pf-primary-light: #910000;
  580. --color-pf-primary-dark: #2b0000;
  581. --color-pf-secondary: #171f69;
  582. --color-pf-secondary-light: #202b93;
  583. --color-pf-secondary-dark: #0e133f;
  584. --primary: var(--color-pf-primary);
  585. --secondary: var(--color-pf-secondary);
  586. --tertiary: #e9d7a1;
  587. --alt: #786452;
  588. --alt-dark: #443730;
  589. --bg: #f8f4f1;
  590. --bg-dark: #e7d9cf;
  591. --sub: #605856;
  592. --color-disabled: #ababab;
  593. --inline-link-bg: #ddd;
  594. --inline-repost-bg: #eaeaea;
  595. --visibility-gm-bg: #e8e8ef;
  596. --visibility-owner-bg: #ddebe1;
  597. --blind-roll: #f5eaf5;
  598. /* Lighter / Darker */
  599. --light: #910000;
  600. --primary-dark: #2b0000;
  601. --primary-darker: #120000;
  602. --tertiary-dark: #dfc578;
  603. --tertiary-light: #f3e9ca;
  604. /* Text */
  605. --text-dark: var(--color-text-dark-primary);
  606. --text-light: #f5efe0;
  607. --color-text-dark-input: #333;
  608. --color-text-dark-improved: #006644;
  609. /* Borders */
  610. --color-border-divider: #baa991;
  611. --color-border-dark-input: #d3ccbc;
  612. --color-border-medium: gray;
  613. /* Headers w/ boxes */
  614. --header-color: var(--text-light);
  615. --header-bg: var(--secondary);
  616. /* Sidebar */
  617. --sidebar-label: var(--tertiary-dark);
  618. --sidebar-title: var(--tertiary);
  619. /** Traits */
  620. --color-bg-alignment: #576293;
  621. --color-bg-size: #3a7b59;
  622. --color-bg-trait: #5e0000;
  623. --color-border-trait: #d8c384;
  624. --color-text-trait: white;
  625. /* Rarity */
  626. --color-rarity-common: #323232;
  627. --color-rarity-uncommon: #98513d;
  628. --color-rarity-rare: #002664;
  629. --color-rarity-unique: #54166e;
  630. /** Proficiency ranks */
  631. --color-proficiency-untrained: #424242;
  632. --color-proficiency-trained: #171f69;
  633. --color-proficiency-expert: #3c005e;
  634. --color-proficiency-master: #664400;
  635. --color-proficiency-legendary: #5e0000;
  636. /* Damage colors */
  637. }
  638. :root .damage {
  639. --color-bg-acid: rgba(0, 115, 0, 0.125);
  640. --color-bg-bleed: rgba(153, 0, 26, 0.125);
  641. --color-bg-chaotic: rgba(166, 0, 166, 0.125);
  642. --color-bg-cold: rgba(47, 47, 166, 0.125);
  643. --color-bg-electricity: rgba(184, 134, 11, 0.125);
  644. --color-bg-evil: rgba(75, 0, 130, 0.125);
  645. --color-bg-fire: rgba(166, 47, 0, 0.125);
  646. --color-bg-force: rgba(99, 0, 170, 0.125);
  647. --color-bg-good: rgba(157, 115, 10, 0.125);
  648. --color-bg-lawful: rgba(64, 38, 0, 0.125);
  649. --color-bg-mental: rgba(25, 25, 112, 0.125);
  650. --color-bg-physical: rgba(60, 60, 60, 0.125);
  651. --color-bg-poison: rgba(91, 115, 50, 0.125);
  652. --color-bg-sonic: rgba(0, 139, 139, 0.125);
  653. --color-bg-spirit: rgba(90, 85, 133, 0.125);
  654. --color-bg-vitality: rgba(255, 255, 224, 0.125);
  655. --color-bg-void: rgba(0, 0, 31, 0.125);
  656. --color-border-acid: #007300;
  657. --color-border-bleed: #99001a;
  658. --color-border-chaotic: #a600a6;
  659. --color-border-cold: #2f2fa6;
  660. --color-border-electricity: darkgoldenrod;
  661. --color-border-evil: indigo;
  662. --color-border-fire: #a62f00;
  663. --color-border-force: #6300aa;
  664. --color-border-good: #9d730a;
  665. --color-border-lawful: #402600;
  666. --color-border-mental: midnightblue;
  667. --color-border-physical: #3c3c3c;
  668. --color-border-poison: #5b7332;
  669. --color-border-sonic: darkcyan;
  670. --color-border-spirit: #5a5585;
  671. --color-border-vitality: #ffffe0;
  672. --color-border-void: #00001f;
  673. --color-text-acid: #003300;
  674. --color-text-bleed: #59000f;
  675. --color-text-chaotic: #660066;
  676. --color-text-cold: #212174;
  677. --color-text-electricity: #7c5a07;
  678. --color-text-evil: #260042;
  679. --color-text-fire: #661d00;
  680. --color-text-force: #3e006a;
  681. --color-text-good: #614706;
  682. --color-text-lawful: black;
  683. --color-text-mental: #0d0d3c;
  684. --color-text-physical: #1c1c1c;
  685. --color-text-poison: #38471f;
  686. --color-text-sonic: #004b4b;
  687. --color-text-spirit: #403c5e;
  688. --color-text-vitality: #ffffa0;
  689. --color-text-void: black;
  690. }
  691. :root .damage.color.acid {
  692. background-color: var(--color-bg-acid);
  693. border-color: var(--color-border-acid);
  694. color: var(--color-text-acid);
  695. }
  696. :root .damage.color.acid .icon {
  697. color: var(--color-border-acid);
  698. }
  699. :root .damage.color.bleed {
  700. background-color: var(--color-bg-bleed);
  701. border-color: var(--color-border-bleed);
  702. color: var(--color-text-bleed);
  703. }
  704. :root .damage.color.bleed .icon {
  705. color: var(--color-border-bleed);
  706. }
  707. :root .damage.color.bludgeoning, :root .damage.color.piercing, :root .damage.color.slashing {
  708. background-color: var(--color-bg-physical);
  709. border-color: var(--color-border-physical);
  710. color: var(--color-text-physical);
  711. }
  712. :root .damage.color.bludgeoning .icon, :root .damage.color.piercing .icon, :root .damage.color.slashing .icon {
  713. color: var(--color-border-physical);
  714. }
  715. :root .damage.color.chaotic {
  716. background-color: var(--color-bg-chaotic);
  717. border-color: var(--color-border-chaotic);
  718. color: var(--color-text-chaotic);
  719. }
  720. :root .damage.color.chaotic .icon {
  721. color: var(--color-border-chaotic);
  722. }
  723. :root .damage.color.cold {
  724. background-color: var(--color-bg-cold);
  725. border-color: var(--color-border-cold);
  726. box-shadow: var(--color-border-cold);
  727. color: var(--color-text-cold);
  728. }
  729. :root .damage.color.cold .icon {
  730. color: var(--color-border-cold);
  731. }
  732. :root .damage.color.electricity {
  733. background-color: var(--color-bg-electricity);
  734. border-color: var(--color-border-electricity);
  735. color: var(--color-text-electricity);
  736. }
  737. :root .damage.color.electricity .icon {
  738. color: var(--color-border-electricity);
  739. }
  740. :root .damage.color.evil {
  741. background-color: var(--color-bg-evil);
  742. border-color: var(--color-border-evil);
  743. color: var(--color-text-evil);
  744. }
  745. :root .damage.color.evil .icon {
  746. color: var(--color-border-evil);
  747. }
  748. :root .damage.color.fire {
  749. background-color: var(--color-bg-fire);
  750. border-color: var(--color-border-fire);
  751. box-shadow: var(--color-border-fire);
  752. color: var(--color-text-fire);
  753. }
  754. :root .damage.color.fire .icon {
  755. color: var(--color-border-fire);
  756. }
  757. :root .damage.color.force {
  758. background-color: var(--color-bg-force);
  759. border-color: var(--color-border-force);
  760. color: var(--color-text-force);
  761. }
  762. :root .damage.color.force .icon {
  763. color: var(--color-border-force);
  764. }
  765. :root .damage.color.good {
  766. background-color: var(--color-bg-good);
  767. border-color: var(--color-border-good);
  768. color: var(--color-text-good);
  769. }
  770. :root .damage.color.good .icon {
  771. color: var(--color-border-good);
  772. }
  773. :root .damage.color.lawful {
  774. background-color: var(--color-bg-lawful);
  775. border-color: var(--color-border-lawful);
  776. color: var(--color-text-lawful);
  777. }
  778. :root .damage.color.lawful .icon {
  779. color: var(--color-border-lawful);
  780. }
  781. :root .damage.color.mental {
  782. background-color: var(--color-bg-mental);
  783. border-color: var(--color-border-mental);
  784. color: var(--color-text-mental);
  785. }
  786. :root .damage.color.mental .icon {
  787. color: var(--color-border-mental);
  788. }
  789. :root .damage.color.poison {
  790. background-color: var(--color-bg-poison);
  791. border-color: var(--color-border-poison);
  792. color: var(--color-text-poison);
  793. }
  794. :root .damage.color.poison .icon {
  795. color: var(--color-border-poison);
  796. }
  797. :root .damage.color.sonic {
  798. border-color: var(--color-border-sonic);
  799. background-color: var(--color-bg-sonic);
  800. color: var(--color-text-sonic);
  801. }
  802. :root .damage.color.sonic .icon {
  803. color: var(--color-border-sonic);
  804. }
  805. :root .damage.color.spirit {
  806. border-color: var(--color-border-spirit);
  807. background-color: var(--color-bg-spirit);
  808. color: var(--color-text-spirit);
  809. }
  810. :root .damage.color.spirit .icon {
  811. color: var(--color-border-spirit);
  812. }
  813. :root .damage.color.vitality {
  814. background-color: var(--color-bg-physical);
  815. border-color: var(--color-border-vitality);
  816. color: var(--color-text-vitality);
  817. text-shadow: 1px 1px var(--color-text-dark-1);
  818. }
  819. :root .damage.color.vitality .icon {
  820. color: var(--color-border-vitality);
  821. }
  822. :root .damage.color.void {
  823. background-color: var(--color-bg-void);
  824. border-color: var(--color-border-void);
  825. color: var(--color-border-void);
  826. }
  827. :root .damage.color.void .icon {
  828. color: var(--color-border-void);
  829. }
  830. @keyframes fadein {
  831. from {
  832. opacity: 0;
  833. }
  834. to {
  835. opacity: 1;
  836. }
  837. }
  838. /**
  839. * Legacy is for the old css unrelated
  840. * to the current design (crb-style).
  841. * Only use the legacy folder if you need
  842. * to make changes to the old css.
  843. *
  844. * If you're adding a new feature, put it
  845. * in the appropriate folder in src/styles.
  846. * Just make sure to update the relevant
  847. * _index.scss so that it will get compiled.
  848. *
  849. */
  850. :root {
  851. --primary-background: #454a7c;
  852. --secondary-background: gray;
  853. --tertiary-background: #454a7c;
  854. --alternate-background: darkgray;
  855. }
  856. /* ---------------------------------------- */
  857. /* Actor Sheet */
  858. /* ---------------------------------------- */
  859. .pf2e.actor form {
  860. font-size: var(--font-size-13);
  861. height: 100%;
  862. padding: 0.25rem;
  863. }
  864. .pf2e.actor form .sheet-header {
  865. border-bottom: 1px solid var(--primary-background);
  866. display: flex;
  867. flex-direction: row;
  868. flex-wrap: wrap;
  869. flex: 0 0 100%;
  870. height: 3rem;
  871. justify-content: flex-start;
  872. }
  873. .pf2e.actor form .sheet-header > * {
  874. flex: 1;
  875. }
  876. .pf2e.actor form .sheet-header h1 {
  877. margin: 0;
  878. border: none;
  879. }
  880. .pf2e.actor form .sheet-header h1 > input {
  881. font-family: var(--serif-condensed);
  882. font-weight: 700;
  883. height: 2.5rem;
  884. width: 100%;
  885. margin: 2px;
  886. font-size: var(--font-size-36);
  887. border: none;
  888. }
  889. .pf2e.actor form .sheet-sidebar {
  890. height: calc(100% - 48px);
  891. display: flex;
  892. flex-direction: column;
  893. flex-wrap: nowrap;
  894. overflow: hidden auto;
  895. border-right: 1px solid var(--primary-background);
  896. }
  897. .pf2e.actor form .sheet-sidebar .tab {
  898. height: 100%;
  899. padding-top: 2px;
  900. overflow-y: auto;
  901. }
  902. .pf2e.actor form .sheet-sidebar > * {
  903. flex: 1;
  904. }
  905. .pf2e.actor form .sheet-sidebar .sidebar-summary {
  906. overflow-y: hidden;
  907. }
  908. .pf2e.actor form .sheet-body {
  909. height: calc(100% - 35px);
  910. overflow: hidden;
  911. display: flex;
  912. flex-direction: column;
  913. flex-wrap: nowrap;
  914. }
  915. .pf2e.actor form input[type=text], .pf2e.actor form input[type=number] {
  916. background: rgba(0, 0, 0, 0.025);
  917. border: 1px solid transparent;
  918. color: var(--color-text-dark-input);
  919. height: calc(100% - 2px);
  920. margin: 1px 0;
  921. padding: 0;
  922. width: calc(100% - 2px);
  923. }
  924. .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 {
  925. border: 1px solid black;
  926. box-shadow: 0 0 10px #00005a;
  927. }
  928. .pf2e.actor form label {
  929. display: block;
  930. }
  931. .pf2e.actor form .mce-panel span {
  932. display: inherit;
  933. }
  934. .pf2e.actor form.editable .rollable:hover {
  935. color: #000;
  936. text-shadow: 0 0 10px #00005a;
  937. cursor: pointer;
  938. }
  939. .pf2e.actor form .sheet-tabs {
  940. font-weight: 500;
  941. height: 30px;
  942. }
  943. .pf2e.actor form .sheet-tabs > .list-row {
  944. line-height: 2rem;
  945. padding-top: 3px;
  946. font-size: var(--font-size-12);
  947. text-align: center;
  948. }
  949. .pf2e.actor form .sheet-tabs > .list-row:last-of-type {
  950. padding-right: 4px;
  951. }
  952. .pf2e.actor form .sheet-tabs > .list-row.active {
  953. color: var(--text-dark);
  954. font-weight: 700;
  955. }
  956. .pf2e.actor form .tag-legacy {
  957. float: left;
  958. margin: 0 2px 2px 0;
  959. padding: 0 3px;
  960. font-size: var(--font-size-10);
  961. line-height: 1rem;
  962. border: 1px solid var(--color-border-light-2);
  963. border-radius: 3px;
  964. white-space: normal;
  965. font-weight: 500;
  966. }
  967. .pf2e.actor form .traits label {
  968. font-weight: bold;
  969. }
  970. .pf2e.actor form .traits select {
  971. margin: 2px 0;
  972. }
  973. .pf2e.actor form .traits .trait-perception > input {
  974. flex: 0 0 32px;
  975. text-align: center;
  976. }
  977. .pf2e.actor form .traits .tag-selector {
  978. float: right;
  979. margin-right: 3px;
  980. color: #999;
  981. font-size: var(--font-size-10);
  982. line-height: 16px;
  983. }
  984. .pf2e.actor form .inventory-header {
  985. list-style: none;
  986. margin: 0;
  987. padding: 0;
  988. }
  989. .pf2e.actor form .action-header .item-controls {
  990. flex: 0 0 44px;
  991. }
  992. .pf2e.actor form .action-header .item-controls a {
  993. display: block;
  994. float: left;
  995. width: 44px;
  996. font-size: var(--font-size-14);
  997. text-align: center;
  998. }
  999. .pf2e.actor form .list-row.action-header .item-controls a {
  1000. display: block;
  1001. float: left;
  1002. width: 22px;
  1003. font-size: var(--font-size-10);
  1004. text-align: center;
  1005. color: #666;
  1006. }
  1007. .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 {
  1008. width: 100%;
  1009. color: #fff;
  1010. background: var(--primary-background);
  1011. }
  1012. /* ----------------------------------------- */
  1013. /* Item Buttons */
  1014. /* ----------------------------------------- */
  1015. .pf2e.sheet .item-buttons button {
  1016. font-size: var(--font-size-10);
  1017. line-height: 12px;
  1018. margin: 0;
  1019. }
  1020. .pf2e.sheet .item-buttons > span {
  1021. padding: 0;
  1022. }
  1023. li.list-row.hover-container {
  1024. background-color: #aaa !important;
  1025. }
  1026. .dice-total-shield-btn.shield-activated {
  1027. background-color: #333;
  1028. color: var(--text-light);
  1029. }
  1030. .recall-knowledge-table th {
  1031. padding: 5px 8px;
  1032. }
  1033. .recall-knowledge-table td {
  1034. text-align: center;
  1035. padding: 5px 8px;
  1036. }
  1037. .recall-knowledge-table td:first-child {
  1038. text-align: right;
  1039. }
  1040. .recall-knowledge-table th:first-child {
  1041. text-align: right;
  1042. }
  1043. button:hover::not(:disabled) {
  1044. box-shadow: 0 0 3px #c00;
  1045. }
  1046. button:disabled {
  1047. color: #666;
  1048. }
  1049. button:active {
  1050. box-shadow: 0 0 5px red;
  1051. }
  1052. .app.tag-selector {
  1053. max-height: 700px;
  1054. }
  1055. /* ----------------------------------------- */
  1056. /* Item Card Structure */
  1057. /* ----------------------------------------- */
  1058. .pf2e.chat-card {
  1059. font-style: normal;
  1060. }
  1061. .pf2e.chat-card .card-header {
  1062. padding: 2px 0;
  1063. border-top: 2px groove #fff;
  1064. border-bottom: 2px groove #fff;
  1065. align-items: center;
  1066. min-height: 36px;
  1067. }
  1068. .pf2e.chat-card .card-header img {
  1069. flex: 0 0 36px;
  1070. margin-right: 5px;
  1071. height: 36px;
  1072. width: 36px;
  1073. }
  1074. .pf2e.chat-card .card-header h3 {
  1075. border-bottom: none;
  1076. flex: 1;
  1077. margin: 0;
  1078. }
  1079. .pf2e.chat-card .card-header h4 {
  1080. flex: 0;
  1081. margin: 0 5px 0 0;
  1082. white-space: nowrap;
  1083. }
  1084. .pf2e.chat-card .tags {
  1085. margin: 3px 0 0;
  1086. }
  1087. .pf2e.chat-card .card-content {
  1088. margin: 4px 0;
  1089. }
  1090. .pf2e.chat-card .card-content p {
  1091. margin: 4px 0;
  1092. min-height: unset;
  1093. }
  1094. .pf2e.chat-card .card-buttons {
  1095. display: flex;
  1096. flex-basis: 100%;
  1097. flex-direction: column;
  1098. margin: 4px 0;
  1099. }
  1100. .pf2e.chat-card .card-buttons button {
  1101. margin: 2px 0;
  1102. }
  1103. .pf2e.chat-card .card-buttons button.with-image {
  1104. display: flex;
  1105. align-items: center;
  1106. justify-content: center;
  1107. }
  1108. .pf2e.chat-card .card-buttons button.with-image img {
  1109. border: none;
  1110. height: 2em;
  1111. margin-right: 0.5em;
  1112. }
  1113. .pf2e.chat-card .card-buttons button span {
  1114. border: none;
  1115. }
  1116. .pf2e.chat-card .card-buttons .owner-buttons {
  1117. display: flex;
  1118. flex-basis: 100%;
  1119. flex-direction: column;
  1120. }
  1121. .pf2e.chat-card .card-buttons .spell-attack-buttons,
  1122. .pf2e.chat-card .card-buttons .spell-button {
  1123. display: flex;
  1124. flex-direction: row;
  1125. }
  1126. .pf2e.chat-card .card-buttons .spell-attack-buttons *,
  1127. .pf2e.chat-card .card-buttons .spell-button * {
  1128. flex-grow: 1;
  1129. flex-basis: 0;
  1130. }
  1131. .pf2e.chat-card .card-buttons .spell-attack-buttons :first-child,
  1132. .pf2e.chat-card .card-buttons .spell-button :first-child {
  1133. flex-grow: 2;
  1134. }
  1135. .pf2e.chat-card .card-buttons .spell-button button.small {
  1136. flex-grow: 0;
  1137. }
  1138. .pf2e.chat-card .card-buttons .spell-button button.small > i {
  1139. margin-right: 0;
  1140. }
  1141. .pf2e.chat-card .card-buttons .hidden-to-others {
  1142. background: var(--visibility-gm-bg);
  1143. }
  1144. .pf2e.chat-card .card-footer {
  1145. padding: 3px 0 0;
  1146. border-top: 2px groove #fff;
  1147. }
  1148. .pf2e.chat-card .card-footer span {
  1149. border-right: 2px groove #fff;
  1150. padding: 0 5px 0 0;
  1151. font-size: var(--font-size-12);
  1152. }
  1153. .pf2e.chat-card .card-footer span:last-child {
  1154. border-right: none;
  1155. padding-right: 0;
  1156. }
  1157. .pf2e.chat-card .card-buttons-multiattack {
  1158. display: grid;
  1159. grid-template-columns: auto 40px 40px;
  1160. grid-column-gap: 4px;
  1161. }
  1162. .pf2e.chat-card .card-buttons-two-column {
  1163. display: grid;
  1164. grid-template-columns: 1fr 1fr;
  1165. grid-column-gap: 4px;
  1166. }
  1167. /* This is the core CSS of Tooltipster */
  1168. /* GENERAL STRUCTURE RULES (do not edit this section) */
  1169. .tooltipster-base {
  1170. /* this ensures that a constrained height set by functionPosition,
  1171. if greater that the natural height of the tooltip, will be enforced
  1172. in browsers that support display:flex */
  1173. display: flex;
  1174. pointer-events: none;
  1175. /* this may be overriden in JS for fixed position origins */
  1176. position: absolute;
  1177. }
  1178. .tooltipster-box {
  1179. /* see .tooltipster-base. flex-shrink 1 is only necessary for IE10-
  1180. and flex-basis auto for IE11- (at least) */
  1181. flex: 1 1 auto;
  1182. }
  1183. .tooltipster-content {
  1184. /* prevents an overflow if the user adds padding to the div */
  1185. box-sizing: border-box;
  1186. /* these make sure we'll be able to detect any overflow */
  1187. max-height: 100%;
  1188. max-width: 100%;
  1189. overflow: auto;
  1190. }
  1191. .tooltipster-ruler {
  1192. /* these let us test the size of the tooltip without overflowing the window */
  1193. bottom: 0;
  1194. left: 0;
  1195. overflow: hidden;
  1196. position: fixed;
  1197. right: 0;
  1198. top: 0;
  1199. visibility: hidden;
  1200. }
  1201. /* ANIMATIONS */
  1202. /* Open/close animations */
  1203. /* fade */
  1204. .tooltipster-fade {
  1205. opacity: 0;
  1206. -webkit-transition-property: opacity;
  1207. -moz-transition-property: opacity;
  1208. -o-transition-property: opacity;
  1209. -ms-transition-property: opacity;
  1210. transition-property: opacity;
  1211. }
  1212. .tooltipster-fade.tooltipster-show {
  1213. opacity: 1;
  1214. }
  1215. /* grow */
  1216. .tooltipster-grow {
  1217. -webkit-transform: scale(0, 0);
  1218. -moz-transform: scale(0, 0);
  1219. -o-transform: scale(0, 0);
  1220. -ms-transform: scale(0, 0);
  1221. transform: scale(0, 0);
  1222. -webkit-transition-property: -webkit-transform;
  1223. -moz-transition-property: -moz-transform;
  1224. -o-transition-property: -o-transform;
  1225. -ms-transition-property: -ms-transform;
  1226. transition-property: transform;
  1227. -webkit-backface-visibility: hidden;
  1228. backface-visibility: hidden;
  1229. }
  1230. .tooltipster-grow.tooltipster-show {
  1231. -webkit-transform: scale(1, 1);
  1232. -moz-transform: scale(1, 1);
  1233. -o-transform: scale(1, 1);
  1234. -ms-transform: scale(1, 1);
  1235. transform: scale(1, 1);
  1236. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  1237. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1238. -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1239. -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1240. -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1241. transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1242. }
  1243. /* swing */
  1244. .tooltipster-swing {
  1245. opacity: 0;
  1246. -webkit-transform: rotateZ(4deg);
  1247. -moz-transform: rotateZ(4deg);
  1248. -o-transform: rotateZ(4deg);
  1249. -ms-transform: rotateZ(4deg);
  1250. transform: rotateZ(4deg);
  1251. -webkit-transition-property: -webkit-transform, opacity;
  1252. -moz-transition-property: -moz-transform;
  1253. -o-transition-property: -o-transform;
  1254. -ms-transition-property: -ms-transform;
  1255. transition-property: transform;
  1256. }
  1257. .tooltipster-swing.tooltipster-show {
  1258. opacity: 1;
  1259. -webkit-transform: rotateZ(0deg);
  1260. -moz-transform: rotateZ(0deg);
  1261. -o-transform: rotateZ(0deg);
  1262. -ms-transform: rotateZ(0deg);
  1263. transform: rotateZ(0deg);
  1264. -webkit-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 1);
  1265. -webkit-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1266. -moz-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1267. -ms-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1268. -o-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1269. transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  1270. }
  1271. /* fall */
  1272. .tooltipster-fall {
  1273. -webkit-transition-property: top;
  1274. -moz-transition-property: top;
  1275. -o-transition-property: top;
  1276. -ms-transition-property: top;
  1277. transition-property: top;
  1278. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  1279. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1280. -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1281. -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1282. -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1283. transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1284. }
  1285. .tooltipster-fall.tooltipster-initial {
  1286. top: 0 !important;
  1287. }
  1288. .tooltipster-fall.tooltipster-dying {
  1289. -webkit-transition-property: all;
  1290. -moz-transition-property: all;
  1291. -o-transition-property: all;
  1292. -ms-transition-property: all;
  1293. transition-property: all;
  1294. top: 0 !important;
  1295. opacity: 0;
  1296. }
  1297. /* slide */
  1298. .tooltipster-slide {
  1299. -webkit-transition-property: left;
  1300. -moz-transition-property: left;
  1301. -o-transition-property: left;
  1302. -ms-transition-property: left;
  1303. transition-property: left;
  1304. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  1305. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1306. -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1307. -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1308. -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1309. transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  1310. }
  1311. .tooltipster-slide.tooltipster-initial {
  1312. left: -40px !important;
  1313. }
  1314. .tooltipster-slide.tooltipster-dying {
  1315. -webkit-transition-property: all;
  1316. -moz-transition-property: all;
  1317. -o-transition-property: all;
  1318. -ms-transition-property: all;
  1319. transition-property: all;
  1320. left: 0 !important;
  1321. opacity: 0;
  1322. }
  1323. /* Update animations */
  1324. /* We use animations rather than transitions here because
  1325. transition durations may be specified in the style tag due to
  1326. animationDuration, and we try to avoid collisions and the use
  1327. of !important */
  1328. /* fade */
  1329. @keyframes tooltipster-fading {
  1330. 0% {
  1331. opacity: 0;
  1332. }
  1333. 100% {
  1334. opacity: 1;
  1335. }
  1336. }
  1337. .tooltipster-update-fade {
  1338. animation: tooltipster-fading 400ms;
  1339. }
  1340. /* rotate */
  1341. @keyframes tooltipster-rotating {
  1342. 25% {
  1343. transform: rotate(-2deg);
  1344. }
  1345. 75% {
  1346. transform: rotate(2deg);
  1347. }
  1348. 100% {
  1349. transform: rotate(0);
  1350. }
  1351. }
  1352. .tooltipster-update-rotate {
  1353. animation: tooltipster-rotating 600ms;
  1354. }
  1355. /* scale */
  1356. @keyframes tooltipster-scaling {
  1357. 50% {
  1358. transform: scale(1.1);
  1359. }
  1360. 100% {
  1361. transform: scale(1);
  1362. }
  1363. }
  1364. .tooltipster-update-scale {
  1365. animation: tooltipster-scaling 600ms;
  1366. }
  1367. /**
  1368. * DEFAULT STYLE OF THE SIDETIP PLUGIN
  1369. *
  1370. * All styles are "namespaced" with .tooltipster-sidetip to prevent
  1371. * conflicts between plugins.
  1372. */
  1373. /* .tooltipster-box */
  1374. .tooltipster-sidetip .tooltipster-box {
  1375. background: #565656;
  1376. border: 2px solid black;
  1377. border-radius: 4px;
  1378. }
  1379. .tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
  1380. margin-top: 8px;
  1381. }
  1382. .tooltipster-sidetip.tooltipster-left .tooltipster-box {
  1383. margin-right: 8px;
  1384. }
  1385. .tooltipster-sidetip.tooltipster-right .tooltipster-box {
  1386. margin-left: 8px;
  1387. }
  1388. .tooltipster-sidetip.tooltipster-top .tooltipster-box {
  1389. margin-bottom: 8px;
  1390. }
  1391. /* .tooltipster-content */
  1392. .tooltipster-sidetip .tooltipster-content {
  1393. color: var(--text-light);
  1394. line-height: 18px;
  1395. padding: 6px 14px;
  1396. }
  1397. /* .tooltipster-arrow : will keep only the zone of .tooltipster-arrow-uncropped that
  1398. corresponds to the arrow we want to display */
  1399. .tooltipster-sidetip .tooltipster-arrow {
  1400. overflow: hidden;
  1401. position: absolute;
  1402. }
  1403. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow {
  1404. height: 10px;
  1405. /* half the width, for centering */
  1406. margin-left: -10px;
  1407. top: 0;
  1408. width: 20px;
  1409. }
  1410. .tooltipster-sidetip.tooltipster-left .tooltipster-arrow {
  1411. height: 20px;
  1412. margin-top: -10px;
  1413. right: 0;
  1414. /* top 0 to keep the arrow from overflowing .tooltipster-base when it has not
  1415. been positioned yet */
  1416. top: 0;
  1417. width: 10px;
  1418. }
  1419. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
  1420. height: 20px;
  1421. margin-top: -10px;
  1422. left: 0;
  1423. /* same as .tooltipster-left .tooltipster-arrow */
  1424. top: 0;
  1425. width: 10px;
  1426. }
  1427. .tooltipster-sidetip.tooltipster-top .tooltipster-arrow {
  1428. bottom: 0;
  1429. height: 10px;
  1430. margin-left: -10px;
  1431. width: 20px;
  1432. }
  1433. /* common rules between .tooltipster-arrow-background and .tooltipster-arrow-border */
  1434. .tooltipster-sidetip .tooltipster-arrow-background,
  1435. .tooltipster-sidetip .tooltipster-arrow-border {
  1436. height: 0;
  1437. position: absolute;
  1438. width: 0;
  1439. }
  1440. /* .tooltipster-arrow-background */
  1441. .tooltipster-sidetip .tooltipster-arrow-background {
  1442. border: 10px solid transparent;
  1443. }
  1444. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background {
  1445. border-bottom-color: #565656;
  1446. left: 0;
  1447. top: 3px;
  1448. }
  1449. .tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background {
  1450. border-left-color: #565656;
  1451. left: -3px;
  1452. top: 0;
  1453. }
  1454. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background {
  1455. border-right-color: #565656;
  1456. left: 3px;
  1457. top: 0;
  1458. }
  1459. .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
  1460. border-top-color: #565656;
  1461. left: 0;
  1462. top: -3px;
  1463. }
  1464. /* .tooltipster-arrow-border */
  1465. .tooltipster-sidetip .tooltipster-arrow-border {
  1466. border: 10px solid transparent;
  1467. left: 0;
  1468. top: 0;
  1469. }
  1470. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border {
  1471. border-bottom-color: black;
  1472. }
  1473. .tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border {
  1474. border-left-color: black;
  1475. }
  1476. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
  1477. border-right-color: black;
  1478. }
  1479. .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
  1480. border-top-color: black;
  1481. }
  1482. /* tooltipster-arrow-uncropped */
  1483. .tooltipster-sidetip .tooltipster-arrow-uncropped {
  1484. position: relative;
  1485. }
  1486. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped {
  1487. top: -10px;
  1488. }
  1489. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped {
  1490. left: -10px;
  1491. }
  1492. @-webkit-keyframes wobble {
  1493. from {
  1494. -webkit-transform: translate3d(0, 0, 0);
  1495. transform: translate3d(0, 0, 0);
  1496. }
  1497. 15% {
  1498. -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  1499. transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  1500. }
  1501. 30% {
  1502. -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  1503. transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  1504. }
  1505. 45% {
  1506. -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  1507. transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  1508. }
  1509. 60% {
  1510. -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  1511. transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  1512. }
  1513. 75% {
  1514. -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  1515. transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  1516. }
  1517. to {
  1518. -webkit-transform: translate3d(0, 0, 0);
  1519. transform: translate3d(0, 0, 0);
  1520. }
  1521. }
  1522. @keyframes wobble {
  1523. from {
  1524. -webkit-transform: translate3d(0, 0, 0);
  1525. transform: translate3d(0, 0, 0);
  1526. }
  1527. 15% {
  1528. -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  1529. transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  1530. }
  1531. 30% {
  1532. -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  1533. transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  1534. }
  1535. 45% {
  1536. -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  1537. transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  1538. }
  1539. 60% {
  1540. -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  1541. transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  1542. }
  1543. 75% {
  1544. -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  1545. transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  1546. }
  1547. to {
  1548. -webkit-transform: translate3d(0, 0, 0);
  1549. transform: translate3d(0, 0, 0);
  1550. }
  1551. }
  1552. @keyframes rotation {
  1553. from {
  1554. -webkit-transform: rotate(0deg);
  1555. }
  1556. to {
  1557. -webkit-transform: rotate(359deg);
  1558. }
  1559. }
  1560. /* ----------------------------------------- */
  1561. /* Animation */
  1562. /* ----------------------------------------- */
  1563. :root {
  1564. --animate-duration: 1s;
  1565. --animate-delay: 1s;
  1566. --animate-repeat: 1;
  1567. }
  1568. /* ----------------------------------------- */
  1569. /* Layout */
  1570. /* ----------------------------------------- */
  1571. /** A vertical rule in a flexbox */
  1572. .vr {
  1573. border: 1px inset;
  1574. margin: 1px;
  1575. }
  1576. /* ----------------------------------------- */
  1577. /* Typography */
  1578. /* ----------------------------------------- */
  1579. .pf2e,
  1580. .app.sheet.actor {
  1581. font-family: var(--sans-serif);
  1582. }
  1583. .pf2e h1,
  1584. .pf2e h2,
  1585. .pf2e h3,
  1586. .pf2e h4,
  1587. .app.sheet.actor h1,
  1588. .app.sheet.actor h2,
  1589. .app.sheet.actor h3,
  1590. .app.sheet.actor h4 {
  1591. font-weight: 600;
  1592. }
  1593. .pf2e.sheet form span.pf2-icon,
  1594. .pf2e.sheet form span[data-pf2-action],
  1595. .pf2e.sheet form span[data-pf2-action] *,
  1596. .pf2e.sheet form span[data-pf2-check],
  1597. .pf2e.sheet form span[data-pf2-check] *,
  1598. .pf2-icon {
  1599. display: inline;
  1600. }
  1601. .pf2e.sheet form span.pf2-icon,
  1602. .pf2-icon {
  1603. font-family: "Pathfinder2eActions", sans-serif;
  1604. }
  1605. section.roll-note,
  1606. p.compact-text {
  1607. display: inline-block;
  1608. font-weight: normal;
  1609. line-height: 1.4em;
  1610. margin: 0.25em 0;
  1611. min-height: 1rem;
  1612. width: 100%;
  1613. }
  1614. .action-glyph {
  1615. align-self: center;
  1616. display: inline;
  1617. font-family: "Pathfinder2eActions", sans-serif;
  1618. letter-spacing: 0;
  1619. margin: 0;
  1620. padding: 0;
  1621. }
  1622. /* ----------------------------------------- */
  1623. /* Styled table */
  1624. /* ----------------------------------------- */
  1625. table.pf2-table {
  1626. border: solid 1px #000000;
  1627. border-collapse: collapse;
  1628. font-size: var(--font-size-13);
  1629. color: #191813;
  1630. user-select: text;
  1631. }
  1632. table.pf2-table thead,
  1633. table.pf2-table tbody,
  1634. table.pf2-table tr,
  1635. table.pf2-table th,
  1636. table.pf2-table td {
  1637. box-sizing: border-box;
  1638. user-select: text;
  1639. }
  1640. table.pf2-table tr:nth-child(odd) {
  1641. background-color: #eee5c8;
  1642. }
  1643. table.pf2-table tr:nth-child(even) {
  1644. background-color: #f6f1e1;
  1645. }
  1646. table.pf2-table th {
  1647. color: var(--text-light);
  1648. font-weight: bold;
  1649. background-color: #522e2c;
  1650. }
  1651. table.pf2-table th,
  1652. table.pf2-table td {
  1653. border: solid 1px #808080;
  1654. padding: 6px 15px;
  1655. text-align: center;
  1656. }
  1657. a.foundry-href {
  1658. color: var(--primary);
  1659. font-weight: 500;
  1660. text-decoration: underline;
  1661. }
  1662. a.content-link {
  1663. line-height: 1.6em;
  1664. }
  1665. #tooltip a.content-link {
  1666. color: var(--color-text-dark-primary);
  1667. }
  1668. .inline-roll.altered {
  1669. color: var(--color-text-dark-improved);
  1670. }
  1671. /* ----------------------------------------- */
  1672. /* PF2E Action Custom Element */
  1673. /* ----------------------------------------- */
  1674. span[data-pf2-action] {
  1675. background: var(--inline-link-bg);
  1676. border-radius: 2px;
  1677. border: 1px solid var(--color-border-dark-tertiary);
  1678. box-sizing: border-box;
  1679. color: var(--color-text-dark-primary);
  1680. line-height: 1.6em;
  1681. padding: 1px 4px;
  1682. white-space: nowrap;
  1683. word-break: break-all;
  1684. cursor: pointer;
  1685. }
  1686. span[data-pf2-action] > i.icon {
  1687. color: var(--color-text-dark-inactive);
  1688. margin-right: 0.25em;
  1689. }
  1690. span[data-pf2-action][data-pf2-glyph]::before {
  1691. font-family: "Pathfinder2eActions";
  1692. margin-right: 2px;
  1693. color: var(--color-text-dark-inactive);
  1694. }
  1695. span[data-pf2-action]:not([data-pf2-glyph])::before, span[data-pf2-action][data-pf2-glyph=""]::before {
  1696. display: inline-block;
  1697. height: 15px;
  1698. width: 15px;
  1699. background-image: url("../icons/actions/Passive.webp");
  1700. background-repeat: no-repeat;
  1701. background-size: 15px 15px;
  1702. opacity: 0.4;
  1703. margin-bottom: -3px;
  1704. margin-right: 2px;
  1705. content: "";
  1706. }
  1707. 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 {
  1708. content: "A";
  1709. }
  1710. 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 {
  1711. content: "D";
  1712. }
  1713. 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 {
  1714. content: "T";
  1715. }
  1716. span[data-pf2-action][data-pf2-glyph=F]::before, span[data-pf2-action][data-pf2-glyph=f]::before {
  1717. content: "F";
  1718. }
  1719. span[data-pf2-action][data-pf2-glyph=R]::before, span[data-pf2-action][data-pf2-glyph=r]::before {
  1720. content: "R";
  1721. }
  1722. /* ----------------------------------------- */
  1723. /* PF2E Check Custom Element */
  1724. /* ----------------------------------------- */
  1725. a.inline-check,
  1726. span[data-pf2-check] {
  1727. background: var(--inline-link-bg);
  1728. border-radius: 2px;
  1729. border: 1px solid var(--color-border-dark-tertiary);
  1730. box-sizing: border-box;
  1731. color: var(--color-text-dark-primary);
  1732. line-height: 1.6em;
  1733. padding: 1px 4px;
  1734. white-space: nowrap;
  1735. word-break: break-all;
  1736. }
  1737. a.inline-check > i.icon,
  1738. span[data-pf2-check] > i.icon {
  1739. color: var(--color-text-dark-inactive);
  1740. margin-right: 0.25em;
  1741. }
  1742. a.inline-check:has([data-pf2-repost]),
  1743. span[data-pf2-check]:has([data-pf2-repost]) {
  1744. padding-right: 0;
  1745. }
  1746. a.inline-check:hover,
  1747. span[data-pf2-check]:hover {
  1748. text-shadow: none;
  1749. }
  1750. a.inline-check:has(.label:hover, i.fa-dice-d20:hover),
  1751. span[data-pf2-check]:has(.label:hover, i.fa-dice-d20:hover) {
  1752. text-shadow: 0 0 8px var(--color-shadow-primary);
  1753. }
  1754. a.inline-check > i.icon:has(+ span.label > :first-child:is([data-visibility=gm])),
  1755. span[data-pf2-check] > i.icon:has(+ span.label > :first-child:is([data-visibility=gm])) {
  1756. margin-right: 0.25em;
  1757. }
  1758. a.inline-check[data-pf2-traits*=secret],
  1759. span[data-pf2-check][data-pf2-traits*=secret] {
  1760. background: var(--blind-roll);
  1761. border-color: #720073;
  1762. }
  1763. a.inline-check[data-invalid],
  1764. span[data-pf2-check][data-invalid] {
  1765. background: rgba(255, 0, 0, 0.05);
  1766. border: 1px dashed red;
  1767. }
  1768. /* ----------------------------------------- */
  1769. /* PF2E Inline Template Custom Element */
  1770. /* ----------------------------------------- */
  1771. span[data-pf2-effect-area] {
  1772. background: var(--inline-link-bg);
  1773. border-radius: 2px;
  1774. border: 1px solid var(--color-border-dark-tertiary);
  1775. box-sizing: border-box;
  1776. color: var(--color-text-dark-primary);
  1777. line-height: 1.6em;
  1778. padding: 1px 4px;
  1779. white-space: nowrap;
  1780. word-break: break-all;
  1781. cursor: pointer;
  1782. padding-right: 0;
  1783. }
  1784. span[data-pf2-effect-area] > i.icon {
  1785. color: var(--color-text-dark-inactive);
  1786. margin-right: 0.25em;
  1787. }
  1788. span[data-pf2-effect-area]::before {
  1789. color: var(--color-text-dark-inactive);
  1790. font-family: "Font Awesome 5 Free";
  1791. font-weight: 900;
  1792. margin-right: 0.25em;
  1793. }
  1794. span[data-pf2-effect-area][data-pf2-effect-area=cone]::before {
  1795. content: "\f104";
  1796. }
  1797. span[data-pf2-effect-area][data-pf2-effect-area=line]::before {
  1798. content: "\f7a5";
  1799. }
  1800. span[data-pf2-effect-area][data-pf2-effect-area=burst]::before {
  1801. content: "\f111";
  1802. }
  1803. span[data-pf2-effect-area][data-pf2-effect-area=emanation]::before {
  1804. content: "\f192";
  1805. }
  1806. span[data-pf2-effect-area][data-pf2-effect-area=rect]::before {
  1807. content: "\f0c8";
  1808. }
  1809. /* ----------------------------------------- */
  1810. /* PF2E Inline Repost Element */
  1811. /* ----------------------------------------- */
  1812. i[data-pf2-repost] {
  1813. 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;
  1814. background: var(--inline-repost-bg);
  1815. color: var(--color-text-dark-inactive);
  1816. border-left: 1px solid var(--color-border-dark-tertiary);
  1817. background: rgba(255, 255, 255, 0.6);
  1818. padding: 2px;
  1819. margin-left: 2px;
  1820. text-shadow: none;
  1821. }
  1822. i[data-pf2-repost]:hover {
  1823. color: var(--text-light);
  1824. text-shadow: 0px 0px 2px var(--text-dark);
  1825. }
  1826. [data-visibility]:not([data-visibility=all]) {
  1827. border-radius: 1px;
  1828. box-sizing: border-box;
  1829. display: inline-block;
  1830. line-height: 1em;
  1831. outline: 1px dotted rgba(75, 74, 68, 0.5);
  1832. padding: 1px;
  1833. /* ----------------------------------------- */
  1834. /* GM Visibility Elements */
  1835. /* ----------------------------------------- */
  1836. }
  1837. [data-visibility]:not([data-visibility=all])[data-visibility=gm] {
  1838. background: var(--visibility-gm-bg);
  1839. }
  1840. [data-visibility]:not([data-visibility=all])[data-visibility=gm].message-sender {
  1841. max-width: fit-content;
  1842. }
  1843. [data-visibility]:not([data-visibility=all])[data-visibility=gm] [data-visibility=gm] {
  1844. outline: none;
  1845. padding: initial;
  1846. }
  1847. /* ----------------------------------------- */
  1848. /* Forms */
  1849. /* ----------------------------------------- */
  1850. .crb-style {
  1851. display: flex;
  1852. }
  1853. .crb-style .details-label {
  1854. color: var(--primary);
  1855. font: 600 var(--font-size-11)/1em var(--sans-serif);
  1856. margin-left: 1px;
  1857. text-transform: uppercase;
  1858. white-space: nowrap;
  1859. }
  1860. .crb-style .details-input {
  1861. color: var(--text-dark);
  1862. font-family: var(--body-serif);
  1863. font-weight: bold;
  1864. width: calc(100% - 6px);
  1865. border-bottom: 1px solid var(--color-border-dark-input);
  1866. background-color: rgba(28, 28, 28, 0.1);
  1867. }
  1868. .crb-style .details-input::placeholder {
  1869. filter: opacity(0.5);
  1870. }
  1871. .crb-style .details-input:focus {
  1872. border-bottom: 1px solid var(--alt);
  1873. }
  1874. .crb-style .details-input[type=number] {
  1875. padding-bottom: 0;
  1876. padding-left: 4px;
  1877. }
  1878. .crb-style input {
  1879. border: none;
  1880. border-radius: 0;
  1881. }
  1882. .crb-style input:focus {
  1883. box-shadow: none;
  1884. }
  1885. .crb-style input:focus::placeholder {
  1886. color: transparent;
  1887. }
  1888. .crb-style input::placeholder {
  1889. color: inherit;
  1890. }
  1891. .crb-style input::-webkit-outer-spin-button, .crb-style input::-webkit-inner-spin-button {
  1892. -webkit-appearance: none;
  1893. margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
  1894. }
  1895. .crb-style input[type=number] {
  1896. -moz-appearance: textfield;
  1897. appearance: textfield;
  1898. }
  1899. .crb-style select {
  1900. -moz-appearance: none;
  1901. -webkit-appearance: none;
  1902. appearance: none;
  1903. background-color: var(--alt);
  1904. background-image: url("../assets/icons/chevron-down.svg");
  1905. background-position: right 0.25em top 50%;
  1906. background-repeat: no-repeat;
  1907. background-size: 1em auto;
  1908. border-radius: 2px;
  1909. border: 1px solid #53422a;
  1910. color: var(--text-light);
  1911. font: 500 var(--font-size-14) var(--serif);
  1912. height: auto;
  1913. line-height: 1;
  1914. padding: 0.25rem 1.1rem 0.25rem 0.25rem;
  1915. position: relative;
  1916. text-overflow: ellipsis;
  1917. }
  1918. .crb-style select:not(:disabled) {
  1919. cursor: pointer;
  1920. }
  1921. .crb-style select option {
  1922. background-color: var(--alt);
  1923. }
  1924. .crb-style .dots span {
  1925. cursor: pointer;
  1926. }
  1927. input[type=range]:disabled::-webkit-slider-runnable-track {
  1928. background: rgba(0, 0, 0, 0.1);
  1929. border: rgba(0, 0, 0, 0.1);
  1930. box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1), 0px 0px 1px rgba(0, 0, 0, 0.1);
  1931. cursor: default;
  1932. }
  1933. input[type=range]:disabled::-moz-range-track {
  1934. background: rgba(0, 0, 0, 0.1);
  1935. border: rgba(0, 0, 0, 0.1);
  1936. box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1), 0px 0px 1px rgba(0, 0, 0, 0.1);
  1937. cursor: default;
  1938. }
  1939. input[type=range]:disabled::-webkit-slider-thumb {
  1940. background: var(--color-text-light-1);
  1941. border: var(--color-text-light-1);
  1942. box-shadow: 1px 1px 1px var(--color-text-light-1), 0px 0px 1px var(--color-text-light-1);
  1943. cursor: default;
  1944. }
  1945. input[type=range]:disabled::-moz-range-thumb {
  1946. background: var(--color-text-light-1);
  1947. border: var(--color-text-light-1);
  1948. box-shadow: 1px 1px 1px var(--color-text-light-1), 0px 0px 1px var(--color-text-light-1);
  1949. cursor: default;
  1950. }
  1951. a[href]:hover {
  1952. text-shadow: 0 0 8px var(--color-text-hyperlink);
  1953. }
  1954. #loading-bar {
  1955. white-space: nowrap;
  1956. }
  1957. #tinymce {
  1958. --space-s: 0.25em;
  1959. --space-m: 0.5em;
  1960. --space-l: 1em;
  1961. --space-xl: 1.5em;
  1962. --space-2xl: 2em;
  1963. --radius: 3px;
  1964. }
  1965. #tinymce p {
  1966. min-height: unset;
  1967. }
  1968. #tinymce :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  1969. margin-top: 1em;
  1970. }
  1971. #tinymce .inline-header {
  1972. display: flex;
  1973. align-items: center;
  1974. gap: var(--space-l);
  1975. background-color: var(--alt);
  1976. font-family: var(--sans-serif);
  1977. color: var(--text-light);
  1978. padding: 0;
  1979. font-size: 0.8em;
  1980. font-weight: 400;
  1981. border: none;
  1982. }
  1983. #tinymce .inline-header strong {
  1984. display: inline-flex;
  1985. padding: 0 var(--space-m);
  1986. background-color: var(--primary);
  1987. min-width: 15ch;
  1988. border-right: 1px solid rgba(0, 0, 0, 0.4);
  1989. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  1990. font-weight: 400;
  1991. }
  1992. #tinymce .inline-header + p {
  1993. margin-top: var(--space-s);
  1994. }
  1995. #tinymce .info {
  1996. background-color: var(--secondary);
  1997. padding: var(--space-m);
  1998. color: var(--text-light);
  1999. margin-left: auto;
  2000. margin-right: auto;
  2001. padding: 0;
  2002. border-radius: var(--radius);
  2003. font-family: var(--sans-serif);
  2004. padding-bottom: var(--space-m);
  2005. }
  2006. #tinymce .info > * + * {
  2007. margin-top: var(--space-m);
  2008. }
  2009. #tinymce .info + * {
  2010. margin-top: var(--space-xl);
  2011. }
  2012. #tinymce .info + #tinymce .info {
  2013. margin-top: var(--space-s);
  2014. }
  2015. #tinymce .info h4 {
  2016. font-size: 0.9em;
  2017. font-weight: 400;
  2018. line-height: 1.2;
  2019. font-family: var(--sans-serif);
  2020. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  2021. padding: var(--space-m) var(--space-l);
  2022. position: relative;
  2023. display: flex;
  2024. align-items: center;
  2025. justify-content: space-between;
  2026. color: var(--text-light);
  2027. }
  2028. #tinymce .info h4::after {
  2029. font-family: "Font Awesome 6";
  2030. content: "\f05a";
  2031. font-weight: 900;
  2032. margin-right: var(--space-s);
  2033. }
  2034. #tinymce .info p {
  2035. font-size: 0.8em;
  2036. margin: 0;
  2037. padding: 0 var(--space-l);
  2038. }
  2039. #tinymce .info p:first-of-type {
  2040. padding-top: var(--space-m);
  2041. border-top: 1px solid rgba(255, 255, 255, 0.1);
  2042. }
  2043. #tinymce .traits {
  2044. display: flex;
  2045. flex-wrap: wrap;
  2046. padding: 0;
  2047. }
  2048. #tinymce .traits p {
  2049. display: inline-flex;
  2050. padding: 0.16rem 0.25rem;
  2051. margin: 0;
  2052. background-color: var(--primary);
  2053. border: 2px solid var(--color-border-trait);
  2054. color: var(--text-light);
  2055. font: 500 var(--font-size-10) var(--sans-serif);
  2056. text-transform: uppercase;
  2057. }
  2058. #tinymce .statblock {
  2059. font-family: var(--sans-serif-condensed);
  2060. color: var(--text-dark);
  2061. line-height: 1.2;
  2062. margin-bottom: var(--space-m);
  2063. }
  2064. #tinymce .statblock > * + * {
  2065. margin-top: var(--space-s);
  2066. margin-bottom: 0;
  2067. }
  2068. #tinymce .statblock p {
  2069. --indent: var(--space-l);
  2070. margin-left: var(--indent);
  2071. position: relative;
  2072. }
  2073. #tinymce .statblock p strong:first-of-type {
  2074. margin-left: calc(var(--indent) * -1);
  2075. }
  2076. #tinymce .statblock p .trait:first-of-type {
  2077. margin-left: calc(var(--indent) * -1 - 2px);
  2078. }
  2079. #tinymce .statblock span.pf2-icon {
  2080. line-height: 1;
  2081. }
  2082. #tinymce .statblock h1,
  2083. #tinymce .statblock h2,
  2084. #tinymce .statblock h3,
  2085. #tinymce .statblock h4 {
  2086. display: flex;
  2087. align-items: baseline;
  2088. justify-content: space-between;
  2089. border-bottom: 1px solid var(--color-border-dark);
  2090. text-transform: uppercase;
  2091. letter-spacing: -0.05em;
  2092. font-family: var(--sans-serif-condensed);
  2093. font-weight: 700;
  2094. }
  2095. #tinymce .statblock hr {
  2096. border: none;
  2097. border-bottom: 1px solid var(--color-border-dark);
  2098. }
  2099. #tinymce .message {
  2100. font-family: var(--journal-cursive);
  2101. font-size: 2em;
  2102. line-height: 1.2;
  2103. }
  2104. /* ----------------------------------------- */
  2105. /* Upstream Overrides */
  2106. /* ----------------------------------------- */
  2107. button:disabled {
  2108. cursor: default;
  2109. }
  2110. .crb-style.sheet .window-content {
  2111. background: url("../assets/sheet/background.webp") no-repeat;
  2112. background-size: cover;
  2113. }
  2114. .actors-sidebar .directory-item.actor h4 {
  2115. line-height: normal;
  2116. display: flex;
  2117. flex-direction: column;
  2118. justify-content: center;
  2119. }
  2120. .actors-sidebar .directory-item.actor .actor-level {
  2121. font-size: x-small;
  2122. color: var(--color-text-light-primary);
  2123. }
  2124. .actors-sidebar ol.party-list {
  2125. list-style-type: none;
  2126. margin: 0 0 0.25rem 0;
  2127. padding: 0;
  2128. position: relative;
  2129. }
  2130. .actors-sidebar li.folder-like {
  2131. border-top: none;
  2132. border-bottom: none;
  2133. }
  2134. .actors-sidebar li.folder-like > header {
  2135. border-bottom: 1px solid var(--color-border-dark);
  2136. border-top: 1px solid var(--color-border-dark);
  2137. display: flex;
  2138. line-height: 1.5rem;
  2139. padding: 6px;
  2140. }
  2141. .actors-sidebar li.folder-like > header .icon {
  2142. cursor: pointer;
  2143. font-size: var(--font-size-16);
  2144. }
  2145. .actors-sidebar li.folder-like > header .left-control > i {
  2146. margin: 0 0.5em 0 0.25em;
  2147. text-align: center;
  2148. }
  2149. .actors-sidebar li.folder-like > header h3 {
  2150. display: block;
  2151. flex: 1;
  2152. font-size: var(--font-size-16);
  2153. margin: 0;
  2154. padding-left: 1px;
  2155. }
  2156. .actors-sidebar li.folder-like > header a.create-button {
  2157. flex: 0 0 20px;
  2158. margin-left: 3px;
  2159. position: relative;
  2160. text-align: center;
  2161. }
  2162. .actors-sidebar li.folder-like > header a.create-button:hover i + i {
  2163. color: var(--color-text-hyperlink);
  2164. }
  2165. .actors-sidebar li.folder-like > header a.create-button i + i {
  2166. position: absolute;
  2167. top: -2px;
  2168. right: -2px;
  2169. font-size: 0.5rem;
  2170. background: black;
  2171. color: var(--color-text-light-highlight);
  2172. padding: 1px;
  2173. border-radius: 4px;
  2174. }
  2175. .actors-sidebar li.folder-like.collapsed i.folder {
  2176. margin-right: 2px;
  2177. }
  2178. .actors-sidebar li.folder-like.collapsed .fa-folder-open::before {
  2179. content: "\f07b";
  2180. }
  2181. .actors-sidebar li.folder-like.collapsed .subdirectory {
  2182. display: none;
  2183. }
  2184. .actors-sidebar li.folder-like.droptarget > header h3 {
  2185. text-shadow: 1px 1px 3px var(--color-shadow-dark);
  2186. font-size: 1.2em;
  2187. }
  2188. .actors-sidebar li.folder-like.droptarget > header h3 i {
  2189. text-shadow: 0 0 4px var(--color-shadow-primary);
  2190. transform: scale(1.2);
  2191. }
  2192. .actors-sidebar li.folder-like.other-parties > header {
  2193. background: var(--primary-dark);
  2194. }
  2195. .actors-sidebar li.folder-like.other-parties > header h3 i {
  2196. margin-right: 6px;
  2197. }
  2198. .actors-sidebar li.folder-like.other-parties.collapsed > header h3 i {
  2199. margin-right: 8px;
  2200. }
  2201. .actors-sidebar .subdirectory .folder-like {
  2202. border-left: 1px solid var(--color-border-dark-1);
  2203. }
  2204. .actors-sidebar .subdirectory .folder-like > header {
  2205. background: var(--primary-darker);
  2206. }
  2207. .actors-sidebar .party:not(.activated) .party-header {
  2208. background: var(--primary-darker);
  2209. padding: 2px 6px;
  2210. }
  2211. .actors-sidebar .party:not(.activated) .party-header > *:not(nav) {
  2212. opacity: 0.85;
  2213. }
  2214. .actors-sidebar .party .activate-party:hover i {
  2215. font-weight: 900;
  2216. }
  2217. .actors-sidebar .party.activated .party-header {
  2218. background: var(--primary);
  2219. }
  2220. .actors-sidebar .party .blank {
  2221. line-height: 2.375em;
  2222. padding: 0 0.5rem;
  2223. }
  2224. .directory-item.item img.thumbnail {
  2225. object-fit: contain;
  2226. }
  2227. .directory-item.item h4 {
  2228. line-height: normal;
  2229. display: flex;
  2230. flex-direction: column;
  2231. justify-content: center;
  2232. }
  2233. .directory-item.item .item-level {
  2234. font-size: x-small;
  2235. color: var(--color-text-light-primary);
  2236. }
  2237. .chat-inspect-roll .content {
  2238. display: flex;
  2239. flex-direction: column;
  2240. gap: 1em;
  2241. width: 100%;
  2242. height: 100%;
  2243. flex: 1 1 auto;
  2244. }
  2245. .chat-inspect-roll .summary {
  2246. flex: 0 1 auto;
  2247. }
  2248. .chat-inspect-roll .summary .type {
  2249. display: flex;
  2250. align-items: baseline;
  2251. gap: 2px;
  2252. }
  2253. .chat-inspect-roll .summary .tags.domains {
  2254. justify-items: end;
  2255. margin-top: 4px;
  2256. }
  2257. .chat-inspect-roll .summary .tags.domains .tag {
  2258. font-size: var(--font-size-12);
  2259. font-weight: normal;
  2260. text-transform: none;
  2261. user-select: all;
  2262. }
  2263. .chat-inspect-roll .body {
  2264. display: flex;
  2265. flex-direction: row;
  2266. gap: 1em;
  2267. width: 100%;
  2268. flex: 1;
  2269. }
  2270. .chat-inspect-roll .roll-options,
  2271. .chat-inspect-roll .modifiers {
  2272. display: flex;
  2273. flex: 1;
  2274. flex-direction: column;
  2275. height: 100%;
  2276. overflow: hidden;
  2277. }
  2278. .chat-inspect-roll .roll-options .filter {
  2279. margin-bottom: 2px;
  2280. }
  2281. .chat-inspect-roll .roll-options .roll-option-lists {
  2282. overflow: hidden scroll;
  2283. flex: 1 0 0;
  2284. overflow: auto;
  2285. padding-right: 1px;
  2286. }
  2287. .chat-inspect-roll .roll-options .roll-option-lists ul {
  2288. margin: 0;
  2289. padding: 0;
  2290. list-style-type: none;
  2291. border-radius: 3px;
  2292. white-space: nowrap;
  2293. border: 1px solid var(--color-border-dark-tertiary);
  2294. overflow-x: auto;
  2295. }
  2296. .chat-inspect-roll .roll-options .roll-option-lists li {
  2297. user-select: text;
  2298. line-height: 1.5em;
  2299. padding-left: 5px;
  2300. }
  2301. .chat-inspect-roll .roll-options .roll-option-lists li:nth-child(even) {
  2302. background-color: rgba(0, 0, 0, 0.0666666667);
  2303. }
  2304. .chat-inspect-roll .modifier-list {
  2305. overflow: hidden scroll;
  2306. flex: 1 0 0;
  2307. display: flex;
  2308. flex-direction: column;
  2309. gap: 4px;
  2310. }
  2311. .chat-inspect-roll .modifier-list .modifier {
  2312. border: 1px solid black;
  2313. border-radius: 3px;
  2314. padding: 4px;
  2315. }
  2316. .chat-inspect-roll .modifier-list .modifier.disabled {
  2317. border-style: dashed;
  2318. opacity: 0.6;
  2319. }
  2320. .chat-inspect-roll .modifier-list .modifier h4 {
  2321. font-size: 1.1em;
  2322. }
  2323. .chat-inspect-roll .modifier-list .modifier > div {
  2324. display: flex;
  2325. justify-content: space-between;
  2326. align-items: baseline;
  2327. }
  2328. .chat-message.emote > .message-content {
  2329. font-style: italic;
  2330. }
  2331. .chat-message.emote > .message-content p.action-content {
  2332. display: flex;
  2333. align-items: center;
  2334. font-weight: normal;
  2335. }
  2336. .chat-message.emote > .message-content p.action-content img {
  2337. height: 2.33em;
  2338. width: 2.33em;
  2339. float: left;
  2340. margin-right: 0.5em;
  2341. }
  2342. .chat-message.emote > .message-content hr.action-divider {
  2343. margin: 0;
  2344. }
  2345. .chat-message > .message-header .flavor-text h4.action {
  2346. line-height: 1.5em;
  2347. margin: 0;
  2348. }
  2349. .chat-message > .message-header .flavor-text h4.action > strong {
  2350. font-weight: 600;
  2351. }
  2352. .chat-message > .message-content > .description {
  2353. margin-bottom: 0rem;
  2354. position: relative;
  2355. }
  2356. .chat-message > .message-content > .description a.preview {
  2357. height: 4.5ch;
  2358. display: block;
  2359. -webkit-mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0));
  2360. mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0));
  2361. overflow: hidden;
  2362. position: relative;
  2363. z-index: 2;
  2364. }
  2365. .chat-message > .message-content > .description a.preview:hover {
  2366. text-shadow: none;
  2367. }
  2368. .chat-message > .message-content > .description a.preview:hover + .shadow {
  2369. box-shadow: 0 1px 6px var(--color-shadow-primary);
  2370. clip-path: polygon(0 0, 100% 0, 100% 200%, 0 200%);
  2371. width: 100%;
  2372. }
  2373. .chat-message > .message-content > .description .shadow {
  2374. border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  2375. height: 6px;
  2376. position: relative;
  2377. top: -6px;
  2378. z-index: 1;
  2379. }
  2380. .chat-message > .message-content .message-buttons {
  2381. display: flex;
  2382. margin: 0.35em 0 2px;
  2383. }
  2384. .chat-message > .message-content .message-buttons button {
  2385. align-items: center;
  2386. display: flex;
  2387. justify-content: center;
  2388. position: relative;
  2389. }
  2390. .chat-message > .message-content .message-buttons button .cue {
  2391. position: absolute;
  2392. right: 0.5rem;
  2393. }
  2394. .chat-message > .message-content .message-buttons button .cue i {
  2395. --fa-primary-color: var(--color-border-dark);
  2396. --fa-secondary-color: var(--primary);
  2397. --fa-secondary-opacity: 0.6;
  2398. }
  2399. .chat-message > .message-content .message-buttons:has(.effect-applied) {
  2400. align-items: center;
  2401. color: var(--color-text-dark-secondary);
  2402. font-style: italic;
  2403. height: 2.1rem;
  2404. justify-content: center;
  2405. padding-bottom: 0.1rem;
  2406. }
  2407. .chat-message > .message-header .flavor-text .target-dc-result {
  2408. line-height: 0.75rem;
  2409. margin-bottom: 4px;
  2410. }
  2411. .chat-message > .message-header .flavor-text .target-dc-result .target-dc,
  2412. .chat-message > .message-header .flavor-text .target-dc-result .result {
  2413. display: block;
  2414. margin: 1px 0;
  2415. width: fit-content;
  2416. }
  2417. .chat-message > .message-header .flavor-text .target-dc-result .unadjusted {
  2418. text-decoration: line-through;
  2419. }
  2420. .chat-message > .message-header .flavor-text .target-dc-result .adjusted {
  2421. text-decoration: underline dotted;
  2422. }
  2423. .chat-message > .message-header .flavor-text .target-dc-result .adjusted.increased {
  2424. color: rgb(0, 128, 0);
  2425. }
  2426. .chat-message > .message-header .flavor-text .target-dc-result .adjusted.decreased {
  2427. color: rgb(255, 0, 0);
  2428. }
  2429. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .criticalSuccess {
  2430. color: rgb(0, 128, 0);
  2431. }
  2432. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .success {
  2433. color: rgb(0, 0, 255);
  2434. }
  2435. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .failure {
  2436. color: rgb(255, 69, 0);
  2437. }
  2438. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .criticalFailure {
  2439. color: rgb(255, 0, 0);
  2440. }
  2441. .chat-message > .message-header .flavor-text .effect {
  2442. display: flex;
  2443. align-items: center;
  2444. column-gap: 5px;
  2445. }
  2446. .chat-message > .message-header .flavor-text .effect img {
  2447. height: 32px;
  2448. width: 32px;
  2449. }
  2450. .chat-message .message-content .damage-roll:not(:first-child) {
  2451. margin-top: 1em;
  2452. }
  2453. .chat-message .message-content .damage-roll .dice-result .dice-formula {
  2454. align-items: center;
  2455. display: flex;
  2456. flex-wrap: wrap;
  2457. gap: 0.25em;
  2458. justify-content: center;
  2459. }
  2460. .chat-message .message-content .damage-roll .dice-result .dice-formula .instance {
  2461. padding: 0 0.25em;
  2462. }
  2463. .chat-message .message-content .damage-roll .dice-result .dice-total {
  2464. flex-direction: column;
  2465. font-weight: normal;
  2466. }
  2467. .chat-message .message-content .damage-roll .dice-result .dice-total .total {
  2468. font-weight: 700;
  2469. padding: 0 2ch;
  2470. }
  2471. .chat-message .message-content .damage-roll .dice-result .dice-total .total .increased-from {
  2472. color: var(--color-text-dark-2);
  2473. font-size: var(--font-size-16);
  2474. font-weight: normal;
  2475. vertical-align: 15%;
  2476. }
  2477. .chat-message .message-content .damage-roll .dice-result .dice-total .instances {
  2478. align-items: center;
  2479. display: flex;
  2480. flex-wrap: wrap;
  2481. font-size: var(--font-size-12);
  2482. justify-content: center;
  2483. line-height: var(--font-size-12);
  2484. margin-bottom: 0.2em;
  2485. vertical-align: top;
  2486. }
  2487. .chat-message .message-content .damage-roll .dice-result .dice-total .instances .instance {
  2488. padding: 0.15em 0.25em;
  2489. }
  2490. .chat-message .message-content .damage-roll .dice-result .dice-tooltip {
  2491. display: flex;
  2492. flex-direction: column;
  2493. gap: 0.25em;
  2494. margin-bottom: 0.25em;
  2495. }
  2496. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance {
  2497. border-radius: 2px;
  2498. border-style: solid;
  2499. border-width: 1px;
  2500. }
  2501. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance > header {
  2502. align-items: center;
  2503. display: flex;
  2504. justify-content: space-between;
  2505. margin-bottom: 0.1em;
  2506. }
  2507. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance .dice .part-formula,
  2508. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance .dice .part-total {
  2509. color: var(--color-text-dark-secondary);
  2510. }
  2511. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance > header,
  2512. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance .dice {
  2513. padding: 0.2em;
  2514. }
  2515. .chat-message .message-content .damage-roll .dice-result .instance {
  2516. white-space: nowrap;
  2517. }
  2518. .chat-message .message-content .damage-roll .dice-result .instance.tooltip-part > header {
  2519. background: var(--color-bg-bludgeoning);
  2520. }
  2521. .chat-message .message-content .damage-roll .dice-result .instance.tooltip-part > .dice {
  2522. text-shadow: none;
  2523. }
  2524. .chat-message .message-content .damage-roll .dice-result .instance .precision,
  2525. .chat-message .message-content .damage-roll .dice-result .instance .splash {
  2526. border-color: inherit;
  2527. border-width: 1px;
  2528. border-style: dotted;
  2529. padding: 1px 2px;
  2530. line-height: 0;
  2531. }
  2532. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type {
  2533. margin-bottom: 3px;
  2534. }
  2535. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type h3 {
  2536. text-transform: capitalize;
  2537. padding-left: 3px;
  2538. padding-right: 1px;
  2539. }
  2540. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type i.fa {
  2541. flex: none;
  2542. margin: 2px;
  2543. }
  2544. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type .dice {
  2545. margin-left: 2px;
  2546. margin-right: 2px;
  2547. }
  2548. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .dice .part-header .part-flavor {
  2549. text-transform: capitalize;
  2550. }
  2551. .chat-message .message-content .damage-application {
  2552. display: flex;
  2553. justify-content: center;
  2554. margin-top: 3px;
  2555. order: 3;
  2556. }
  2557. .chat-message .message-content .damage-application button {
  2558. align-items: center;
  2559. display: flex;
  2560. flex-direction: column;
  2561. font-size: var(--font-size-18);
  2562. height: 2em;
  2563. justify-content: space-around;
  2564. line-height: unset;
  2565. padding: 0;
  2566. }
  2567. .chat-message .message-content .damage-application button.half-damage {
  2568. position: relative;
  2569. }
  2570. .chat-message .message-content .damage-application button.half-damage .transparent-half {
  2571. background: rgb(248, 247, 233);
  2572. display: block;
  2573. height: 24px;
  2574. left: 49%;
  2575. opacity: 0.6;
  2576. position: absolute;
  2577. top: 0px;
  2578. width: 10px;
  2579. }
  2580. .chat-message .message-content .damage-application button > img {
  2581. border: none;
  2582. height: var(--font-size-18);
  2583. }
  2584. .chat-message .message-content .damage-application button.heal-damage .fa-stack {
  2585. font-size: 0.5em;
  2586. }
  2587. .chat-message .message-content .damage-application button.heal-damage .fa-stack i.fa-plus {
  2588. font-size: var(--font-size-10);
  2589. }
  2590. .chat-message .message-content .damage-application button .label {
  2591. font-size: var(--font-size-9);
  2592. font-weight: 500;
  2593. text-transform: uppercase;
  2594. }
  2595. .chat-message .message-content .damage-taken section.roll-note {
  2596. font-size: var(--font-size-12);
  2597. }
  2598. .chat-message .message-content .damage-taken .persistent {
  2599. font-style: normal;
  2600. margin-top: 1em;
  2601. }
  2602. .chat-message .message-content .damage-taken .persistent h4 {
  2603. border-bottom: 1px solid var(--color-underline-header);
  2604. max-width: fit-content;
  2605. }
  2606. .chat-message .message-content .damage-taken button.revert-damage {
  2607. align-items: center;
  2608. background: var(--bg-dark);
  2609. display: inline-flex;
  2610. justify-content: center;
  2611. width: 3ch;
  2612. margin-left: 2px;
  2613. }
  2614. .chat-message .message-content .damage-taken button.revert-damage > i {
  2615. margin: 0;
  2616. }
  2617. .chat-message .message-content .damage-taken .reverted {
  2618. text-decoration: line-through;
  2619. }
  2620. .chat-message .flavor-text .pf2e-reroll-indicator {
  2621. float: right;
  2622. }
  2623. .chat-message .message-content .pf2e-reroll-discard .dice-total,
  2624. .chat-message .message-content .pf2e-reroll-discard .dice-tooltip {
  2625. opacity: 0.3;
  2626. }
  2627. .chat-message .message-content .pf2e-reroll-second .dice-formula {
  2628. display: none;
  2629. }
  2630. .chat-message .message-header .flavor-text {
  2631. display: block;
  2632. }
  2633. .chat-message .message-header .flavor-text ul.notes {
  2634. display: block;
  2635. line-height: 1.5em;
  2636. list-style: none;
  2637. margin: 0;
  2638. padding: 0;
  2639. }
  2640. .chat-message .message-header .flavor-text ul.notes li {
  2641. display: block;
  2642. line-height: 1.5em;
  2643. }
  2644. .chat-message > .message-content ul.participant-conditions {
  2645. background: rgba(0, 0, 0, 0.1);
  2646. border-radius: 3px;
  2647. border: 1px solid var(--color-border-light-2);
  2648. box-shadow: 0 0 2px white inset;
  2649. display: flex;
  2650. flex-direction: column;
  2651. gap: 3px;
  2652. list-style: none;
  2653. padding: 0.5em;
  2654. }
  2655. .chat-message > .message-content ul.participant-conditions li {
  2656. align-items: center;
  2657. cursor: help;
  2658. display: flex;
  2659. gap: 0.5rem;
  2660. }
  2661. .chat-message > .message-content ul.participant-conditions li img {
  2662. width: 2rem;
  2663. }
  2664. section.compendium-sidebar .directory-item.compendium.locked > .compendium-banner {
  2665. opacity: 0.5;
  2666. }
  2667. section.compendium-sidebar .directory-item.compendium.locked:hover > .compendium-banner {
  2668. opacity: 1;
  2669. }
  2670. section.compendium-sidebar ol.directory-list ol.document-matches {
  2671. background: rgba(0, 0, 0, 0.25);
  2672. margin-top: 1px;
  2673. padding: 0;
  2674. }
  2675. section.compendium-sidebar ol.directory-list ol.document-matches li.match {
  2676. align-items: center;
  2677. column-gap: 2px;
  2678. cursor: pointer;
  2679. display: grid;
  2680. font-size: var(--font-size-12);
  2681. grid-template-areas: "thumbnail name" "thumbnail details";
  2682. grid-template-columns: 38px 1fr;
  2683. grid-template-rows: 1fr 1fr;
  2684. list-style: none;
  2685. padding: 2px 0 2px 4px;
  2686. }
  2687. section.compendium-sidebar ol.directory-list ol.document-matches li.match:hover {
  2688. background: rgba(255, 255, 255, 0.1);
  2689. }
  2690. section.compendium-sidebar ol.directory-list ol.document-matches li.match > * {
  2691. align-items: inherit;
  2692. display: flex;
  2693. height: 100%;
  2694. }
  2695. section.compendium-sidebar ol.directory-list ol.document-matches li.match .thumbnail {
  2696. grid-area: thumbnail;
  2697. justify-content: start;
  2698. }
  2699. section.compendium-sidebar ol.directory-list ol.document-matches li.match .thumbnail img {
  2700. border: none;
  2701. height: 36px;
  2702. object-fit: contain;
  2703. object-position: 50% 0;
  2704. padding: 2px 0;
  2705. width: 36px;
  2706. }
  2707. section.compendium-sidebar ol.directory-list ol.document-matches li.match .name {
  2708. grid-area: name;
  2709. }
  2710. section.compendium-sidebar ol.directory-list ol.document-matches li.match .details {
  2711. color: var(--color-text-light-primary);
  2712. grid-area: details;
  2713. }
  2714. #pack-search-drag-preview {
  2715. background: url(../../../ui/parchment.jpg) repeat;
  2716. border-bottom: 1px solid var(--color-border-light-1);
  2717. border-top: 1px solid transparent;
  2718. box-shadow: none;
  2719. display: flex;
  2720. height: 50px;
  2721. line-height: 48px;
  2722. position: absolute;
  2723. text-shadow: 0 0 0.5rem var(--color-shadow-primary);
  2724. top: -1000px;
  2725. width: 328px;
  2726. }
  2727. #pack-search-drag-preview img {
  2728. border: none;
  2729. height: 48px;
  2730. }
  2731. #pack-search-drag-preview h4 {
  2732. color: var(--color-text-dark-primary);
  2733. font-size: var(--font-size-14);
  2734. }
  2735. #combat nav.encounters,
  2736. #combat-popout nav.encounters {
  2737. line-height: 1.5rem;
  2738. padding-top: 0.25rem;
  2739. }
  2740. #combat .threat-award,
  2741. #combat-popout .threat-award {
  2742. color: var(--text-light);
  2743. display: flex;
  2744. font-size: var(--font-size-14);
  2745. gap: 1rem;
  2746. justify-content: center;
  2747. line-height: 1.5rem;
  2748. text-shadow: 1px 1px 4px var(--color-shadow-dark);
  2749. white-space: nowrap;
  2750. }
  2751. #combat .threat-award > *,
  2752. #combat-popout .threat-award > * {
  2753. width: 6rem;
  2754. }
  2755. #combat .threat-award .threat .value.trivial,
  2756. #combat-popout .threat-award .threat .value.trivial {
  2757. color: aqua;
  2758. }
  2759. #combat .threat-award .threat .value.low,
  2760. #combat-popout .threat-award .threat .value.low {
  2761. color: lime;
  2762. }
  2763. #combat .threat-award .threat .value.moderate,
  2764. #combat-popout .threat-award .threat .value.moderate {
  2765. color: yellow;
  2766. }
  2767. #combat .threat-award .threat .value.severe,
  2768. #combat-popout .threat-award .threat .value.severe {
  2769. color: orange;
  2770. }
  2771. #combat .threat-award .threat .value.extreme,
  2772. #combat-popout .threat-award .threat .value.extreme {
  2773. color: red;
  2774. }
  2775. #combat .encounter-controls,
  2776. #combat-popout .encounter-controls {
  2777. padding: 0.25rem 0 0.5rem;
  2778. }
  2779. #combat li.combatant,
  2780. #combat-popout li.combatant {
  2781. cursor: default;
  2782. padding: 3px 0 3px 3px;
  2783. }
  2784. #combat li.combatant.gm-draggable,
  2785. #combat-popout li.combatant.gm-draggable {
  2786. cursor: grab;
  2787. }
  2788. #combat li.combatant.drag-preview,
  2789. #combat-popout li.combatant.drag-preview {
  2790. background: rgba(0, 0, 0, 0.75);
  2791. box-shadow: 0 0 6px inset var(--color-shadow-highlight);
  2792. }
  2793. #combat li.combatant.drag-gap,
  2794. #combat-popout li.combatant.drag-gap {
  2795. visibility: hidden;
  2796. }
  2797. #combat li.combatant .hidden-name .token-name h4,
  2798. #combat-popout li.combatant .hidden-name .token-name h4 {
  2799. color: var(--color-text-light-7);
  2800. }
  2801. #combat li.combatant .token-name h4,
  2802. #combat-popout li.combatant .token-name h4 {
  2803. flex-direction: row;
  2804. }
  2805. #combat li.combatant .token-name h4 .users-targeting,
  2806. #combat-popout li.combatant .token-name h4 .users-targeting {
  2807. display: inline-block;
  2808. font-size: x-small;
  2809. line-height: inherit;
  2810. padding: 0 0.3em;
  2811. text-shadow: none;
  2812. vertical-align: bottom;
  2813. }
  2814. #combat a.combat-control.center,
  2815. #combat-popout a.combat-control.center {
  2816. white-space: nowrap;
  2817. }
  2818. .sidebar-tab ol.subdirectory {
  2819. border-left-width: 6px;
  2820. }
  2821. .hover {
  2822. cursor: pointer;
  2823. }
  2824. .hover-content {
  2825. display: none;
  2826. }
  2827. .crb-hover .tooltipster-box {
  2828. border-style: solid;
  2829. border-image-outset: 0;
  2830. border-width: 9px;
  2831. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  2832. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  2833. background-color: rgba(0, 0, 0, 0.9);
  2834. overflow: visible;
  2835. }
  2836. .crb-hover .tooltipster-box .tooltipster-content {
  2837. margin: 0;
  2838. padding: 0;
  2839. }
  2840. .crb-hover .tooltipster-box .tooltipster-content .item-summary {
  2841. --space-s: 0.25em;
  2842. --space-m: 0.5em;
  2843. --space-l: 1em;
  2844. --space-xl: 1.5em;
  2845. --space-2xl: 2em;
  2846. --radius: 3px;
  2847. }
  2848. .crb-hover .tooltipster-box .tooltipster-content .item-summary p {
  2849. min-height: unset;
  2850. }
  2851. .crb-hover .tooltipster-box .tooltipster-content .item-summary :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  2852. margin-top: 1em;
  2853. }
  2854. .crb-hover .tooltipster-box .tooltipster-content .item-summary .inline-header {
  2855. display: flex;
  2856. align-items: center;
  2857. gap: var(--space-l);
  2858. background-color: var(--alt);
  2859. font-family: var(--sans-serif);
  2860. color: var(--text-light);
  2861. padding: 0;
  2862. font-size: 0.8em;
  2863. font-weight: 400;
  2864. border: none;
  2865. }
  2866. .crb-hover .tooltipster-box .tooltipster-content .item-summary .inline-header strong {
  2867. display: inline-flex;
  2868. padding: 0 var(--space-m);
  2869. background-color: var(--primary);
  2870. min-width: 15ch;
  2871. border-right: 1px solid rgba(0, 0, 0, 0.4);
  2872. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  2873. font-weight: 400;
  2874. }
  2875. .crb-hover .tooltipster-box .tooltipster-content .item-summary .inline-header + p {
  2876. margin-top: var(--space-s);
  2877. }
  2878. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info {
  2879. background-color: var(--secondary);
  2880. padding: var(--space-m);
  2881. color: var(--text-light);
  2882. margin-left: auto;
  2883. margin-right: auto;
  2884. padding: 0;
  2885. border-radius: var(--radius);
  2886. font-family: var(--sans-serif);
  2887. padding-bottom: var(--space-m);
  2888. }
  2889. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info > * + * {
  2890. margin-top: var(--space-m);
  2891. }
  2892. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info + * {
  2893. margin-top: var(--space-xl);
  2894. }
  2895. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info + .crb-hover .tooltipster-box .tooltipster-content .item-summary .info {
  2896. margin-top: var(--space-s);
  2897. }
  2898. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info h4 {
  2899. font-size: 0.9em;
  2900. font-weight: 400;
  2901. line-height: 1.2;
  2902. font-family: var(--sans-serif);
  2903. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  2904. padding: var(--space-m) var(--space-l);
  2905. position: relative;
  2906. display: flex;
  2907. align-items: center;
  2908. justify-content: space-between;
  2909. color: var(--text-light);
  2910. }
  2911. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info h4::after {
  2912. font-family: "Font Awesome 6";
  2913. content: "\f05a";
  2914. font-weight: 900;
  2915. margin-right: var(--space-s);
  2916. }
  2917. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info p {
  2918. font-size: 0.8em;
  2919. margin: 0;
  2920. padding: 0 var(--space-l);
  2921. }
  2922. .crb-hover .tooltipster-box .tooltipster-content .item-summary .info p:first-of-type {
  2923. padding-top: var(--space-m);
  2924. border-top: 1px solid rgba(255, 255, 255, 0.1);
  2925. }
  2926. .crb-hover .tooltipster-box .tooltipster-content .item-summary .traits {
  2927. display: flex;
  2928. flex-wrap: wrap;
  2929. padding: 0;
  2930. }
  2931. .crb-hover .tooltipster-box .tooltipster-content .item-summary .traits p {
  2932. display: inline-flex;
  2933. padding: 0.16rem 0.25rem;
  2934. margin: 0;
  2935. background-color: var(--primary);
  2936. border: 2px solid var(--color-border-trait);
  2937. color: var(--text-light);
  2938. font: 500 var(--font-size-10) var(--sans-serif);
  2939. text-transform: uppercase;
  2940. }
  2941. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock {
  2942. font-family: var(--sans-serif-condensed);
  2943. color: var(--text-dark);
  2944. line-height: 1.2;
  2945. margin-bottom: var(--space-m);
  2946. }
  2947. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock > * + * {
  2948. margin-top: var(--space-s);
  2949. margin-bottom: 0;
  2950. }
  2951. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock p {
  2952. --indent: var(--space-l);
  2953. margin-left: var(--indent);
  2954. position: relative;
  2955. }
  2956. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock p strong:first-of-type {
  2957. margin-left: calc(var(--indent) * -1);
  2958. }
  2959. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock p .trait:first-of-type {
  2960. margin-left: calc(var(--indent) * -1 - 2px);
  2961. }
  2962. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock span.pf2-icon {
  2963. line-height: 1;
  2964. }
  2965. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock h1,
  2966. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock h2,
  2967. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock h3,
  2968. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock h4 {
  2969. display: flex;
  2970. align-items: baseline;
  2971. justify-content: space-between;
  2972. border-bottom: 1px solid var(--color-border-dark);
  2973. text-transform: uppercase;
  2974. letter-spacing: -0.05em;
  2975. font-family: var(--sans-serif-condensed);
  2976. font-weight: 700;
  2977. }
  2978. .crb-hover .tooltipster-box .tooltipster-content .item-summary .statblock hr {
  2979. border: none;
  2980. border-bottom: 1px solid var(--color-border-dark);
  2981. }
  2982. .crb-hover .tooltipster-box .tooltipster-content .item-summary .message {
  2983. font-family: var(--journal-cursive);
  2984. font-size: 2em;
  2985. line-height: 1.2;
  2986. }
  2987. .crb-hover .tooltipster-box .tooltipster-content .item-summary a,
  2988. .crb-hover .tooltipster-box .tooltipster-content .item-summary span[data-pf2-effect-area] {
  2989. color: var(--color-text-dark-primary);
  2990. }
  2991. .crb-hover .tooltipster-box .tooltipster-content .hover-content {
  2992. display: flex;
  2993. min-width: 120px;
  2994. max-width: fit-content;
  2995. padding: 4px;
  2996. line-height: 1;
  2997. flex-direction: column;
  2998. }
  2999. .crb-hover .tooltipster-box .tooltipster-content .hover-content p {
  3000. font-size: var(--font-size-14);
  3001. font-family: var(--body-serif);
  3002. font-weight: 400;
  3003. }
  3004. .crb-hover .tooltipster-box .tooltipster-content .hover-content h1,
  3005. .crb-hover .tooltipster-box .tooltipster-content .hover-content h2,
  3006. .crb-hover .tooltipster-box .tooltipster-content .hover-content h3 {
  3007. font-size: var(--font-size-12);
  3008. font-weight: 500;
  3009. text-align: left;
  3010. }
  3011. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title {
  3012. align-items: baseline;
  3013. border-bottom: 1px solid var(--sidebar-title);
  3014. display: flex;
  3015. flex: 1 auto;
  3016. justify-content: space-between;
  3017. margin: 0.25em 0 0.5em;
  3018. }
  3019. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title h2,
  3020. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title a {
  3021. font-family: var(--sans-serif);
  3022. font-size: var(--font-size-10);
  3023. text-transform: uppercase;
  3024. letter-spacing: 0.05em;
  3025. text-rendering: optimizeLegibility;
  3026. border: none;
  3027. color: var(--sidebar-title);
  3028. line-height: 1.5;
  3029. margin: 0;
  3030. }
  3031. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title h2 + h2,
  3032. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title a + h2 {
  3033. font-size: var(--font-size-11);
  3034. }
  3035. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title a {
  3036. color: var(--text-light);
  3037. text-decoration: none;
  3038. }
  3039. .crb-hover .tooltipster-box .tooltipster-content .hover-content.select-shield {
  3040. width: 160px;
  3041. }
  3042. .crb-hover .tooltipster-box .tooltipster-content .hover-content.select-shield ul li.item .data {
  3043. position: relative;
  3044. top: -2px;
  3045. }
  3046. .crb-hover .tooltipster-box .tooltipster-content .hover-content.select-shield ul li.item .tag-legacy {
  3047. width: auto;
  3048. }
  3049. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option {
  3050. color: rgba(255, 255, 255, 0.5);
  3051. }
  3052. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option i {
  3053. margin: 1px 4px 1px 0;
  3054. }
  3055. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option.selected {
  3056. color: var(--text-light);
  3057. }
  3058. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option.selected:hover {
  3059. cursor: default;
  3060. text-shadow: none;
  3061. }
  3062. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul {
  3063. list-style: none;
  3064. margin: 0;
  3065. padding: 0;
  3066. flex: 1 auto;
  3067. }
  3068. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input {
  3069. color: var(--text-light);
  3070. border: none;
  3071. border-radius: 0;
  3072. background: transparent;
  3073. font-family: var(--body-serif);
  3074. width: 100%;
  3075. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  3076. }
  3077. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input:focus {
  3078. box-shadow: none;
  3079. border-bottom: 1px solid white;
  3080. }
  3081. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input:focus::placeholder {
  3082. color: transparent;
  3083. }
  3084. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input::placeholder {
  3085. color: rgba(255, 255, 255, 0.8);
  3086. }
  3087. .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 {
  3088. -webkit-appearance: none;
  3089. appearance: none;
  3090. margin: 0;
  3091. }
  3092. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input[type=number] {
  3093. appearance: textfield;
  3094. -moz-appearance: textfield;
  3095. }
  3096. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul select {
  3097. border-radius: 2px;
  3098. height: 18px;
  3099. border: 1px solid white;
  3100. background: transparent;
  3101. cursor: pointer;
  3102. }
  3103. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul select option {
  3104. font-size: 0.8rem;
  3105. min-height: 1rem;
  3106. color: var(--text-dark);
  3107. text-transform: capitalize;
  3108. }
  3109. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul label {
  3110. display: flex;
  3111. align-items: center;
  3112. text-align: left;
  3113. font-family: var(--serif);
  3114. font-weight: 500;
  3115. }
  3116. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .label,
  3117. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .data {
  3118. font-size: var(--font-size-12);
  3119. font-family: var(--serif);
  3120. font-weight: 400;
  3121. color: var(--text-light);
  3122. margin: 0;
  3123. padding: 0;
  3124. }
  3125. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item {
  3126. display: grid;
  3127. grid: "data label close" min-content "data type close" min-content/30px 1fr;
  3128. margin: 8px 0;
  3129. align-items: center;
  3130. column-gap: 8px;
  3131. justify-items: start;
  3132. }
  3133. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item:first-child {
  3134. border: none;
  3135. }
  3136. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.no-effect {
  3137. filter: opacity(0.5);
  3138. position: relative;
  3139. }
  3140. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .tag-legacy {
  3141. font-family: var(--sans-serif);
  3142. font-size: var(--font-size-10);
  3143. text-transform: uppercase;
  3144. letter-spacing: 0.05em;
  3145. text-rendering: optimizeLegibility;
  3146. display: flex;
  3147. justify-content: center;
  3148. align-items: center;
  3149. color: var(--tertiary);
  3150. grid-area: type;
  3151. letter-spacing: 0.5px;
  3152. white-space: nowrap;
  3153. width: min-content;
  3154. }
  3155. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .tag-legacy .remove-modifier {
  3156. white-space: nowrap;
  3157. }
  3158. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .label {
  3159. grid-area: label;
  3160. }
  3161. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .data {
  3162. grid-area: data;
  3163. text-align: right;
  3164. font-size: var(--font-size-21);
  3165. justify-self: right;
  3166. width: min-content;
  3167. padding-top: 2px;
  3168. }
  3169. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .label,
  3170. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .data,
  3171. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .data::placeholder {
  3172. color: rgba(255, 255, 255, 0.5);
  3173. }
  3174. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .label {
  3175. text-decoration: line-through;
  3176. }
  3177. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .remove-modifier {
  3178. grid-area: close;
  3179. font-size: 0.8rem;
  3180. cursor: pointer;
  3181. }
  3182. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier {
  3183. border-top: 1px solid var(--sidebar-title);
  3184. padding-top: 5px;
  3185. grid: "value name name" 1fr "type type btn" 1fr/42px 1fr 1fr;
  3186. font-size: 0.8rem;
  3187. gap: 0.25rem 0.5rem;
  3188. align-items: baseline;
  3189. }
  3190. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value {
  3191. grid-area: value;
  3192. font-size: 1rem;
  3193. text-align: right;
  3194. display: grid;
  3195. grid: "input plus" 1fr "input minus" 1fr/1fr 10px;
  3196. column-gap: 4px;
  3197. align-items: center;
  3198. }
  3199. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value input {
  3200. grid-area: input;
  3201. }
  3202. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value .fa-solid {
  3203. margin-top: 2px;
  3204. font-size: var(--font-size-9);
  3205. cursor: pointer;
  3206. }
  3207. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value .fa-solid.fa-plus-circle {
  3208. grid-area: plus;
  3209. }
  3210. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-value .fa-solid.fa-minus-circle {
  3211. grid-area: minus;
  3212. }
  3213. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-name {
  3214. grid-area: name;
  3215. }
  3216. .crb-hover .tooltipster-box .tooltipster-content .hover-content.modifiers-tooltip .add-modifier .add-modifier-submit {
  3217. font-family: var(--sans-serif);
  3218. font-size: var(--font-size-10);
  3219. text-transform: uppercase;
  3220. letter-spacing: 0.05em;
  3221. text-rendering: optimizeLegibility;
  3222. grid-area: btn;
  3223. white-space: nowrap;
  3224. line-height: 1.5;
  3225. background-color: black;
  3226. color: var(--tertiary);
  3227. }
  3228. .crb-hover .tooltipster-box .tooltipster-content .hover-content.manage-tabs ul li {
  3229. display: flex;
  3230. }
  3231. .crb-hover .tooltipster-box .tooltipster-content .hover-content.manage-tabs ul li label {
  3232. color: var(--tertiary);
  3233. flex-basis: 100%;
  3234. }
  3235. .crb-hover .tooltipster-box .tooltipster-content .hover-content.manage-tabs ul li input {
  3236. display: flex;
  3237. min-width: 2em;
  3238. }
  3239. .crb-hover .tooltipster-box .tooltipster-content .hover-content.carry-hover-content {
  3240. white-space: nowrap;
  3241. }
  3242. .crb-hover .tooltipster-box .tooltipster-content .hover-content.carry-hover-content a.item-control i.fas {
  3243. min-width: 1.25em;
  3244. }
  3245. .icon.anger::before {
  3246. content: "💢︎";
  3247. }
  3248. .icon.bang::before {
  3249. content: "💥︎";
  3250. }
  3251. .icon.collision::before {
  3252. content: "💥︎";
  3253. }
  3254. .icon.crystal-ball::before {
  3255. content: "🔮︎";
  3256. }
  3257. .icon.dizzy::before {
  3258. content: "💫︎";
  3259. }
  3260. .icon.diamond-with-dot::before {
  3261. content: "💠︎";
  3262. }
  3263. .icon.gemstone::before {
  3264. content: "💎︎";
  3265. }
  3266. .icon.gem-stone::before {
  3267. content: "💎︎";
  3268. }
  3269. .icon.glowing-star::before {
  3270. content: "🌟︎";
  3271. }
  3272. .icon.prayer-beads::before {
  3273. content: "📿︎";
  3274. }
  3275. .icon.ring::before {
  3276. content: "💍︎";
  3277. }
  3278. .icon.sparkle::before {
  3279. content: "❇︎";
  3280. }
  3281. .icon.sparkler::before {
  3282. content: "🎇︎";
  3283. }
  3284. .icon.sparkles::before {
  3285. content: "✨︎";
  3286. }
  3287. .roll-modifiers-dialog {
  3288. background: none;
  3289. box-shadow: none;
  3290. }
  3291. .roll-modifiers-dialog .window-header {
  3292. border: none;
  3293. 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);
  3294. background: linear-gradient(90deg, var(--secondary) 0%, #202b93 50%, var(--secondary) 100%);
  3295. border-radius: 0;
  3296. margin-bottom: 2px;
  3297. font-size: var(--font-size-13);
  3298. }
  3299. .roll-modifiers-dialog .window-content {
  3300. border-style: solid;
  3301. border-image-outset: 0;
  3302. border-width: 9px;
  3303. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  3304. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  3305. padding-top: 0;
  3306. }
  3307. .roll-modifiers-dialog button {
  3308. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  3309. background-color: var(--alt);
  3310. border-radius: 2px;
  3311. color: var(--text-light);
  3312. cursor: pointer;
  3313. font-family: var(--sans-serif);
  3314. }
  3315. .roll-modifiers-dialog button:hover {
  3316. text-shadow: 0 0 2px var(--tertiary);
  3317. }
  3318. .roll-modifiers-dialog .toggle {
  3319. background: var(--secondary);
  3320. border-radius: 50px;
  3321. box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2);
  3322. cursor: pointer;
  3323. display: inline-block;
  3324. height: 19px;
  3325. margin: 4px auto;
  3326. position: relative;
  3327. width: 46px;
  3328. }
  3329. .roll-modifiers-dialog .toggle::before {
  3330. color: var(--text-light);
  3331. content: "ON";
  3332. left: 6px;
  3333. position: absolute;
  3334. z-index: 0;
  3335. }
  3336. .roll-modifiers-dialog .toggle::after {
  3337. color: var(--text-dark);
  3338. content: "OFF";
  3339. position: absolute;
  3340. right: 4px;
  3341. text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15);
  3342. z-index: 0;
  3343. }
  3344. .roll-modifiers-dialog .toggle::after, .roll-modifiers-dialog .toggle::before {
  3345. font-family: var(--sans-serif);
  3346. font-size: var(--font-size-10);
  3347. text-transform: uppercase;
  3348. letter-spacing: 0.05em;
  3349. text-rendering: optimizeLegibility;
  3350. top: 4px;
  3351. }
  3352. .roll-modifiers-dialog .toggle .widget {
  3353. background: #fcfff4;
  3354. background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  3355. border-radius: 50px;
  3356. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0px 2px 5px 0px rgba(0, 0, 0, 0.3);
  3357. cursor: pointer;
  3358. display: block;
  3359. height: 16px;
  3360. position: absolute;
  3361. right: 1px;
  3362. top: 1px;
  3363. transition: all 0.4s ease;
  3364. width: 19px;
  3365. z-index: 1;
  3366. }
  3367. .roll-modifiers-dialog .toggle input[type=checkbox] {
  3368. visibility: hidden;
  3369. }
  3370. .roll-modifiers-dialog .toggle input[type=checkbox]:not(:checked) + .widget {
  3371. right: 23px;
  3372. }
  3373. .roll-modifiers-dialog .dialog-row {
  3374. align-items: center;
  3375. display: flex;
  3376. padding: 8px 0;
  3377. gap: 2px;
  3378. }
  3379. .roll-modifiers-dialog .dialog-row .mod {
  3380. flex: 1.5 0 0;
  3381. }
  3382. .roll-modifiers-dialog .dialog-row .type {
  3383. flex: 0 0 6.25rem;
  3384. text-transform: capitalize;
  3385. }
  3386. .roll-modifiers-dialog .dialog-row .value {
  3387. flex: 0 0 36px;
  3388. display: flex;
  3389. justify-content: center;
  3390. }
  3391. .roll-modifiers-dialog .dialog-row .exclude {
  3392. flex: 0 0 50px;
  3393. justify-self: right;
  3394. }
  3395. .roll-modifiers-dialog .dialog-row.header {
  3396. font-size: var(--font-size-13);
  3397. font-weight: 700;
  3398. padding-bottom: 0;
  3399. }
  3400. .roll-modifiers-dialog .dialog-row.header + hr {
  3401. margin-bottom: 0;
  3402. }
  3403. .roll-modifiers-dialog .dialog-row.disabled {
  3404. text-decoration: line-through;
  3405. }
  3406. .roll-modifiers-dialog .dialog-row.disabled > * {
  3407. filter: opacity(0.5);
  3408. }
  3409. .roll-modifiers-dialog .dialog-row.disabled > * i {
  3410. color: var(--text-dark);
  3411. }
  3412. .roll-modifiers-dialog .dialog-row.disabled .toggle {
  3413. background: rgba(0, 0, 0, 0.4);
  3414. }
  3415. .roll-modifiers-dialog .dialog-row.disabled .toggle input[type=checkbox] + label {
  3416. right: 26px;
  3417. }
  3418. .roll-modifiers-dialog .dialog-row.disabled.hidden {
  3419. display: none;
  3420. }
  3421. .roll-modifiers-dialog .dialog-row .exclude.disabled {
  3422. filter: opacity(0.5);
  3423. }
  3424. .roll-modifiers-dialog .dialog-row .exclude.disabled .toggle,
  3425. .roll-modifiers-dialog .dialog-row .exclude.disabled .widget {
  3426. cursor: default;
  3427. }
  3428. .roll-modifiers-dialog .dialog-row .exclude.disabled i {
  3429. color: var(--text-dark);
  3430. }
  3431. .roll-modifiers-dialog .substitutions,
  3432. .roll-modifiers-dialog .modifier-container {
  3433. display: flex;
  3434. flex-direction: column;
  3435. }
  3436. .roll-modifiers-dialog .substitutions + hr,
  3437. .roll-modifiers-dialog .modifier-container + hr {
  3438. margin-top: 0;
  3439. }
  3440. .roll-modifiers-dialog .substitutions .dialog-row,
  3441. .roll-modifiers-dialog .modifier-container .dialog-row {
  3442. border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  3443. }
  3444. .roll-modifiers-dialog .substitutions .dialog-row:last-child,
  3445. .roll-modifiers-dialog .modifier-container .dialog-row:last-child {
  3446. border-bottom: none;
  3447. }
  3448. .roll-modifiers-dialog .substitutions .dialog-row .tag,
  3449. .roll-modifiers-dialog .modifier-container .dialog-row .tag {
  3450. background-color: var(--sub);
  3451. border-radius: 2px;
  3452. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25);
  3453. color: var(--text-light);
  3454. font-family: var(--sans-serif);
  3455. font-size: var(--font-size-10);
  3456. letter-spacing: 0.5px;
  3457. padding: 4px 8px;
  3458. text-transform: uppercase;
  3459. width: fit-content;
  3460. }
  3461. .roll-modifiers-dialog .total-mod {
  3462. font-weight: 700;
  3463. padding: 0;
  3464. }
  3465. .roll-modifiers-dialog .roll-mode-panel {
  3466. display: flex;
  3467. flex-wrap: nowrap;
  3468. align-items: stretch;
  3469. }
  3470. .roll-modifiers-dialog .roll-mode-panel .label {
  3471. flex: 1 40%;
  3472. }
  3473. .roll-modifiers-dialog .roll-mode-panel select {
  3474. flex: 2 60%;
  3475. height: auto;
  3476. width: 100%;
  3477. margin-right: 4px;
  3478. border-radius: 2px;
  3479. cursor: pointer;
  3480. }
  3481. .roll-modifiers-dialog .roll {
  3482. color: var(--text-light);
  3483. background-color: var(--secondary);
  3484. }
  3485. .roll-modifiers-dialog .roll .damage.color,
  3486. .roll-modifiers-dialog .roll i {
  3487. color: var(--text-light) !important;
  3488. }
  3489. .roll-modifiers-dialog .add-entry-row {
  3490. display: flex;
  3491. flex-wrap: nowrap;
  3492. align-items: stretch;
  3493. gap: 2px;
  3494. }
  3495. .roll-modifiers-dialog .add-entry-row select,
  3496. .roll-modifiers-dialog .add-entry-row input {
  3497. height: auto;
  3498. border-radius: 2px;
  3499. }
  3500. .roll-modifiers-dialog .add-entry-row button {
  3501. line-height: 1;
  3502. margin: 0;
  3503. padding: 4px 6px;
  3504. text-transform: uppercase;
  3505. flex: 0 0 min-content;
  3506. font-weight: 700;
  3507. font-size: 0.75rem;
  3508. }
  3509. .roll-modifiers-dialog .add-entry-row .add-modifier-name {
  3510. flex: 1;
  3511. }
  3512. .roll-modifiers-dialog .add-entry-row .add-modifier-type {
  3513. flex: 0 0 min-content;
  3514. }
  3515. .roll-modifiers-dialog .add-entry-row .add-modifier-value {
  3516. flex: 0 0 4ch;
  3517. }
  3518. .dice-checks .fate {
  3519. display: flex;
  3520. justify-content: space-evenly;
  3521. align-items: center;
  3522. }
  3523. .dice-checks .fate label {
  3524. cursor: pointer;
  3525. }
  3526. .dialog.trick-magic-item .dialog-content p {
  3527. font-weight: normal;
  3528. }
  3529. .dialog.trick-magic-item .dialog-buttons {
  3530. flex-direction: column;
  3531. }
  3532. .damage-dialog .dialog-row .value {
  3533. flex-basis: 4rem;
  3534. }
  3535. .damage-dialog .dialog-row .dice-type,
  3536. .damage-dialog .dialog-row .modifier-type {
  3537. background: none;
  3538. white-space: nowrap;
  3539. }
  3540. .damage-dialog .dialog-row .dice-type .icon-container,
  3541. .damage-dialog .dialog-row .modifier-type .icon-container {
  3542. white-space: nowrap;
  3543. }
  3544. .damage-dialog .dialog-row .dice-type .icon-container i,
  3545. .damage-dialog .dialog-row .modifier-type .icon-container i {
  3546. vertical-align: middle;
  3547. text-align: start;
  3548. font-size: 1rem;
  3549. }
  3550. .damage-dialog .dialog-row .no-mod {
  3551. filter: opacity(0.7);
  3552. }
  3553. .damage-dialog .dialog-row .damage {
  3554. padding: 2px 4px;
  3555. }
  3556. .damage-dialog .dice .dialog-row .value {
  3557. flex: 1 0 0;
  3558. gap: 2px;
  3559. justify-content: flex-end;
  3560. margin-right: 6px;
  3561. }
  3562. .damage-dialog .add-modifier-panel {
  3563. flex-wrap: wrap;
  3564. }
  3565. .damage-dialog .add-modifier-panel .add-modifier-name {
  3566. flex-basis: 100%;
  3567. }
  3568. .damage-dialog .add-modifier-panel .add-modifier-value {
  3569. flex: 1;
  3570. }
  3571. .damage-dialog .add-dice-panel .add-dice-count {
  3572. flex: 0 0 4ch;
  3573. text-align: end;
  3574. }
  3575. /* ----------------------------------------- */
  3576. /* Tag Selector */
  3577. /* ----------------------------------------- */
  3578. .app.tag-selector form {
  3579. height: 100%;
  3580. }
  3581. .app.tag-selector form ol.trait-list {
  3582. display: flex;
  3583. flex-direction: column;
  3584. list-style-type: none;
  3585. max-height: 87%;
  3586. overflow-y: scroll;
  3587. padding: 0;
  3588. }
  3589. .app.tag-selector form ol.trait-list.has-custom {
  3590. max-height: 78%;
  3591. }
  3592. .app.tag-selector form table th,
  3593. .app.tag-selector form table td {
  3594. text-align: left;
  3595. white-space: nowrap;
  3596. }
  3597. .app.tag-selector form table tbody td:first-child label {
  3598. vertical-align: super;
  3599. }
  3600. .app.tag-selector form .trait-header {
  3601. flex: 0 0 32px;
  3602. line-height: 32px;
  3603. text-align: center;
  3604. margin: 0;
  3605. }
  3606. .app.tag-selector form .trait-header .header-search {
  3607. flex: 1;
  3608. }
  3609. .app.tag-selector form .trait-header .header-search input {
  3610. background: rgba(255, 255, 245, 0.8);
  3611. width: calc(100% - 26px);
  3612. margin: 0 2px;
  3613. }
  3614. .app.tag-selector form .trait-footer {
  3615. flex: 0 0 32px;
  3616. line-height: 32px;
  3617. margin: 0;
  3618. margin-bottom: 5px;
  3619. border-top: 1px solid grey;
  3620. }
  3621. .app.tag-selector form .trait-selection-label {
  3622. display: flex;
  3623. align-items: center;
  3624. }
  3625. .app.tag-selector form .trait-selection-label .trait-label {
  3626. margin-left: 5px;
  3627. }
  3628. .app.tag-selector form input:not([type=checkbox]) {
  3629. flex: 1.8;
  3630. }
  3631. #token-hud .status-effects {
  3632. grid-template-columns: repeat(5, 1fr);
  3633. width: auto;
  3634. }
  3635. #token-hud .status-effects .effect-control {
  3636. border-radius: 1px;
  3637. color: var(--color-text-dark-1);
  3638. cursor: pointer;
  3639. height: 36px;
  3640. opacity: 0.75;
  3641. position: relative;
  3642. width: 36px;
  3643. }
  3644. #token-hud .status-effects .effect-control.active img {
  3645. border: 1px solid var(--color-border-highlight);
  3646. opacity: 1;
  3647. }
  3648. #token-hud .status-effects .effect-control img {
  3649. border: 1px solid rgba(0, 0, 0, 0);
  3650. height: 35px;
  3651. margin: 0;
  3652. width: 35px;
  3653. }
  3654. #token-hud .status-effects .effect-control:not(.active):hover img {
  3655. border: 1px solid rgba(255, 100, 0, 0.5);
  3656. }
  3657. #token-hud .status-effects .effect-control .badge {
  3658. background: rgba(255, 255, 255, 0.9);
  3659. border-radius: 50%;
  3660. border: 0.1em solid darkred;
  3661. font-size: var(--font-size-8);
  3662. height: 0.8rem;
  3663. line-height: var(--font-size-10);
  3664. pointer-events: none;
  3665. position: absolute;
  3666. right: -3px;
  3667. text-align: center;
  3668. top: -3px;
  3669. width: 0.8rem;
  3670. z-index: 1;
  3671. }
  3672. #token-hud .status-effects .effect-control.overridden > * {
  3673. filter: saturate(0);
  3674. }
  3675. #token-hud .status-effects .effect-control.valued .badge {
  3676. font-size: var(--font-size-12);
  3677. font-style: unset;
  3678. font-weight: 500;
  3679. line-height: var(--font-size-12);
  3680. }
  3681. #token-hud .status-effects .title-bar {
  3682. background: rgba(0, 0, 0, 0.6);
  3683. border-radius: inherit;
  3684. border: inherit;
  3685. box-shadow: inherit;
  3686. box-sizing: content-box;
  3687. font-size: var(--font-size-14);
  3688. font-weight: normal;
  3689. left: 0;
  3690. line-height: normal;
  3691. padding: 3px 0;
  3692. position: absolute;
  3693. text-align: center;
  3694. top: -30px;
  3695. visibility: hidden;
  3696. width: 100%;
  3697. z-index: 1;
  3698. }
  3699. #token-hud .status-effects .title-bar.active {
  3700. visibility: visible;
  3701. }
  3702. #token-hud .control-icon[data-action=clown-car][data-disabled=true] {
  3703. cursor: wait;
  3704. opacity: 0.5;
  3705. }
  3706. #token-hud .control-icon[data-action=clown-car] img {
  3707. height: 36px;
  3708. transform-style: preserve-3d;
  3709. transition: 0.5s;
  3710. width: 36px;
  3711. }
  3712. #token-hud .control-icon[data-action=clown-car] img.retrieve {
  3713. transform: scaleX(-1);
  3714. }
  3715. .default section.window-content {
  3716. padding: 0;
  3717. overflow: hidden;
  3718. }
  3719. /* Adjust height of the header */
  3720. .attribute-builder .window-content {
  3721. background: url("../assets/sheet/background.webp");
  3722. background-repeat: repeat-x, no-repeat;
  3723. background-size: cover;
  3724. background-attachment: local;
  3725. height: 100%;
  3726. padding: 10px 20px 10px 20px;
  3727. position: relative;
  3728. --color-boost: #316549;
  3729. --color-boost-dark: #1b3c2a;
  3730. --color-flaw: #5e0000;
  3731. }
  3732. .attribute-builder .window-content h3 {
  3733. font: 400 var(--font-size-24) var(--serif-condensed);
  3734. line-height: var(--font-size-24);
  3735. }
  3736. .attribute-builder .window-content h4 {
  3737. font: 400 var(--font-size-10) var(--sans-serif);
  3738. text-transform: uppercase;
  3739. color: #605856;
  3740. }
  3741. .attribute-builder .window-content button:focus:not(:focus-visible) {
  3742. box-shadow: none;
  3743. }
  3744. .attribute-builder .window-content .row {
  3745. display: flex;
  3746. align-items: center;
  3747. }
  3748. .attribute-builder .window-content .row .row-heading {
  3749. width: 220px;
  3750. }
  3751. .attribute-builder .window-content .row.not-eligible {
  3752. pointer-events: none;
  3753. filter: blur(1px);
  3754. opacity: 0.6;
  3755. }
  3756. .attribute-builder .window-content .row.not-eligible .remaining {
  3757. visibility: hidden;
  3758. }
  3759. .attribute-builder .window-content .row .attributes {
  3760. display: grid;
  3761. grid-template-columns: repeat(6, 84px);
  3762. grid-template-rows: auto;
  3763. flex: 0 0 auto;
  3764. }
  3765. .attribute-builder .window-content .row .full-row {
  3766. display: flex;
  3767. flex: 1;
  3768. justify-content: center;
  3769. }
  3770. .attribute-builder .window-content header.row {
  3771. align-items: normal;
  3772. padding-top: 10px;
  3773. height: 60px;
  3774. }
  3775. .attribute-builder .window-content header.row .row-column {
  3776. display: block;
  3777. }
  3778. .attribute-builder .window-content header.row .attributes {
  3779. align-items: normal;
  3780. }
  3781. .attribute-builder .window-content .background-stripes {
  3782. position: absolute;
  3783. left: 0;
  3784. top: 0;
  3785. bottom: 50px;
  3786. right: 0;
  3787. padding: 10px 20px 10px 20px;
  3788. pointer-events: none;
  3789. align-items: normal;
  3790. }
  3791. .attribute-builder .window-content .background-stripes .attributes div:nth-child(odd) {
  3792. background-color: rgba(68, 55, 48, 0.1);
  3793. }
  3794. .attribute-builder .window-content .voluntary-flaw-row {
  3795. margin: 0.5rem 0;
  3796. }
  3797. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons {
  3798. display: flex;
  3799. flex-direction: row;
  3800. }
  3801. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons button {
  3802. flex: 1 1 0;
  3803. }
  3804. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons button.first {
  3805. border-bottom-right-radius: 0;
  3806. border-right: none;
  3807. border-top-right-radius: 0;
  3808. width: 4em;
  3809. }
  3810. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons button.second {
  3811. border-bottom-left-radius: 0;
  3812. border-top-left-radius: 0;
  3813. max-width: 2em;
  3814. text-transform: none;
  3815. }
  3816. .attribute-builder .window-content .voluntary-flaw-row .flaw-buttons button.second.selected {
  3817. border-left-color: rgba(255, 255, 255, 0.5);
  3818. }
  3819. .attribute-builder .window-content .row-heading {
  3820. display: grid;
  3821. grid-template-columns: 42px 1fr auto;
  3822. grid-template-areas: "img description remaining";
  3823. align-items: center;
  3824. }
  3825. .attribute-builder .window-content .row-heading h3 {
  3826. grid-column: 1/4;
  3827. align-self: start;
  3828. font-size: var(--font-size-24);
  3829. }
  3830. .attribute-builder .window-content .row-heading .hint-container {
  3831. grid-column: 1/4;
  3832. }
  3833. .attribute-builder .window-content .row-heading img {
  3834. grid-area: img;
  3835. border: 0;
  3836. }
  3837. .attribute-builder .window-content .row-heading div.label {
  3838. grid-area: description;
  3839. display: flex;
  3840. flex-direction: column;
  3841. overflow: hidden;
  3842. white-space: nowrap;
  3843. text-overflow: ellipsis;
  3844. margin-right: 10px;
  3845. }
  3846. .attribute-builder .window-content .row-heading div.remaining {
  3847. grid-area: remaining;
  3848. display: flex;
  3849. margin-right: 10px;
  3850. width: 1.6rem;
  3851. height: 1.6rem;
  3852. border-radius: 50%;
  3853. background: rgba(68, 55, 48, 0.1);
  3854. align-self: center;
  3855. align-items: center;
  3856. justify-content: center;
  3857. text-align: center;
  3858. }
  3859. .attribute-builder .window-content .row-heading div.remaining.extra {
  3860. animation: glow 0.75s infinite alternate;
  3861. }
  3862. @keyframes glow {
  3863. from {
  3864. box-shadow: 0 0 1px 1px #ffb351;
  3865. }
  3866. to {
  3867. box-shadow: 0 0 3px 3px #ffb351;
  3868. }
  3869. }
  3870. .attribute-builder .window-content .row-column {
  3871. align-items: center;
  3872. display: flex;
  3873. flex-direction: column;
  3874. justify-content: center;
  3875. text-align: center;
  3876. }
  3877. .attribute-builder .window-content .row-column button {
  3878. align-items: center;
  3879. border: 1px solid var(--button-color);
  3880. color: var(--button-color);
  3881. display: flex;
  3882. font-size: var(--font-size-12);
  3883. height: 1.5em;
  3884. justify-content: center;
  3885. margin: 0;
  3886. outline: none;
  3887. padding: 0.1em 0 0;
  3888. position: relative;
  3889. text-transform: uppercase;
  3890. width: 6em;
  3891. }
  3892. .attribute-builder .window-content .row-column button > i.key-attribute {
  3893. font-size: smaller;
  3894. left: 2px;
  3895. margin-top: 1px;
  3896. position: absolute;
  3897. }
  3898. .attribute-builder .window-content .row-column button.boost, .attribute-builder .window-content .row-column button.apex {
  3899. margin-top: auto;
  3900. --button-color: var(--color-boost);
  3901. --button-locked-color: var(--color-boost-dark);
  3902. }
  3903. .attribute-builder .window-content .row-column button.flaw {
  3904. margin-bottom: auto;
  3905. --button-color: var(--color-flaw);
  3906. --button-locked-color: var(--color-flaw);
  3907. }
  3908. .attribute-builder .window-content .row-column button.selected {
  3909. background: var(--button-color);
  3910. }
  3911. .attribute-builder .window-content .row-column button.selected.partial {
  3912. background: var(--color-boost-dark);
  3913. }
  3914. .attribute-builder .window-content .row-column button:hover {
  3915. box-shadow: 0 0 5px var(--button-color);
  3916. cursor: pointer;
  3917. }
  3918. .attribute-builder .window-content .row-column button:hover.key-attribute.selected {
  3919. box-shadow: none;
  3920. cursor: default;
  3921. }
  3922. .attribute-builder .window-content .row-column button:hover:disabled {
  3923. background: rgba(0, 0, 0, 0.04);
  3924. box-shadow: none;
  3925. cursor: not-allowed;
  3926. }
  3927. .attribute-builder .window-content .row-column button.hidden {
  3928. pointer-events: none;
  3929. visibility: hidden;
  3930. }
  3931. .attribute-builder .window-content .row-column button:disabled {
  3932. background: rgba(0, 0, 0, 0.04);
  3933. opacity: 0.4;
  3934. }
  3935. .attribute-builder .window-content .row-column button:disabled:active {
  3936. pointer-events: none;
  3937. }
  3938. .attribute-builder .window-content .row-column button.locked {
  3939. background: var(--button-locked-color);
  3940. border-color: var(--button-locked-color);
  3941. pointer-events: none;
  3942. }
  3943. .attribute-builder .window-content .row-column button.locked, .attribute-builder .window-content .row-column button.selected {
  3944. color: var(--text-light);
  3945. }
  3946. .attribute-builder .window-content .row-column div + .boost,
  3947. .attribute-builder .window-content .row-column button + .boost {
  3948. margin-top: 4px;
  3949. }
  3950. .attribute-builder .window-content .summary-row .row-heading {
  3951. display: block;
  3952. }
  3953. .attribute-builder .window-content .summary-row .hint-container {
  3954. background: rgba(211, 204, 188, 0.4);
  3955. padding: 12px;
  3956. margin-right: 10px;
  3957. border: 1px solid rgb(211, 204, 188);
  3958. border-radius: 3px;
  3959. align-self: end;
  3960. }
  3961. .attribute-builder .window-content .summary-row .hint-container h3 {
  3962. color: var(--primary);
  3963. font-variant: small-caps;
  3964. font-size: var(--font-size-20);
  3965. line-height: var(--font-size-16);
  3966. font-family: var(--sans-serif-condensed);
  3967. font-weight: 500;
  3968. }
  3969. .attribute-builder .window-content .summary-row .hint-container p {
  3970. font-style: italic;
  3971. font-size: var(--font-size-12);
  3972. line-height: var(--font-size-14);
  3973. font-family: var(--sans-serif);
  3974. font-weight: 500;
  3975. margin-bottom: 3px;
  3976. }
  3977. .attribute-builder .window-content .summary-row .hint-container label {
  3978. display: flex;
  3979. align-items: center;
  3980. margin-top: 10px;
  3981. }
  3982. .attribute-builder .window-content .summary-row .attributes {
  3983. grid-template-rows: auto auto;
  3984. }
  3985. .attribute-builder .window-content .summary-row .row-column {
  3986. display: flex;
  3987. flex-direction: column;
  3988. padding-top: 10px;
  3989. }
  3990. .attribute-builder .window-content .summary-row .row-column .value {
  3991. height: 40px;
  3992. font: 700 var(--font-size-24) var(--serif);
  3993. line-height: var(--font-size-30);
  3994. }
  3995. .attribute-builder .window-content .summary-row .row-column input {
  3996. width: calc(100% - 20px);
  3997. flex-grow: 0;
  3998. height: 30px;
  3999. color: var(--text-dark);
  4000. font: 500 var(--font-size-24) var(--serif);
  4001. border: 0;
  4002. border-bottom: 1px solid #d3ccbc;
  4003. border-radius: 0;
  4004. background-color: transparent;
  4005. margin: 0 10px 10px 10px;
  4006. }
  4007. .attribute-builder .window-content .summary-row .row-column input::placeholder {
  4008. filter: opacity(0.5);
  4009. }
  4010. .attribute-builder .window-content .summary-row .row-column input:focus {
  4011. border-bottom: 1px solid var(--alt);
  4012. }
  4013. .attribute-builder .window-content .summary-row .row-column input[type=number] {
  4014. padding-bottom: 0;
  4015. padding-left: 4px;
  4016. }
  4017. .attribute-builder .window-content .summary-row .complete {
  4018. grid-row: 2;
  4019. grid-column: 1/7;
  4020. margin-top: 10px;
  4021. margin-left: auto;
  4022. }
  4023. .attribute-builder .window-content .summary-row button.complete {
  4024. color: var(--text-light);
  4025. background: var(--secondary);
  4026. height: 35px;
  4027. width: 131px;
  4028. border: 1px solid var(--tertiary);
  4029. }
  4030. .attribute-builder .window-content .title {
  4031. color: var(--primary);
  4032. font: 500 var(--font-size-10) var(--sans-serif-condensed);
  4033. line-height: var(--font-size-10);
  4034. text-transform: uppercase;
  4035. }
  4036. .attribute-builder .window-content div[data-tooltip-content].description,
  4037. .attribute-builder .window-content div[data-tooltip-content] .description {
  4038. text-decoration: underline dotted;
  4039. text-underline-offset: 2px;
  4040. }
  4041. .attribute-builder .window-content .description {
  4042. font: 600 var(--font-size-16) var(--serif);
  4043. }
  4044. .attribute-builder .window-content .extra {
  4045. align-items: center;
  4046. display: flex;
  4047. font-size: var(--font-size-12);
  4048. gap: 1px;
  4049. margin-top: -0.25rem;
  4050. }
  4051. .attribute-builder .window-content .extra > i {
  4052. margin-left: 0.125rem;
  4053. }
  4054. .attribute-builder .window-content .extra input[type=checkbox] {
  4055. height: var(--font-size-12);
  4056. margin: 0;
  4057. }
  4058. .crb-hover .tooltipster-box .tooltipster-content .hover-content h2:not(:first-child) {
  4059. margin-top: 10px;
  4060. }
  4061. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul.boost-details li {
  4062. white-space: nowrap;
  4063. display: flex;
  4064. flex-direction: row;
  4065. align-items: center;
  4066. }
  4067. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul.boost-details li i {
  4068. font-size: var(--font-size-5);
  4069. margin-right: 5px;
  4070. }
  4071. .iwr-editor {
  4072. max-height: 500px;
  4073. }
  4074. .iwr-editor a.document-id-link {
  4075. display: none;
  4076. }
  4077. .iwr-editor .entries {
  4078. display: flex;
  4079. flex-direction: column;
  4080. gap: 0.5em;
  4081. }
  4082. .iwr-editor .entries .entry {
  4083. padding: 0.25em 0.5em;
  4084. }
  4085. .iwr-editor .entries .entry label {
  4086. flex: unset;
  4087. white-space: nowrap;
  4088. width: 6em;
  4089. }
  4090. .iwr-editor .entries .entry a.form-action,
  4091. .iwr-editor .entries .entry .synthetic-source {
  4092. flex: 0;
  4093. margin-left: 0.5em;
  4094. }
  4095. .iwr-editor .entries .entry:not(.new):nth-child(odd) {
  4096. background-color: rgba(0, 0, 0, 0.075);
  4097. }
  4098. .iwr-editor select:disabled {
  4099. color: var(--color-text-dark-7);
  4100. }
  4101. .iwr-editor tags.tagify.pf2e-tagify {
  4102. background: rgba(0, 0, 0, 0.05);
  4103. border: 1px solid var(--color-border-light-tertiary);
  4104. }
  4105. .iwr-editor tags.tagify.pf2e-tagify[disabled] > .tagify__input {
  4106. margin: 0;
  4107. }
  4108. .iwr-editor input[type=number] {
  4109. max-width: 5ch;
  4110. }
  4111. body > .choices__list--dropdown {
  4112. background-color: white;
  4113. position: fixed;
  4114. }
  4115. .actor.sheet .image-container {
  4116. position: relative;
  4117. }
  4118. .actor.sheet .image-container .hover-icon {
  4119. display: none;
  4120. font-size: var(--font-size-16);
  4121. }
  4122. .actor.sheet .image-container:hover .hover-icon {
  4123. display: block;
  4124. }
  4125. .actor.sheet .image-container [data-action=show-image] {
  4126. position: absolute;
  4127. bottom: 0.25rem;
  4128. right: 0.025rem;
  4129. }
  4130. .actor.sheet h3 {
  4131. border-bottom: none;
  4132. }
  4133. .actor.sheet button > i {
  4134. margin-right: 0;
  4135. }
  4136. .actor.sheet .item-summary {
  4137. --space-s: 0.25em;
  4138. --space-m: 0.5em;
  4139. --space-l: 1em;
  4140. --space-xl: 1.5em;
  4141. --space-2xl: 2em;
  4142. --radius: 3px;
  4143. overflow: hidden;
  4144. }
  4145. .actor.sheet .item-summary p {
  4146. min-height: unset;
  4147. }
  4148. .actor.sheet .item-summary :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  4149. margin-top: 1em;
  4150. }
  4151. .actor.sheet .item-summary .inline-header {
  4152. display: flex;
  4153. align-items: center;
  4154. gap: var(--space-l);
  4155. background-color: var(--alt);
  4156. font-family: var(--sans-serif);
  4157. color: var(--text-light);
  4158. padding: 0;
  4159. font-size: 0.8em;
  4160. font-weight: 400;
  4161. border: none;
  4162. }
  4163. .actor.sheet .item-summary .inline-header strong {
  4164. display: inline-flex;
  4165. padding: 0 var(--space-m);
  4166. background-color: var(--primary);
  4167. min-width: 15ch;
  4168. border-right: 1px solid rgba(0, 0, 0, 0.4);
  4169. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  4170. font-weight: 400;
  4171. }
  4172. .actor.sheet .item-summary .inline-header + p {
  4173. margin-top: var(--space-s);
  4174. }
  4175. .actor.sheet .item-summary .info {
  4176. background-color: var(--secondary);
  4177. padding: var(--space-m);
  4178. color: var(--text-light);
  4179. margin-left: auto;
  4180. margin-right: auto;
  4181. padding: 0;
  4182. border-radius: var(--radius);
  4183. font-family: var(--sans-serif);
  4184. padding-bottom: var(--space-m);
  4185. }
  4186. .actor.sheet .item-summary .info > * + * {
  4187. margin-top: var(--space-m);
  4188. }
  4189. .actor.sheet .item-summary .info + * {
  4190. margin-top: var(--space-xl);
  4191. }
  4192. .actor.sheet .item-summary .info + .actor.sheet .item-summary .info {
  4193. margin-top: var(--space-s);
  4194. }
  4195. .actor.sheet .item-summary .info h4 {
  4196. font-size: 0.9em;
  4197. font-weight: 400;
  4198. line-height: 1.2;
  4199. font-family: var(--sans-serif);
  4200. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  4201. padding: var(--space-m) var(--space-l);
  4202. position: relative;
  4203. display: flex;
  4204. align-items: center;
  4205. justify-content: space-between;
  4206. color: var(--text-light);
  4207. }
  4208. .actor.sheet .item-summary .info h4::after {
  4209. font-family: "Font Awesome 6";
  4210. content: "\f05a";
  4211. font-weight: 900;
  4212. margin-right: var(--space-s);
  4213. }
  4214. .actor.sheet .item-summary .info p {
  4215. font-size: 0.8em;
  4216. margin: 0;
  4217. padding: 0 var(--space-l);
  4218. }
  4219. .actor.sheet .item-summary .info p:first-of-type {
  4220. padding-top: var(--space-m);
  4221. border-top: 1px solid rgba(255, 255, 255, 0.1);
  4222. }
  4223. .actor.sheet .item-summary .traits {
  4224. display: flex;
  4225. flex-wrap: wrap;
  4226. padding: 0;
  4227. }
  4228. .actor.sheet .item-summary .traits p {
  4229. display: inline-flex;
  4230. padding: 0.16rem 0.25rem;
  4231. margin: 0;
  4232. background-color: var(--primary);
  4233. border: 2px solid var(--color-border-trait);
  4234. color: var(--text-light);
  4235. font: 500 var(--font-size-10) var(--sans-serif);
  4236. text-transform: uppercase;
  4237. }
  4238. .actor.sheet .item-summary .statblock {
  4239. font-family: var(--sans-serif-condensed);
  4240. color: var(--text-dark);
  4241. line-height: 1.2;
  4242. margin-bottom: var(--space-m);
  4243. }
  4244. .actor.sheet .item-summary .statblock > * + * {
  4245. margin-top: var(--space-s);
  4246. margin-bottom: 0;
  4247. }
  4248. .actor.sheet .item-summary .statblock p {
  4249. --indent: var(--space-l);
  4250. margin-left: var(--indent);
  4251. position: relative;
  4252. }
  4253. .actor.sheet .item-summary .statblock p strong:first-of-type {
  4254. margin-left: calc(var(--indent) * -1);
  4255. }
  4256. .actor.sheet .item-summary .statblock p .trait:first-of-type {
  4257. margin-left: calc(var(--indent) * -1 - 2px);
  4258. }
  4259. .actor.sheet .item-summary .statblock span.pf2-icon {
  4260. line-height: 1;
  4261. }
  4262. .actor.sheet .item-summary .statblock h1,
  4263. .actor.sheet .item-summary .statblock h2,
  4264. .actor.sheet .item-summary .statblock h3,
  4265. .actor.sheet .item-summary .statblock h4 {
  4266. display: flex;
  4267. align-items: baseline;
  4268. justify-content: space-between;
  4269. border-bottom: 1px solid var(--color-border-dark);
  4270. text-transform: uppercase;
  4271. letter-spacing: -0.05em;
  4272. font-family: var(--sans-serif-condensed);
  4273. font-weight: 700;
  4274. }
  4275. .actor.sheet .item-summary .statblock hr {
  4276. border: none;
  4277. border-bottom: 1px solid var(--color-border-dark);
  4278. }
  4279. .actor.sheet .item-summary .message {
  4280. font-family: var(--journal-cursive);
  4281. font-size: 2em;
  4282. line-height: 1.2;
  4283. }
  4284. .actor.sheet .item-summary span[data-visibility=all] {
  4285. display: inline-block;
  4286. line-height: 1em;
  4287. padding: 2px 1px 1px;
  4288. }
  4289. .actor.sheet .item-summary .item-buttons button {
  4290. background-color: var(--primary);
  4291. border: none;
  4292. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  4293. border-top: 1px solid #ff5e5e;
  4294. border-bottom: 1px solid black;
  4295. color: var(--text-light);
  4296. cursor: pointer;
  4297. font-family: var(--serif);
  4298. font-size: var(--font-size-14);
  4299. font-weight: 500;
  4300. line-height: 1.8em;
  4301. margin: 8px 0 0 0;
  4302. padding: 0 8px;
  4303. }
  4304. .actor.sheet .item-summary .item-buttons button:hover {
  4305. box-shadow: none;
  4306. text-shadow: 0 0 2px white;
  4307. }
  4308. .actor.sheet .expandable:not(.expanded) .item-summary {
  4309. display: none;
  4310. }
  4311. .actor.sheet .inventory {
  4312. --border-color: var(--alt);
  4313. }
  4314. .actor.sheet .inventory ol:not(.currency) {
  4315. margin: 0;
  4316. padding: 0;
  4317. list-style: none;
  4318. display: flex;
  4319. flex-direction: column;
  4320. }
  4321. .actor.sheet .inventory .notify {
  4322. animation: glow 0.75s infinite alternate;
  4323. }
  4324. .actor.sheet .inventory .item-name {
  4325. display: flex;
  4326. align-items: center;
  4327. font-weight: 500;
  4328. flex: 2;
  4329. gap: 4px;
  4330. }
  4331. .actor.sheet .inventory .item-name h3,
  4332. .actor.sheet .inventory .item-name h4 {
  4333. cursor: pointer;
  4334. font-weight: 500;
  4335. line-height: var(--font-size-12);
  4336. margin: auto auto auto 0;
  4337. padding: 2px;
  4338. word-break: break-word;
  4339. }
  4340. .actor.sheet .inventory .item-name h3:hover,
  4341. .actor.sheet .inventory .item-name h4:hover {
  4342. color: var(--primary);
  4343. }
  4344. .actor.sheet .inventory .item-name h4:not(:hover).rarity-uncommon {
  4345. border-color: var(--color-rarity-uncommon);
  4346. color: var(--color-rarity-uncommon);
  4347. }
  4348. .actor.sheet .inventory .item-name h4:not(:hover).rarity-rare {
  4349. border-color: var(--color-rarity-rare);
  4350. color: var(--color-rarity-rare);
  4351. }
  4352. .actor.sheet .inventory .item-name h4:not(:hover).rarity-unique {
  4353. border-color: var(--color-rarity-unique);
  4354. color: var(--color-rarity-unique);
  4355. }
  4356. .actor.sheet .inventory .item-name .item-image {
  4357. box-shadow: inset 0 0 0 1px var(--tertiary);
  4358. }
  4359. .actor.sheet .inventory .item-name .item-image img {
  4360. border-radius: 0;
  4361. }
  4362. .actor.sheet .inventory .item-name .size {
  4363. font-size: 0.8em;
  4364. color: var(--alt);
  4365. margin: 0;
  4366. }
  4367. .actor.sheet .inventory .item-name .item-charges {
  4368. color: var(--sub);
  4369. }
  4370. .actor.sheet .inventory .inventory-list,
  4371. .actor.sheet .inventory .inventory-items {
  4372. flex-direction: column;
  4373. list-style-type: none;
  4374. position: relative;
  4375. width: 100%;
  4376. }
  4377. .actor.sheet .inventory .inventory-list > li:nth-of-type(even),
  4378. .actor.sheet .inventory .inventory-items > li:nth-of-type(even) {
  4379. background-color: rgba(120, 100, 82, 0.1);
  4380. }
  4381. .actor.sheet .inventory .inventory-list .list-row:last-child .item-summary,
  4382. .actor.sheet .inventory .inventory-items .list-row:last-child .item-summary {
  4383. border-bottom: none;
  4384. }
  4385. .actor.sheet .inventory .inventory-list .temporary-item,
  4386. .actor.sheet .inventory .inventory-items .temporary-item {
  4387. background-color: rgba(0, 5, 255, 0.1137254902);
  4388. }
  4389. .actor.sheet .inventory .inventory-list {
  4390. overflow: hidden scroll;
  4391. display: flex;
  4392. height: calc(100% - 60px);
  4393. padding-right: 0.15rem;
  4394. }
  4395. .actor.sheet .inventory .quantity,
  4396. .actor.sheet .inventory .bulk,
  4397. .actor.sheet .inventory .item-controls,
  4398. .actor.sheet .inventory .sell-value {
  4399. display: flex;
  4400. justify-content: center;
  4401. align-items: center;
  4402. flex: 0 0 68px;
  4403. }
  4404. .actor.sheet .inventory .sell-value {
  4405. justify-content: end;
  4406. padding-right: 3px;
  4407. }
  4408. .actor.sheet .inventory .quantity {
  4409. justify-content: space-around;
  4410. }
  4411. .actor.sheet .inventory .quantity .decrease,
  4412. .actor.sheet .inventory .quantity .increase {
  4413. display: flex;
  4414. justify-content: center;
  4415. align-items: center;
  4416. font-family: var(--sans-serif-monospace);
  4417. height: 100%;
  4418. text-align: center;
  4419. width: 18px;
  4420. }
  4421. .actor.sheet .inventory .bulk {
  4422. flex: 0 0 36px;
  4423. }
  4424. .actor.sheet .inventory .item-controls {
  4425. flex: 0 0 90px;
  4426. font-size: var(--font-size-12);
  4427. gap: 1px;
  4428. justify-content: end;
  4429. }
  4430. .actor.sheet .inventory .inventory-header {
  4431. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  4432. align-items: center;
  4433. background-color: var(--alt);
  4434. color: var(--color-text-light-0);
  4435. display: flex;
  4436. font-family: var(--sans-serif);
  4437. font-size: var(--font-size-10);
  4438. justify-content: end;
  4439. letter-spacing: 0.05em;
  4440. line-height: 1;
  4441. margin-top: 6px;
  4442. padding: 0.25rem;
  4443. text-rendering: optimizeLegibility;
  4444. text-transform: uppercase;
  4445. width: 100%;
  4446. }
  4447. .actor.sheet .inventory .inventory-header:first-child {
  4448. margin-top: 0;
  4449. }
  4450. .actor.sheet .inventory .inventory-header h3 {
  4451. font-size: var(--font-size-14);
  4452. margin: 2px 0;
  4453. text-shadow: 0 0 2px rgba(0, 0, 0, 0.75);
  4454. text-transform: capitalize;
  4455. }
  4456. .actor.sheet .inventory .inventory-header h3:hover {
  4457. color: var(--color-text-light-0);
  4458. }
  4459. .actor.sheet .inventory .inventory-header .item-name {
  4460. padding-left: 4px;
  4461. }
  4462. .actor.sheet .inventory .inventory-header .item-invested-total {
  4463. flex: none;
  4464. margin-right: 1em;
  4465. }
  4466. .actor.sheet .inventory .inventory-header .item-controls {
  4467. gap: 0.25rem;
  4468. }
  4469. .actor.sheet .inventory .inventory-header .overinvested {
  4470. color: orange;
  4471. text-shadow: 1px 1px 0px black;
  4472. }
  4473. .actor.sheet .inventory .inventory-items {
  4474. border: 1px solid var(--border-color);
  4475. border-top: none;
  4476. }
  4477. .actor.sheet .inventory .item {
  4478. display: flex;
  4479. flex-wrap: wrap;
  4480. font-size: var(--font-size-12);
  4481. justify-content: flex-start;
  4482. width: 100%;
  4483. }
  4484. .actor.sheet .inventory .item .quantity,
  4485. .actor.sheet .inventory .item .bulk,
  4486. .actor.sheet .inventory .item .item-controls,
  4487. .actor.sheet .inventory .item .sell-value {
  4488. border-left: 1px solid var(--alt);
  4489. }
  4490. .actor.sheet .inventory .list-row {
  4491. width: 100%;
  4492. }
  4493. .actor.sheet .inventory .list-row .item-controls {
  4494. color: var(--text-dark);
  4495. font-size: var(--font-size-13);
  4496. }
  4497. .actor.sheet .inventory .list-row .item-controls .item-control.toggle-invested, .actor.sheet .inventory .list-row .item-controls .item-control.item-carry-type {
  4498. color: rgba(0, 0, 0, 0.5);
  4499. }
  4500. .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 {
  4501. color: var(--secondary);
  4502. }
  4503. .actor.sheet .inventory .list-row .item-controls .item-control.item-carry-type {
  4504. text-align: right;
  4505. }
  4506. .actor.sheet .inventory .list-row .item-controls .item-control .fa-stack {
  4507. margin: -3px -2px 0;
  4508. }
  4509. .actor.sheet .inventory .list-row .item-controls .item-control .fa-stack .fa-1,
  4510. .actor.sheet .inventory .list-row .item-controls .item-control .fa-stack .fa-2 {
  4511. left: 1px;
  4512. position: relative;
  4513. }
  4514. .actor.sheet .inventory .list-row.drag-preview {
  4515. box-shadow: 0 0 6px inset var(--color-shadow-highlight);
  4516. }
  4517. .actor.sheet .inventory .list-row.drag-gap {
  4518. visibility: hidden;
  4519. }
  4520. .actor.sheet .inventory .container-metadata .container-capacity {
  4521. font-family: var(--sans-serif);
  4522. font-size: var(--font-size-10);
  4523. text-transform: uppercase;
  4524. letter-spacing: 0.05em;
  4525. text-rendering: optimizeLegibility;
  4526. position: relative;
  4527. background-color: rgba(0, 0, 0, 0.75);
  4528. box-shadow: inset 0 0 4px black;
  4529. color: var(--color-text-light-0);
  4530. display: flex;
  4531. width: 100%;
  4532. }
  4533. .actor.sheet .inventory .container-metadata .container-capacity .container-capacity-bar {
  4534. background-color: var(--secondary);
  4535. border-radius: 0 2px 2px 0;
  4536. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 0 2px rgba(255, 255, 255, 0.1);
  4537. padding: 8px 0;
  4538. }
  4539. .actor.sheet .inventory .container-metadata .container-capacity .container-capacity-label {
  4540. position: absolute;
  4541. height: 100%;
  4542. top: 0;
  4543. left: 0;
  4544. padding: 2px;
  4545. }
  4546. .actor.sheet .inventory .container-metadata .container-capacity.over-limit .container-capacity-bar {
  4547. background-color: var(--primary);
  4548. }
  4549. .actor.sheet .inventory .container-metadata .container-held-items {
  4550. padding-left: 10px;
  4551. border-left: none;
  4552. border-right: none;
  4553. }
  4554. .actor.sheet .inventory .container-metadata .container-held-items li:nth-of-type(even) {
  4555. background-color: rgba(120, 100, 82, 0.1);
  4556. }
  4557. .actor.sheet .inventory .container-metadata .container-held-items li:first-of-type .item::before {
  4558. height: 50%;
  4559. top: 0;
  4560. }
  4561. .actor.sheet .inventory .container-metadata .container-held-items .item {
  4562. position: relative;
  4563. }
  4564. .actor.sheet .inventory .container-metadata .container-held-items .item::before, .actor.sheet .inventory .container-metadata .container-held-items .item::after {
  4565. position: absolute;
  4566. border-left: 1px solid var(--alt);
  4567. top: 0;
  4568. height: 50%;
  4569. left: -5px;
  4570. width: 5px;
  4571. content: "";
  4572. }
  4573. .actor.sheet .inventory .container-metadata .container-held-items .item::before {
  4574. border-bottom: 1px solid var(--alt);
  4575. top: 0;
  4576. }
  4577. .actor.sheet .inventory .container-metadata .container-held-items .item::after {
  4578. top: 50%;
  4579. }
  4580. .actor.sheet .inventory .container-metadata .container-held-items .item .item-summary {
  4581. border-left: 1px solid var(--alt);
  4582. }
  4583. .actor.sheet .inventory .container-metadata .container-held-items .container-metadata {
  4584. position: relative;
  4585. }
  4586. .actor.sheet .inventory .container-metadata .container-held-items .container-metadata::before {
  4587. position: absolute;
  4588. border-left: 1px solid var(--alt);
  4589. top: 0;
  4590. height: 100%;
  4591. left: -5px;
  4592. width: 0px;
  4593. content: "";
  4594. }
  4595. .actor.sheet .inventory .container-metadata .container-held-items li:last-of-type .item::after,
  4596. .actor.sheet .inventory .container-metadata .container-held-items li:last-of-type .container-metadata::before {
  4597. border: none;
  4598. }
  4599. .actor.sheet .inventory .item-summary {
  4600. flex: 100%;
  4601. padding: 4px 8px 8px;
  4602. border-top: 1px solid var(--alt);
  4603. border-bottom: 1px solid var(--alt);
  4604. background: var(--bg);
  4605. }
  4606. .actor.sheet .inventory .encumbrance {
  4607. align-items: center;
  4608. display: grid;
  4609. grid: "img bar overflow" min-content/24px 1fr;
  4610. margin-top: auto;
  4611. }
  4612. .actor.sheet .inventory .encumbrance img {
  4613. border: none;
  4614. border-radius: 2px;
  4615. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  4616. border-radius: 0;
  4617. grid-area: img;
  4618. position: relative;
  4619. z-index: 4;
  4620. }
  4621. .actor.sheet .inventory .encumbrance .encumbrance-bar {
  4622. position: relative;
  4623. z-index: 2;
  4624. grid-area: bar;
  4625. height: 16px;
  4626. width: 100%;
  4627. background-color: var(--secondary);
  4628. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  4629. }
  4630. .actor.sheet .inventory .encumbrance .encumbrance-label {
  4631. position: relative;
  4632. z-index: 3;
  4633. grid-area: bar;
  4634. color: var(--text-light);
  4635. font-family: var(--serif);
  4636. font-size: var(--font-size-12);
  4637. font-weight: 500;
  4638. padding: 0 8px;
  4639. padding-top: 2px;
  4640. display: flex;
  4641. align-items: center;
  4642. justify-content: space-between;
  4643. width: 100%;
  4644. text-shadow: 0 0 2px black;
  4645. }
  4646. .actor.sheet .inventory .encumbrance .encumbrance-light-bulk-overflow {
  4647. position: relative;
  4648. z-index: 3;
  4649. grid-area: overflow;
  4650. color: var(--text-dark);
  4651. font-family: var(--serif);
  4652. font-size: var(--font-size-12);
  4653. font-weight: 500;
  4654. padding: 0 8px;
  4655. padding-top: 2px;
  4656. display: flex;
  4657. align-items: center;
  4658. justify-content: space-between;
  4659. width: 100%;
  4660. text-shadow: 0 0 2px white;
  4661. }
  4662. .actor.sheet .inventory .encumbrance .bar-bg {
  4663. position: relative;
  4664. z-index: 1;
  4665. grid-area: bar;
  4666. width: 100%;
  4667. height: 16px;
  4668. background-color: rgba(0, 0, 0, 0.5);
  4669. border-radius: 0 2px 2px 0;
  4670. box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.75);
  4671. }
  4672. .actor.sheet .inventory .encumbrance.over-limit .encumbrance-bar {
  4673. background-color: var(--primary) !important;
  4674. }
  4675. .actor.sheet .inventory .total-bulk {
  4676. align-items: center;
  4677. display: flex;
  4678. font-weight: 500;
  4679. gap: 0.25rem;
  4680. height: 1.5rem;
  4681. justify-content: start;
  4682. margin-bottom: 0.7rem;
  4683. }
  4684. .actor.sheet .inventory .total-bulk img {
  4685. border: none;
  4686. border-radius: 2px;
  4687. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  4688. height: 1.5rem;
  4689. width: 1.5rem;
  4690. border-radius: 0;
  4691. z-index: 1;
  4692. }
  4693. .actor.sheet .inventory .total-bulk .bar {
  4694. justify-content: start;
  4695. margin-top: 0;
  4696. position: relative;
  4697. height: 1.25rem;
  4698. padding-left: 0.5rem;
  4699. left: -0.35rem;
  4700. z-index: 0;
  4701. }
  4702. .actor.sheet .item-image {
  4703. display: flex;
  4704. cursor: pointer;
  4705. position: relative;
  4706. font-size: var(--font-size-16);
  4707. height: 24px;
  4708. width: 24px;
  4709. }
  4710. .actor.sheet .item-image.framed {
  4711. background-color: var(--tertiary);
  4712. }
  4713. .actor.sheet .item-image.framed img {
  4714. border-radius: 2px;
  4715. }
  4716. .actor.sheet .item-image.framed,
  4717. .actor.sheet .item-image.framed i {
  4718. border: none;
  4719. border-radius: 2px;
  4720. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  4721. }
  4722. .actor.sheet .item-image img {
  4723. border: none;
  4724. }
  4725. .actor.sheet .item-image i {
  4726. display: none;
  4727. position: absolute;
  4728. width: 100%;
  4729. height: 100%;
  4730. color: var(--text-dark);
  4731. box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.5);
  4732. }
  4733. .actor.sheet .item-image:hover i {
  4734. background: #f1eee9;
  4735. display: flex;
  4736. justify-content: center;
  4737. align-items: center;
  4738. }
  4739. .actor.sheet .alignment-select {
  4740. background-color: var(--color-bg-alignment);
  4741. border: 2px solid var(--color-border-trait);
  4742. color: var(--color-text-trait);
  4743. }
  4744. .actor.sheet .size-select {
  4745. background-color: var(--color-bg-size);
  4746. border: 2px solid var(--color-border-trait);
  4747. color: var(--color-text-trait);
  4748. }
  4749. .actor.sheet .rarity-select {
  4750. border: 2px solid var(--color-border-trait);
  4751. color: var(--color-text-trait);
  4752. }
  4753. .actor.sheet .rarity-select.common {
  4754. background-color: var(--color-rarity-common);
  4755. }
  4756. .actor.sheet .rarity-select.uncommon {
  4757. background-color: var(--color-rarity-uncommon);
  4758. }
  4759. .actor.sheet .rarity-select.rare {
  4760. background-color: var(--color-rarity-rare);
  4761. }
  4762. .actor.sheet .rarity-select.unique {
  4763. background-color: var(--color-rarity-unique);
  4764. }
  4765. .actor.sheet.character .attack-popout.actions {
  4766. gap: 0.5rem;
  4767. padding: 0;
  4768. margin-left: 0.25rem;
  4769. }
  4770. .actor.sheet.character .attack-popout.actions ol.actions-list + .actions-list {
  4771. margin-top: 0.5rem;
  4772. }
  4773. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .item-name {
  4774. align-items: start;
  4775. }
  4776. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .item-name .actions-title {
  4777. display: flex;
  4778. flex-direction: column;
  4779. }
  4780. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .item-name .item-image {
  4781. height: 32px;
  4782. width: 32px;
  4783. }
  4784. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group {
  4785. align-items: center;
  4786. display: flex;
  4787. flex-direction: row;
  4788. flex-wrap: nowrap;
  4789. font-size: var(--font-size-14);
  4790. margin-bottom: 0;
  4791. padding: 2px 0;
  4792. }
  4793. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group button {
  4794. border: none;
  4795. flex: 0;
  4796. gap: 2px;
  4797. height: 1.25rem;
  4798. line-height: unset;
  4799. margin: 0;
  4800. padding: 0 0.5em;
  4801. white-space: nowrap;
  4802. }
  4803. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group button:not(:disabled):hover {
  4804. box-shadow: none;
  4805. text-shadow: 0 0 2px var(--text-light);
  4806. }
  4807. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options {
  4808. align-items: center;
  4809. display: flex;
  4810. font-size: var(--font-size-14);
  4811. gap: 2px;
  4812. justify-content: center;
  4813. padding: 0 3px;
  4814. }
  4815. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options .title {
  4816. text-transform: uppercase;
  4817. }
  4818. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button {
  4819. align-items: center;
  4820. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  4821. display: flex;
  4822. justify-content: center;
  4823. width: 3ch;
  4824. }
  4825. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button.selected {
  4826. background: var(--text-dark);
  4827. }
  4828. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button.selected > .icon {
  4829. color: var(--bg-dark);
  4830. }
  4831. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button:not(disabled):hover {
  4832. box-shadow: inset 0 0 0 1px rgba(94, 0, 0, 0.5);
  4833. text-shadow: none;
  4834. }
  4835. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .button-group .versatile-options button:active {
  4836. text-shadow: 0 0 1px var(--primary);
  4837. }
  4838. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .alt-usage {
  4839. flex-basis: 100%;
  4840. margin-left: calc(3em - 2px);
  4841. position: relative;
  4842. }
  4843. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .alt-usage .alt-usage-icon {
  4844. border: none;
  4845. height: 1rem;
  4846. position: absolute;
  4847. left: -1.5em;
  4848. top: 0.2em;
  4849. }
  4850. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo,
  4851. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions {
  4852. margin-left: 2.5rem;
  4853. }
  4854. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo {
  4855. align-items: center;
  4856. display: flex;
  4857. gap: 3px;
  4858. margin-bottom: 2px;
  4859. }
  4860. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo select.linked {
  4861. font: normal var(--font-size-12) var(--sans-serif);
  4862. line-height: var(--font-size-12);
  4863. padding-top: 3px;
  4864. width: fit-content;
  4865. }
  4866. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo select.linked[data-compatible=false] {
  4867. color: rgba(255, 255, 255, 0.6);
  4868. }
  4869. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo select.linked option,
  4870. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo select.linked optgroup {
  4871. color: var(--text-light);
  4872. }
  4873. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo .magazine {
  4874. margin-right: 0.5rem;
  4875. font-family: var(--sans-serif);
  4876. font-weight: 600;
  4877. }
  4878. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .ammo .magazine .icon {
  4879. display: inline-block;
  4880. width: 0.9rem;
  4881. height: 0.9rem;
  4882. background-image: url("../assets/icons/heavy-bullets.svg");
  4883. background-size: cover;
  4884. }
  4885. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions {
  4886. display: flex;
  4887. gap: 3px;
  4888. }
  4889. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions button select.modular {
  4890. appearance: auto;
  4891. background: none;
  4892. color: var(--text-dark);
  4893. cursor: default;
  4894. font: inherit;
  4895. margin-left: 0.5em;
  4896. padding: 0.15em 0.2em;
  4897. text-transform: uppercase;
  4898. }
  4899. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions button select.modular option {
  4900. background: var(--bg-dark);
  4901. }
  4902. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .auxiliary-actions button:has(select.modular:hover) {
  4903. text-shadow: none;
  4904. }
  4905. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike .action-name {
  4906. justify-content: space-between;
  4907. }
  4908. .actor.sheet.character .attack-popout.actions ol.actions-list li.strike:not(.ready) .auxiliary-actions {
  4909. justify-content: right;
  4910. }
  4911. .actor.sheet.character .attack-popout.actions ol.actions-list li.action .item-image:hover {
  4912. background: none;
  4913. }
  4914. .actor.sheet.character .attack-popout.actions ol.actions-list li.action .tracking {
  4915. align-items: center;
  4916. display: flex;
  4917. flex-direction: row;
  4918. flex-wrap: nowrap;
  4919. margin-left: auto;
  4920. margin-right: 1rem;
  4921. }
  4922. .actor.sheet.character .attack-popout.actions ol.actions-list li.action .tracking input {
  4923. width: 0;
  4924. flex: 0 1 4rem;
  4925. text-align: center;
  4926. }
  4927. .actor.sheet.character .attack-popout.actions ol.actions-list li.action .tracking span {
  4928. white-space: nowrap;
  4929. }
  4930. .actor.sheet.character .attack-popout.actions h4 {
  4931. flex: 1;
  4932. }
  4933. .actor.sheet.character .attack-popout.actions button.activate {
  4934. background: none;
  4935. border: 1px solid var(--color-border-dark);
  4936. border-radius: 5px;
  4937. flex: 0;
  4938. line-height: 1.25em;
  4939. opacity: 0.7;
  4940. margin-right: 0.5rem;
  4941. padding: 0 0.25rem;
  4942. }
  4943. .actor.sheet.character .attack-popout.actions button.activate.active, .actor.sheet.character .attack-popout.actions button.activate:hover {
  4944. background-color: var(--primary);
  4945. color: var(--text-light);
  4946. opacity: 1;
  4947. }
  4948. .actor.sheet.character .attack-popout.actions .item-controls {
  4949. display: flex;
  4950. min-width: 2.5em;
  4951. justify-content: end;
  4952. }
  4953. .actor.sheet.character .attack-popout .actions-container {
  4954. padding: 0 0.5rem 2rem 0;
  4955. }
  4956. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper {
  4957. justify-items: center;
  4958. }
  4959. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .action-radio {
  4960. display: none;
  4961. }
  4962. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels {
  4963. min-height: min-content;
  4964. width: 100%;
  4965. }
  4966. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-panel {
  4967. display: none;
  4968. }
  4969. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-panel.active {
  4970. display: flex;
  4971. flex-direction: column;
  4972. }
  4973. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options {
  4974. border-image-repeat: repeat;
  4975. border-image-slice: 11;
  4976. border-image-source: url("../assets/sheet/frame-elegant.svg");
  4977. border-image-width: 14px;
  4978. border-style: double;
  4979. display: flex;
  4980. flex-wrap: wrap;
  4981. margin-bottom: 0.5rem;
  4982. padding: 0.5rem 1rem;
  4983. }
  4984. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option {
  4985. align-items: center;
  4986. display: flex;
  4987. width: 100%;
  4988. margin: 1px 0;
  4989. }
  4990. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label * {
  4991. vertical-align: middle;
  4992. }
  4993. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label input {
  4994. margin: 0;
  4995. padding: 0;
  4996. }
  4997. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label .unchecked-disabled {
  4998. color: var(--color-text-dark-inactive);
  4999. }
  5000. .actor.sheet.character .attack-popout .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label select {
  5001. margin-left: 0.25em;
  5002. }
  5003. .actor.sheet.character .attack-popout ol.actions-list {
  5004. padding-left: 0;
  5005. }
  5006. .actor.sheet.character .attack-popout ol.actions-list li.action-header {
  5007. align-items: center;
  5008. display: flex;
  5009. }
  5010. .actor.sheet.character .attack-popout ol.actions-list li.action, .actor.sheet.character .attack-popout ol.actions-list li.strike {
  5011. border: solid transparent;
  5012. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  5013. border-width: 0 0 1px;
  5014. padding: 4px;
  5015. width: 100%;
  5016. }
  5017. .actor.sheet.character .attack-popout ol.actions-list li.action p:empty, .actor.sheet.character .attack-popout ol.actions-list li.strike p:empty {
  5018. display: none;
  5019. }
  5020. .actor.sheet.character .attack-popout ol.actions-list li.action .item-name, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-name {
  5021. grid-area: icon-name;
  5022. align-items: center;
  5023. display: flex;
  5024. flex: 1;
  5025. margin: 0;
  5026. }
  5027. .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 {
  5028. cursor: pointer;
  5029. margin: 0;
  5030. max-width: fit-content;
  5031. }
  5032. .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 {
  5033. display: flex;
  5034. justify-content: center;
  5035. align-items: center;
  5036. background-repeat: no-repeat;
  5037. background-size: contain;
  5038. color: transparent;
  5039. cursor: pointer;
  5040. font-size: var(--font-size-18);
  5041. height: 32px;
  5042. margin-right: 8px;
  5043. width: 32px;
  5044. }
  5045. .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 {
  5046. background: none;
  5047. color: var(--primary);
  5048. }
  5049. .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 {
  5050. flex: 1;
  5051. }
  5052. .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 {
  5053. display: flex;
  5054. flex-direction: row;
  5055. }
  5056. .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 {
  5057. cursor: pointer;
  5058. }
  5059. .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 {
  5060. color: var(--primary);
  5061. }
  5062. .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 {
  5063. color: var(--text-dark);
  5064. }
  5065. .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 {
  5066. align-items: center;
  5067. border-radius: 2px;
  5068. border: none;
  5069. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3), inset 0 0 0 2px rgba(0, 0, 0, 0.2);
  5070. display: flex;
  5071. flex: 0;
  5072. font: 500 var(--font-size-10) var(--sans-serif);
  5073. gap: 0.25em;
  5074. height: 2em;
  5075. justify-content: space-evenly;
  5076. letter-spacing: 0.05em;
  5077. margin: 0;
  5078. max-width: fit-content;
  5079. padding: 0.5em;
  5080. text-rendering: optimizeLegibility;
  5081. text-transform: uppercase;
  5082. white-space: nowrap;
  5083. }
  5084. .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) {
  5085. background: var(--bg-dark);
  5086. cursor: pointer;
  5087. }
  5088. .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 {
  5089. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), inset 0 0 0 2px rgba(0, 0, 0, 0.4);
  5090. }
  5091. .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 {
  5092. color: var(--primary);
  5093. }
  5094. .actor.sheet.character .attack-popout ol.actions-list li.action .item-controls, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-controls {
  5095. font-size: var(--font-size-12);
  5096. grid-area: controls;
  5097. white-space: nowrap;
  5098. }
  5099. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary {
  5100. flex-basis: 100%;
  5101. margin: 0.5rem 0;
  5102. }
  5103. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary .title,
  5104. .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,
  5105. .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary .framing {
  5106. color: var(--primary);
  5107. margin-top: 1em;
  5108. margin: 0;
  5109. padding: 0;
  5110. }
  5111. .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 {
  5112. color: var(--secondary);
  5113. margin: 1em 0 0.25em;
  5114. }
  5115. .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 {
  5116. font-weight: 500;
  5117. }
  5118. .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 {
  5119. margin-top: 0;
  5120. }
  5121. .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 {
  5122. border: none;
  5123. vertical-align: middle;
  5124. }
  5125. .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 {
  5126. background: var(--alt);
  5127. vertical-align: middle;
  5128. border: 1px solid var(--text-dark);
  5129. }
  5130. .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 {
  5131. box-shadow: none;
  5132. text-shadow: 0 0 2px white;
  5133. }
  5134. .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 {
  5135. cursor: pointer;
  5136. }
  5137. .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 {
  5138. background-color: rgba(23, 31, 105, 0.5);
  5139. color: var(--text-dark);
  5140. text-shadow: 0 0 2px white;
  5141. }
  5142. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary, .actor.sheet.character .attack-popout ol.actions-list li.strike .item-summary {
  5143. border-image-repeat: repeat;
  5144. border-image-slice: 11;
  5145. border-image-source: url("../assets/sheet/frame-elegant.svg");
  5146. border-image-width: 14px;
  5147. border-style: double;
  5148. padding: 0.5rem 1rem 1rem;
  5149. }
  5150. .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 {
  5151. margin: 0;
  5152. margin-bottom: 0.5rem;
  5153. }
  5154. .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 {
  5155. background-color: rgba(0, 0, 0, 0.8);
  5156. }
  5157. .actor.sheet.character .attack-popout ol.actions-list li.action.hidden, .actor.sheet.character .attack-popout ol.actions-list li.strike.hidden {
  5158. display: none;
  5159. }
  5160. .actor.sheet.character .attack-popout ol.actions-list li.action {
  5161. align-items: center;
  5162. column-gap: 0.5rem;
  5163. display: grid;
  5164. grid: "icon name tracking controls" 1fr "icon buttons tracking controls" auto "summary summary summary summary" auto/min-content auto 20% 10%;
  5165. }
  5166. .actor.sheet.character .attack-popout ol.actions-list li.action > .icon {
  5167. grid-area: icon;
  5168. height: 32px;
  5169. width: 32px;
  5170. }
  5171. .actor.sheet.character .attack-popout ol.actions-list li.action .name {
  5172. align-items: center;
  5173. grid-area: name;
  5174. display: flex;
  5175. margin-bottom: 0;
  5176. text-align: left;
  5177. }
  5178. .actor.sheet.character .attack-popout ol.actions-list li.action .button-group {
  5179. grid-area: buttons;
  5180. display: flex;
  5181. flex-wrap: wrap;
  5182. gap: 1px;
  5183. }
  5184. .actor.sheet.character .attack-popout ol.actions-list li.action .tracking {
  5185. grid-area: tracking;
  5186. }
  5187. .actor.sheet.character .attack-popout ol.actions-list li.action .item-controls {
  5188. grid-area: controls;
  5189. }
  5190. .actor.sheet.character .attack-popout ol.actions-list li.action .item-summary {
  5191. grid-area: summary;
  5192. }
  5193. .actor.sheet.character .attack-popout.actions {
  5194. margin: 0.25em 0.1em 0 0.4em;
  5195. }
  5196. .actor.sheet.character .attack-popout .actions-container {
  5197. padding: 0.5em 0 0.5em 0.4em;
  5198. }
  5199. .actor.sheet.character .attack-popout ol.actions-list li.strike {
  5200. border: unset;
  5201. }
  5202. .actor.sheet.character .attack-popout ol.actions-list li.strike .ammo select.linked {
  5203. -moz-appearance: none;
  5204. -webkit-appearance: none;
  5205. appearance: none;
  5206. background-color: var(--alt);
  5207. background-image: url("../assets/icons/chevron-down.svg");
  5208. background-position: right 0.25em top 50%;
  5209. background-repeat: no-repeat;
  5210. background-size: 1em auto;
  5211. border-radius: 2px;
  5212. border: 1px solid #53422a;
  5213. color: var(--text-light);
  5214. height: auto;
  5215. padding: 0.25rem 1.1rem 0.25rem 0.25rem;
  5216. position: relative;
  5217. text-overflow: ellipsis;
  5218. }
  5219. .actor.sheet.character .attack-popout ol.actions-list li.strike .ammo select.linked[data-compatible=false] {
  5220. color: rgba(255, 255, 255, 0.6);
  5221. }
  5222. .actor.sheet.character .attack-popout ol.actions-list li.strike .ammo select.linked option,
  5223. .actor.sheet.character .attack-popout ol.actions-list li.strike .ammo select.linked optgroup {
  5224. color: var(--text-light);
  5225. background-color: var(--alt);
  5226. }
  5227. .actor.sheet.character .crb-style .pf-rank {
  5228. font-family: var(--sans-serif);
  5229. font-size: var(--font-size-10);
  5230. text-transform: uppercase;
  5231. letter-spacing: 0.05em;
  5232. text-rendering: optimizeLegibility;
  5233. align-items: center;
  5234. background: var(--color-proficiency-untrained);
  5235. border-radius: 2px;
  5236. border: 1px solid rgba(0, 0, 0, 0.5);
  5237. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  5238. color: var(--text-light);
  5239. cursor: pointer;
  5240. display: flex;
  5241. font-weight: 500;
  5242. justify-content: center;
  5243. padding: 2px 1px 1px 1px;
  5244. text-align-last: center;
  5245. }
  5246. .actor.sheet.character .crb-style .pf-rank.readonly {
  5247. pointer-events: none;
  5248. }
  5249. .actor.sheet.character .crb-style .pf-rank option[value="0"] {
  5250. background: var(--color-proficiency-untrained);
  5251. }
  5252. .actor.sheet.character .crb-style .pf-rank.trained, .actor.sheet.character .crb-style .pf-rank[data-rank="1"],
  5253. .actor.sheet.character .crb-style .pf-rank option[value="1"] {
  5254. background: var(--color-proficiency-trained);
  5255. }
  5256. .actor.sheet.character .crb-style .pf-rank.expert, .actor.sheet.character .crb-style .pf-rank[data-rank="2"],
  5257. .actor.sheet.character .crb-style .pf-rank option[value="2"] {
  5258. background: var(--color-proficiency-expert);
  5259. }
  5260. .actor.sheet.character .crb-style .pf-rank.master, .actor.sheet.character .crb-style .pf-rank[data-rank="3"],
  5261. .actor.sheet.character .crb-style .pf-rank option[value="3"] {
  5262. background: var(--color-proficiency-master);
  5263. }
  5264. .actor.sheet.character .crb-style .pf-rank.legendary, .actor.sheet.character .crb-style .pf-rank[data-rank="4"],
  5265. .actor.sheet.character .crb-style .pf-rank option[value="4"] {
  5266. background: var(--color-proficiency-legendary);
  5267. }
  5268. .actor.sheet.character .crb-style span.pf-rank {
  5269. min-width: 61px;
  5270. pointer-events: none;
  5271. }
  5272. .actor.sheet.character .crb-style aside .sidebar a.roll-icon.rest {
  5273. padding-bottom: 0;
  5274. }
  5275. .actor.sheet.character .crb-style aside .sidebar .class-dc.secondary {
  5276. margin-top: 0.2em;
  5277. }
  5278. .actor.sheet.character .crb-style aside .sidebar .class-dc .classdc-rank {
  5279. align-items: center;
  5280. display: flex;
  5281. gap: 0.5em;
  5282. }
  5283. .actor.sheet.character .crb-style header.char-header .char-details .dots {
  5284. display: flex;
  5285. font-size: var(--font-size-10);
  5286. }
  5287. .actor.sheet.character .crb-style header.char-header .char-details .dots .label {
  5288. color: var(--sidebar-label);
  5289. padding-left: 3px;
  5290. margin-right: 8px;
  5291. font-weight: 700;
  5292. }
  5293. .actor.sheet.character .crb-style header.char-header .char-level .exp-data {
  5294. display: flex;
  5295. flex-direction: column;
  5296. justify-content: space-between;
  5297. padding: 0.5em 0;
  5298. position: relative;
  5299. }
  5300. .actor.sheet.character .crb-style header.char-header .char-level .exp-data .exp-input {
  5301. font-size: var(--font-size-13);
  5302. height: 1.5em;
  5303. }
  5304. .actor.sheet.character .crb-style header.char-header .char-level .exp-data .exp-input input {
  5305. color: var(--text-light);
  5306. font-family: var(--sans-serif);
  5307. text-align: right;
  5308. width: 3em;
  5309. }
  5310. .actor.sheet.character .crb-style header.char-header .char-level .exp-data .exp-input .slash {
  5311. color: var(--sidebar-label);
  5312. }
  5313. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress {
  5314. background-color: unset;
  5315. border: 1px solid rgba(255, 255, 255, 0.1);
  5316. border-left: none;
  5317. bottom: 7px;
  5318. box-shadow: 0 0 2px var(--sidebar-label);
  5319. height: 5px;
  5320. left: -9px;
  5321. position: absolute;
  5322. width: 7em;
  5323. }
  5324. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress::-moz-progress-bar {
  5325. background: var(--sidebar-title);
  5326. }
  5327. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress::-webkit-progress-bar {
  5328. background: rgba(0, 0, 0, 0.2);
  5329. }
  5330. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress::-webkit-progress-value {
  5331. background: var(--sidebar-title);
  5332. }
  5333. .actor.sheet.character .crb-style nav.sheet-navigation .item.to-hide {
  5334. opacity: 45%;
  5335. }
  5336. .actor.sheet.character .crb-style nav.sheet-navigation .item.hidden {
  5337. display: none;
  5338. }
  5339. .actor.sheet.character .crb-style nav.sheet-navigation .item .pfs-icon {
  5340. clip-rule: evenodd;
  5341. fill-rule: evenodd;
  5342. padding: 4px;
  5343. position: relative;
  5344. stroke-linejoin: round;
  5345. stroke-miterlimit: 2;
  5346. top: -1px;
  5347. }
  5348. .actor.sheet.character .crb-style nav.sheet-navigation .item .pfs-icon path {
  5349. fill-rule: nonzero;
  5350. }
  5351. .actor.sheet.character .crb-style nav.sheet-navigation .manage-tabs {
  5352. color: var(--text-light);
  5353. margin: 0;
  5354. padding: 0 6px;
  5355. }
  5356. .actor.sheet.character .crb-style .sheet-body .sheet-content > .tab.active {
  5357. display: flex;
  5358. height: 100%;
  5359. }
  5360. .actor.sheet.character .crb-style .sheet-body .sheet-content > .tab:not(.inventory, .actions),
  5361. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab-content {
  5362. overflow: hidden scroll;
  5363. flex-grow: 1;
  5364. min-height: 0;
  5365. overflow: hidden scroll;
  5366. }
  5367. .actor.sheet.character .crb-style .sheet-body .sheet-content nav + .tab-content {
  5368. padding-top: 0.75rem;
  5369. }
  5370. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header {
  5371. position: relative;
  5372. margin-top: 0.75em;
  5373. font-size: var(--font-size-16);
  5374. font-family: var(--serif);
  5375. font-weight: 600;
  5376. color: var(--primary);
  5377. line-height: 1;
  5378. border-bottom: 1px solid var(--color-border-divider);
  5379. }
  5380. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header > button, .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header > .controls {
  5381. position: absolute;
  5382. bottom: -1px;
  5383. right: 0;
  5384. }
  5385. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header .controls {
  5386. display: flex;
  5387. }
  5388. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header button {
  5389. background: transparent;
  5390. border-radius: 2px 2px 0 0;
  5391. border: 1px solid var(--color-border-divider);
  5392. color: var(--primary);
  5393. cursor: pointer;
  5394. font-family: var(--sans-serif);
  5395. font-size: var(--font-size-12);
  5396. font-weight: 500;
  5397. height: 20px;
  5398. line-height: var(--font-size-12);
  5399. margin: 0;
  5400. outline: none;
  5401. text-transform: uppercase;
  5402. width: auto;
  5403. }
  5404. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header button.has-unallocated {
  5405. animation: glow 0.75s infinite alternate;
  5406. }
  5407. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image {
  5408. cursor: pointer;
  5409. display: flex;
  5410. font-size: var(--font-size-16);
  5411. height: 24px;
  5412. min-width: 24px;
  5413. position: relative;
  5414. width: 24px;
  5415. }
  5416. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image img {
  5417. border: none;
  5418. }
  5419. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image i {
  5420. display: none;
  5421. position: absolute;
  5422. width: 100%;
  5423. height: 100%;
  5424. color: var(--text-dark);
  5425. }
  5426. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image:hover i {
  5427. background: #f1eee9;
  5428. display: flex;
  5429. justify-content: center;
  5430. align-items: center;
  5431. }
  5432. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed {
  5433. background-color: var(--tertiary);
  5434. }
  5435. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed,
  5436. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed i {
  5437. border: none;
  5438. border-radius: 2px;
  5439. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  5440. }
  5441. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab {
  5442. flex-direction: column;
  5443. }
  5444. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character select {
  5445. width: calc(100% - 6px);
  5446. background-color: var(--alt);
  5447. border: 1px solid #605041;
  5448. }
  5449. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character select:disabled {
  5450. cursor: initial;
  5451. }
  5452. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character hr {
  5453. margin: 10px 6px 10px 0;
  5454. }
  5455. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 {
  5456. background-color: rgba(28, 28, 28, 0.1);
  5457. border: none;
  5458. color: var(--text-dark);
  5459. display: flex;
  5460. font: 700 var(--font-size-14) var(--body-serif);
  5461. grid-area: mod;
  5462. line-height: 1;
  5463. margin: 0;
  5464. padding: 8px 4px 6px;
  5465. width: calc(100% - 6px);
  5466. }
  5467. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 a {
  5468. margin-left: auto;
  5469. }
  5470. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 a i {
  5471. position: relative;
  5472. right: -2px;
  5473. top: -2px;
  5474. float: right;
  5475. }
  5476. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 span.value {
  5477. display: inline-block;
  5478. max-width: 87%;
  5479. overflow: hidden;
  5480. text-overflow: ellipsis;
  5481. white-space: nowrap;
  5482. }
  5483. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details {
  5484. display: grid;
  5485. grid: "img alignment deity" 46px "img details details" auto/120px 130px 1fr;
  5486. margin-top: 4px;
  5487. }
  5488. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .image-container {
  5489. grid-area: img;
  5490. margin-left: 0.25rem;
  5491. z-index: 3;
  5492. }
  5493. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .image-container .actor-image {
  5494. border: none;
  5495. 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;
  5496. border-radius: 0;
  5497. max-height: 11rem;
  5498. object-fit: cover;
  5499. object-position: top;
  5500. width: 100%;
  5501. }
  5502. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment {
  5503. grid-area: alignment;
  5504. position: relative;
  5505. display: flex;
  5506. align-items: center;
  5507. justify-content: center;
  5508. background: url("../assets/sheet/banner-bg.webp") repeat-x center;
  5509. z-index: 1;
  5510. }
  5511. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment .bio-alignment {
  5512. position: absolute;
  5513. left: 0;
  5514. }
  5515. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment select {
  5516. background: none;
  5517. border: none;
  5518. box-shadow: none;
  5519. color: var(--text-dark);
  5520. cursor: pointer;
  5521. display: block;
  5522. font-family: var(--body-serif);
  5523. font-size: var(--font-size-14);
  5524. font-weight: 700;
  5525. outline: none;
  5526. overflow-x: visible;
  5527. padding-left: 8px;
  5528. width: auto;
  5529. line-height: 1;
  5530. text-transform: capitalize;
  5531. margin-top: 2px;
  5532. }
  5533. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment select option {
  5534. color: var(--text-light);
  5535. font: initial;
  5536. }
  5537. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment input[type=text] {
  5538. font: 700 var(--font-size-14) var(--body-serif);
  5539. text-align: center;
  5540. max-width: 138px;
  5541. }
  5542. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment::after {
  5543. position: absolute;
  5544. content: "";
  5545. height: 46px;
  5546. width: 15px;
  5547. top: 0;
  5548. right: -11px;
  5549. background: url("../assets/sheet/banner-bg2.webp") no-repeat right;
  5550. }
  5551. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity {
  5552. align-items: center;
  5553. display: flex;
  5554. grid-area: deity;
  5555. margin-left: auto;
  5556. min-width: 10em;
  5557. padding-bottom: 0.7em;
  5558. }
  5559. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input {
  5560. display: flex;
  5561. flex-flow: column wrap;
  5562. justify-content: end;
  5563. }
  5564. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input span {
  5565. text-align: right;
  5566. }
  5567. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input h3 {
  5568. min-width: 9em;
  5569. }
  5570. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input h3 span {
  5571. max-width: 10em;
  5572. }
  5573. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity img.symbol {
  5574. border: none;
  5575. 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;
  5576. border-radius: 50%;
  5577. height: 32px;
  5578. margin: 0.5rem 0 0 0.5rem;
  5579. width: 32px;
  5580. }
  5581. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-sheet {
  5582. grid-area: details;
  5583. display: grid;
  5584. grid-template-columns: 44% 55%;
  5585. grid-template-rows: repeat(2, 42px);
  5586. grid-row-gap: 8px;
  5587. padding-left: 12px;
  5588. margin-top: 8px;
  5589. }
  5590. .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 {
  5591. margin: 0;
  5592. }
  5593. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-sheet .detail-small {
  5594. display: flex;
  5595. }
  5596. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control {
  5597. cursor: pointer;
  5598. margin-left: auto;
  5599. }
  5600. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control i.fa-ellipsis-v:hover {
  5601. text-shadow: 0 0 8px var(--color-shadow-primary);
  5602. }
  5603. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control #context-menu {
  5604. left: -85px;
  5605. min-width: 105px;
  5606. padding: 0;
  5607. text-align: left;
  5608. }
  5609. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control #context-menu .context-item {
  5610. font-family: var(--font-primary);
  5611. font-weight: normal;
  5612. min-width: 105px;
  5613. }
  5614. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control #context-menu .context-item i {
  5615. position: static;
  5616. float: none;
  5617. }
  5618. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background {
  5619. display: flex;
  5620. flex-wrap: wrap;
  5621. }
  5622. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background label {
  5623. align-items: start;
  5624. display: flex;
  5625. flex: 1 0 0;
  5626. flex-direction: column;
  5627. justify-content: start;
  5628. margin-bottom: 8px;
  5629. }
  5630. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background label span {
  5631. width: 100%;
  5632. }
  5633. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits {
  5634. display: flex;
  5635. flex-wrap: wrap;
  5636. }
  5637. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .tags {
  5638. width: 100%;
  5639. }
  5640. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc {
  5641. display: flex;
  5642. flex-direction: column;
  5643. justify-content: start;
  5644. align-items: start;
  5645. flex: 20%;
  5646. margin-bottom: 8px;
  5647. }
  5648. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc span {
  5649. width: 100%;
  5650. }
  5651. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc span.speed * {
  5652. width: 50%;
  5653. }
  5654. .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 {
  5655. flex: 50%;
  5656. }
  5657. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_speed-types {
  5658. flex: 50%;
  5659. }
  5660. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_senses {
  5661. flex: 50%;
  5662. }
  5663. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_languages {
  5664. flex: 50%;
  5665. margin-bottom: 0;
  5666. }
  5667. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_traits {
  5668. flex: 50%;
  5669. margin-bottom: 0;
  5670. }
  5671. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc label,
  5672. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc h4 {
  5673. margin: 0;
  5674. white-space: nowrap;
  5675. }
  5676. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc .tags {
  5677. margin: 0;
  5678. padding: 0;
  5679. }
  5680. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc .tags,
  5681. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc select,
  5682. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc input,
  5683. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc h3 {
  5684. margin-top: 4px;
  5685. }
  5686. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes {
  5687. margin: 0;
  5688. padding: 0;
  5689. display: grid;
  5690. gap: 12px;
  5691. grid: 1fr/repeat(6, 1fr);
  5692. justify-content: center;
  5693. list-style: none;
  5694. }
  5695. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute {
  5696. display: grid;
  5697. grid: "abbrev" auto "mod" 1fr "label" auto/1fr;
  5698. column-gap: 10px;
  5699. align-items: center;
  5700. }
  5701. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute:focus-within .abbreviation {
  5702. filter: opacity(1);
  5703. }
  5704. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute.key .abbreviation,
  5705. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute.key .modifier {
  5706. color: var(--secondary);
  5707. }
  5708. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation {
  5709. margin: 0;
  5710. padding: 0;
  5711. border: none;
  5712. color: var(--primary);
  5713. font: 400 22px var(--serif-condensed);
  5714. grid-area: abbrev;
  5715. position: relative;
  5716. text-align: center;
  5717. text-transform: capitalize;
  5718. }
  5719. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.key,
  5720. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.apex {
  5721. bottom: 4px;
  5722. position: absolute;
  5723. font-size: var(--font-size-12);
  5724. }
  5725. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.key {
  5726. left: 2px;
  5727. }
  5728. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.apex {
  5729. right: 2px;
  5730. }
  5731. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation i.apex.unselected:not(:hover) {
  5732. opacity: 0.75;
  5733. }
  5734. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute h3.modifier {
  5735. display: flex;
  5736. justify-content: center;
  5737. align-items: center;
  5738. border-image-repeat: repeat;
  5739. border-image-slice: 11;
  5740. border-image-source: url("../assets/sheet/frame-elegant.svg");
  5741. border-image-width: 14px;
  5742. border-style: double;
  5743. grid-area: mod;
  5744. font-size: var(--font-size-24);
  5745. font-family: var(--serif);
  5746. font-weight: 700;
  5747. height: 46px;
  5748. margin: 0;
  5749. padding-right: 4px;
  5750. }
  5751. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .label {
  5752. color: rgb(68, 55, 48);
  5753. grid-area: label;
  5754. margin: 0;
  5755. opacity: 0.4;
  5756. padding: 2px;
  5757. text-align: center;
  5758. }
  5759. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions {
  5760. gap: 0.5rem;
  5761. padding: 0;
  5762. margin-left: 0.25rem;
  5763. }
  5764. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list + .actions-list {
  5765. margin-top: 0.5rem;
  5766. }
  5767. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name {
  5768. align-items: start;
  5769. }
  5770. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .actions-title {
  5771. display: flex;
  5772. flex-direction: column;
  5773. }
  5774. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name .item-image {
  5775. height: 32px;
  5776. width: 32px;
  5777. }
  5778. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group {
  5779. align-items: center;
  5780. display: flex;
  5781. flex-direction: row;
  5782. flex-wrap: nowrap;
  5783. font-size: var(--font-size-14);
  5784. margin-bottom: 0;
  5785. padding: 2px 0;
  5786. }
  5787. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group button {
  5788. border: none;
  5789. flex: 0;
  5790. gap: 2px;
  5791. height: 1.25rem;
  5792. line-height: unset;
  5793. margin: 0;
  5794. padding: 0 0.5em;
  5795. white-space: nowrap;
  5796. }
  5797. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group button:not(:disabled):hover {
  5798. box-shadow: none;
  5799. text-shadow: 0 0 2px var(--text-light);
  5800. }
  5801. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options {
  5802. align-items: center;
  5803. display: flex;
  5804. font-size: var(--font-size-14);
  5805. gap: 2px;
  5806. justify-content: center;
  5807. padding: 0 3px;
  5808. }
  5809. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options .title {
  5810. text-transform: uppercase;
  5811. }
  5812. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button {
  5813. align-items: center;
  5814. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  5815. display: flex;
  5816. justify-content: center;
  5817. width: 3ch;
  5818. }
  5819. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button.selected {
  5820. background: var(--text-dark);
  5821. }
  5822. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button.selected > .icon {
  5823. color: var(--bg-dark);
  5824. }
  5825. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button:not(disabled):hover {
  5826. box-shadow: inset 0 0 0 1px rgba(94, 0, 0, 0.5);
  5827. text-shadow: none;
  5828. }
  5829. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group .versatile-options button:active {
  5830. text-shadow: 0 0 1px var(--primary);
  5831. }
  5832. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .alt-usage {
  5833. flex-basis: 100%;
  5834. margin-left: calc(3em - 2px);
  5835. position: relative;
  5836. }
  5837. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .alt-usage .alt-usage-icon {
  5838. border: none;
  5839. height: 1rem;
  5840. position: absolute;
  5841. left: -1.5em;
  5842. top: 0.2em;
  5843. }
  5844. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo,
  5845. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions {
  5846. margin-left: 2.5rem;
  5847. }
  5848. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo {
  5849. align-items: center;
  5850. display: flex;
  5851. gap: 3px;
  5852. margin-bottom: 2px;
  5853. }
  5854. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo select.linked {
  5855. font: normal var(--font-size-12) var(--sans-serif);
  5856. line-height: var(--font-size-12);
  5857. padding-top: 3px;
  5858. width: fit-content;
  5859. }
  5860. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo select.linked[data-compatible=false] {
  5861. color: rgba(255, 255, 255, 0.6);
  5862. }
  5863. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo select.linked option,
  5864. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo select.linked optgroup {
  5865. color: var(--text-light);
  5866. }
  5867. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo .magazine {
  5868. margin-right: 0.5rem;
  5869. font-family: var(--sans-serif);
  5870. font-weight: 600;
  5871. }
  5872. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo .magazine .icon {
  5873. display: inline-block;
  5874. width: 0.9rem;
  5875. height: 0.9rem;
  5876. background-image: url("../assets/icons/heavy-bullets.svg");
  5877. background-size: cover;
  5878. }
  5879. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions {
  5880. display: flex;
  5881. gap: 3px;
  5882. }
  5883. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions button select.modular {
  5884. appearance: auto;
  5885. background: none;
  5886. color: var(--text-dark);
  5887. cursor: default;
  5888. font: inherit;
  5889. margin-left: 0.5em;
  5890. padding: 0.15em 0.2em;
  5891. text-transform: uppercase;
  5892. }
  5893. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions button select.modular option {
  5894. background: var(--bg-dark);
  5895. }
  5896. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .auxiliary-actions button:has(select.modular:hover) {
  5897. text-shadow: none;
  5898. }
  5899. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .action-name {
  5900. justify-content: space-between;
  5901. }
  5902. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike:not(.ready) .auxiliary-actions {
  5903. justify-content: right;
  5904. }
  5905. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-image:hover {
  5906. background: none;
  5907. }
  5908. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .tracking {
  5909. align-items: center;
  5910. display: flex;
  5911. flex-direction: row;
  5912. flex-wrap: nowrap;
  5913. margin-left: auto;
  5914. margin-right: 1rem;
  5915. }
  5916. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .tracking input {
  5917. width: 0;
  5918. flex: 0 1 4rem;
  5919. text-align: center;
  5920. }
  5921. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .tracking span {
  5922. white-space: nowrap;
  5923. }
  5924. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions h4 {
  5925. flex: 1;
  5926. }
  5927. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate {
  5928. background: none;
  5929. border: 1px solid var(--color-border-dark);
  5930. border-radius: 5px;
  5931. flex: 0;
  5932. line-height: 1.25em;
  5933. opacity: 0.7;
  5934. margin-right: 0.5rem;
  5935. padding: 0 0.25rem;
  5936. }
  5937. .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 {
  5938. background-color: var(--primary);
  5939. color: var(--text-light);
  5940. opacity: 1;
  5941. }
  5942. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .item-controls {
  5943. display: flex;
  5944. min-width: 2.5em;
  5945. justify-content: end;
  5946. }
  5947. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list {
  5948. gap: 0.2em;
  5949. padding-bottom: 1em;
  5950. }
  5951. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item {
  5952. display: flex;
  5953. flex-wrap: wrap;
  5954. align-items: center;
  5955. justify-content: space-between;
  5956. padding: 2px 4px 2px 12px;
  5957. width: 100%;
  5958. }
  5959. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item p:empty {
  5960. display: none;
  5961. }
  5962. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-name {
  5963. display: flex;
  5964. align-items: center;
  5965. flex: 1;
  5966. }
  5967. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-name h4 {
  5968. cursor: pointer;
  5969. margin: 0;
  5970. }
  5971. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-name .item-image {
  5972. margin-right: 8px;
  5973. }
  5974. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-controls {
  5975. display: flex;
  5976. flex: 0;
  5977. font-size: var(--font-size-12);
  5978. gap: 1px;
  5979. white-space: nowrap;
  5980. }
  5981. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-controls a.info-only:hover {
  5982. cursor: default;
  5983. text-shadow: none;
  5984. }
  5985. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-controls a + a {
  5986. margin-left: 4px;
  5987. }
  5988. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary {
  5989. flex-basis: 100%;
  5990. }
  5991. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item.unidentified {
  5992. border-radius: 1px;
  5993. outline: 1px dotted rgba(75, 74, 68, 0.5);
  5994. background: var(--visibility-gm-bg);
  5995. }
  5996. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .button-group {
  5997. display: flex;
  5998. justify-content: flex-end;
  5999. align-items: center;
  6000. flex-wrap: nowrap;
  6001. width: 50%;
  6002. flex: 0;
  6003. }
  6004. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .button-group button {
  6005. margin: 0;
  6006. border: none;
  6007. cursor: pointer;
  6008. font-family: var(--sans-serif);
  6009. font-size: var(--font-size-10);
  6010. text-transform: uppercase;
  6011. letter-spacing: 0.05em;
  6012. text-rendering: optimizeLegibility;
  6013. padding: 5px;
  6014. color: var(--text-light);
  6015. width: 70px;
  6016. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  6017. background: var(--secondary);
  6018. border-radius: 2px;
  6019. flex: 0;
  6020. white-space: nowrap;
  6021. margin-left: 4px;
  6022. flex: 0;
  6023. }
  6024. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .button-group button:hover {
  6025. box-shadow: none;
  6026. text-shadow: 0 0 2px white;
  6027. }
  6028. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item {
  6029. border-top: 1px solid #d5cac1;
  6030. border: solid transparent;
  6031. border-width: 0 0 1px;
  6032. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  6033. }
  6034. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item:last-child {
  6035. border-bottom: none;
  6036. }
  6037. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item-name h4 {
  6038. font-family: var(--serif);
  6039. }
  6040. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry {
  6041. align-items: center;
  6042. display: flex;
  6043. flex-wrap: wrap;
  6044. margin-bottom: 0.25em;
  6045. padding-bottom: 1em;
  6046. }
  6047. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry:first-child .action-header {
  6048. justify-content: start;
  6049. }
  6050. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable .d20-svg {
  6051. width: var(--font-size-14);
  6052. height: var(--font-size-14);
  6053. }
  6054. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable .d20-svg path {
  6055. fill: black;
  6056. }
  6057. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable:hover svg {
  6058. animation: rotation 2s infinite linear;
  6059. }
  6060. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data {
  6061. align-items: center;
  6062. display: flex;
  6063. flex: 1;
  6064. gap: 1rem;
  6065. margin: 0.5em 0.25rem;
  6066. }
  6067. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data section {
  6068. display: flex;
  6069. align-items: center;
  6070. }
  6071. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .rollable {
  6072. cursor: pointer;
  6073. }
  6074. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data button {
  6075. width: auto;
  6076. line-height: 1.5em;
  6077. padding-top: 1px;
  6078. margin-bottom: 1px;
  6079. }
  6080. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data button i {
  6081. font-size: 0.9em;
  6082. }
  6083. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .skill-score {
  6084. font-family: var(--serif);
  6085. font-weight: bold;
  6086. font-size: 1rem;
  6087. letter-spacing: -1px;
  6088. line-height: 1;
  6089. color: var(--secondary);
  6090. }
  6091. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values {
  6092. display: flex;
  6093. gap: 0.5rem;
  6094. }
  6095. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values .skill-data {
  6096. display: flex;
  6097. gap: 0.25rem;
  6098. white-space: nowrap;
  6099. }
  6100. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values h4 {
  6101. white-space: nowrap;
  6102. }
  6103. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values .rollable {
  6104. gap: 0.1rem;
  6105. }
  6106. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool {
  6107. cursor: pointer;
  6108. gap: 0.25em;
  6109. position: relative;
  6110. }
  6111. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool img.pool-size {
  6112. border: none;
  6113. width: 34px;
  6114. height: 32px;
  6115. }
  6116. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool .pips {
  6117. display: flex;
  6118. font-size: var(--font-size-10);
  6119. gap: 1px;
  6120. }
  6121. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool .pips i {
  6122. padding-bottom: 0.08rem;
  6123. }
  6124. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool h4 {
  6125. white-space: nowrap;
  6126. }
  6127. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .spell-ability {
  6128. gap: 0.5em;
  6129. margin-left: auto;
  6130. }
  6131. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .spell-ability .spell-tradition {
  6132. font-family: var(--body-serif);
  6133. font-weight: 600;
  6134. }
  6135. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .pf-rank {
  6136. margin-bottom: 0.13rem;
  6137. }
  6138. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellbook-empty {
  6139. margin: 8px 0;
  6140. background: none;
  6141. border: none;
  6142. }
  6143. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .pf-add-item-row {
  6144. grid-column: span 4;
  6145. text-align: center;
  6146. width: 100%;
  6147. display: flex;
  6148. justify-content: space-evenly;
  6149. }
  6150. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .pf-add-item-row a {
  6151. width: 100%;
  6152. margin-bottom: 12px;
  6153. }
  6154. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane {
  6155. margin: 0;
  6156. padding: 0;
  6157. }
  6158. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies h1,
  6159. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies h4,
  6160. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies h6 {
  6161. margin: 0;
  6162. padding: 0;
  6163. line-height: 1;
  6164. display: flex;
  6165. align-items: center;
  6166. }
  6167. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies h6 {
  6168. padding: 2px 4px;
  6169. border-radius: 2px;
  6170. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  6171. font-family: var(--sans-serif);
  6172. font-size: var(--font-size-10);
  6173. text-transform: uppercase;
  6174. letter-spacing: 0.05em;
  6175. text-rendering: optimizeLegibility;
  6176. color: var(--text-light);
  6177. display: flex;
  6178. justify-content: center;
  6179. align-items: center;
  6180. cursor: pointer;
  6181. }
  6182. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .core-title {
  6183. width: 100%;
  6184. text-align: left;
  6185. margin: 0;
  6186. padding: 0;
  6187. margin-left: 0;
  6188. padding-top: 10px;
  6189. padding-left: 12px;
  6190. height: 43px;
  6191. border: none;
  6192. color: var(--text-light);
  6193. font-family: var(--serif);
  6194. }
  6195. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list,
  6196. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list,
  6197. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list {
  6198. list-style: none;
  6199. margin: 0;
  6200. padding: 0;
  6201. display: grid;
  6202. grid-template-columns: repeat(2, 1fr);
  6203. gap: 12px;
  6204. align-items: center;
  6205. margin-bottom: 2em;
  6206. }
  6207. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill,
  6208. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill,
  6209. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill {
  6210. border-image-repeat: repeat;
  6211. border-image-slice: 11;
  6212. border-image-source: url("../assets/sheet/frame-elegant.svg");
  6213. border-image-width: 14px;
  6214. border-style: double;
  6215. padding: 2px 15px 2px 4px;
  6216. display: flex;
  6217. align-items: center;
  6218. }
  6219. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .rollable,
  6220. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .rollable,
  6221. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .rollable {
  6222. cursor: pointer;
  6223. }
  6224. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .rollable:hover,
  6225. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .rollable:hover,
  6226. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .rollable:hover {
  6227. color: var(--primary);
  6228. text-shadow: 0 0 2px white;
  6229. }
  6230. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .rollable:hover .skill-score,
  6231. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .rollable:hover .skill-score,
  6232. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .rollable:hover .skill-score {
  6233. text-decoration: underline;
  6234. }
  6235. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .skill-score,
  6236. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .skill-score,
  6237. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .skill-score {
  6238. color: var(--primary);
  6239. font-family: var(--serif);
  6240. font-size: var(--font-size-24);
  6241. font-weight: 600;
  6242. line-height: 1;
  6243. text-align: end;
  6244. margin-right: 4px;
  6245. width: 2.5rem;
  6246. }
  6247. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .skill-name,
  6248. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .skill-name,
  6249. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .skill-name {
  6250. display: flex;
  6251. align-items: center;
  6252. flex: 1;
  6253. }
  6254. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .button-group,
  6255. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group,
  6256. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group {
  6257. display: flex;
  6258. align-items: center;
  6259. justify-content: center;
  6260. flex-wrap: wrap;
  6261. flex-direction: column;
  6262. }
  6263. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .button-group h6,
  6264. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group h6,
  6265. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group h6 {
  6266. margin: 1px 0;
  6267. background: var(--sub);
  6268. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
  6269. }
  6270. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .button-group h6:hover,
  6271. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group h6:hover,
  6272. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group h6:hover {
  6273. background: var(--primary);
  6274. }
  6275. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill.custom,
  6276. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill.custom,
  6277. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill.custom {
  6278. position: relative;
  6279. }
  6280. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill.custom a.delete,
  6281. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill.custom a.delete,
  6282. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill.custom a.delete {
  6283. position: absolute;
  6284. top: -8px;
  6285. right: -8px;
  6286. z-index: -1;
  6287. opacity: 0.75;
  6288. }
  6289. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill.custom a.delete:hover,
  6290. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill.custom a.delete:hover,
  6291. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill.custom a.delete:hover {
  6292. z-index: 1;
  6293. opacity: 1;
  6294. }
  6295. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill.custom:hover a.delete,
  6296. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill.custom:hover a.delete,
  6297. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill.custom:hover a.delete {
  6298. z-index: 1;
  6299. }
  6300. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill,
  6301. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill {
  6302. grid: "score name btn" min-content/42px 2fr 1fr;
  6303. padding: 2px 15px 2px 6px;
  6304. }
  6305. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input,
  6306. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input {
  6307. color: var(--text-dark);
  6308. border-bottom: 1px solid var(--sub);
  6309. margin-right: 4px;
  6310. font-weight: 600;
  6311. }
  6312. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input:hover,
  6313. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input:hover {
  6314. border: 1px solid var(--sub);
  6315. }
  6316. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group,
  6317. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group {
  6318. flex-direction: row;
  6319. flex-wrap: nowrap;
  6320. margin-left: auto;
  6321. }
  6322. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .button-group .item-controls,
  6323. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .button-group .item-controls {
  6324. font-size: var(--font-size-12);
  6325. margin-top: 1px;
  6326. margin-left: 0.5rem;
  6327. }
  6328. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list {
  6329. grid-template-columns: 1fr;
  6330. }
  6331. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list {
  6332. grid-template: repeat(2, 1fr);
  6333. }
  6334. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .item {
  6335. grid-column: 1/3;
  6336. }
  6337. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lore-header .item-controls {
  6338. white-space: nowrap;
  6339. color: var(--text-light);
  6340. font-family: var(--sans-serif);
  6341. font-size: var(--font-size-10);
  6342. text-transform: uppercase;
  6343. letter-spacing: 0.05em;
  6344. text-rendering: optimizeLegibility;
  6345. }
  6346. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lore-header .item-controls .item-control {
  6347. padding: 4px;
  6348. background: var(--secondary);
  6349. font-size: var(--font-size-10);
  6350. border-radius: 2px;
  6351. }
  6352. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats {
  6353. padding-bottom: 1em;
  6354. }
  6355. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-section {
  6356. padding-bottom: 1em;
  6357. }
  6358. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item {
  6359. display: grid;
  6360. grid: "name ctrl" min-content "content content" min-content/1fr min-content;
  6361. align-items: center;
  6362. padding: 2px 0;
  6363. }
  6364. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item:nth-child(odd) {
  6365. background-color: rgba(120, 100, 82, 0.1);
  6366. }
  6367. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name,
  6368. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-controls {
  6369. margin: 0;
  6370. }
  6371. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name {
  6372. align-items: center;
  6373. display: flex;
  6374. flex: 1;
  6375. grid-area: name;
  6376. height: calc(1.5rem + 2px);
  6377. width: 100%;
  6378. }
  6379. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .feat-slot-title {
  6380. display: flex;
  6381. font-family: var(--serif);
  6382. font-size: 1.1em;
  6383. font-weight: 600;
  6384. color: var(--secondary);
  6385. justify-content: center;
  6386. width: 20px;
  6387. margin-left: 6px;
  6388. }
  6389. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .item-placeholder {
  6390. margin-left: 40px;
  6391. margin-right: 4px;
  6392. }
  6393. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name h4 {
  6394. cursor: pointer;
  6395. font-family: var(--serif);
  6396. }
  6397. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name h4:hover {
  6398. color: var(--primary);
  6399. text-shadow: 0 0 3px var(--tertiary);
  6400. }
  6401. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .item-image {
  6402. margin-left: 8px;
  6403. margin-right: 8px;
  6404. }
  6405. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-controls {
  6406. align-items: center;
  6407. display: flex;
  6408. font-size: var(--font-size-12);
  6409. grid-area: ctrl;
  6410. height: 100%;
  6411. white-space: nowrap;
  6412. width: 100%;
  6413. }
  6414. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-controls a:last-child {
  6415. margin-right: 6px;
  6416. }
  6417. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-summary {
  6418. flex: 100%;
  6419. grid-area: content;
  6420. padding: 0 8px 8px;
  6421. margin: 4px 0 0 4px;
  6422. }
  6423. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items {
  6424. grid-column: span 2;
  6425. border-left: 3px dotted #786452;
  6426. display: flex;
  6427. margin: 1px 0 0 45px;
  6428. padding: 0;
  6429. flex-basis: 100%;
  6430. flex-direction: column;
  6431. }
  6432. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li {
  6433. align-items: center;
  6434. display: flex;
  6435. flex-wrap: wrap;
  6436. gap: 2px;
  6437. margin: 2px 0;
  6438. padding-bottom: 1px;
  6439. }
  6440. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li:last-child {
  6441. padding-bottom: 0;
  6442. }
  6443. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li .item-name .feat-slot-title {
  6444. width: 0;
  6445. }
  6446. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li .item-name img {
  6447. margin-left: 0;
  6448. }
  6449. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li .item-controls {
  6450. flex: 0;
  6451. }
  6452. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li ol.nested-items {
  6453. margin-left: 25px;
  6454. }
  6455. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography h3.header {
  6456. display: flex;
  6457. align-items: baseline;
  6458. justify-content: space-between;
  6459. padding: 0 1px;
  6460. }
  6461. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography h3.header a {
  6462. color: var(--color-text-dark-primary);
  6463. font-size: var(--font-size-12);
  6464. }
  6465. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography h3.header a i.fa-eye-slash {
  6466. opacity: 75%;
  6467. }
  6468. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.editable .editor-content,
  6469. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.editable input {
  6470. background: rgba(0, 0, 0, 0.05);
  6471. }
  6472. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.editable .editor-content {
  6473. min-height: 4rem;
  6474. }
  6475. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section:not(.editable) .editor-content {
  6476. min-height: 2rem;
  6477. }
  6478. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:disabled {
  6479. color: var(--text-dark);
  6480. }
  6481. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.appearance-details {
  6482. display: grid;
  6483. grid-template: "bio bio" 1fr "height weight" min-content/1fr 1fr;
  6484. }
  6485. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.appearance-details .bio {
  6486. grid-area: bio;
  6487. }
  6488. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.personality {
  6489. display: flex;
  6490. flex-wrap: wrap;
  6491. }
  6492. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.personality .bio {
  6493. display: flex;
  6494. flex-direction: column;
  6495. justify-content: flex-start;
  6496. align-items: flex-start;
  6497. flex: 50%;
  6498. margin-bottom: 8px;
  6499. }
  6500. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.personality .bio span {
  6501. width: 100%;
  6502. }
  6503. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section.campaign {
  6504. display: flex;
  6505. flex-direction: column;
  6506. gap: 0.5rem;
  6507. }
  6508. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input {
  6509. background: none;
  6510. border-bottom: 1px solid var(--color-border-input);
  6511. font-family: var(--body-serif);
  6512. width: calc(100% - 6px);
  6513. }
  6514. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input::placeholder {
  6515. filter: opacity(0.5);
  6516. color: var(--text-dark);
  6517. }
  6518. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:focus {
  6519. border-bottom: 1px solid #644f33;
  6520. }
  6521. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:focus::placeholder {
  6522. color: transparent;
  6523. }
  6524. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input[type=number] {
  6525. padding-bottom: 0;
  6526. padding-left: 4px;
  6527. }
  6528. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section hr {
  6529. margin: 10px 6px 10px 0;
  6530. }
  6531. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio h3 {
  6532. margin: 0;
  6533. padding: 0;
  6534. background-color: rgba(28, 28, 28, 0.1);
  6535. border: none;
  6536. color: var(--text-dark);
  6537. font: 700 var(--font-size-14) var(--body-serif);
  6538. grid-area: mod;
  6539. height: 26px;
  6540. padding: 8px 4px 6px;
  6541. width: calc(100% - 6px);
  6542. }
  6543. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio h3 i {
  6544. position: relative;
  6545. right: -2px;
  6546. top: -2px;
  6547. float: right;
  6548. }
  6549. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio h3 span.value {
  6550. display: inline-block;
  6551. max-width: 87%;
  6552. overflow: hidden;
  6553. text-overflow: ellipsis;
  6554. white-space: nowrap;
  6555. }
  6556. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio h4.details-label {
  6557. margin-bottom: 0;
  6558. width: 100%;
  6559. }
  6560. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content {
  6561. padding: 0 0 0.5rem;
  6562. /* Typography */
  6563. }
  6564. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h1,
  6565. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h2 {
  6566. font-family: var(--serif);
  6567. line-height: 1.1;
  6568. }
  6569. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h1 {
  6570. text-align: center;
  6571. font-size: 2.5em;
  6572. margin-bottom: 30px;
  6573. }
  6574. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h2 {
  6575. color: var(--secondary);
  6576. font-size: 2.25em;
  6577. }
  6578. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h3 {
  6579. font-size: 2em;
  6580. border-bottom: 0px;
  6581. }
  6582. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h4 {
  6583. color: var(--text-dark);
  6584. border-bottom: 1px solid var(--color-border-dark-primary);
  6585. margin-bottom: 0px;
  6586. text-transform: uppercase;
  6587. }
  6588. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h5 {
  6589. text-transform: uppercase;
  6590. }
  6591. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content h6 {
  6592. background-color: var(--header-bg);
  6593. color: var(--header-color);
  6594. margin-bottom: 5px;
  6595. padding-left: 8px;
  6596. padding-top: 5px;
  6597. padding-bottom: 3px;
  6598. font-size: 1.25em;
  6599. text-transform: uppercase;
  6600. border-radius: 12px 12px 0px 0px;
  6601. }
  6602. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content p,
  6603. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content p + p,
  6604. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content ul,
  6605. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content ol {
  6606. font-family: var(--body-serif);
  6607. }
  6608. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .editor-edit {
  6609. background: var(--primary);
  6610. color: var(--text-light);
  6611. }
  6612. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox.tox-tinymce {
  6613. height: 200px !important;
  6614. }
  6615. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-editor-container .tox-editor-header {
  6616. background: none;
  6617. }
  6618. .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 {
  6619. background-color: var(--secondary);
  6620. }
  6621. .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 {
  6622. background-color: var(--alt);
  6623. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);
  6624. }
  6625. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-tbtn {
  6626. color: #cdcdcd;
  6627. border-radius: 1px;
  6628. }
  6629. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-tbtn svg {
  6630. fill: #cdcdcd;
  6631. }
  6632. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-tbtn:hover {
  6633. background: var(--secondary);
  6634. color: var(--text-light);
  6635. }
  6636. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .tox .tox-tbtn:hover svg {
  6637. fill: white;
  6638. }
  6639. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section .bio .biography-content .editor .editor-content {
  6640. overflow-y: inherit;
  6641. padding: 0 0.25rem;
  6642. }
  6643. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory {
  6644. height: calc(100% - 40px);
  6645. }
  6646. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-list {
  6647. padding-right: 0.1rem;
  6648. }
  6649. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .item-controls {
  6650. flex: 0 0 100px;
  6651. }
  6652. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .wealth {
  6653. margin-bottom: 0.5rem;
  6654. }
  6655. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs {
  6656. gap: 0.2em;
  6657. }
  6658. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item {
  6659. display: flex;
  6660. flex-wrap: wrap;
  6661. align-items: center;
  6662. justify-content: space-between;
  6663. padding: 2px 4px 2px 12px;
  6664. width: 100%;
  6665. }
  6666. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item p:empty {
  6667. display: none;
  6668. }
  6669. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-name {
  6670. display: flex;
  6671. align-items: center;
  6672. flex: 1;
  6673. }
  6674. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-name h4 {
  6675. cursor: pointer;
  6676. margin: 0;
  6677. }
  6678. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-name .item-image {
  6679. margin-right: 8px;
  6680. }
  6681. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-controls {
  6682. display: flex;
  6683. flex: 0;
  6684. font-size: var(--font-size-12);
  6685. gap: 1px;
  6686. white-space: nowrap;
  6687. }
  6688. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-controls a.info-only:hover {
  6689. cursor: default;
  6690. text-shadow: none;
  6691. }
  6692. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-controls a + a {
  6693. margin-left: 4px;
  6694. }
  6695. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary {
  6696. flex-basis: 100%;
  6697. }
  6698. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item.unidentified {
  6699. border-radius: 1px;
  6700. outline: 1px dotted rgba(75, 74, 68, 0.5);
  6701. background: var(--visibility-gm-bg);
  6702. }
  6703. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .button-group {
  6704. display: flex;
  6705. justify-content: flex-end;
  6706. align-items: center;
  6707. flex-wrap: nowrap;
  6708. width: 50%;
  6709. flex: 0;
  6710. }
  6711. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .button-group button {
  6712. margin: 0;
  6713. border: none;
  6714. cursor: pointer;
  6715. font-family: var(--sans-serif);
  6716. font-size: var(--font-size-10);
  6717. text-transform: uppercase;
  6718. letter-spacing: 0.05em;
  6719. text-rendering: optimizeLegibility;
  6720. padding: 5px;
  6721. color: var(--text-light);
  6722. width: 70px;
  6723. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  6724. background: var(--secondary);
  6725. border-radius: 2px;
  6726. flex: 0;
  6727. white-space: nowrap;
  6728. margin-left: 4px;
  6729. flex: 0;
  6730. }
  6731. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .button-group button:hover {
  6732. box-shadow: none;
  6733. text-shadow: 0 0 2px white;
  6734. }
  6735. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section {
  6736. display: flex;
  6737. flex-direction: column;
  6738. gap: 0.25em;
  6739. margin: 0.75rem 0;
  6740. }
  6741. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section:first-child {
  6742. margin-top: 0.25rem;
  6743. }
  6744. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play {
  6745. align-items: center;
  6746. display: grid;
  6747. grid-template-columns: 6em 1em 4em;
  6748. }
  6749. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play > * {
  6750. width: 100%;
  6751. }
  6752. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play input {
  6753. text-align: center;
  6754. }
  6755. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play .dash {
  6756. font-weight: bold;
  6757. text-align: center;
  6758. }
  6759. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play label.player-number {
  6760. grid-column: span 2;
  6761. }
  6762. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump {
  6763. align-items: center;
  6764. flex-direction: row;
  6765. }
  6766. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle {
  6767. width: 42px;
  6768. height: 1rem;
  6769. background: rgba(0, 0, 0, 0.5);
  6770. position: relative;
  6771. border-radius: 50px;
  6772. box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2);
  6773. }
  6774. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle.enabled {
  6775. background: var(--secondary);
  6776. }
  6777. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle::after {
  6778. content: "OFF";
  6779. color: var(--text-dark);
  6780. position: absolute;
  6781. right: 5px;
  6782. z-index: 0;
  6783. text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15);
  6784. }
  6785. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle::before {
  6786. content: "ON";
  6787. color: var(--text-light);
  6788. position: absolute;
  6789. left: 6px;
  6790. z-index: 0;
  6791. }
  6792. .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 {
  6793. font-family: var(--sans-serif);
  6794. font-size: var(--font-size-10);
  6795. text-transform: uppercase;
  6796. letter-spacing: 0.05em;
  6797. text-rendering: optimizeLegibility;
  6798. top: 4px;
  6799. }
  6800. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle label {
  6801. display: block;
  6802. width: 18px;
  6803. height: 14px;
  6804. position: absolute;
  6805. top: 1px;
  6806. right: 20px;
  6807. cursor: pointer;
  6808. background: #fcfff4;
  6809. z-index: 1;
  6810. background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  6811. border-radius: 50%;
  6812. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0px 2px 5px 0px rgba(0, 0, 0, 0.3);
  6813. transition: all 0.4s ease;
  6814. }
  6815. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle input[type=checkbox] {
  6816. visibility: hidden;
  6817. }
  6818. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle input[type=checkbox]:checked + label {
  6819. right: 1px;
  6820. }
  6821. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.faction {
  6822. max-width: fit-content;
  6823. }
  6824. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.reputations {
  6825. font-family: var(--serif);
  6826. gap: 0.2em;
  6827. }
  6828. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.reputations .reputation {
  6829. align-items: center;
  6830. display: flex;
  6831. gap: 0.2em;
  6832. justify-content: space-between;
  6833. width: 12em;
  6834. }
  6835. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.reputations .reputation input {
  6836. padding: 0 0.3em;
  6837. text-align: right;
  6838. width: 3em;
  6839. }
  6840. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options {
  6841. display: flex;
  6842. flex-wrap: wrap;
  6843. margin: 0 1rem 1rem;
  6844. padding: 0.5rem 1rem;
  6845. border-image-repeat: repeat;
  6846. border-image-slice: 11;
  6847. border-image-source: url("../assets/sheet/frame-elegant.svg");
  6848. border-image-width: 14px;
  6849. border-style: double;
  6850. }
  6851. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options .crafting-option {
  6852. display: flex;
  6853. align-items: center;
  6854. width: 100%;
  6855. }
  6856. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options .crafting-option label * {
  6857. vertical-align: middle;
  6858. }
  6859. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options .crafting-option label input {
  6860. margin: 0;
  6861. padding: 0;
  6862. }
  6863. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas,
  6864. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry {
  6865. display: flex;
  6866. flex-wrap: wrap;
  6867. justify-content: space-evenly;
  6868. align-items: center;
  6869. background: none;
  6870. border: none;
  6871. }
  6872. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas.item-container,
  6873. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry.item-container {
  6874. margin-bottom: 0.5em;
  6875. }
  6876. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas.alchemical-entry,
  6877. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry.alchemical-entry {
  6878. margin-bottom: 0;
  6879. }
  6880. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas.alchemical-entry:last-child,
  6881. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry.alchemical-entry:last-child {
  6882. margin-bottom: 0.5em;
  6883. }
  6884. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas:first-child .action-header,
  6885. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry:first-child .action-header {
  6886. margin-top: 0;
  6887. }
  6888. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header .item-controls .toggle-free-crafting,
  6889. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header .item-controls .toggle-free-crafting {
  6890. display: flex;
  6891. align-items: center;
  6892. justify-content: flex-end;
  6893. }
  6894. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header .item-controls .toggle-free-crafting *,
  6895. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header .item-controls .toggle-free-crafting * {
  6896. flex: 1 0 auto;
  6897. }
  6898. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header .item-controls .toggle-free-crafting input[type=checkbox],
  6899. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header .item-controls .toggle-free-crafting input[type=checkbox] {
  6900. height: 1em;
  6901. width: 1em;
  6902. }
  6903. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header.alchemical-title,
  6904. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header.alchemical-title {
  6905. background: var(--secondary);
  6906. }
  6907. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list,
  6908. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list {
  6909. margin: 0;
  6910. padding: 0;
  6911. width: 100%;
  6912. flex-basis: 100%;
  6913. position: relative;
  6914. z-index: 1;
  6915. }
  6916. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item[data-expended-state=true] h4,
  6917. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item[data-expended-state=true] h4 {
  6918. color: var(--color-disabled);
  6919. text-decoration: line-through;
  6920. }
  6921. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item[data-expended-state=true] .toggle-formula-expended,
  6922. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item[data-expended-state=true] .toggle-formula-expended {
  6923. color: var(--primary);
  6924. }
  6925. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header,
  6926. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item,
  6927. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header,
  6928. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item {
  6929. display: grid;
  6930. grid: "name dc price quantity controls" 1fr/4fr 0.7fr 1fr 1fr 1fr;
  6931. align-items: center;
  6932. justify-items: center;
  6933. margin: 0;
  6934. padding: 0;
  6935. background: none;
  6936. border: none;
  6937. border-left: 1px solid var(--sub);
  6938. border-right: 1px solid var(--sub);
  6939. cursor: default;
  6940. }
  6941. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header:nth-child(odd),
  6942. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item:nth-child(odd),
  6943. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header:nth-child(odd),
  6944. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item:nth-child(odd) {
  6945. background-color: rgba(120, 100, 82, 0.1);
  6946. }
  6947. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header:last-child,
  6948. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item:last-child,
  6949. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header:last-child,
  6950. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item:last-child {
  6951. border-bottom: 1px solid var(--sub);
  6952. }
  6953. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header:last-child .item-image,
  6954. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item:last-child .item-image,
  6955. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header:last-child .item-image,
  6956. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item:last-child .item-image {
  6957. margin-bottom: 0;
  6958. margin-top: 2px;
  6959. }
  6960. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header,
  6961. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header,
  6962. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header,
  6963. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header {
  6964. background: rgba(96, 88, 86, 0.25);
  6965. border: 1px solid var(--sub);
  6966. padding: 4px;
  6967. color: var(--text-dark);
  6968. font: 600 var(--font-size-12) var(--sans-serif);
  6969. line-height: 1;
  6970. letter-spacing: 0.25px;
  6971. margin: 0;
  6972. }
  6973. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header h3,
  6974. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header h3,
  6975. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header h3,
  6976. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header h3 {
  6977. text-transform: capitalize;
  6978. font-size: var(--font-size-12);
  6979. margin-left: 0;
  6980. padding: 4px 0;
  6981. }
  6982. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header .level-name,
  6983. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header .level-name,
  6984. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header .level-name,
  6985. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header .level-name {
  6986. line-height: 1;
  6987. gap: 0.5em;
  6988. }
  6989. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header .level-name h3,
  6990. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header .level-name h3,
  6991. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header .level-name h3,
  6992. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header .level-name h3 {
  6993. margin: 0;
  6994. padding: 0;
  6995. }
  6996. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header .formula-number,
  6997. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header .formula-number,
  6998. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header .formula-number,
  6999. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header .formula-number {
  7000. background: var(--alt);
  7001. border: 1px solid var(--sub);
  7002. border-radius: 3px;
  7003. color: var(--text-light);
  7004. font-size: var(--font-size-11);
  7005. height: 14px;
  7006. max-width: 22px;
  7007. padding-top: 2px;
  7008. text-align: center;
  7009. width: 22px;
  7010. }
  7011. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header input.formula-number,
  7012. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header input.formula-number,
  7013. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header input.formula-number,
  7014. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header input.formula-number {
  7015. background: var(--alt-dark);
  7016. }
  7017. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name,
  7018. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name,
  7019. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name,
  7020. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name {
  7021. cursor: pointer;
  7022. min-height: 28px;
  7023. }
  7024. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name,
  7025. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name,
  7026. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name,
  7027. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name,
  7028. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name,
  7029. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name,
  7030. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name,
  7031. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name {
  7032. justify-self: start;
  7033. display: flex;
  7034. align-items: center;
  7035. justify-content: flex-start;
  7036. flex-wrap: nowrap;
  7037. line-height: 1.5;
  7038. flex-basis: 50%;
  7039. }
  7040. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name h3,
  7041. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name h3,
  7042. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name h3,
  7043. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name h3,
  7044. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name h3,
  7045. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name h3,
  7046. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name h3,
  7047. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name h3 {
  7048. white-space: nowrap;
  7049. }
  7050. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name + span:not(.flex0),
  7051. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name + span:not(.flex0),
  7052. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name + span:not(.flex0),
  7053. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name + span:not(.flex0),
  7054. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name + span:not(.flex0),
  7055. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name + span:not(.flex0),
  7056. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name + span:not(.flex0),
  7057. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name + span:not(.flex0) {
  7058. font-size: var(--font-size-12);
  7059. }
  7060. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name .item-image,
  7061. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name .item-image,
  7062. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name .item-image,
  7063. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name .item-image,
  7064. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name .item-image,
  7065. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name .item-image,
  7066. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name .item-image,
  7067. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name .item-image {
  7068. margin: 2px 0;
  7069. margin-left: 4px;
  7070. }
  7071. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name h4,
  7072. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name h4,
  7073. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name h4,
  7074. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name h4,
  7075. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name h4,
  7076. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name h4,
  7077. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name h4,
  7078. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name h4 {
  7079. margin: 0;
  7080. padding: 0;
  7081. margin-left: 8px;
  7082. line-height: 1;
  7083. letter-spacing: -0.075em;
  7084. }
  7085. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name h4:hover,
  7086. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name h4:hover,
  7087. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name h4:hover,
  7088. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name h4:hover,
  7089. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name h4:hover,
  7090. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name h4:hover,
  7091. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name h4:hover,
  7092. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name h4:hover {
  7093. color: var(--secondary);
  7094. }
  7095. .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,
  7096. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name.aa-level,
  7097. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name.reagent-resource,
  7098. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name.aa-level,
  7099. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name.reagent-resource,
  7100. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name.aa-level,
  7101. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name.reagent-resource,
  7102. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name.aa-level,
  7103. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name.reagent-resource,
  7104. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name.aa-level,
  7105. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name.reagent-resource,
  7106. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name.aa-level,
  7107. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name.reagent-resource,
  7108. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name.aa-level,
  7109. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name.reagent-resource {
  7110. justify-content: flex-end;
  7111. }
  7112. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-controls,
  7113. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-controls,
  7114. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-controls,
  7115. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-controls {
  7116. justify-self: end;
  7117. font-size: var(--font-size-12);
  7118. margin-right: 4px;
  7119. }
  7120. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-controls .item-control.disabled,
  7121. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-controls .item-control.disabled,
  7122. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-controls .item-control.disabled,
  7123. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-controls .item-control.disabled {
  7124. opacity: 0.3;
  7125. }
  7126. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-summary,
  7127. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-summary,
  7128. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-summary,
  7129. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-summary {
  7130. grid-column: 1/6;
  7131. padding: 8px;
  7132. border-bottom: 1px solid var(--sub);
  7133. border-top: 1px solid #aca5a3;
  7134. background-color: var(--bg);
  7135. }
  7136. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-summary p,
  7137. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-summary p,
  7138. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-summary p,
  7139. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-summary p {
  7140. margin-top: 0;
  7141. }
  7142. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-summary .item-buttons button,
  7143. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-summary .item-buttons button,
  7144. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-summary .item-buttons button,
  7145. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-summary .item-buttons button {
  7146. display: none;
  7147. }
  7148. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity,
  7149. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity,
  7150. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity,
  7151. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity {
  7152. align-items: center;
  7153. display: flex;
  7154. gap: 3px;
  7155. justify-content: center;
  7156. }
  7157. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity .adjust,
  7158. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity .adjust,
  7159. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity .adjust,
  7160. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity .adjust {
  7161. align-items: center;
  7162. display: flex;
  7163. font-size: var(--font-size-16);
  7164. font-family: var(--sans-serif-monospace);
  7165. justify-content: center;
  7166. width: 1em;
  7167. }
  7168. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity input,
  7169. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity input,
  7170. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity input,
  7171. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity input {
  7172. width: 1.5rem;
  7173. text-align: center;
  7174. }
  7175. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .empty,
  7176. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .empty {
  7177. align-items: center;
  7178. display: flex;
  7179. justify-content: space-between;
  7180. min-height: 28px;
  7181. }
  7182. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .empty > *,
  7183. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .empty > * {
  7184. white-space: nowrap;
  7185. }
  7186. .actor.sheet.character .crb-style .sheet-body .sheet-content .directory-list {
  7187. margin: 0;
  7188. padding: 0;
  7189. display: flex;
  7190. flex-direction: column;
  7191. list-style: none;
  7192. width: 100%;
  7193. }
  7194. .actor.sheet.character .crb-style .sheet-body .sheet-content .directory-list h4 {
  7195. margin: 0;
  7196. padding: 0;
  7197. }
  7198. .actor.sheet.character .crb-style .sheet-body .sheet-content .directory-list .item ol {
  7199. list-style: none;
  7200. }
  7201. .actor.sheet.character .crb-style .sheet-body .sheet-content .blue-button {
  7202. align-items: center;
  7203. background: var(--secondary);
  7204. border: black;
  7205. border-radius: 2px;
  7206. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  7207. color: var(--text-light);
  7208. display: flex;
  7209. font-family: var(--serif);
  7210. font-weight: 500;
  7211. gap: 0.25em;
  7212. line-height: 1.8em;
  7213. justify-content: center;
  7214. margin: 0;
  7215. padding: 0 0.5em;
  7216. }
  7217. .actor.sheet.character .crb-style .sheet-body .sheet-content .blue-button:hover {
  7218. text-shadow: 0 0 4px white;
  7219. }
  7220. .actor.sheet.vehicle .crb-style .sheet-navigation {
  7221. min-width: 375px;
  7222. }
  7223. .actor.sheet.vehicle .crb-style aside .sidebar .save-roll input[type=number] {
  7224. width: 3ch;
  7225. font-size: var(--font-size-20);
  7226. height: 24px;
  7227. }
  7228. .actor.sheet.vehicle .crb-style aside .sidebar .hitpoints .container {
  7229. display: grid;
  7230. }
  7231. .actor.sheet.vehicle .crb-style aside .sidebar .armor-class {
  7232. grid: "ac hardness" 1fr;
  7233. }
  7234. .actor.sheet.vehicle .crb-style aside .sidebar .armor-class .shield {
  7235. padding: 18px 20px 0 20px;
  7236. }
  7237. .actor.sheet.vehicle .crb-style aside .sidebar .armor-class .hardness {
  7238. background: url("../assets/sheet/shield-red.webp") no-repeat top center;
  7239. }
  7240. .actor.sheet.vehicle .crb-style aside .sidebar li.tag {
  7241. font-size: var(--font-size-10);
  7242. }
  7243. .actor.sheet.vehicle .crb-style header.char-header .tags select {
  7244. font-family: var(--sans-serif);
  7245. font-size: var(--font-size-12);
  7246. text-transform: uppercase;
  7247. }
  7248. .actor.sheet.vehicle .crb-style header.char-header .char-details {
  7249. font-size: var(--font-size-13);
  7250. font-weight: normal;
  7251. }
  7252. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab:not(.inventory),
  7253. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab .inventory .inventory-list {
  7254. overflow: hidden scroll;
  7255. flex-grow: 1;
  7256. overflow: hidden scroll;
  7257. }
  7258. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.actions ol.actions-list li.action .icon {
  7259. height: var(--font-size-18);
  7260. width: var(--font-size-18);
  7261. }
  7262. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details {
  7263. display: grid;
  7264. grid: "img details" 1fr/120px 1fr;
  7265. min-width: 330px;
  7266. }
  7267. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .frame {
  7268. margin-left: 5px;
  7269. }
  7270. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .frame .actor-image {
  7271. margin-top: 8px;
  7272. max-height: 90%;
  7273. object-fit: contain;
  7274. border-radius: 0;
  7275. border: none;
  7276. 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;
  7277. }
  7278. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .image-container [data-action=show-image] {
  7279. bottom: 3px;
  7280. right: 1px;
  7281. }
  7282. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .detail-sheet {
  7283. display: grid;
  7284. grid: repeat(2, 42px)/3fr 2fr;
  7285. grid-row-gap: 8px;
  7286. padding-left: 12px;
  7287. }
  7288. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-details .detail-small {
  7289. display: flex;
  7290. }
  7291. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-properties {
  7292. display: flex;
  7293. flex-wrap: wrap;
  7294. padding-top: 8px;
  7295. }
  7296. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-properties > div {
  7297. display: flex;
  7298. flex-direction: column;
  7299. justify-content: flex-start;
  7300. align-items: flex-start;
  7301. margin-bottom: 8px;
  7302. }
  7303. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .vehicle-properties > div > span {
  7304. width: 100%;
  7305. }
  7306. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.details .detailsInput {
  7307. margin-bottom: 8px;
  7308. }
  7309. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list {
  7310. gap: 0.2em;
  7311. padding-bottom: 1em;
  7312. }
  7313. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item {
  7314. display: flex;
  7315. flex-wrap: wrap;
  7316. align-items: center;
  7317. justify-content: space-between;
  7318. padding: 2px 4px 2px 12px;
  7319. width: 100%;
  7320. }
  7321. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item p:empty {
  7322. display: none;
  7323. }
  7324. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-name {
  7325. display: flex;
  7326. align-items: center;
  7327. flex: 1;
  7328. }
  7329. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-name h4 {
  7330. cursor: pointer;
  7331. margin: 0;
  7332. }
  7333. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-name .item-image {
  7334. margin-right: 8px;
  7335. }
  7336. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-controls {
  7337. display: flex;
  7338. flex: 0;
  7339. font-size: var(--font-size-12);
  7340. gap: 1px;
  7341. white-space: nowrap;
  7342. }
  7343. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-controls a.info-only:hover {
  7344. cursor: default;
  7345. text-shadow: none;
  7346. }
  7347. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-controls a + a {
  7348. margin-left: 4px;
  7349. }
  7350. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .item-summary {
  7351. flex-basis: 100%;
  7352. }
  7353. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item.unidentified {
  7354. border-radius: 1px;
  7355. outline: 1px dotted rgba(75, 74, 68, 0.5);
  7356. background: var(--visibility-gm-bg);
  7357. }
  7358. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .button-group {
  7359. display: flex;
  7360. justify-content: flex-end;
  7361. align-items: center;
  7362. flex-wrap: nowrap;
  7363. width: 50%;
  7364. flex: 0;
  7365. }
  7366. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .button-group button {
  7367. margin: 0;
  7368. border: none;
  7369. cursor: pointer;
  7370. font-family: var(--sans-serif);
  7371. font-size: var(--font-size-10);
  7372. text-transform: uppercase;
  7373. letter-spacing: 0.05em;
  7374. text-rendering: optimizeLegibility;
  7375. padding: 5px;
  7376. color: var(--text-light);
  7377. width: 70px;
  7378. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  7379. background: var(--secondary);
  7380. border-radius: 2px;
  7381. flex: 0;
  7382. white-space: nowrap;
  7383. margin-left: 4px;
  7384. flex: 0;
  7385. }
  7386. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item .button-group button:hover {
  7387. box-shadow: none;
  7388. text-shadow: 0 0 2px white;
  7389. }
  7390. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item {
  7391. border-top: 1px solid #d5cac1;
  7392. border: solid transparent;
  7393. border-width: 0 0 1px;
  7394. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  7395. }
  7396. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item-image {
  7397. border-radius: 2px;
  7398. }
  7399. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item:last-child {
  7400. border-bottom: none;
  7401. }
  7402. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects.effects .effects-list .item-name h4 {
  7403. font-family: var(--serif);
  7404. }
  7405. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects h3.header {
  7406. position: relative;
  7407. margin-top: 0.75em;
  7408. font-size: var(--font-size-16);
  7409. font-family: var(--serif);
  7410. font-weight: 600;
  7411. color: var(--primary);
  7412. line-height: 1;
  7413. border-bottom: 1px solid var(--color-border-divider);
  7414. }
  7415. .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 {
  7416. position: absolute;
  7417. bottom: -1px;
  7418. right: 0;
  7419. }
  7420. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects h3.header .controls {
  7421. display: flex;
  7422. }
  7423. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects h3.header button {
  7424. background: transparent;
  7425. border-radius: 2px 2px 0 0;
  7426. border: 1px solid var(--color-border-divider);
  7427. color: var(--primary);
  7428. cursor: pointer;
  7429. font-family: var(--sans-serif);
  7430. font-size: var(--font-size-12);
  7431. font-weight: 500;
  7432. height: 20px;
  7433. line-height: var(--font-size-12);
  7434. margin: 0;
  7435. outline: none;
  7436. text-transform: uppercase;
  7437. width: auto;
  7438. }
  7439. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects ol.directory-list {
  7440. margin: 0;
  7441. padding: 0;
  7442. display: flex;
  7443. flex-direction: column;
  7444. list-style: none;
  7445. width: 100%;
  7446. }
  7447. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects ol.directory-list h4 {
  7448. margin: 0;
  7449. padding: 0;
  7450. }
  7451. .actor.sheet.vehicle .crb-style .sheet-body .sheet-content > .tab.effects ol.directory-list .item ol {
  7452. list-style: none;
  7453. }
  7454. .actor.sheet.vehicle .crb-style input.adjustable:not(:focus).adjusted-higher,
  7455. .actor.sheet.vehicle .crb-style span.adjustable.adjusted-higher {
  7456. color: #009988;
  7457. }
  7458. .actor.sheet.vehicle .crb-style input.adjustable:not(:focus).adjusted-lower,
  7459. .actor.sheet.vehicle .crb-style span.adjustable.adjusted-lower {
  7460. color: #cc3311;
  7461. }
  7462. .actor.sheet.vehicle .crb-style .inventory {
  7463. margin-bottom: 0.6rem;
  7464. }
  7465. .actor.sheet.vehicle .crb-style .row-nr-1 {
  7466. grid-row: 1/2;
  7467. }
  7468. .actor.sheet.vehicle .crb-style .row-nr-2 {
  7469. grid-row: 2/3;
  7470. }
  7471. .actor.sheet.vehicle .crb-style .row-nr-3 {
  7472. grid-row: 3/4;
  7473. }
  7474. .actor.sheet.vehicle .crb-style .span-2-columns {
  7475. grid-column-end: span 2;
  7476. }
  7477. .actor.sheet.vehicle .crb-style .flexitem-1 {
  7478. flex: 1 1 10%;
  7479. }
  7480. .actor.sheet.vehicle .crb-style .flexitem-5 {
  7481. flex: 5 1 50%;
  7482. }
  7483. .actor.sheet.vehicle .crb-style .flexitem-full {
  7484. flex: 100%;
  7485. }
  7486. .actor.sheet .crb-style {
  7487. display: grid;
  7488. grid: "sidebar header" 75px "sidebar nav" minmax(min-content, max-content) "sidebar content" 1fr/230px 1fr;
  7489. font-family: var(--body-serif);
  7490. background: url("../assets/sheet/header.webp"), url("../assets/sheet/background.webp");
  7491. background-repeat: repeat-x, no-repeat;
  7492. background-size: auto 89px, cover;
  7493. background-attachment: local;
  7494. height: 100%;
  7495. /* Navigation */
  7496. /** White background navigation with little decorations on the left and right */
  7497. /* Page structure elements */
  7498. /* Read-Only Sheet */
  7499. }
  7500. .actor.sheet .crb-style .d20-svg {
  7501. width: 19px;
  7502. height: 19px;
  7503. }
  7504. .actor.sheet .crb-style aside {
  7505. grid-area: sidebar;
  7506. color: var(--sidebar-label);
  7507. font-family: var(--serif);
  7508. font-size: var(--font-size-10);
  7509. font-weight: 600;
  7510. margin-left: 8px;
  7511. background-image: url("../assets/sheet/red_sidebar_top.webp"), url("../assets/sheet/red_sidebar_bottom.webp");
  7512. background-repeat: no-repeat;
  7513. background-position: center calc(100% - 52px), center bottom;
  7514. background-size: 224px 100%, 224px 52px;
  7515. display: flex;
  7516. flex-direction: column;
  7517. }
  7518. .actor.sheet .crb-style aside input[type=number] {
  7519. -moz-appearance: textfield;
  7520. color: var(--text-light);
  7521. text-align: center;
  7522. font-size: var(--font-size-26);
  7523. line-height: 1;
  7524. font-weight: initial;
  7525. font-family: var(--serif);
  7526. border: none;
  7527. }
  7528. .actor.sheet .crb-style aside input[type=number]:focus {
  7529. box-shadow: none;
  7530. }
  7531. .actor.sheet .crb-style aside input[type=number]::-webkit-outer-spin-button, .actor.sheet .crb-style aside input[type=number]::-webkit-inner-spin-button {
  7532. -webkit-appearance: none;
  7533. margin: 0;
  7534. }
  7535. .actor.sheet .crb-style aside input[type=number]:read-only {
  7536. pointer-events: none;
  7537. color: var(--tertiary-light);
  7538. }
  7539. .actor.sheet .crb-style aside input[type=number]:hover {
  7540. text-shadow: 0 0 4px var(--tertiary);
  7541. }
  7542. .actor.sheet .crb-style aside .modifiers_button {
  7543. background: rgba(255, 255, 255, 0.75);
  7544. border-radius: 2px 2px 0 0;
  7545. border: none;
  7546. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
  7547. color: var(--primary);
  7548. flex: 0;
  7549. font: 600 var(--font-size-9) var(--sans-serif);
  7550. letter-spacing: 0.05em;
  7551. line-height: 1;
  7552. margin: 0;
  7553. padding: 2px 3px;
  7554. text-rendering: optimizeLegibility;
  7555. text-transform: uppercase;
  7556. white-space: nowrap;
  7557. }
  7558. .actor.sheet .crb-style aside .modifiers_button:hover:not(:disabled) {
  7559. background: white;
  7560. box-shadow: inset 0 0 0 1px white;
  7561. }
  7562. .actor.sheet .crb-style aside .logo {
  7563. margin: 5px -6px 0 -6px;
  7564. border: none;
  7565. z-index: 10;
  7566. max-width: unset;
  7567. flex-shrink: 0;
  7568. }
  7569. .actor.sheet .crb-style aside .sidebar {
  7570. padding: 0 2px 2px 8px;
  7571. margin-bottom: 42px;
  7572. overflow: hidden scroll;
  7573. }
  7574. .actor.sheet .crb-style aside .sidebar::-webkit-scrollbar-track {
  7575. box-shadow: none;
  7576. }
  7577. .actor.sheet .crb-style aside .sidebar h2,
  7578. .actor.sheet .crb-style aside .sidebar h3,
  7579. .actor.sheet .crb-style aside .sidebar h4 {
  7580. margin: 0;
  7581. line-height: 1;
  7582. }
  7583. .actor.sheet .crb-style aside .sidebar_label {
  7584. color: var(--sidebar-label);
  7585. font-family: var(--sans-serif);
  7586. font-size: var(--font-size-10);
  7587. text-transform: uppercase;
  7588. letter-spacing: 0.05em;
  7589. text-rendering: optimizeLegibility;
  7590. white-space: nowrap;
  7591. }
  7592. .actor.sheet .crb-style aside .sidebar_title {
  7593. display: flex;
  7594. flex-wrap: nowrap;
  7595. justify-content: space-between;
  7596. align-items: flex-end;
  7597. margin: 0.8em 0 0.5em;
  7598. }
  7599. .actor.sheet .crb-style aside .sidebar_title:first-of-type {
  7600. margin-top: 0.5em;
  7601. margin-bottom: -1px;
  7602. }
  7603. .actor.sheet .crb-style aside .sidebar_title h2 {
  7604. font-family: var(--sans-serif);
  7605. font-size: var(--font-size-13);
  7606. font-variant: small-caps;
  7607. letter-spacing: 0.05em;
  7608. line-height: 1;
  7609. color: var(--sidebar-title);
  7610. flex: 1;
  7611. }
  7612. .actor.sheet .crb-style aside .sidebar_title .modifiers_button,
  7613. .actor.sheet .crb-style aside .sidebar_title h2 {
  7614. border-bottom: 1px solid var(--sidebar-title);
  7615. }
  7616. .actor.sheet .crb-style aside .sidebar a.dots {
  7617. display: flex;
  7618. flex-direction: column;
  7619. gap: 2px;
  7620. }
  7621. .actor.sheet .crb-style aside .sidebar a.dots > * {
  7622. cursor: pointer;
  7623. }
  7624. .actor.sheet .crb-style aside .sidebar a.dots .pips {
  7625. display: flex;
  7626. justify-content: center;
  7627. }
  7628. .actor.sheet .crb-style aside .sidebar .data-value {
  7629. display: flex;
  7630. justify-content: center;
  7631. align-items: center;
  7632. font-size: 0; /* Removes whitespace for inputs */
  7633. }
  7634. .actor.sheet .crb-style aside .sidebar .data-value h2 {
  7635. color: var(--tertiary-light);
  7636. text-align: center;
  7637. font-size: var(--font-size-26);
  7638. line-height: 1;
  7639. font-weight: initial;
  7640. font-family: var(--serif);
  7641. border: none;
  7642. }
  7643. .actor.sheet .crb-style aside .sidebar a.roll-icon {
  7644. display: inline-flex;
  7645. align-items: center;
  7646. padding-bottom: 2px;
  7647. }
  7648. .actor.sheet .crb-style aside .sidebar a.roll-icon i {
  7649. font-size: var(--font-size-19);
  7650. color: var(--text-light);
  7651. transition: all 0.2s ease-in-out;
  7652. }
  7653. .actor.sheet .crb-style aside .sidebar a.roll-icon i:hover {
  7654. transform: scale(1.25);
  7655. }
  7656. .actor.sheet .crb-style aside .sidebar a.roll-icon svg {
  7657. animation-play-state: paused;
  7658. }
  7659. .actor.sheet .crb-style aside .sidebar a.roll-icon svg path {
  7660. fill: var(--text-light);
  7661. }
  7662. .actor.sheet .crb-style aside .sidebar a.roll-icon:hover svg {
  7663. animation-play-state: running;
  7664. animation: rotation 2s infinite linear;
  7665. }
  7666. .actor.sheet .crb-style aside .sidebar a.roll-icon.disabled {
  7667. cursor: default;
  7668. filter: brightness(0.75);
  7669. opacity: 0.75;
  7670. text-shadow: none;
  7671. }
  7672. .actor.sheet .crb-style aside .sidebar a.roll-icon.disabled:hover svg {
  7673. animation-play-state: paused;
  7674. }
  7675. .actor.sheet .crb-style aside .sidebar select {
  7676. font-size: var(--font-size-15);
  7677. background-color: var(--primary);
  7678. padding: 2px 6px;
  7679. width: 100%;
  7680. max-width: 100%;
  7681. border: 1px solid #956d58;
  7682. /* prettier-ignore */
  7683. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 0 4px rgba(0, 0, 0, 0.5);
  7684. }
  7685. .actor.sheet .crb-style aside .sidebar ol {
  7686. display: flex;
  7687. flex-direction: column;
  7688. list-style: none;
  7689. margin: 0;
  7690. padding: 0;
  7691. }
  7692. .actor.sheet .crb-style aside .sidebar ol li {
  7693. display: flex;
  7694. flex-direction: row;
  7695. align-items: center;
  7696. justify-content: space-between;
  7697. }
  7698. .actor.sheet .crb-style aside .sidebar .tags .tag.edit-btn {
  7699. background-color: var(--color-bg-option);
  7700. color: var(--primary);
  7701. }
  7702. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big {
  7703. display: grid;
  7704. grid-template-columns: repeat(3, 1fr);
  7705. justify-content: space-evenly;
  7706. }
  7707. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container {
  7708. text-align: center;
  7709. }
  7710. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.current-hp {
  7711. background-image: linear-gradient(90deg, #450000 0%, #870000 50%, #450000 100%);
  7712. background-color: var(--primary);
  7713. border-radius: 0 0 4px 4px;
  7714. border: 1px solid var(--sidebar-title);
  7715. display: flex;
  7716. flex-direction: column;
  7717. padding: 10px 4px 0;
  7718. position: relative;
  7719. width: min-content;
  7720. z-index: 0;
  7721. }
  7722. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.current-hp .data-value {
  7723. margin-top: 3px;
  7724. }
  7725. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.current-hp .data-value input[type=number] {
  7726. font-size: var(--font-size-32);
  7727. letter-spacing: -1px;
  7728. height: 32px;
  7729. }
  7730. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.max-hp, .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.temp-hp {
  7731. margin-top: 0.75rem;
  7732. }
  7733. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.temp-hp {
  7734. margin-right: 0.5rem;
  7735. text-align: center;
  7736. }
  7737. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.max-hp {
  7738. margin-left: 0.5rem;
  7739. text-align: center;
  7740. }
  7741. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.max-hp .unrecoverable {
  7742. color: orangered;
  7743. }
  7744. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small {
  7745. display: flex;
  7746. justify-content: space-evenly;
  7747. margin: 8px 2px 0 2px;
  7748. text-align: center;
  7749. gap: 2px;
  7750. }
  7751. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small h4,
  7752. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small label {
  7753. font-family: var(--sans-serif);
  7754. font-size: var(--font-size-10);
  7755. text-transform: uppercase;
  7756. letter-spacing: 0.05em;
  7757. text-rendering: optimizeLegibility;
  7758. }
  7759. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small .far,
  7760. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small .fas {
  7761. color: var(--text-light);
  7762. }
  7763. .actor.sheet .crb-style aside .sidebar .armor-class {
  7764. display: grid;
  7765. grid: "ac shield-hp shield-footer" 74px "shield-data shield-data shield-data" auto/66px 59px auto;
  7766. grid-column-gap: 4px;
  7767. }
  7768. .actor.sheet .crb-style aside .sidebar .armor-class .shield {
  7769. display: flex;
  7770. justify-content: flex-start;
  7771. align-items: center;
  7772. flex-direction: column;
  7773. height: 74px;
  7774. text-align: center;
  7775. padding: 14px 10px 0 10px;
  7776. }
  7777. .actor.sheet .crb-style aside .sidebar .armor-class .shield .data-value h2,
  7778. .actor.sheet .crb-style aside .sidebar .armor-class .shield .data-value input[type=number] {
  7779. font-size: var(--font-size-32);
  7780. width: 55px;
  7781. }
  7782. .actor.sheet .crb-style aside .sidebar .armor-class .shield label {
  7783. white-space: normal;
  7784. }
  7785. .actor.sheet .crb-style aside .sidebar .armor-class .shield.ac {
  7786. grid-area: ac;
  7787. background: url("../assets/sheet/shield-blue.webp") no-repeat center center;
  7788. }
  7789. .actor.sheet .crb-style aside .sidebar .armor-class .shield.hp {
  7790. grid-area: shield-hp;
  7791. background: url("../assets/sheet/shield-red.webp") no-repeat top center;
  7792. }
  7793. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats {
  7794. grid-area: shield-data;
  7795. }
  7796. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol {
  7797. margin-top: 4px;
  7798. flex-direction: row;
  7799. height: 100%;
  7800. padding: 0 4px;
  7801. justify-content: space-evenly;
  7802. }
  7803. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li {
  7804. justify-content: center;
  7805. font-size: 0;
  7806. }
  7807. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li + li {
  7808. margin-left: 8px;
  7809. }
  7810. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label {
  7811. position: relative;
  7812. }
  7813. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label svg {
  7814. border: none;
  7815. width: auto;
  7816. height: 20px;
  7817. }
  7818. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label svg path {
  7819. fill: var(--tertiary-light);
  7820. }
  7821. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label svg text {
  7822. fill: var(--primary-dark);
  7823. }
  7824. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label:after {
  7825. display: inline-block;
  7826. position: absolute;
  7827. font-family: var(--sans-serif);
  7828. font-size: var(--font-size-10);
  7829. text-transform: uppercase;
  7830. letter-spacing: 0.05em;
  7831. text-rendering: optimizeLegibility;
  7832. color: var(--primary);
  7833. top: 0;
  7834. left: 1px;
  7835. line-height: 1.5;
  7836. }
  7837. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label.ac:after {
  7838. content: "AC";
  7839. top: 3px;
  7840. left: 3px;
  7841. }
  7842. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label.hardness:after {
  7843. left: 5px;
  7844. top: 3px;
  7845. content: "H";
  7846. }
  7847. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label.bt:after {
  7848. top: 3px;
  7849. left: 3.5px;
  7850. content: "BT";
  7851. }
  7852. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .data-value {
  7853. flex: 1;
  7854. border: 1px solid #956d58;
  7855. /* prettier-ignore */
  7856. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 0 4px rgba(0, 0, 0, 0.5);
  7857. padding-left: 4px;
  7858. margin-left: -8px;
  7859. height: 20px;
  7860. }
  7861. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .data-value input[type=number] {
  7862. font-size: var(--font-size-14);
  7863. font-weight: 400;
  7864. padding-top: 2px;
  7865. height: 14px;
  7866. }
  7867. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer {
  7868. grid-area: shield-footer;
  7869. display: inline-flex;
  7870. flex-direction: column;
  7871. justify-content: center;
  7872. justify-self: center;
  7873. width: calc(100% - 6px);
  7874. }
  7875. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer .shield-max {
  7876. display: flex;
  7877. flex-direction: column;
  7878. }
  7879. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer .shield-max label {
  7880. white-space: normal;
  7881. text-align: center;
  7882. margin-bottom: 4px;
  7883. }
  7884. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer .shield-status {
  7885. display: flex;
  7886. align-items: end;
  7887. justify-content: center;
  7888. gap: 5px;
  7889. color: var(--tertiary-light);
  7890. margin-top: 4px;
  7891. }
  7892. .actor.sheet .crb-style aside .sidebar .stamina {
  7893. flex-direction: row;
  7894. }
  7895. .actor.sheet .crb-style aside .sidebar .stamina li {
  7896. flex-direction: column;
  7897. }
  7898. .actor.sheet .crb-style aside .sidebar .stamina li input {
  7899. padding: 0;
  7900. font-size: var(--font-size-24);
  7901. }
  7902. .actor.sheet .crb-style aside .sidebar .stamina li input.left {
  7903. color: var(--text-light);
  7904. text-align: right;
  7905. margin-right: 4px;
  7906. }
  7907. .actor.sheet .crb-style aside .sidebar .stamina li input.right {
  7908. color: var(--tertiary-light);
  7909. text-align: left;
  7910. margin-left: 4px;
  7911. }
  7912. .actor.sheet .crb-style aside .sidebar .stamina li .divider {
  7913. font-size: var(--font-size-16);
  7914. line-height: 1;
  7915. }
  7916. .actor.sheet .crb-style aside .sidebar .stamina li .stamina-group {
  7917. display: flex;
  7918. align-items: center;
  7919. }
  7920. .actor.sheet .crb-style aside .sidebar .roll-data {
  7921. display: flex;
  7922. align-items: center;
  7923. justify-content: space-between;
  7924. }
  7925. .actor.sheet .crb-style aside .sidebar .roll-data h3 {
  7926. font-size: var(--font-size-18);
  7927. font-weight: initial;
  7928. color: var(--tertiary-light);
  7929. white-space: nowrap;
  7930. }
  7931. .actor.sheet .crb-style aside .sidebar .roll-data .initiative-select {
  7932. width: 129px;
  7933. }
  7934. .actor.sheet .crb-style aside .sidebar .perception-sidebar,
  7935. .actor.sheet .crb-style aside .sidebar .initiative-sidebar {
  7936. gap: 5px;
  7937. }
  7938. .actor.sheet .crb-style aside .sidebar .perception-sidebar h3,
  7939. .actor.sheet .crb-style aside .sidebar .initiative-sidebar h3 {
  7940. flex-grow: 1;
  7941. }
  7942. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves {
  7943. margin: 0;
  7944. padding: 0;
  7945. display: flex;
  7946. }
  7947. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data {
  7948. flex: 1 1 auto;
  7949. display: flex;
  7950. flex-direction: column;
  7951. justify-content: center;
  7952. align-items: center;
  7953. border-left: 1px solid rgba(255, 239, 189, 0.1882352941);
  7954. }
  7955. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data:first-child {
  7956. border-left: none;
  7957. }
  7958. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .sidebar_label {
  7959. font-weight: initial;
  7960. text-transform: capitalize;
  7961. font-size: var(--font-size-12);
  7962. border: none;
  7963. margin-bottom: 2px;
  7964. }
  7965. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .save-roll {
  7966. display: flex;
  7967. justify-content: center;
  7968. align-items: center;
  7969. margin: 4px 0;
  7970. }
  7971. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .save-roll h3 {
  7972. margin: 0;
  7973. margin-left: 2px;
  7974. }
  7975. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .modifiers_button {
  7976. padding: 2px;
  7977. border-radius: 2px;
  7978. width: initial;
  7979. }
  7980. .actor.sheet .crb-style aside .sidebar ol.tags {
  7981. flex-direction: row;
  7982. }
  7983. .actor.sheet .crb-style aside .sidebar ol.tags li {
  7984. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  7985. }
  7986. .actor.sheet .crb-style header.char-header {
  7987. display: flex;
  7988. justify-content: space-between;
  7989. align-items: center;
  7990. color: var(--text-light);
  7991. }
  7992. .actor.sheet .crb-style header.char-header .char-details {
  7993. font-family: var(--sans-serif);
  7994. font-size: var(--font-size-10);
  7995. text-transform: uppercase;
  7996. letter-spacing: 0.05em;
  7997. text-rendering: optimizeLegibility;
  7998. margin-left: 8px;
  7999. }
  8000. .actor.sheet .crb-style header.char-header .char-details h1.char-name {
  8001. margin: 0;
  8002. border: none;
  8003. }
  8004. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable {
  8005. letter-spacing: normal;
  8006. word-spacing: normal;
  8007. text-transform: none;
  8008. text-indent: 0;
  8009. text-shadow: none;
  8010. text-rendering: auto;
  8011. }
  8012. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable.gender {
  8013. font-size: var(--font-size-14);
  8014. }
  8015. .actor.sheet .crb-style header.char-header .char-details h1.char-name input[type=text],
  8016. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable {
  8017. font-family: var(--serif);
  8018. font-weight: 500;
  8019. font-size: var(--font-size-24);
  8020. color: var(--text-light);
  8021. line-height: calc(1em + 1px);
  8022. border-bottom: 1px solid transparent;
  8023. height: 26px;
  8024. }
  8025. .actor.sheet .crb-style header.char-header .char-details h1.char-name input[type=text]:focus,
  8026. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable:focus {
  8027. box-shadow: none;
  8028. border-bottom: 1px solid var(--text-light);
  8029. }
  8030. .actor.sheet .crb-style header.char-header .char-details h2.non-editable.ancestry-class {
  8031. font-family: var(--serif);
  8032. border-bottom: none;
  8033. margin-bottom: 0;
  8034. font-weight: 400;
  8035. }
  8036. .actor.sheet .crb-style header.char-header .char-level {
  8037. display: flex;
  8038. justify-content: flex-start;
  8039. padding-bottom: 4px;
  8040. }
  8041. .actor.sheet .crb-style header.char-header .char-level .level {
  8042. position: relative;
  8043. display: flex;
  8044. justify-content: center;
  8045. align-items: center;
  8046. flex-direction: column;
  8047. height: 43px;
  8048. width: 40px;
  8049. background: url("../assets/sheet/level-badge.webp") no-repeat;
  8050. background-size: 40px 43px;
  8051. z-index: 2;
  8052. font-size: 0;
  8053. padding-top: 2px;
  8054. }
  8055. .actor.sheet .crb-style header.char-header .char-level .level label {
  8056. color: var(--sidebar-label);
  8057. font-family: var(--sans-serif);
  8058. font-size: var(--font-size-10);
  8059. text-transform: uppercase;
  8060. letter-spacing: 0.05em;
  8061. text-rendering: optimizeLegibility;
  8062. line-height: 1.5;
  8063. }
  8064. .actor.sheet .crb-style header.char-header .char-level .level input {
  8065. font-family: var(--serif);
  8066. font-size: var(--font-size-22);
  8067. font-weight: 400;
  8068. color: var(--text-light);
  8069. line-height: calc(1em + 1px);
  8070. height: 24px;
  8071. }
  8072. .actor.sheet .crb-style header.char-header .char-level .level label,
  8073. .actor.sheet .crb-style header.char-header .char-level .level input {
  8074. margin-left: 1px;
  8075. text-align: center;
  8076. }
  8077. .actor.sheet .crb-style .char-header {
  8078. grid-area: header;
  8079. padding-right: 1rem;
  8080. }
  8081. .actor.sheet .crb-style .sheet-navigation {
  8082. grid-area: nav;
  8083. margin-left: -2px;
  8084. }
  8085. .actor.sheet .crb-style .sheet-body {
  8086. grid-area: content;
  8087. position: relative;
  8088. z-index: 0;
  8089. }
  8090. .actor.sheet .crb-style .sheet-body ol {
  8091. list-style: none;
  8092. }
  8093. .actor.sheet .crb-style .sheet-body .sheet-content,
  8094. .actor.sheet .crb-style .sheet-body .sheet-content .inventory {
  8095. bottom: 0;
  8096. display: flex;
  8097. flex-direction: column;
  8098. left: 0;
  8099. position: absolute;
  8100. top: 0;
  8101. width: 100%;
  8102. }
  8103. .actor.sheet .crb-style .sheet-body .sheet-content.tab[data-tab],
  8104. .actor.sheet .crb-style .sheet-body .sheet-content .inventory.tab[data-tab] {
  8105. display: none;
  8106. }
  8107. .actor.sheet .crb-style .sheet-body .sheet-content.tab[data-tab].active,
  8108. .actor.sheet .crb-style .sheet-body .sheet-content .inventory.tab[data-tab].active {
  8109. display: initial;
  8110. }
  8111. .actor.sheet .crb-style .sheet-body .sheet-content {
  8112. color: var(--text-dark);
  8113. }
  8114. .actor.sheet .crb-style .sheet-body .sheet-content > .tab {
  8115. padding: 0.6rem 0.6rem 0;
  8116. }
  8117. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list {
  8118. margin: 0;
  8119. padding: 0;
  8120. border-bottom: 1px solid var(--color-border-light-2);
  8121. flex-basis: 100%;
  8122. gap: 1px;
  8123. position: relative;
  8124. width: 100%;
  8125. z-index: 1;
  8126. }
  8127. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li {
  8128. margin: 0;
  8129. padding: 0;
  8130. align-items: center;
  8131. background: none;
  8132. cursor: default;
  8133. display: grid;
  8134. grid: "name range components cast-spell controls" auto "content content content content content" auto/9fr 4fr 4fr 2fr 2.5fr;
  8135. justify-content: center;
  8136. padding: 0 0.3em 1px 0.35em;
  8137. }
  8138. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li[data-expended-state=true] h4 {
  8139. color: var(--color-disabled);
  8140. text-decoration: line-through;
  8141. }
  8142. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li[data-expended-state=true] .cast-spell {
  8143. background: var(--color-disabled);
  8144. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  8145. cursor: not-allowed;
  8146. }
  8147. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li:nth-child(odd) {
  8148. background-color: rgba(120, 100, 82, 0.1);
  8149. }
  8150. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li:last-child {
  8151. border-bottom: 1px solid var(--sub);
  8152. }
  8153. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li:last-child .item-image {
  8154. margin-bottom: 0;
  8155. margin-top: 2px;
  8156. }
  8157. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header {
  8158. margin: 0;
  8159. padding: 0;
  8160. background: rgba(96, 88, 86, 0.25);
  8161. border: 1px solid var(--color-border-light-2);
  8162. border-radius: 2px;
  8163. color: var(--text-dark);
  8164. font: 500 var(--font-size-12) var(--sans-serif);
  8165. letter-spacing: 0.25px;
  8166. line-height: 1;
  8167. padding: 0 0.5em;
  8168. text-transform: uppercase;
  8169. }
  8170. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header h3 {
  8171. text-transform: capitalize;
  8172. font-size: var(--font-size-13);
  8173. margin-left: 0;
  8174. padding: 4px 0;
  8175. }
  8176. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .item-name {
  8177. line-height: 1;
  8178. gap: 0.25em;
  8179. }
  8180. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .item-name h3 {
  8181. margin: 0;
  8182. padding: 0;
  8183. font-weight: 700;
  8184. }
  8185. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .item-controls {
  8186. grid-column: span 2;
  8187. }
  8188. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses {
  8189. align-items: center;
  8190. display: flex;
  8191. gap: 0.25em;
  8192. line-height: 1;
  8193. }
  8194. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input,
  8195. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input {
  8196. background: var(--alt);
  8197. border-radius: 3px;
  8198. border: 1px solid var(--sub);
  8199. color: var(--text-light);
  8200. font: var(--font-size-12) var(--sans-serif);
  8201. height: unset;
  8202. text-align: center;
  8203. width: 2em;
  8204. }
  8205. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .spell-slots-increment-reset,
  8206. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses .spell-slots-increment-reset {
  8207. padding-left: 5px;
  8208. font-size: var(--font-size-10);
  8209. }
  8210. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell {
  8211. border: none;
  8212. font-size: var(--font-size-13);
  8213. }
  8214. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .level-prepared-toggle {
  8215. flex: 0;
  8216. font-size: 0.75rem;
  8217. color: var(--secondary);
  8218. }
  8219. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name {
  8220. align-items: center;
  8221. display: flex;
  8222. flex-wrap: nowrap;
  8223. justify-content: start;
  8224. justify-self: start;
  8225. min-height: 1.75rem;
  8226. }
  8227. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h3 {
  8228. white-space: nowrap;
  8229. }
  8230. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name + span {
  8231. font-size: 0.75rem;
  8232. }
  8233. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .focus-pool-input {
  8234. align-items: center;
  8235. display: flex;
  8236. flex-wrap: nowrap;
  8237. }
  8238. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .slash {
  8239. font-size: 0.75rem;
  8240. }
  8241. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-slots,
  8242. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-max {
  8243. padding-top: 3px;
  8244. font-size: 0.75rem;
  8245. }
  8246. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-slots.infinity,
  8247. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-max.infinity {
  8248. position: relative;
  8249. top: -2px;
  8250. }
  8251. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .item-image {
  8252. height: 1.5rem;
  8253. width: 1.5rem;
  8254. flex: 0 0 auto;
  8255. margin: 2px 0;
  8256. }
  8257. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h4 {
  8258. margin: 0;
  8259. padding: 0;
  8260. font-size: var(--font-size-14);
  8261. letter-spacing: -0.075em;
  8262. line-height: 1;
  8263. margin-left: 8px;
  8264. cursor: pointer;
  8265. }
  8266. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h4:hover {
  8267. color: var(--secondary);
  8268. }
  8269. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .action-glyph {
  8270. margin-left: 4px;
  8271. font-size: small;
  8272. }
  8273. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name.empty {
  8274. grid-column: 1/span 4;
  8275. }
  8276. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-range {
  8277. grid-area: range;
  8278. padding-left: 0.2em;
  8279. }
  8280. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-components {
  8281. grid-area: components;
  8282. justify-self: right;
  8283. padding: 0 0.5em;
  8284. }
  8285. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-components .tag {
  8286. font: var(--font-size-12) var(--sans-serif-condensed);
  8287. }
  8288. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-cast {
  8289. grid-area: cast-spell;
  8290. display: flex;
  8291. justify-content: center;
  8292. }
  8293. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-controls {
  8294. grid-area: controls;
  8295. display: flex;
  8296. justify-self: end;
  8297. padding-right: 0.25em;
  8298. }
  8299. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li button.cast-spell {
  8300. align-items: center;
  8301. background: var(--secondary);
  8302. border-radius: 2px;
  8303. border: black;
  8304. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  8305. color: var(--text-light);
  8306. cursor: pointer;
  8307. display: flex;
  8308. font: 700 0.55rem var(--sans-serif);
  8309. justify-self: center;
  8310. letter-spacing: 0.25px;
  8311. max-width: fit-content;
  8312. padding: 0.5em 1em;
  8313. text-transform: uppercase;
  8314. }
  8315. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-summary {
  8316. grid-area: content;
  8317. width: 100%;
  8318. padding: 8px;
  8319. border-bottom: 1px solid var(--sub);
  8320. border-top: 1px solid #aca5a3;
  8321. background-color: var(--bg);
  8322. }
  8323. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list[data-category=spontaneous] .virtual {
  8324. position: relative;
  8325. }
  8326. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list[data-category=spontaneous] .virtual::before {
  8327. pointer-events: none;
  8328. content: "";
  8329. position: absolute;
  8330. height: 100%;
  8331. width: 100%;
  8332. background-color: rgba(0, 5, 255, 0.1137254902);
  8333. mix-blend-mode: saturation;
  8334. }
  8335. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list[data-category=spontaneous] .item:not(.virtual) + .virtual {
  8336. border-top: 1px solid rgba(0, 0, 0, 0.15);
  8337. }
  8338. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .level-prepared-header {
  8339. font-size: 0.75rem;
  8340. color: var(--text-light);
  8341. margin: 0;
  8342. padding: 4px;
  8343. text-align: center;
  8344. background: var(--secondary);
  8345. position: relative;
  8346. }
  8347. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spell .item-name {
  8348. width: 100%;
  8349. }
  8350. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list input.toggle-signature-spell[type=checkbox] {
  8351. width: 12px;
  8352. height: 12px;
  8353. margin: 0 2px 0 0;
  8354. flex: 0 0 auto;
  8355. }
  8356. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spellbook-empty {
  8357. display: flex;
  8358. align-items: center;
  8359. min-height: 28px;
  8360. justify-content: flex-end;
  8361. }
  8362. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spellbook-empty h4 {
  8363. margin: 0;
  8364. white-space: nowrap;
  8365. margin-right: auto;
  8366. }
  8367. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spellbook-empty a {
  8368. flex: 0 1 0;
  8369. white-space: nowrap;
  8370. margin-left: 8px;
  8371. }
  8372. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list > h3,
  8373. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list > li > h3 {
  8374. font-size: 1rem;
  8375. font-weight: 500;
  8376. font-family: var(--serif);
  8377. line-height: 1;
  8378. color: var(--text-light);
  8379. margin: 0;
  8380. padding: 0;
  8381. margin-left: 8px;
  8382. }
  8383. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header {
  8384. align-items: center;
  8385. background: var(--primary);
  8386. border: none;
  8387. border-radius: 0.25em;
  8388. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  8389. display: flex;
  8390. flex-basis: 100%;
  8391. flex-wrap: nowrap;
  8392. height: 32px;
  8393. justify-content: space-between;
  8394. margin-left: 0;
  8395. margin-top: 8px;
  8396. padding: 0 0.5em;
  8397. position: relative;
  8398. width: 100%;
  8399. z-index: 2;
  8400. }
  8401. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header:first-child {
  8402. margin-top: 0;
  8403. }
  8404. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header + li {
  8405. border-top: none;
  8406. }
  8407. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header .drag-handle {
  8408. cursor: move;
  8409. }
  8410. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header > a .fas,
  8411. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header > a > .fa {
  8412. flex-basis: 0;
  8413. color: var(--text-light);
  8414. margin-right: 0.25em;
  8415. padding-top: 0.25em;
  8416. }
  8417. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header .item-controls {
  8418. color: var(--text-light);
  8419. flex: 1 0 auto;
  8420. font: 0.85em var(--sans-serif);
  8421. letter-spacing: 0.05em;
  8422. margin-left: auto;
  8423. max-width: fit-content;
  8424. text-transform: uppercase;
  8425. font-size: var(--font-size-12);
  8426. }
  8427. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header h3 {
  8428. color: var(--text-light);
  8429. flex: 1 1 100%;
  8430. margin-bottom: 0;
  8431. font-size: var(--font-size-16);
  8432. }
  8433. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header h3 input.item-name-input {
  8434. color: var(--text-light);
  8435. max-width: 100%;
  8436. font-weight: 500;
  8437. }
  8438. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header h3 input.item-name-input:read-only {
  8439. pointer-events: none;
  8440. }
  8441. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container {
  8442. padding: 0 0.5rem 2rem 0;
  8443. }
  8444. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper {
  8445. justify-items: center;
  8446. }
  8447. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .action-radio {
  8448. display: none;
  8449. }
  8450. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels {
  8451. min-height: min-content;
  8452. width: 100%;
  8453. }
  8454. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-panel {
  8455. display: none;
  8456. }
  8457. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-panel.active {
  8458. display: flex;
  8459. flex-direction: column;
  8460. }
  8461. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options {
  8462. border-image-repeat: repeat;
  8463. border-image-slice: 11;
  8464. border-image-source: url("../assets/sheet/frame-elegant.svg");
  8465. border-image-width: 14px;
  8466. border-style: double;
  8467. display: flex;
  8468. flex-wrap: wrap;
  8469. margin-bottom: 0.5rem;
  8470. padding: 0.5rem 1rem;
  8471. }
  8472. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option {
  8473. align-items: center;
  8474. display: flex;
  8475. width: 100%;
  8476. margin: 1px 0;
  8477. }
  8478. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label * {
  8479. vertical-align: middle;
  8480. }
  8481. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label input {
  8482. margin: 0;
  8483. padding: 0;
  8484. }
  8485. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label .unchecked-disabled {
  8486. color: var(--color-text-dark-inactive);
  8487. }
  8488. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label select {
  8489. margin-left: 0.25em;
  8490. }
  8491. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list {
  8492. padding-left: 0;
  8493. }
  8494. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action-header {
  8495. align-items: center;
  8496. display: flex;
  8497. }
  8498. .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 {
  8499. border: solid transparent;
  8500. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  8501. border-width: 0 0 1px;
  8502. padding: 4px;
  8503. width: 100%;
  8504. }
  8505. .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 {
  8506. display: none;
  8507. }
  8508. .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 {
  8509. grid-area: icon-name;
  8510. align-items: center;
  8511. display: flex;
  8512. flex: 1;
  8513. margin: 0;
  8514. }
  8515. .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 {
  8516. cursor: pointer;
  8517. margin: 0;
  8518. max-width: fit-content;
  8519. }
  8520. .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 {
  8521. display: flex;
  8522. justify-content: center;
  8523. align-items: center;
  8524. background-repeat: no-repeat;
  8525. background-size: contain;
  8526. color: transparent;
  8527. cursor: pointer;
  8528. font-size: var(--font-size-18);
  8529. height: 32px;
  8530. margin-right: 8px;
  8531. width: 32px;
  8532. }
  8533. .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 {
  8534. background: none;
  8535. color: var(--primary);
  8536. }
  8537. .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 {
  8538. flex: 1;
  8539. }
  8540. .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 {
  8541. display: flex;
  8542. flex-direction: row;
  8543. }
  8544. .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 {
  8545. cursor: pointer;
  8546. }
  8547. .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 {
  8548. color: var(--primary);
  8549. }
  8550. .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 {
  8551. color: var(--text-dark);
  8552. }
  8553. .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 {
  8554. align-items: center;
  8555. border-radius: 2px;
  8556. border: none;
  8557. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3), inset 0 0 0 2px rgba(0, 0, 0, 0.2);
  8558. display: flex;
  8559. flex: 0;
  8560. font: 500 var(--font-size-10) var(--sans-serif);
  8561. gap: 0.25em;
  8562. height: 2em;
  8563. justify-content: space-evenly;
  8564. letter-spacing: 0.05em;
  8565. margin: 0;
  8566. max-width: fit-content;
  8567. padding: 0.5em;
  8568. text-rendering: optimizeLegibility;
  8569. text-transform: uppercase;
  8570. white-space: nowrap;
  8571. }
  8572. .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) {
  8573. background: var(--bg-dark);
  8574. cursor: pointer;
  8575. }
  8576. .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 {
  8577. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), inset 0 0 0 2px rgba(0, 0, 0, 0.4);
  8578. }
  8579. .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 {
  8580. color: var(--primary);
  8581. }
  8582. .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 {
  8583. font-size: var(--font-size-12);
  8584. grid-area: controls;
  8585. white-space: nowrap;
  8586. }
  8587. .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 {
  8588. flex-basis: 100%;
  8589. margin: 0.5rem 0;
  8590. }
  8591. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary .title,
  8592. .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,
  8593. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary .framing {
  8594. color: var(--primary);
  8595. margin-top: 1em;
  8596. margin: 0;
  8597. padding: 0;
  8598. }
  8599. .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 {
  8600. color: var(--secondary);
  8601. margin: 1em 0 0.25em;
  8602. }
  8603. .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 {
  8604. font-weight: 500;
  8605. }
  8606. .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 {
  8607. margin-top: 0;
  8608. }
  8609. .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 {
  8610. border: none;
  8611. vertical-align: middle;
  8612. }
  8613. .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 {
  8614. background: var(--alt);
  8615. vertical-align: middle;
  8616. border: 1px solid var(--text-dark);
  8617. }
  8618. .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 {
  8619. box-shadow: none;
  8620. text-shadow: 0 0 2px white;
  8621. }
  8622. .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 {
  8623. cursor: pointer;
  8624. }
  8625. .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 {
  8626. background-color: rgba(23, 31, 105, 0.5);
  8627. color: var(--text-dark);
  8628. text-shadow: 0 0 2px white;
  8629. }
  8630. .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 {
  8631. border-image-repeat: repeat;
  8632. border-image-slice: 11;
  8633. border-image-source: url("../assets/sheet/frame-elegant.svg");
  8634. border-image-width: 14px;
  8635. border-style: double;
  8636. padding: 0.5rem 1rem 1rem;
  8637. }
  8638. .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 {
  8639. margin: 0;
  8640. margin-bottom: 0.5rem;
  8641. }
  8642. .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 {
  8643. background-color: rgba(0, 0, 0, 0.8);
  8644. }
  8645. .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 {
  8646. display: none;
  8647. }
  8648. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action {
  8649. align-items: center;
  8650. column-gap: 0.5rem;
  8651. display: grid;
  8652. grid: "icon name tracking controls" 1fr "icon buttons tracking controls" auto "summary summary summary summary" auto/min-content auto 20% 10%;
  8653. }
  8654. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action > .icon {
  8655. grid-area: icon;
  8656. height: 32px;
  8657. width: 32px;
  8658. }
  8659. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .name {
  8660. align-items: center;
  8661. grid-area: name;
  8662. display: flex;
  8663. margin-bottom: 0;
  8664. text-align: left;
  8665. }
  8666. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .button-group {
  8667. grid-area: buttons;
  8668. display: flex;
  8669. flex-wrap: wrap;
  8670. gap: 1px;
  8671. }
  8672. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .tracking {
  8673. grid-area: tracking;
  8674. }
  8675. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-controls {
  8676. grid-area: controls;
  8677. }
  8678. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary {
  8679. grid-area: summary;
  8680. }
  8681. .actor.sheet .crb-style .sheet-body .sheet-content footer {
  8682. font-family: var(--sans-serif);
  8683. font-size: var(--font-size-10);
  8684. text-transform: uppercase;
  8685. letter-spacing: 0.05em;
  8686. text-rendering: optimizeLegibility;
  8687. color: var(--primary);
  8688. text-align: right;
  8689. line-height: 1.4;
  8690. margin: 1em 1em 0;
  8691. }
  8692. .actor.sheet .crb-style nav.sheet-navigation {
  8693. display: inline-flex;
  8694. justify-content: center;
  8695. align-items: center;
  8696. height: 20px;
  8697. background: var(--secondary);
  8698. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  8699. transition: all 0.1s ease-out;
  8700. box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
  8701. border-top: 1px solid rgba(255, 255, 255, 0.1);
  8702. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  8703. position: relative;
  8704. }
  8705. .actor.sheet .crb-style nav.sheet-navigation .navigation-title {
  8706. color: var(--text-light);
  8707. margin-right: auto;
  8708. padding-left: 1em;
  8709. white-space: nowrap;
  8710. width: 7em;
  8711. }
  8712. .actor.sheet .crb-style nav.sheet-navigation > a {
  8713. display: flex;
  8714. justify-content: center;
  8715. align-items: center;
  8716. margin: 0 6px;
  8717. font-size: var(--font-size-12);
  8718. }
  8719. .actor.sheet .crb-style nav.sheet-navigation .item {
  8720. height: 24px;
  8721. width: 24px;
  8722. border-radius: 50%;
  8723. z-index: 1;
  8724. transition: all 0.1s ease-out;
  8725. color: var(--tertiary);
  8726. fill: var(--tertiary);
  8727. background-image: url("../assets/sheet/nav-item-inactive.webp");
  8728. background-size: contain;
  8729. /* prettier-ignore */
  8730. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25);
  8731. }
  8732. .actor.sheet .crb-style nav.sheet-navigation .item.active {
  8733. 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);
  8734. }
  8735. .actor.sheet .crb-style nav.sheet-navigation .item:last-child {
  8736. margin-right: 10px;
  8737. }
  8738. .actor.sheet .crb-style nav.sheet-navigation .item:hover, .actor.sheet .crb-style nav.sheet-navigation .item.active {
  8739. z-index: 2;
  8740. transform: scale(1.2);
  8741. color: var(--text-light);
  8742. fill: var(--text-light);
  8743. background-image: url("../assets/sheet/nav-item.webp");
  8744. }
  8745. .actor.sheet .crb-style nav.sheet-navigation .item .fas {
  8746. padding-bottom: 0;
  8747. }
  8748. .actor.sheet .crb-style nav.sheet-navigation .item:hover .pfs-icon {
  8749. filter: drop-shadow(0 0 8px var(--color-shadow-primary));
  8750. }
  8751. .actor.sheet .crb-style nav.sheet-navigation .item .action-icon {
  8752. font-family: "Pathfinder2eActions", sans-serif;
  8753. font-size: 1rem;
  8754. }
  8755. .actor.sheet .crb-style nav.sub-nav {
  8756. margin: 0;
  8757. padding: 0;
  8758. display: flex;
  8759. flex-wrap: nowrap;
  8760. justify-content: center;
  8761. align-items: center;
  8762. list-style: none;
  8763. background-color: var(--bg);
  8764. box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  8765. width: 100%;
  8766. flex: 0 0 2.5rem;
  8767. }
  8768. .actor.sheet .crb-style nav.sub-nav::before, .actor.sheet .crb-style nav.sub-nav::after {
  8769. content: "";
  8770. width: 37px;
  8771. height: 16px;
  8772. background: url("../assets/sheet/sub-nav-decoration.webp");
  8773. margin: 0 16px;
  8774. }
  8775. .actor.sheet .crb-style nav.sub-nav::after {
  8776. transform: scaleX(-100%);
  8777. }
  8778. .actor.sheet .crb-style nav.sub-nav a,
  8779. .actor.sheet .crb-style nav.sub-nav .tab {
  8780. border-left: 1px solid rgba(255, 255, 255, 0.3);
  8781. border-right: 1px solid rgba(0, 0, 0, 0.2);
  8782. color: var(--alt);
  8783. cursor: pointer;
  8784. display: block;
  8785. font: 400 var(--font-size-16) var(--serif);
  8786. flex: 1;
  8787. margin: 0 0.25rem;
  8788. max-width: 30%;
  8789. text-align: center;
  8790. text-decoration: none;
  8791. transition: all 0.1s ease-out;
  8792. }
  8793. .actor.sheet .crb-style nav.sub-nav a.active,
  8794. .actor.sheet .crb-style nav.sub-nav .tab.active {
  8795. color: var(--primary);
  8796. font-weight: 600;
  8797. }
  8798. .actor.sheet .crb-style nav.sub-nav a:first-child,
  8799. .actor.sheet .crb-style nav.sub-nav .tab:first-child {
  8800. border-left: none;
  8801. }
  8802. .actor.sheet .crb-style nav.sub-nav a:last-child,
  8803. .actor.sheet .crb-style nav.sub-nav .tab:last-child {
  8804. border-right: none;
  8805. }
  8806. .actor.sheet .crb-style nav.sub-nav a:hover,
  8807. .actor.sheet .crb-style nav.sub-nav .tab:hover {
  8808. text-shadow: 0 0 3px rgba(255, 255, 255, 0.5);
  8809. }
  8810. .actor.sheet .crb-style .tab nav.sub-nav {
  8811. padding-right: 20px;
  8812. }
  8813. .actor.sheet .crb-style .stroke-header {
  8814. position: relative;
  8815. }
  8816. .actor.sheet .crb-style .stroke-header svg {
  8817. position: absolute;
  8818. fill: var(--primary);
  8819. }
  8820. .actor.sheet .crb-style .stroke-header h3 {
  8821. position: relative;
  8822. }
  8823. .actor.sheet .crb-style.limited .sidebar {
  8824. align-items: center;
  8825. display: flex;
  8826. flex-direction: column;
  8827. height: 100%;
  8828. }
  8829. .actor.sheet .crb-style.limited .sidebar .profile-img {
  8830. display: flex;
  8831. align-items: end;
  8832. margin: 1rem 0;
  8833. max-width: 85%;
  8834. max-height: 200px;
  8835. background-color: var(--tertiary);
  8836. background-size: cover;
  8837. background-position: top center;
  8838. border: 1px solid rgba(0, 0, 0, 0.5);
  8839. box-shadow: 0 0 0 1px #c0c0c0, 0 0 0 2px #808080;
  8840. }
  8841. .actor.sheet .crb-style.limited .sidebar .appearance {
  8842. color: var(--sidebar-title);
  8843. display: flex;
  8844. flex-direction: column;
  8845. }
  8846. .actor.sheet .crb-style.limited .sidebar .appearance h3 {
  8847. border-bottom: none;
  8848. font-size: 1rem;
  8849. text-align: center;
  8850. }
  8851. .actor.sheet .crb-style.limited .sidebar .appearance .body {
  8852. font-weight: 400;
  8853. font-size: var(--font-size-14);
  8854. }
  8855. .actor.sheet .crb-style.limited .sidebar .orn img {
  8856. border: none;
  8857. position: relative;
  8858. }
  8859. .actor.sheet .crb-style.limited .sidebar .orn img:first-child {
  8860. left: 4px;
  8861. }
  8862. .actor.sheet .crb-style.limited .sidebar .orn img:last-child {
  8863. right: 4px;
  8864. transform: scaleX(-1);
  8865. }
  8866. .actor.sheet .crb-style.limited .sidebar ul.stats {
  8867. margin: 0;
  8868. padding: 0;
  8869. list-style: none;
  8870. text-align: center;
  8871. }
  8872. .actor.sheet .crb-style.limited .sidebar ul.stats li {
  8873. margin: 0;
  8874. padding: 0;
  8875. }
  8876. .actor.sheet .crb-style.limited .tab.biography .bio.backstory p:first-child {
  8877. margin-top: 0;
  8878. }
  8879. .actor.sheet .crb-style input.adjusted:not(:focus) {
  8880. font-weight: 700;
  8881. color: #009988;
  8882. }
  8883. .actor.sheet .crb-style button.tag:disabled {
  8884. cursor: not-allowed;
  8885. background-color: var(--color-text-dark-inactive);
  8886. }
  8887. .actor.sheet .crb-style .tags .tag.edit-btn {
  8888. align-items: center;
  8889. border-radius: 0;
  8890. display: flex;
  8891. justify-content: center;
  8892. }
  8893. .actor.sheet .crb-style .tags .tag.edit-btn a {
  8894. display: inline-flex;
  8895. }
  8896. .actor.sheet .crb-style .tags .tag.edit-btn a svg {
  8897. height: 9px;
  8898. width: auto;
  8899. }
  8900. .spellcasting-entry.preparation h3 {
  8901. border-bottom: none;
  8902. }
  8903. .spellcasting-entry.preparation button > i {
  8904. margin-right: 0;
  8905. }
  8906. .spellcasting-entry.preparation ol.spell-list {
  8907. margin: 0;
  8908. padding: 0;
  8909. border-bottom: 1px solid var(--color-border-light-2);
  8910. flex-basis: 100%;
  8911. gap: 1px;
  8912. position: relative;
  8913. width: 100%;
  8914. z-index: 1;
  8915. }
  8916. .spellcasting-entry.preparation ol.spell-list > li {
  8917. margin: 0;
  8918. padding: 0;
  8919. align-items: center;
  8920. background: none;
  8921. cursor: default;
  8922. display: grid;
  8923. grid: "name range components cast-spell controls" auto "content content content content content" auto/9fr 4fr 4fr 2fr 2.5fr;
  8924. justify-content: center;
  8925. padding: 0 0.3em 1px 0.35em;
  8926. }
  8927. .spellcasting-entry.preparation ol.spell-list > li[data-expended-state=true] h4 {
  8928. color: var(--color-disabled);
  8929. text-decoration: line-through;
  8930. }
  8931. .spellcasting-entry.preparation ol.spell-list > li[data-expended-state=true] .cast-spell {
  8932. background: var(--color-disabled);
  8933. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  8934. cursor: not-allowed;
  8935. }
  8936. .spellcasting-entry.preparation ol.spell-list > li:nth-child(odd) {
  8937. background-color: rgba(120, 100, 82, 0.1);
  8938. }
  8939. .spellcasting-entry.preparation ol.spell-list > li:last-child {
  8940. border-bottom: 1px solid var(--sub);
  8941. }
  8942. .spellcasting-entry.preparation ol.spell-list > li:last-child .item-image {
  8943. margin-bottom: 0;
  8944. margin-top: 2px;
  8945. }
  8946. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header {
  8947. margin: 0;
  8948. padding: 0;
  8949. background: rgba(96, 88, 86, 0.25);
  8950. border: 1px solid var(--color-border-light-2);
  8951. border-radius: 2px;
  8952. color: var(--text-dark);
  8953. font: 500 var(--font-size-12) var(--sans-serif);
  8954. letter-spacing: 0.25px;
  8955. line-height: 1;
  8956. padding: 0 0.5em;
  8957. text-transform: uppercase;
  8958. }
  8959. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header h3 {
  8960. text-transform: capitalize;
  8961. font-size: var(--font-size-13);
  8962. margin-left: 0;
  8963. padding: 4px 0;
  8964. }
  8965. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .item-name {
  8966. line-height: 1;
  8967. gap: 0.25em;
  8968. }
  8969. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .item-name h3 {
  8970. margin: 0;
  8971. padding: 0;
  8972. font-weight: 700;
  8973. }
  8974. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .item-controls {
  8975. grid-column: span 2;
  8976. }
  8977. .spellcasting-entry.preparation ol.spell-list > li .uses {
  8978. align-items: center;
  8979. display: flex;
  8980. gap: 0.25em;
  8981. line-height: 1;
  8982. }
  8983. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header input,
  8984. .spellcasting-entry.preparation ol.spell-list > li .uses input {
  8985. background: var(--alt);
  8986. border-radius: 3px;
  8987. border: 1px solid var(--sub);
  8988. color: var(--text-light);
  8989. font: var(--font-size-12) var(--sans-serif);
  8990. height: unset;
  8991. text-align: center;
  8992. width: 2em;
  8993. }
  8994. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .spell-slots-increment-reset,
  8995. .spellcasting-entry.preparation ol.spell-list > li .uses .spell-slots-increment-reset {
  8996. padding-left: 5px;
  8997. font-size: var(--font-size-10);
  8998. }
  8999. .spellcasting-entry.preparation ol.spell-list > li.spell {
  9000. border: none;
  9001. font-size: var(--font-size-13);
  9002. }
  9003. .spellcasting-entry.preparation ol.spell-list > li .level-prepared-toggle {
  9004. flex: 0;
  9005. font-size: 0.75rem;
  9006. color: var(--secondary);
  9007. }
  9008. .spellcasting-entry.preparation ol.spell-list > li .item-name {
  9009. align-items: center;
  9010. display: flex;
  9011. flex-wrap: nowrap;
  9012. justify-content: start;
  9013. justify-self: start;
  9014. min-height: 1.75rem;
  9015. }
  9016. .spellcasting-entry.preparation ol.spell-list > li .item-name h3 {
  9017. white-space: nowrap;
  9018. }
  9019. .spellcasting-entry.preparation ol.spell-list > li .item-name + span {
  9020. font-size: 0.75rem;
  9021. }
  9022. .spellcasting-entry.preparation ol.spell-list > li .item-name .focus-pool-input {
  9023. align-items: center;
  9024. display: flex;
  9025. flex-wrap: nowrap;
  9026. }
  9027. .spellcasting-entry.preparation ol.spell-list > li .item-name .slash {
  9028. font-size: 0.75rem;
  9029. }
  9030. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-slots,
  9031. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-max {
  9032. padding-top: 3px;
  9033. font-size: 0.75rem;
  9034. }
  9035. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-slots.infinity,
  9036. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-max.infinity {
  9037. position: relative;
  9038. top: -2px;
  9039. }
  9040. .spellcasting-entry.preparation ol.spell-list > li .item-name .item-image {
  9041. height: 1.5rem;
  9042. width: 1.5rem;
  9043. flex: 0 0 auto;
  9044. margin: 2px 0;
  9045. }
  9046. .spellcasting-entry.preparation ol.spell-list > li .item-name h4 {
  9047. margin: 0;
  9048. padding: 0;
  9049. font-size: var(--font-size-14);
  9050. letter-spacing: -0.075em;
  9051. line-height: 1;
  9052. margin-left: 8px;
  9053. cursor: pointer;
  9054. }
  9055. .spellcasting-entry.preparation ol.spell-list > li .item-name h4:hover {
  9056. color: var(--secondary);
  9057. }
  9058. .spellcasting-entry.preparation ol.spell-list > li .item-name .action-glyph {
  9059. margin-left: 4px;
  9060. font-size: small;
  9061. }
  9062. .spellcasting-entry.preparation ol.spell-list > li .item-name.empty {
  9063. grid-column: 1/span 4;
  9064. }
  9065. .spellcasting-entry.preparation ol.spell-list > li .spell-range {
  9066. grid-area: range;
  9067. padding-left: 0.2em;
  9068. }
  9069. .spellcasting-entry.preparation ol.spell-list > li .spell-components {
  9070. grid-area: components;
  9071. justify-self: right;
  9072. padding: 0 0.5em;
  9073. }
  9074. .spellcasting-entry.preparation ol.spell-list > li .spell-components .tag {
  9075. font: var(--font-size-12) var(--sans-serif-condensed);
  9076. }
  9077. .spellcasting-entry.preparation ol.spell-list > li .spell-cast {
  9078. grid-area: cast-spell;
  9079. display: flex;
  9080. justify-content: center;
  9081. }
  9082. .spellcasting-entry.preparation ol.spell-list > li .item-controls {
  9083. grid-area: controls;
  9084. display: flex;
  9085. justify-self: end;
  9086. padding-right: 0.25em;
  9087. }
  9088. .spellcasting-entry.preparation ol.spell-list > li button.cast-spell {
  9089. align-items: center;
  9090. background: var(--secondary);
  9091. border-radius: 2px;
  9092. border: black;
  9093. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  9094. color: var(--text-light);
  9095. cursor: pointer;
  9096. display: flex;
  9097. font: 700 0.55rem var(--sans-serif);
  9098. justify-self: center;
  9099. letter-spacing: 0.25px;
  9100. max-width: fit-content;
  9101. padding: 0.5em 1em;
  9102. text-transform: uppercase;
  9103. }
  9104. .spellcasting-entry.preparation ol.spell-list > li .item-summary {
  9105. grid-area: content;
  9106. width: 100%;
  9107. padding: 8px;
  9108. border-bottom: 1px solid var(--sub);
  9109. border-top: 1px solid #aca5a3;
  9110. background-color: var(--bg);
  9111. }
  9112. .spellcasting-entry.preparation ol.spell-list[data-category=spontaneous] .virtual {
  9113. position: relative;
  9114. }
  9115. .spellcasting-entry.preparation ol.spell-list[data-category=spontaneous] .virtual::before {
  9116. pointer-events: none;
  9117. content: "";
  9118. position: absolute;
  9119. height: 100%;
  9120. width: 100%;
  9121. background-color: rgba(0, 5, 255, 0.1137254902);
  9122. mix-blend-mode: saturation;
  9123. }
  9124. .spellcasting-entry.preparation ol.spell-list[data-category=spontaneous] .item:not(.virtual) + .virtual {
  9125. border-top: 1px solid rgba(0, 0, 0, 0.15);
  9126. }
  9127. .spellcasting-entry.preparation ol.spell-list .level-prepared-header {
  9128. font-size: 0.75rem;
  9129. color: var(--text-light);
  9130. margin: 0;
  9131. padding: 4px;
  9132. text-align: center;
  9133. background: var(--secondary);
  9134. position: relative;
  9135. }
  9136. .spellcasting-entry.preparation ol.spell-list .spell .item-name {
  9137. width: 100%;
  9138. }
  9139. .spellcasting-entry.preparation ol.spell-list input.toggle-signature-spell[type=checkbox] {
  9140. width: 12px;
  9141. height: 12px;
  9142. margin: 0 2px 0 0;
  9143. flex: 0 0 auto;
  9144. }
  9145. .spellcasting-entry.preparation ol.spell-list .spellbook-empty {
  9146. display: flex;
  9147. align-items: center;
  9148. min-height: 28px;
  9149. justify-content: flex-end;
  9150. }
  9151. .spellcasting-entry.preparation ol.spell-list .spellbook-empty h4 {
  9152. margin: 0;
  9153. white-space: nowrap;
  9154. margin-right: auto;
  9155. }
  9156. .spellcasting-entry.preparation ol.spell-list .spellbook-empty a {
  9157. flex: 0 1 0;
  9158. white-space: nowrap;
  9159. margin-left: 8px;
  9160. }
  9161. .spellcasting-entry.preparation form {
  9162. display: flex;
  9163. flex-direction: column;
  9164. height: 100%;
  9165. padding: 4px;
  9166. }
  9167. .spellcasting-entry.preparation .sheet-header {
  9168. align-items: baseline;
  9169. display: block;
  9170. flex: 0;
  9171. padding-right: 16px;
  9172. }
  9173. .spellcasting-entry.preparation .sheet-header h1 {
  9174. display: flex;
  9175. flex: 1;
  9176. overflow: hidden;
  9177. font-family: var(--serif-condensed);
  9178. font-weight: 700;
  9179. white-space: nowrap;
  9180. justify-content: space-between;
  9181. }
  9182. .spellcasting-entry.preparation .sheet-header p.hint {
  9183. margin: auto auto 1em;
  9184. }
  9185. .spellcasting-entry.preparation .sheet-header .item-controls {
  9186. flex: 0;
  9187. white-space: nowrap;
  9188. }
  9189. .spellcasting-entry.preparation .sheet-content {
  9190. overflow: hidden scroll;
  9191. padding-bottom: 1em;
  9192. padding-right: 8px;
  9193. }
  9194. .currency {
  9195. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  9196. align-items: center;
  9197. background-color: var(--sub);
  9198. display: flex;
  9199. font-size: var(--font-size-13);
  9200. list-style: none;
  9201. margin: 0;
  9202. padding: 3px;
  9203. }
  9204. .currency .label {
  9205. color: var(--color-text-light-0);
  9206. font-weight: 500;
  9207. margin: 0 10px 0 4px;
  9208. }
  9209. .currency .denomination {
  9210. align-items: center;
  9211. background-color: transparent;
  9212. border-left: 1px solid rgba(0, 0, 0, 0.2);
  9213. border-right: 1px solid rgba(255, 255, 255, 0.1);
  9214. color: var(--color-text-light-0);
  9215. display: flex;
  9216. flex-wrap: nowrap;
  9217. flex: 0 1 auto;
  9218. justify-content: start;
  9219. text-shadow: 0 0 3px rgba(0, 0, 0, 0.75);
  9220. width: 100%;
  9221. }
  9222. .currency .denomination:first-child {
  9223. border-left: none;
  9224. }
  9225. .currency .denomination:last-child {
  9226. border-right: none;
  9227. margin-right: 8px;
  9228. }
  9229. .currency .denomination label {
  9230. color: #ffe8d1;
  9231. text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.2), -1px -1px 1px rgba(0, 0, 0, 0.2);
  9232. font-family: var(--sans-serif);
  9233. font-size: var(--font-size-10);
  9234. text-transform: uppercase;
  9235. letter-spacing: 0.05em;
  9236. text-rendering: optimizeLegibility;
  9237. }
  9238. .currency .denomination span {
  9239. padding-left: 8px;
  9240. padding-right: 12px;
  9241. }
  9242. .currency .denomination.pp .currency-image {
  9243. background: url("../icons/equipment/treasure/currency/platinum-pieces.webp") no-repeat;
  9244. }
  9245. .currency .denomination.gp .currency-image {
  9246. background: url("../icons/equipment/treasure/currency/gold-pieces.webp") no-repeat;
  9247. }
  9248. .currency .denomination.sp .currency-image {
  9249. background: url("../icons/equipment/treasure/currency/silver-pieces.webp") no-repeat;
  9250. }
  9251. .currency .denomination.cp .currency-image {
  9252. background: url("../icons/equipment/treasure/currency/copper-pieces.webp") no-repeat;
  9253. }
  9254. .currency .denomination .currency-image {
  9255. box-shadow: 0 0 0 1px #9f725b, 0 0 0 2px var(--tertiary), 0 0 0 3px #956d58;
  9256. height: 24px;
  9257. width: 24px;
  9258. background-size: cover !important;
  9259. }
  9260. .currency li > button {
  9261. display: flex;
  9262. justify-content: center;
  9263. align-items: center;
  9264. margin: 0;
  9265. padding: 0;
  9266. background-color: var(--tertiary);
  9267. border-radius: 1px;
  9268. border: none;
  9269. 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);
  9270. color: rgba(0, 0, 0, 0.75);
  9271. font-size: var(--font-size-13);
  9272. font-weight: 600;
  9273. height: 24px;
  9274. line-height: 1;
  9275. margin-left: 2px;
  9276. width: 30px;
  9277. }
  9278. .currency li > button > i {
  9279. margin: 0;
  9280. padding: 0;
  9281. }
  9282. .currency li > button:disabled {
  9283. opacity: 0.6;
  9284. }
  9285. .currency li > button:hover:not(:disabled) {
  9286. background-color: var(--primary);
  9287. color: var(--color-text-light-0);
  9288. cursor: pointer;
  9289. }
  9290. .wealth {
  9291. font-family: var(--sans-serif);
  9292. font-size: var(--font-size-10);
  9293. text-transform: uppercase;
  9294. letter-spacing: 0.05em;
  9295. text-rendering: optimizeLegibility;
  9296. align-items: center;
  9297. background-color: var(--alt);
  9298. display: flex;
  9299. margin-bottom: 10px;
  9300. min-height: 22px;
  9301. justify-content: flex-end;
  9302. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  9303. }
  9304. .wealth h3 {
  9305. font-size: var(--font-size-13);
  9306. text-transform: capitalize;
  9307. text-shadow: 0 0 2px rgba(0, 0, 0, 0.75);
  9308. margin: 2px;
  9309. margin-left: 4px;
  9310. cursor: default;
  9311. }
  9312. .wealth h3:hover {
  9313. color: var(--color-text-light-0);
  9314. }
  9315. .wealth h3.item-name {
  9316. flex-grow: 1;
  9317. color: var(--color-text-light-0);
  9318. margin-bottom: 0;
  9319. font-weight: bold;
  9320. margin: 0 5px;
  9321. }
  9322. .wealth h3.item-name span {
  9323. margin-left: 5px;
  9324. font-weight: normal;
  9325. text-transform: uppercase;
  9326. }
  9327. .wealth ol {
  9328. padding-right: 0;
  9329. padding-bottom: 0;
  9330. margin-bottom: 0;
  9331. margin-right: 0;
  9332. }
  9333. /* Actor-type Imports */
  9334. .sheet.familiar .section-container {
  9335. display: flex;
  9336. flex-direction: column;
  9337. }
  9338. .sheet.familiar .section-container .section-header {
  9339. border: 1px solid var(--primary);
  9340. border-radius: 3px 3px 0px 0px;
  9341. background: var(--primary);
  9342. display: flex;
  9343. flex: 0;
  9344. width: 100%;
  9345. flex-direction: row;
  9346. justify-content: space-between;
  9347. align-items: baseline;
  9348. text-align: left;
  9349. color: var(--text-light);
  9350. font-size: var(--font-size-13);
  9351. padding: 0 8px;
  9352. line-height: 2em;
  9353. }
  9354. .sheet.familiar .section-container .section-header h4 {
  9355. flex: auto;
  9356. display: flex;
  9357. align-items: baseline;
  9358. gap: 4px;
  9359. margin-bottom: 0px;
  9360. text-transform: uppercase;
  9361. }
  9362. .sheet.familiar .section-container .section-header input {
  9363. color: inherit;
  9364. width: auto;
  9365. }
  9366. .sheet.familiar .section-container .section-header .controls {
  9367. gap: 0.5rem;
  9368. white-space: nowrap;
  9369. }
  9370. .sheet.familiar .section-container .section-body {
  9371. border: 1px solid var(--primary);
  9372. border-radius: 0px 0px 3px 3px;
  9373. display: flex;
  9374. flex: auto;
  9375. flex-wrap: wrap;
  9376. flex-direction: row;
  9377. align-items: baseline;
  9378. justify-content: flex-start;
  9379. width: 100%;
  9380. }
  9381. .sheet.familiar .section-container.headerless .section-body {
  9382. border-radius: 3px;
  9383. }
  9384. .sheet.familiar .actions-list,
  9385. .sheet.familiar .attacks-list {
  9386. margin: 0;
  9387. padding: 0;
  9388. width: 100%;
  9389. }
  9390. .sheet.familiar .actions-list .controls,
  9391. .sheet.familiar .attacks-list .controls {
  9392. align-items: baseline;
  9393. display: flex;
  9394. flex: 0;
  9395. flex-wrap: nowrap;
  9396. font-size: var(--font-size-12);
  9397. gap: 1px;
  9398. margin-left: auto;
  9399. }
  9400. .sheet.familiar .actions-list .controls .chat,
  9401. .sheet.familiar .attacks-list .controls .chat {
  9402. margin-right: 2px;
  9403. font-size: 0.9em;
  9404. }
  9405. .sheet.familiar .actions-list li.action .button-group,
  9406. .sheet.familiar .actions-list li.attack .button-group,
  9407. .sheet.familiar .attacks-list li.action .button-group,
  9408. .sheet.familiar .attacks-list li.attack .button-group {
  9409. display: flex;
  9410. gap: 0.25em;
  9411. justify-content: start;
  9412. min-width: 100%;
  9413. }
  9414. .sheet.familiar .actions-list li.action .button-group .flexrow,
  9415. .sheet.familiar .actions-list li.action .button-group .sub-section,
  9416. .sheet.familiar .actions-list li.attack .button-group .flexrow,
  9417. .sheet.familiar .actions-list li.attack .button-group .sub-section,
  9418. .sheet.familiar .attacks-list li.action .button-group .flexrow,
  9419. .sheet.familiar .attacks-list li.action .button-group .sub-section,
  9420. .sheet.familiar .attacks-list li.attack .button-group .flexrow,
  9421. .sheet.familiar .attacks-list li.attack .button-group .sub-section {
  9422. gap: 2px;
  9423. }
  9424. .sheet.familiar .actions-list li.action .button-group .sub-section,
  9425. .sheet.familiar .actions-list li.attack .button-group .sub-section,
  9426. .sheet.familiar .attacks-list li.action .button-group .sub-section,
  9427. .sheet.familiar .attacks-list li.attack .button-group .sub-section {
  9428. align-items: start;
  9429. display: flex;
  9430. flex-wrap: wrap;
  9431. justify-content: flex-start;
  9432. }
  9433. .sheet.familiar .actions-list li.action .button-group .sub-section h4,
  9434. .sheet.familiar .actions-list li.attack .button-group .sub-section h4,
  9435. .sheet.familiar .attacks-list li.action .button-group .sub-section h4,
  9436. .sheet.familiar .attacks-list li.attack .button-group .sub-section h4 {
  9437. margin-left: var(--font-size-12);
  9438. margin-right: var(--font-size-12);
  9439. }
  9440. .sheet.familiar .actions-list li.action .button-group button,
  9441. .sheet.familiar .actions-list li.attack .button-group button,
  9442. .sheet.familiar .attacks-list li.action .button-group button,
  9443. .sheet.familiar .attacks-list li.attack .button-group button {
  9444. align-items: center;
  9445. display: flex;
  9446. border-radius: 3px;
  9447. border: none;
  9448. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  9449. color: var(--color-text-light-0);
  9450. cursor: pointer;
  9451. font-size: var(--font-size-11);
  9452. height: var(--font-size-18);
  9453. justify-content: center;
  9454. line-height: var(--font-size-18);
  9455. margin: 0;
  9456. padding: 0 8px;
  9457. white-space: nowrap;
  9458. width: auto;
  9459. }
  9460. .sheet.familiar .actions-list li.action .button-group button:first-child,
  9461. .sheet.familiar .actions-list li.attack .button-group button:first-child,
  9462. .sheet.familiar .attacks-list li.action .button-group button:first-child,
  9463. .sheet.familiar .attacks-list li.attack .button-group button:first-child {
  9464. margin-left: 0px;
  9465. }
  9466. .sheet.familiar .actions-list li.action .button-group button:hover,
  9467. .sheet.familiar .actions-list li.attack .button-group button:hover,
  9468. .sheet.familiar .attacks-list li.action .button-group button:hover,
  9469. .sheet.familiar .attacks-list li.attack .button-group button:hover {
  9470. box-shadow: none;
  9471. text-shadow: 0 0 2px var(--color-text-light-0);
  9472. }
  9473. .sheet.familiar .actions-list li.action .button-group .attack-button,
  9474. .sheet.familiar .actions-list li.attack .button-group .attack-button,
  9475. .sheet.familiar .attacks-list li.action .button-group .attack-button,
  9476. .sheet.familiar .attacks-list li.attack .button-group .attack-button {
  9477. background-color: var(--secondary);
  9478. }
  9479. .sheet.familiar .actions-list li.action .button-group .damage-button,
  9480. .sheet.familiar .actions-list li.action .button-group .critical-button,
  9481. .sheet.familiar .actions-list li.attack .button-group .damage-button,
  9482. .sheet.familiar .actions-list li.attack .button-group .critical-button,
  9483. .sheet.familiar .attacks-list li.action .button-group .damage-button,
  9484. .sheet.familiar .attacks-list li.action .button-group .critical-button,
  9485. .sheet.familiar .attacks-list li.attack .button-group .damage-button,
  9486. .sheet.familiar .attacks-list li.attack .button-group .critical-button {
  9487. background-color: var(--primary);
  9488. }
  9489. .sheet.familiar .actions-list li.attack,
  9490. .sheet.familiar .attacks-list li.attack {
  9491. border-bottom: 1px solid var(--color-border-light-tertiary);
  9492. display: flex;
  9493. flex-direction: row;
  9494. justify-content: start;
  9495. gap: 0.25rem;
  9496. padding: 0.25rem 0;
  9497. }
  9498. .sheet.familiar .actions-list li.attack:last-child,
  9499. .sheet.familiar .attacks-list li.attack:last-child {
  9500. border-bottom: none;
  9501. }
  9502. .sheet.familiar .actions-list li.attack > h4,
  9503. .sheet.familiar .attacks-list li.attack > h4 {
  9504. align-items: center;
  9505. display: flex;
  9506. flex-wrap: wrap;
  9507. font-size: 0.9rem;
  9508. font-weight: 500;
  9509. gap: 2px;
  9510. margin: 0 4px 0 0;
  9511. white-space: nowrap;
  9512. }
  9513. .sheet.familiar .actions-list li.attack > h4 > span,
  9514. .sheet.familiar .actions-list li.attack > h4 > a,
  9515. .sheet.familiar .attacks-list li.attack > h4 > span,
  9516. .sheet.familiar .attacks-list li.attack > h4 > a {
  9517. display: flex;
  9518. gap: 3px;
  9519. line-height: 1.125rem;
  9520. margin-right: 4px;
  9521. }
  9522. .sheet.familiar .actions-list li.attack > .description,
  9523. .sheet.familiar .attacks-list li.attack > .description {
  9524. flex-basis: 100%;
  9525. }
  9526. .sheet.familiar .actions-list li.action,
  9527. .sheet.familiar .attacks-list li.action {
  9528. display: flex;
  9529. gap: 0.25rem;
  9530. }
  9531. .sheet.familiar .actions-list li.action:not(:last-child),
  9532. .sheet.familiar .attacks-list li.action:not(:last-child) {
  9533. border-bottom: 1px solid var(--color-border-light-tertiary);
  9534. }
  9535. .sheet.familiar .actions-list li.action > h4,
  9536. .sheet.familiar .attacks-list li.action > h4 {
  9537. align-items: center;
  9538. display: flex;
  9539. gap: 0.25rem;
  9540. flex: auto;
  9541. font-size: 0.9rem;
  9542. margin: 0;
  9543. }
  9544. .sheet.familiar .actions-list li.action > h4 > a,
  9545. .sheet.familiar .attacks-list li.action > h4 > a {
  9546. align-items: center;
  9547. display: flex;
  9548. gap: 2px;
  9549. }
  9550. .sheet.familiar .actions-list li.action .button-group > button.use-action,
  9551. .sheet.familiar .attacks-list li.action .button-group > button.use-action {
  9552. color: var(--color-text-light-0);
  9553. background-color: var(--secondary);
  9554. margin-right: 0.5rem;
  9555. }
  9556. .sheet.familiar .actions-list li.action .action-traits,
  9557. .sheet.familiar .attacks-list li.action .action-traits {
  9558. margin-left: var(--font-size-12);
  9559. }
  9560. .sheet.familiar .actions-list li.action .tracking,
  9561. .sheet.familiar .attacks-list li.action .tracking {
  9562. flex: 0;
  9563. align-items: center;
  9564. display: flex;
  9565. flex-direction: row;
  9566. flex-wrap: nowrap;
  9567. margin-left: auto;
  9568. margin-right: var(--font-size-16);
  9569. }
  9570. .sheet.familiar .actions-list li.action .tracking input,
  9571. .sheet.familiar .attacks-list li.action .tracking input {
  9572. background: none;
  9573. border: 0;
  9574. flex: 0 1 4rem;
  9575. flex: 1;
  9576. font-family: inherit;
  9577. font-size: 0.9rem;
  9578. height: auto;
  9579. padding: 0 3px;
  9580. text-align: center;
  9581. width: 0;
  9582. }
  9583. .sheet.familiar .actions-list li.action .tracking span,
  9584. .sheet.familiar .attacks-list li.action .tracking span {
  9585. white-space: nowrap;
  9586. }
  9587. .sheet.familiar .actions-list li.action .item-summary,
  9588. .sheet.familiar .attacks-list li.action .item-summary {
  9589. flex-basis: 100%;
  9590. }
  9591. .sheet.familiar form {
  9592. background: url("../assets/sheet/background.webp");
  9593. background-repeat: repeat-x, no-repeat;
  9594. background-size: cover;
  9595. background-attachment: local;
  9596. display: flex;
  9597. flex-direction: column;
  9598. height: 100%;
  9599. }
  9600. .sheet.familiar form > hr {
  9601. width: 100%;
  9602. }
  9603. .sheet.familiar input {
  9604. border: none;
  9605. border-radius: 0;
  9606. background-color: rgba(28, 28, 28, 0.1);
  9607. }
  9608. .sheet.familiar input:focus {
  9609. box-shadow: none;
  9610. }
  9611. .sheet.familiar select {
  9612. border: 1px solid transparent;
  9613. background: rgba(0, 0, 0, 0.05);
  9614. font-family: var(--body-serif);
  9615. font-size: var(--font-size-14);
  9616. font-weight: normal;
  9617. }
  9618. .sheet.familiar select:hover {
  9619. border: 1px solid black;
  9620. }
  9621. .sheet.familiar .familiar-sheet-header {
  9622. display: flex;
  9623. flex-direction: row;
  9624. padding: 4px 6px 0;
  9625. }
  9626. .sheet.familiar .familiar-sheet-header .image-container {
  9627. display: flex;
  9628. }
  9629. .sheet.familiar .familiar-sheet-header .image-container img.actor-image {
  9630. border-radius: 0;
  9631. flex: 0;
  9632. height: 100%;
  9633. min-width: 125px;
  9634. width: 125px;
  9635. }
  9636. .sheet.familiar .familiar-sheet-header .image-container [data-action=show-image] {
  9637. bottom: 2px;
  9638. right: 2px;
  9639. }
  9640. .sheet.familiar .familiar-sheet-header .header-content {
  9641. display: flex;
  9642. flex-direction: column;
  9643. border-radius: 0;
  9644. flex-grow: 1;
  9645. margin-left: 10px;
  9646. }
  9647. .sheet.familiar .familiar-sheet-header .header-content .charname {
  9648. display: flex;
  9649. flex-direction: row;
  9650. font-family: var(--sans-serif-condensed);
  9651. font-size: 1.75rem;
  9652. font-weight: 700;
  9653. width: 100%;
  9654. flex-wrap: nowrap;
  9655. align-items: baseline;
  9656. text-transform: capitalize;
  9657. gap: 0.25em;
  9658. }
  9659. .sheet.familiar .familiar-sheet-header .header-content .charname input {
  9660. font-weight: bold;
  9661. width: calc(100% - 6px);
  9662. border-bottom: 1px solid #d3ccbc;
  9663. text-transform: capitalize;
  9664. padding: 0;
  9665. margin-right: 5px;
  9666. font-variant: small-caps;
  9667. color: #323232;
  9668. }
  9669. .sheet.familiar .familiar-sheet-header .header-content .charname input::placeholder {
  9670. filter: opacity(0.5);
  9671. color: #1c1c1c;
  9672. }
  9673. .sheet.familiar .familiar-sheet-header .header-content .charname input:focus {
  9674. border-bottom: 1px solid #644f33;
  9675. }
  9676. .sheet.familiar .familiar-sheet-header .header-content .charname input:focus::placeholder {
  9677. color: transparent;
  9678. }
  9679. .sheet.familiar .familiar-sheet-header .header-content .charname .charname-value {
  9680. flex: 1 1;
  9681. }
  9682. .sheet.familiar .familiar-sheet-header .header-content .charname .familiar-title {
  9683. flex: 0 1;
  9684. text-align: right;
  9685. margin-right: 0.1em;
  9686. text-transform: uppercase;
  9687. }
  9688. .sheet.familiar .familiar-sheet-header .header-content .sub-header {
  9689. display: flex;
  9690. margin-bottom: 10px;
  9691. }
  9692. .sheet.familiar .familiar-sheet-header .header-content .sub-header .traits {
  9693. flex: 1;
  9694. }
  9695. .sheet.familiar .familiar-sheet-header .header-content .traits {
  9696. margin: 0.25em 0;
  9697. }
  9698. .sheet.familiar .familiar-sheet-header .header-content .traits span {
  9699. color: var(--text-light);
  9700. font-size: 0.75em;
  9701. font-weight: 700;
  9702. padding: 0.25em 0.5em;
  9703. letter-spacing: 1px;
  9704. text-transform: uppercase;
  9705. background-color: var(--primary);
  9706. border: 1px solid var(--tertiary);
  9707. }
  9708. .sheet.familiar .familiar-sheet-header .header-content .details-section {
  9709. display: flex;
  9710. flex-direction: row;
  9711. justify-content: space-between;
  9712. }
  9713. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section {
  9714. display: grid;
  9715. flex-direction: column;
  9716. height: max-content;
  9717. width: 150px;
  9718. grid-template-columns: min-content 1fr;
  9719. font-size: var(--font-size-14);
  9720. }
  9721. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section div {
  9722. white-space: nowrap;
  9723. }
  9724. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .label {
  9725. display: flex;
  9726. flex-direction: row;
  9727. align-items: center;
  9728. white-space: nowrap;
  9729. }
  9730. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .label h4 {
  9731. font-weight: bold;
  9732. margin: 0 0.25em 0 0;
  9733. padding-left: 6px;
  9734. }
  9735. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value {
  9736. display: flex;
  9737. flex-direction: row;
  9738. align-items: center;
  9739. padding-left: 4px;
  9740. }
  9741. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input {
  9742. width: 2em;
  9743. text-align: right;
  9744. padding-right: 3px;
  9745. border: 1px solid transparent;
  9746. background: none;
  9747. height: auto;
  9748. }
  9749. .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 {
  9750. border: 1px solid black;
  9751. box-shadow: 0 0 10px #00005a;
  9752. }
  9753. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value .total-hp {
  9754. flex-grow: 1;
  9755. }
  9756. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .temp-hp {
  9757. display: flex;
  9758. margin-left: 8px;
  9759. align-items: baseline;
  9760. }
  9761. .sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .temp-hp input {
  9762. text-align: left;
  9763. }
  9764. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section {
  9765. display: flex;
  9766. flex-direction: column;
  9767. }
  9768. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list {
  9769. display: flex;
  9770. flex-direction: row;
  9771. justify-content: space-between;
  9772. gap: 12px;
  9773. }
  9774. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name,
  9775. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac {
  9776. display: flex;
  9777. flex-direction: column;
  9778. align-items: center;
  9779. column-gap: 0.5em;
  9780. }
  9781. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name .name,
  9782. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac .name {
  9783. font-weight: bold;
  9784. text-transform: capitalize;
  9785. }
  9786. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name .value,
  9787. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac .value {
  9788. font-style: normal;
  9789. }
  9790. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name .value i,
  9791. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac .value i {
  9792. margin-right: 2px;
  9793. }
  9794. .sheet.familiar .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac {
  9795. border-right: 1px solid rgba(0, 0, 0, 0.15);
  9796. padding-right: 12px;
  9797. }
  9798. .sheet.familiar .familiar-sheet-header .header-content .dying-section {
  9799. display: flex;
  9800. gap: 10px;
  9801. justify-content: end;
  9802. }
  9803. .sheet.familiar .familiar-sheet-header .header-content .dying-section .name {
  9804. font-weight: bold;
  9805. }
  9806. .sheet.familiar .familiar-sheet-header .header-content .dying-section .dots {
  9807. display: flex;
  9808. gap: 4px;
  9809. align-items: baseline;
  9810. }
  9811. .sheet.familiar .familiar-sheet-header .header-content .dying-section .pips {
  9812. display: flex;
  9813. gap: 1px;
  9814. }
  9815. .sheet.familiar .main-section {
  9816. display: flex;
  9817. flex: 1;
  9818. flex-direction: row;
  9819. overflow: hidden;
  9820. }
  9821. .sheet.familiar .main-section .main-container {
  9822. overflow: hidden scroll;
  9823. flex-grow: 2;
  9824. }
  9825. .sheet.familiar .section-container {
  9826. margin: 6px 6px;
  9827. }
  9828. .sheet.familiar .section-container .section-body {
  9829. align-items: stretch;
  9830. flex-direction: column;
  9831. padding: 4px;
  9832. }
  9833. .sheet.familiar .section-container .section-body input {
  9834. font-family: var(--body-serif);
  9835. font-weight: bold;
  9836. width: calc(100% - 6px);
  9837. border-bottom: 1px solid #d3ccbc;
  9838. text-transform: capitalize;
  9839. }
  9840. .sheet.familiar .section-container .section-body input::placeholder {
  9841. filter: opacity(0.5);
  9842. color: #1c1c1c;
  9843. }
  9844. .sheet.familiar .section-container .section-body input:focus {
  9845. border-bottom: 1px solid #644f33;
  9846. }
  9847. .sheet.familiar .section-container .section-body input:focus::placeholder {
  9848. color: transparent;
  9849. }
  9850. .sheet.familiar .familiar-section {
  9851. flex-basis: 50%;
  9852. display: flex;
  9853. flex-direction: column;
  9854. }
  9855. .sheet.familiar .familiar-section .detail {
  9856. display: flex;
  9857. flex-direction: column;
  9858. flex-wrap: nowrap;
  9859. margin-top: 3px;
  9860. }
  9861. .sheet.familiar .familiar-section .detail .detail-label {
  9862. font-size: var(--font-size-10);
  9863. font-weight: 800;
  9864. line-height: 1;
  9865. text-transform: uppercase;
  9866. font-family: var(--sans-serif);
  9867. color: var(--primary);
  9868. white-space: nowrap;
  9869. margin-bottom: 3px;
  9870. }
  9871. .sheet.familiar .familiar-section .detail h4 {
  9872. font-size: var(--font-size-14);
  9873. font-family: var(--serif);
  9874. font-weight: bold;
  9875. background-color: rgba(0, 0, 0, 0.05);
  9876. padding-left: 2px;
  9877. margin: none;
  9878. }
  9879. .sheet.familiar .familiar-section .familiar-content {
  9880. display: flex;
  9881. flex-direction: row;
  9882. margin-bottom: 5px;
  9883. column-gap: 15px;
  9884. }
  9885. .sheet.familiar .familiar-section .familiar-content input {
  9886. border: none;
  9887. border-radius: 0;
  9888. }
  9889. .sheet.familiar .familiar-section .familiar-content input[type=text] {
  9890. background-color: rgba(0, 0, 0, 0.05);
  9891. }
  9892. .sheet.familiar .familiar-section .familiar-content input:focus {
  9893. box-shadow: none;
  9894. }
  9895. .sheet.familiar .familiar-section .familiar-content h3 {
  9896. background-color: rgba(0, 0, 0, 0.05);
  9897. height: 26px;
  9898. font-family: var(--body-serif);
  9899. font-size: var(--font-size-14);
  9900. padding: 8px 4px 6px;
  9901. line-height: 1;
  9902. }
  9903. .sheet.familiar .familiar-section .familiar-content .familiar-species {
  9904. flex-basis: 50%;
  9905. }
  9906. .sheet.familiar .familiar-section .familiar-content .familiar-size {
  9907. flex-basis: 50%;
  9908. }
  9909. .sheet.familiar .familiar-section .familiar-content .familiar-modifier {
  9910. flex-basis: 50%;
  9911. }
  9912. .sheet.familiar .familiar-section .familiar-content .familiar-modifier select {
  9913. font-weight: bold;
  9914. }
  9915. .sheet.familiar .familiar-section .familiar-content .familiar-senses {
  9916. flex-basis: 50%;
  9917. height: min-content;
  9918. }
  9919. .sheet.familiar .familiar-section .familiar-content .familiar-senses .tags {
  9920. margin: 0;
  9921. padding: 0;
  9922. }
  9923. .sheet.familiar .familiar-section .familiar-content .familiar-senses .tags ol {
  9924. margin: 0;
  9925. }
  9926. .sheet.familiar .familiar-section .familiar-content .familiar-speed {
  9927. flex-basis: 30%;
  9928. }
  9929. .sheet.familiar .skills-content {
  9930. display: flex;
  9931. flex-direction: column;
  9932. width: 150px;
  9933. gap: 10px;
  9934. }
  9935. .sheet.familiar .skills-content .skills-list {
  9936. display: flex;
  9937. column-gap: 0.25em;
  9938. row-gap: 0.25em;
  9939. flex-direction: column;
  9940. justify-content: center;
  9941. }
  9942. .sheet.familiar .skills-content .skills-list .skill-name {
  9943. display: flex;
  9944. flex-direction: row;
  9945. align-items: center;
  9946. border: 1px solid #999;
  9947. border-radius: 3px;
  9948. height: 20px;
  9949. cursor: pointer;
  9950. font-size: var(--font-size-14);
  9951. font-family: var(--serif);
  9952. }
  9953. .sheet.familiar .skills-content .skills-list .skill-name:hover {
  9954. padding: none;
  9955. border: 1px solid #323232;
  9956. }
  9957. .sheet.familiar .skills-content .skills-list .skill-name .name {
  9958. flex: 4;
  9959. }
  9960. .sheet.familiar .skills-content .skills-list .skill-name .score {
  9961. flex: 1;
  9962. text-align: center;
  9963. padding-left: 1em;
  9964. color: var(--primary);
  9965. font-weight: bold;
  9966. }
  9967. .sheet.familiar .skills-content .skills-attack {
  9968. flex: 1;
  9969. align-self: center;
  9970. border: 1px solid transparent;
  9971. cursor: pointer;
  9972. }
  9973. .sheet.familiar .skills-content .skills-attack:hover {
  9974. border-bottom: 1px solid #323232;
  9975. }
  9976. .sheet.familiar .actions-list .action {
  9977. padding-top: 4px;
  9978. padding-bottom: 4px;
  9979. }
  9980. .sheet.familiar .effects-list {
  9981. margin: 0;
  9982. padding: 0;
  9983. gap: 0.2em;
  9984. }
  9985. .sheet.familiar .effects-list .item {
  9986. display: flex;
  9987. flex-wrap: wrap;
  9988. align-items: center;
  9989. justify-content: space-between;
  9990. padding: 2px 4px 2px 12px;
  9991. width: 100%;
  9992. }
  9993. .sheet.familiar .effects-list .item p:empty {
  9994. display: none;
  9995. }
  9996. .sheet.familiar .effects-list .item .item-name {
  9997. display: flex;
  9998. align-items: center;
  9999. flex: 1;
  10000. }
  10001. .sheet.familiar .effects-list .item .item-name h4 {
  10002. cursor: pointer;
  10003. margin: 0;
  10004. }
  10005. .sheet.familiar .effects-list .item .item-name .item-image {
  10006. margin-right: 8px;
  10007. }
  10008. .sheet.familiar .effects-list .item .item-controls {
  10009. display: flex;
  10010. flex: 0;
  10011. font-size: var(--font-size-12);
  10012. gap: 1px;
  10013. white-space: nowrap;
  10014. }
  10015. .sheet.familiar .effects-list .item .item-controls a.info-only:hover {
  10016. cursor: default;
  10017. text-shadow: none;
  10018. }
  10019. .sheet.familiar .effects-list .item .item-controls a + a {
  10020. margin-left: 4px;
  10021. }
  10022. .sheet.familiar .effects-list .item .item-summary {
  10023. flex-basis: 100%;
  10024. }
  10025. .sheet.familiar .effects-list .item.unidentified {
  10026. border-radius: 1px;
  10027. outline: 1px dotted rgba(75, 74, 68, 0.5);
  10028. background: var(--visibility-gm-bg);
  10029. }
  10030. .sheet.familiar .effects-list .item .button-group {
  10031. display: flex;
  10032. justify-content: flex-end;
  10033. align-items: center;
  10034. flex-wrap: nowrap;
  10035. width: 50%;
  10036. flex: 0;
  10037. }
  10038. .sheet.familiar .effects-list .item .button-group button {
  10039. margin: 0;
  10040. border: none;
  10041. cursor: pointer;
  10042. font-family: var(--sans-serif);
  10043. font-size: var(--font-size-10);
  10044. text-transform: uppercase;
  10045. letter-spacing: 0.05em;
  10046. text-rendering: optimizeLegibility;
  10047. padding: 5px;
  10048. color: var(--text-light);
  10049. width: 70px;
  10050. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  10051. background: var(--secondary);
  10052. border-radius: 2px;
  10053. flex: 0;
  10054. white-space: nowrap;
  10055. margin-left: 4px;
  10056. flex: 0;
  10057. }
  10058. .sheet.familiar .effects-list .item .button-group button:hover {
  10059. box-shadow: none;
  10060. text-shadow: 0 0 2px white;
  10061. }
  10062. .sheet.familiar .effects-list .item {
  10063. margin: 0;
  10064. padding: 0;
  10065. margin: 0.25em 0;
  10066. }
  10067. .sheet.hazard .section-container {
  10068. display: flex;
  10069. flex-direction: column;
  10070. }
  10071. .sheet.hazard .section-container .section-header {
  10072. border: 1px solid var(--primary);
  10073. border-radius: 3px 3px 0px 0px;
  10074. background: var(--primary);
  10075. display: flex;
  10076. flex: 0;
  10077. width: 100%;
  10078. flex-direction: row;
  10079. justify-content: space-between;
  10080. align-items: baseline;
  10081. text-align: left;
  10082. color: var(--text-light);
  10083. font-size: var(--font-size-13);
  10084. padding: 0 8px;
  10085. line-height: 2em;
  10086. }
  10087. .sheet.hazard .section-container .section-header h4 {
  10088. flex: auto;
  10089. display: flex;
  10090. align-items: baseline;
  10091. gap: 4px;
  10092. margin-bottom: 0px;
  10093. text-transform: uppercase;
  10094. }
  10095. .sheet.hazard .section-container .section-header input {
  10096. color: inherit;
  10097. width: auto;
  10098. }
  10099. .sheet.hazard .section-container .section-header .controls {
  10100. gap: 0.5rem;
  10101. white-space: nowrap;
  10102. }
  10103. .sheet.hazard .section-container .section-body {
  10104. border: 1px solid var(--primary);
  10105. border-radius: 0px 0px 3px 3px;
  10106. display: flex;
  10107. flex: auto;
  10108. flex-wrap: wrap;
  10109. flex-direction: row;
  10110. align-items: baseline;
  10111. justify-content: flex-start;
  10112. width: 100%;
  10113. }
  10114. .sheet.hazard .section-container.headerless .section-body {
  10115. border-radius: 3px;
  10116. }
  10117. .sheet.hazard .actions-list,
  10118. .sheet.hazard .attacks-list {
  10119. margin: 0;
  10120. padding: 0;
  10121. width: 100%;
  10122. }
  10123. .sheet.hazard .actions-list .controls,
  10124. .sheet.hazard .attacks-list .controls {
  10125. align-items: baseline;
  10126. display: flex;
  10127. flex: 0;
  10128. flex-wrap: nowrap;
  10129. font-size: var(--font-size-12);
  10130. gap: 1px;
  10131. margin-left: auto;
  10132. }
  10133. .sheet.hazard .actions-list .controls .chat,
  10134. .sheet.hazard .attacks-list .controls .chat {
  10135. margin-right: 2px;
  10136. font-size: 0.9em;
  10137. }
  10138. .sheet.hazard .actions-list li.action .button-group,
  10139. .sheet.hazard .actions-list li.attack .button-group,
  10140. .sheet.hazard .attacks-list li.action .button-group,
  10141. .sheet.hazard .attacks-list li.attack .button-group {
  10142. display: flex;
  10143. gap: 0.25em;
  10144. justify-content: start;
  10145. min-width: 100%;
  10146. }
  10147. .sheet.hazard .actions-list li.action .button-group .flexrow,
  10148. .sheet.hazard .actions-list li.action .button-group .sub-section,
  10149. .sheet.hazard .actions-list li.attack .button-group .flexrow,
  10150. .sheet.hazard .actions-list li.attack .button-group .sub-section,
  10151. .sheet.hazard .attacks-list li.action .button-group .flexrow,
  10152. .sheet.hazard .attacks-list li.action .button-group .sub-section,
  10153. .sheet.hazard .attacks-list li.attack .button-group .flexrow,
  10154. .sheet.hazard .attacks-list li.attack .button-group .sub-section {
  10155. gap: 2px;
  10156. }
  10157. .sheet.hazard .actions-list li.action .button-group .sub-section,
  10158. .sheet.hazard .actions-list li.attack .button-group .sub-section,
  10159. .sheet.hazard .attacks-list li.action .button-group .sub-section,
  10160. .sheet.hazard .attacks-list li.attack .button-group .sub-section {
  10161. align-items: start;
  10162. display: flex;
  10163. flex-wrap: wrap;
  10164. justify-content: flex-start;
  10165. }
  10166. .sheet.hazard .actions-list li.action .button-group .sub-section h4,
  10167. .sheet.hazard .actions-list li.attack .button-group .sub-section h4,
  10168. .sheet.hazard .attacks-list li.action .button-group .sub-section h4,
  10169. .sheet.hazard .attacks-list li.attack .button-group .sub-section h4 {
  10170. margin-left: var(--font-size-12);
  10171. margin-right: var(--font-size-12);
  10172. }
  10173. .sheet.hazard .actions-list li.action .button-group button,
  10174. .sheet.hazard .actions-list li.attack .button-group button,
  10175. .sheet.hazard .attacks-list li.action .button-group button,
  10176. .sheet.hazard .attacks-list li.attack .button-group button {
  10177. align-items: center;
  10178. display: flex;
  10179. border-radius: 3px;
  10180. border: none;
  10181. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  10182. color: var(--color-text-light-0);
  10183. cursor: pointer;
  10184. font-size: var(--font-size-11);
  10185. height: var(--font-size-18);
  10186. justify-content: center;
  10187. line-height: var(--font-size-18);
  10188. margin: 0;
  10189. padding: 0 8px;
  10190. white-space: nowrap;
  10191. width: auto;
  10192. }
  10193. .sheet.hazard .actions-list li.action .button-group button:first-child,
  10194. .sheet.hazard .actions-list li.attack .button-group button:first-child,
  10195. .sheet.hazard .attacks-list li.action .button-group button:first-child,
  10196. .sheet.hazard .attacks-list li.attack .button-group button:first-child {
  10197. margin-left: 0px;
  10198. }
  10199. .sheet.hazard .actions-list li.action .button-group button:hover,
  10200. .sheet.hazard .actions-list li.attack .button-group button:hover,
  10201. .sheet.hazard .attacks-list li.action .button-group button:hover,
  10202. .sheet.hazard .attacks-list li.attack .button-group button:hover {
  10203. box-shadow: none;
  10204. text-shadow: 0 0 2px var(--color-text-light-0);
  10205. }
  10206. .sheet.hazard .actions-list li.action .button-group .attack-button,
  10207. .sheet.hazard .actions-list li.attack .button-group .attack-button,
  10208. .sheet.hazard .attacks-list li.action .button-group .attack-button,
  10209. .sheet.hazard .attacks-list li.attack .button-group .attack-button {
  10210. background-color: var(--secondary);
  10211. }
  10212. .sheet.hazard .actions-list li.action .button-group .damage-button,
  10213. .sheet.hazard .actions-list li.action .button-group .critical-button,
  10214. .sheet.hazard .actions-list li.attack .button-group .damage-button,
  10215. .sheet.hazard .actions-list li.attack .button-group .critical-button,
  10216. .sheet.hazard .attacks-list li.action .button-group .damage-button,
  10217. .sheet.hazard .attacks-list li.action .button-group .critical-button,
  10218. .sheet.hazard .attacks-list li.attack .button-group .damage-button,
  10219. .sheet.hazard .attacks-list li.attack .button-group .critical-button {
  10220. background-color: var(--primary);
  10221. }
  10222. .sheet.hazard .actions-list li.attack,
  10223. .sheet.hazard .attacks-list li.attack {
  10224. border-bottom: 1px solid var(--color-border-light-tertiary);
  10225. display: flex;
  10226. flex-direction: row;
  10227. justify-content: start;
  10228. gap: 0.25rem;
  10229. padding: 0.25rem 0;
  10230. }
  10231. .sheet.hazard .actions-list li.attack:last-child,
  10232. .sheet.hazard .attacks-list li.attack:last-child {
  10233. border-bottom: none;
  10234. }
  10235. .sheet.hazard .actions-list li.attack > h4,
  10236. .sheet.hazard .attacks-list li.attack > h4 {
  10237. align-items: center;
  10238. display: flex;
  10239. flex-wrap: wrap;
  10240. font-size: 0.9rem;
  10241. font-weight: 500;
  10242. gap: 2px;
  10243. margin: 0 4px 0 0;
  10244. white-space: nowrap;
  10245. }
  10246. .sheet.hazard .actions-list li.attack > h4 > span,
  10247. .sheet.hazard .actions-list li.attack > h4 > a,
  10248. .sheet.hazard .attacks-list li.attack > h4 > span,
  10249. .sheet.hazard .attacks-list li.attack > h4 > a {
  10250. display: flex;
  10251. gap: 3px;
  10252. line-height: 1.125rem;
  10253. margin-right: 4px;
  10254. }
  10255. .sheet.hazard .actions-list li.attack > .description,
  10256. .sheet.hazard .attacks-list li.attack > .description {
  10257. flex-basis: 100%;
  10258. }
  10259. .sheet.hazard .actions-list li.action,
  10260. .sheet.hazard .attacks-list li.action {
  10261. display: flex;
  10262. gap: 0.25rem;
  10263. }
  10264. .sheet.hazard .actions-list li.action:not(:last-child),
  10265. .sheet.hazard .attacks-list li.action:not(:last-child) {
  10266. border-bottom: 1px solid var(--color-border-light-tertiary);
  10267. }
  10268. .sheet.hazard .actions-list li.action > h4,
  10269. .sheet.hazard .attacks-list li.action > h4 {
  10270. align-items: center;
  10271. display: flex;
  10272. gap: 0.25rem;
  10273. flex: auto;
  10274. font-size: 0.9rem;
  10275. margin: 0;
  10276. }
  10277. .sheet.hazard .actions-list li.action > h4 > a,
  10278. .sheet.hazard .attacks-list li.action > h4 > a {
  10279. align-items: center;
  10280. display: flex;
  10281. gap: 2px;
  10282. }
  10283. .sheet.hazard .actions-list li.action .button-group > button.use-action,
  10284. .sheet.hazard .attacks-list li.action .button-group > button.use-action {
  10285. color: var(--color-text-light-0);
  10286. background-color: var(--secondary);
  10287. margin-right: 0.5rem;
  10288. }
  10289. .sheet.hazard .actions-list li.action .action-traits,
  10290. .sheet.hazard .attacks-list li.action .action-traits {
  10291. margin-left: var(--font-size-12);
  10292. }
  10293. .sheet.hazard .actions-list li.action .tracking,
  10294. .sheet.hazard .attacks-list li.action .tracking {
  10295. flex: 0;
  10296. align-items: center;
  10297. display: flex;
  10298. flex-direction: row;
  10299. flex-wrap: nowrap;
  10300. margin-left: auto;
  10301. margin-right: var(--font-size-16);
  10302. }
  10303. .sheet.hazard .actions-list li.action .tracking input,
  10304. .sheet.hazard .attacks-list li.action .tracking input {
  10305. background: none;
  10306. border: 0;
  10307. flex: 0 1 4rem;
  10308. flex: 1;
  10309. font-family: inherit;
  10310. font-size: 0.9rem;
  10311. height: auto;
  10312. padding: 0 3px;
  10313. text-align: center;
  10314. width: 0;
  10315. }
  10316. .sheet.hazard .actions-list li.action .tracking span,
  10317. .sheet.hazard .attacks-list li.action .tracking span {
  10318. white-space: nowrap;
  10319. }
  10320. .sheet.hazard .actions-list li.action .item-summary,
  10321. .sheet.hazard .attacks-list li.action .item-summary {
  10322. flex-basis: 100%;
  10323. }
  10324. .sheet.hazard ul,
  10325. .sheet.hazard ol {
  10326. margin: 0;
  10327. padding: 0;
  10328. list-style-type: none;
  10329. }
  10330. .sheet.hazard h1,
  10331. .sheet.hazard h2,
  10332. .sheet.hazard h3,
  10333. .sheet.hazard h4 {
  10334. margin: 0;
  10335. padding: 0;
  10336. border-bottom: none;
  10337. }
  10338. .sheet.hazard form {
  10339. display: flex;
  10340. flex-direction: column;
  10341. height: 100%;
  10342. }
  10343. .sheet.hazard form .tagify > span {
  10344. min-width: 20px;
  10345. }
  10346. .sheet.hazard form .tagify--hasMaxTags > span {
  10347. display: none;
  10348. }
  10349. .sheet.hazard .window-content {
  10350. margin: 0;
  10351. padding: 0;
  10352. }
  10353. .sheet.hazard input[type=text],
  10354. .sheet.hazard input[type=number] {
  10355. margin: 0;
  10356. padding: 0;
  10357. background: none;
  10358. border: 1px solid transparent;
  10359. }
  10360. .sheet.hazard input[type=text]:hover:not(:disabled), .sheet.hazard input[type=text]:focus,
  10361. .sheet.hazard input[type=number]:hover:not(:disabled),
  10362. .sheet.hazard input[type=number]:focus {
  10363. border: 1px solid black;
  10364. box-shadow: 0 0 10px #00005a;
  10365. }
  10366. .sheet.hazard select {
  10367. font-size: var(--font-size-12);
  10368. height: 2em;
  10369. }
  10370. .sheet.hazard .container {
  10371. display: flex;
  10372. background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
  10373. height: 100%;
  10374. overflow: hidden;
  10375. }
  10376. .sheet.hazard .content {
  10377. flex: 1;
  10378. padding-left: 5px;
  10379. padding-right: 5px;
  10380. padding: 0 5px 20px 5px;
  10381. overflow: hidden scroll;
  10382. }
  10383. .sheet.hazard form > header {
  10384. align-items: center;
  10385. background: url("../assets/sheet/header-bw.webp"), url("../assets/sheet/background.webp");
  10386. background-blend-mode: multiply;
  10387. background-color: #238580;
  10388. background-repeat: repeat-x, no-repeat;
  10389. background-size: cover;
  10390. box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  10391. color: var(--text-light);
  10392. display: flex;
  10393. font-family: var(--sans-serif);
  10394. font-weight: 600;
  10395. gap: 8px;
  10396. justify-content: space-between;
  10397. margin-bottom: 0.1em;
  10398. padding: 0 16px;
  10399. text-transform: uppercase;
  10400. width: 100%;
  10401. }
  10402. .sheet.hazard form > header .frame-container {
  10403. flex: 0 0 60px;
  10404. padding: 4px;
  10405. margin: 16px 0;
  10406. }
  10407. .sheet.hazard form > header .frame-container .frame {
  10408. width: 60px;
  10409. height: 60px;
  10410. }
  10411. .sheet.hazard form > header .frame-container .image-container [data-action=show-image] {
  10412. color: var(--color-text-dark-primary);
  10413. }
  10414. .sheet.hazard form > header .frame-container .actor-image {
  10415. object-fit: cover;
  10416. object-position: top;
  10417. border: none;
  10418. border-radius: 0;
  10419. max-height: 178px;
  10420. width: 100%;
  10421. border: none;
  10422. 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;
  10423. }
  10424. .sheet.hazard form > header .frame-container .edit-mode-button {
  10425. position: absolute;
  10426. width: 20px;
  10427. height: 20px;
  10428. bottom: -10px;
  10429. left: -10px;
  10430. border-radius: 10px;
  10431. background-color: white;
  10432. color: var(--text-dark);
  10433. cursor: pointer;
  10434. border: none;
  10435. 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;
  10436. display: flex;
  10437. justify-content: center;
  10438. align-items: center;
  10439. font-size: 1.05em;
  10440. }
  10441. .sheet.hazard form > header .details {
  10442. margin: 4px 0;
  10443. flex: 1;
  10444. }
  10445. .sheet.hazard form > header .details tags.tags.paizo-style .tagify__input::before {
  10446. color: var(--color-text-light-7);
  10447. }
  10448. .sheet.hazard form > header input[type=text],
  10449. .sheet.hazard form > header input[type=number] {
  10450. color: var(--text-light);
  10451. border: none;
  10452. border-bottom: 1px solid transparent;
  10453. }
  10454. .sheet.hazard form > header input[type=text]:hover:not(:disabled), .sheet.hazard form > header input[type=text]:focus,
  10455. .sheet.hazard form > header input[type=number]:hover:not(:disabled),
  10456. .sheet.hazard form > header input[type=number]:focus {
  10457. border: none;
  10458. border-bottom: 1px solid var(--text-light);
  10459. box-shadow: none;
  10460. }
  10461. .sheet.hazard form > header .title {
  10462. display: flex;
  10463. flex-direction: row;
  10464. align-items: baseline;
  10465. gap: 4px;
  10466. font-size: var(--font-size-28);
  10467. font-family: var(--serif-condensed);
  10468. font-weight: 700;
  10469. }
  10470. .sheet.hazard form > header .title .name {
  10471. flex: 1;
  10472. font-size: var(--font-size-32);
  10473. }
  10474. .sheet.hazard form > header .title .level {
  10475. width: 32px;
  10476. text-align: center;
  10477. }
  10478. .sheet.hazard .sidebar {
  10479. border-right: 1px solid #888;
  10480. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  10481. display: flex;
  10482. flex-direction: column;
  10483. gap: 8px;
  10484. height: 100%;
  10485. padding: 10px 8px 8px 8px;
  10486. width: 220px;
  10487. overflow: hidden scroll;
  10488. }
  10489. .sheet.hazard .sidebar .sidebar-title {
  10490. display: flex;
  10491. justify-content: space-between;
  10492. border-bottom: 1px solid black;
  10493. margin-bottom: 4px;
  10494. }
  10495. .sheet.hazard .sidebar .sidebar-title h2 {
  10496. font-size: var(--font-size-15);
  10497. }
  10498. .sheet.hazard .sidebar .valued-icon {
  10499. display: flex;
  10500. align-items: baseline;
  10501. }
  10502. .sheet.hazard .sidebar .valued-icon i {
  10503. margin-right: 4px;
  10504. }
  10505. .sheet.hazard .sidebar .valued-icon i + input {
  10506. margin-left: -1px;
  10507. }
  10508. .sheet.hazard .sidebar .health input {
  10509. width: 34px;
  10510. }
  10511. .sheet.hazard .sidebar .health input.current {
  10512. text-align: end;
  10513. }
  10514. .sheet.hazard .sidebar .armor-class input {
  10515. width: 25px;
  10516. text-align: right;
  10517. }
  10518. .sheet.hazard .sidebar .health-line {
  10519. display: flex;
  10520. flex-direction: row;
  10521. font-size: var(--font-size-16);
  10522. gap: 3px;
  10523. justify-content: center;
  10524. }
  10525. .sheet.hazard .sidebar .hp-details {
  10526. width: 100%;
  10527. }
  10528. .sheet.hazard .sidebar h2 {
  10529. font-weight: 500;
  10530. font-size: var(--font-size-16);
  10531. }
  10532. .sheet.hazard .sidebar .initiative {
  10533. display: flex;
  10534. font-size: var(--font-size-16);
  10535. }
  10536. .sheet.hazard .sidebar .initiative .roll-init {
  10537. display: flex;
  10538. align-items: center;
  10539. }
  10540. .sheet.hazard .sidebar .initiative .roll-init i {
  10541. margin-right: 4px;
  10542. }
  10543. .sheet.hazard .sidebar .sidebar-saves {
  10544. display: flex;
  10545. justify-content: space-between;
  10546. }
  10547. .sheet.hazard .sidebar .sidebar-saves .save {
  10548. align-items: center;
  10549. display: flex;
  10550. flex: 1;
  10551. flex-direction: column;
  10552. font-size: var(--font-size-16);
  10553. }
  10554. .sheet.hazard .sidebar .sidebar-saves input {
  10555. max-width: 50px;
  10556. text-align: center;
  10557. }
  10558. .sheet.hazard .sidebar .emits-sound .hint:hover {
  10559. text-shadow: 0 0 8px var(--color-shadow-primary);
  10560. }
  10561. .sheet.hazard .sidebar .rollable {
  10562. cursor: pointer;
  10563. }
  10564. .sheet.hazard .sidebar .rollable:hover {
  10565. text-shadow: 0 0 8px var(--color-shadow-primary);
  10566. }
  10567. .sheet.hazard .sidebar .rollable:hover i {
  10568. animation: rotation 2s infinite linear;
  10569. }
  10570. .sheet.hazard .section-container {
  10571. padding: 4px 6px 0;
  10572. }
  10573. .sheet.hazard .section-container .editor {
  10574. width: 100%;
  10575. }
  10576. .sheet.hazard .section-container .editor .tox {
  10577. width: 100%;
  10578. }
  10579. .sheet.hazard .section-container > .section-body {
  10580. padding: 4px;
  10581. }
  10582. .sheet.hazard .section-container.skills > .section-body .list {
  10583. display: flex;
  10584. flex-direction: row;
  10585. flex-wrap: wrap;
  10586. }
  10587. .sheet.hazard .section-container .actions-list,
  10588. .sheet.hazard .section-container .attacks-list {
  10589. border-bottom: 1px solid var(--alt);
  10590. }
  10591. .sheet.hazard .section-container .actions-list:last-child,
  10592. .sheet.hazard .section-container .attacks-list:last-child {
  10593. border-bottom: none;
  10594. }
  10595. .sheet.hazard .section-container .actions-list .action,
  10596. .sheet.hazard .section-container .attacks-list .action {
  10597. padding: 4px 0;
  10598. }
  10599. .sheet.hazard .section-container.publication {
  10600. margin-top: 0.5rem;
  10601. }
  10602. .sheet.hazard .section-container.publication .section-header {
  10603. background: none;
  10604. color: var(--color-pf-primary);
  10605. }
  10606. .sheet.hazard .section-container.publication .section-body {
  10607. align-items: baseline;
  10608. gap: 0.25em;
  10609. display: grid;
  10610. grid-template: "title title title" 2fr "authors license remaster" 3fr/60% 20% 20%;
  10611. border-top: none;
  10612. padding: 0.25rem 0.5rem;
  10613. }
  10614. .sheet.hazard .section-container.publication .section-body label {
  10615. font-weight: 500;
  10616. min-width: unset;
  10617. }
  10618. .sheet.hazard .section-container.publication .section-body input[type=text] {
  10619. height: 1.6rem;
  10620. }
  10621. .sheet.hazard .section-container.publication .section-body .title {
  10622. grid-area: title;
  10623. margin-right: 0;
  10624. }
  10625. .sheet.hazard .section-container.publication .section-body .authors {
  10626. grid-area: authors;
  10627. }
  10628. .sheet.hazard .section-container.publication .section-body .license {
  10629. grid-area: license;
  10630. }
  10631. .sheet.hazard .section-container.publication .section-body .license select {
  10632. margin-top: 1px;
  10633. }
  10634. .sheet.hazard .section-container.publication .section-body .remaster {
  10635. grid-area: remaster;
  10636. }
  10637. .sheet.hazard .section-container.publication .section-body .license,
  10638. .sheet.hazard .section-container.publication .section-body .remaster {
  10639. text-align: center;
  10640. }
  10641. .sheet.hazard .section-container.publication .section-body .license label,
  10642. .sheet.hazard .section-container.publication .section-body .remaster label {
  10643. padding: 0;
  10644. }
  10645. .sheet.hazard .section-container.publication .section-body input[type=text] {
  10646. background: rgba(0, 0, 0, 0.05);
  10647. }
  10648. .sheet.hazard .tox.tox-tinymce {
  10649. height: 200px !important;
  10650. }
  10651. .sheet.hazard .hazard-editor .editor .editor-edit {
  10652. display: none;
  10653. }
  10654. .app.npc-skills-editor form {
  10655. font-size: var(--font-size-12);
  10656. overflow: hidden;
  10657. }
  10658. .app.npc-skills-editor form > .scroll-container {
  10659. max-height: 500px;
  10660. overflow: hidden scroll;
  10661. }
  10662. .app.npc-skills-editor form ol {
  10663. list-style: none;
  10664. overflow: hidden;
  10665. padding: 0px;
  10666. width: 100%;
  10667. }
  10668. .app.npc-skills-editor form ol li {
  10669. align-items: center;
  10670. column-gap: 1rem;
  10671. display: grid;
  10672. grid-template-columns: auto 3rem 2rem;
  10673. grid-template-rows: auto;
  10674. padding: 0.25rem;
  10675. width: 100%;
  10676. }
  10677. .app.npc-skills-editor form ol li.skill:nth-child(even) {
  10678. background-color: #ede3c8;
  10679. }
  10680. .app.npc-skills-editor form ol li.skill:nth-child(odd) {
  10681. background-color: #f5efe0;
  10682. }
  10683. .app.npc-skills-editor form ol li.skill.header {
  10684. background-color: var(--color-pf-primary);
  10685. color: var(--text-light);
  10686. font-weight: 500;
  10687. padding: 4px;
  10688. text-transform: uppercase;
  10689. }
  10690. .app.npc-skills-editor form ol li.skill.header.lore {
  10691. background-color: var(--color-pf-secondary);
  10692. }
  10693. .app.npc-skills-editor form ol li.skill .item-controls {
  10694. text-align: right;
  10695. }
  10696. .app.npc-skills-editor form ol li.skill-selector button, .app.npc-skills-editor form ol li.lore-skill-creator button {
  10697. background-color: var(--color-pf-secondary);
  10698. border-radius: 3px;
  10699. border: 1px solid var(--color-pf-secondary-dark);
  10700. color: var(--text-light);
  10701. display: flex;
  10702. grid-column: span 2;
  10703. justify-content: center;
  10704. line-height: 1em;
  10705. padding: 4px;
  10706. white-space: nowrap;
  10707. }
  10708. .actor.npc.sheet form {
  10709. display: flex;
  10710. flex-direction: row;
  10711. align-items: flex-start;
  10712. }
  10713. .actor.npc.sheet form ol.spell-list {
  10714. margin: 0;
  10715. padding: 0;
  10716. border-bottom: 1px solid var(--color-border-light-2);
  10717. flex-basis: 100%;
  10718. gap: 1px;
  10719. position: relative;
  10720. width: 100%;
  10721. z-index: 1;
  10722. }
  10723. .actor.npc.sheet form ol.spell-list > li {
  10724. margin: 0;
  10725. padding: 0;
  10726. align-items: center;
  10727. background: none;
  10728. cursor: default;
  10729. display: grid;
  10730. grid: "name range components cast-spell controls" auto "content content content content content" auto/9fr 4fr 4fr 2fr 2.5fr;
  10731. justify-content: center;
  10732. padding: 0 0.3em 1px 0.35em;
  10733. }
  10734. .actor.npc.sheet form ol.spell-list > li[data-expended-state=true] h4 {
  10735. color: var(--color-disabled);
  10736. text-decoration: line-through;
  10737. }
  10738. .actor.npc.sheet form ol.spell-list > li[data-expended-state=true] .cast-spell {
  10739. background: var(--color-disabled);
  10740. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  10741. cursor: not-allowed;
  10742. }
  10743. .actor.npc.sheet form ol.spell-list > li:nth-child(odd) {
  10744. background-color: rgba(120, 100, 82, 0.1);
  10745. }
  10746. .actor.npc.sheet form ol.spell-list > li:last-child {
  10747. border-bottom: 1px solid var(--sub);
  10748. }
  10749. .actor.npc.sheet form ol.spell-list > li:last-child .item-image {
  10750. margin-bottom: 0;
  10751. margin-top: 2px;
  10752. }
  10753. .actor.npc.sheet form ol.spell-list > li.spell-level-header {
  10754. margin: 0;
  10755. padding: 0;
  10756. background: rgba(96, 88, 86, 0.25);
  10757. border: 1px solid var(--color-border-light-2);
  10758. border-radius: 2px;
  10759. color: var(--text-dark);
  10760. font: 500 var(--font-size-12) var(--sans-serif);
  10761. letter-spacing: 0.25px;
  10762. line-height: 1;
  10763. padding: 0 0.5em;
  10764. text-transform: uppercase;
  10765. }
  10766. .actor.npc.sheet form ol.spell-list > li.spell-level-header h3 {
  10767. text-transform: capitalize;
  10768. font-size: var(--font-size-13);
  10769. margin-left: 0;
  10770. padding: 4px 0;
  10771. }
  10772. .actor.npc.sheet form ol.spell-list > li.spell-level-header .item-name {
  10773. line-height: 1;
  10774. gap: 0.25em;
  10775. }
  10776. .actor.npc.sheet form ol.spell-list > li.spell-level-header .item-name h3 {
  10777. margin: 0;
  10778. padding: 0;
  10779. font-weight: 700;
  10780. }
  10781. .actor.npc.sheet form ol.spell-list > li.spell-level-header .item-controls {
  10782. grid-column: span 2;
  10783. }
  10784. .actor.npc.sheet form ol.spell-list > li .uses {
  10785. align-items: center;
  10786. display: flex;
  10787. gap: 0.25em;
  10788. line-height: 1;
  10789. }
  10790. .actor.npc.sheet form ol.spell-list > li.spell-level-header input,
  10791. .actor.npc.sheet form ol.spell-list > li .uses input {
  10792. background: var(--alt);
  10793. border-radius: 3px;
  10794. border: 1px solid var(--sub);
  10795. color: var(--text-light);
  10796. font: var(--font-size-12) var(--sans-serif);
  10797. height: unset;
  10798. text-align: center;
  10799. width: 2em;
  10800. }
  10801. .actor.npc.sheet form ol.spell-list > li.spell-level-header .spell-slots-increment-reset,
  10802. .actor.npc.sheet form ol.spell-list > li .uses .spell-slots-increment-reset {
  10803. padding-left: 5px;
  10804. font-size: var(--font-size-10);
  10805. }
  10806. .actor.npc.sheet form ol.spell-list > li.spell {
  10807. border: none;
  10808. font-size: var(--font-size-13);
  10809. }
  10810. .actor.npc.sheet form ol.spell-list > li .level-prepared-toggle {
  10811. flex: 0;
  10812. font-size: 0.75rem;
  10813. color: var(--secondary);
  10814. }
  10815. .actor.npc.sheet form ol.spell-list > li .item-name {
  10816. align-items: center;
  10817. display: flex;
  10818. flex-wrap: nowrap;
  10819. justify-content: start;
  10820. justify-self: start;
  10821. min-height: 1.75rem;
  10822. }
  10823. .actor.npc.sheet form ol.spell-list > li .item-name h3 {
  10824. white-space: nowrap;
  10825. }
  10826. .actor.npc.sheet form ol.spell-list > li .item-name + span {
  10827. font-size: 0.75rem;
  10828. }
  10829. .actor.npc.sheet form ol.spell-list > li .item-name .focus-pool-input {
  10830. align-items: center;
  10831. display: flex;
  10832. flex-wrap: nowrap;
  10833. }
  10834. .actor.npc.sheet form ol.spell-list > li .item-name .slash {
  10835. font-size: 0.75rem;
  10836. }
  10837. .actor.npc.sheet form ol.spell-list > li .item-name .spell-slots,
  10838. .actor.npc.sheet form ol.spell-list > li .item-name .spell-max {
  10839. padding-top: 3px;
  10840. font-size: 0.75rem;
  10841. }
  10842. .actor.npc.sheet form ol.spell-list > li .item-name .spell-slots.infinity,
  10843. .actor.npc.sheet form ol.spell-list > li .item-name .spell-max.infinity {
  10844. position: relative;
  10845. top: -2px;
  10846. }
  10847. .actor.npc.sheet form ol.spell-list > li .item-name .item-image {
  10848. height: 1.5rem;
  10849. width: 1.5rem;
  10850. flex: 0 0 auto;
  10851. margin: 2px 0;
  10852. }
  10853. .actor.npc.sheet form ol.spell-list > li .item-name h4 {
  10854. margin: 0;
  10855. padding: 0;
  10856. font-size: var(--font-size-14);
  10857. letter-spacing: -0.075em;
  10858. line-height: 1;
  10859. margin-left: 8px;
  10860. cursor: pointer;
  10861. }
  10862. .actor.npc.sheet form ol.spell-list > li .item-name h4:hover {
  10863. color: var(--secondary);
  10864. }
  10865. .actor.npc.sheet form ol.spell-list > li .item-name .action-glyph {
  10866. margin-left: 4px;
  10867. font-size: small;
  10868. }
  10869. .actor.npc.sheet form ol.spell-list > li .item-name.empty {
  10870. grid-column: 1/span 4;
  10871. }
  10872. .actor.npc.sheet form ol.spell-list > li .spell-range {
  10873. grid-area: range;
  10874. padding-left: 0.2em;
  10875. }
  10876. .actor.npc.sheet form ol.spell-list > li .spell-components {
  10877. grid-area: components;
  10878. justify-self: right;
  10879. padding: 0 0.5em;
  10880. }
  10881. .actor.npc.sheet form ol.spell-list > li .spell-components .tag {
  10882. font: var(--font-size-12) var(--sans-serif-condensed);
  10883. }
  10884. .actor.npc.sheet form ol.spell-list > li .spell-cast {
  10885. grid-area: cast-spell;
  10886. display: flex;
  10887. justify-content: center;
  10888. }
  10889. .actor.npc.sheet form ol.spell-list > li .item-controls {
  10890. grid-area: controls;
  10891. display: flex;
  10892. justify-self: end;
  10893. padding-right: 0.25em;
  10894. }
  10895. .actor.npc.sheet form ol.spell-list > li button.cast-spell {
  10896. align-items: center;
  10897. background: var(--secondary);
  10898. border-radius: 2px;
  10899. border: black;
  10900. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  10901. color: var(--text-light);
  10902. cursor: pointer;
  10903. display: flex;
  10904. font: 700 0.55rem var(--sans-serif);
  10905. justify-self: center;
  10906. letter-spacing: 0.25px;
  10907. max-width: fit-content;
  10908. padding: 0.5em 1em;
  10909. text-transform: uppercase;
  10910. }
  10911. .actor.npc.sheet form ol.spell-list > li .item-summary {
  10912. grid-area: content;
  10913. width: 100%;
  10914. padding: 8px;
  10915. border-bottom: 1px solid var(--sub);
  10916. border-top: 1px solid #aca5a3;
  10917. background-color: var(--bg);
  10918. }
  10919. .actor.npc.sheet form ol.spell-list[data-category=spontaneous] .virtual {
  10920. position: relative;
  10921. }
  10922. .actor.npc.sheet form ol.spell-list[data-category=spontaneous] .virtual::before {
  10923. pointer-events: none;
  10924. content: "";
  10925. position: absolute;
  10926. height: 100%;
  10927. width: 100%;
  10928. background-color: rgba(0, 5, 255, 0.1137254902);
  10929. mix-blend-mode: saturation;
  10930. }
  10931. .actor.npc.sheet form ol.spell-list[data-category=spontaneous] .item:not(.virtual) + .virtual {
  10932. border-top: 1px solid rgba(0, 0, 0, 0.15);
  10933. }
  10934. .actor.npc.sheet form ol.spell-list .level-prepared-header {
  10935. font-size: 0.75rem;
  10936. color: var(--text-light);
  10937. margin: 0;
  10938. padding: 4px;
  10939. text-align: center;
  10940. background: var(--secondary);
  10941. position: relative;
  10942. }
  10943. .actor.npc.sheet form ol.spell-list .spell .item-name {
  10944. width: 100%;
  10945. }
  10946. .actor.npc.sheet form ol.spell-list input.toggle-signature-spell[type=checkbox] {
  10947. width: 12px;
  10948. height: 12px;
  10949. margin: 0 2px 0 0;
  10950. flex: 0 0 auto;
  10951. }
  10952. .actor.npc.sheet form ol.spell-list .spellbook-empty {
  10953. display: flex;
  10954. align-items: center;
  10955. min-height: 28px;
  10956. justify-content: flex-end;
  10957. }
  10958. .actor.npc.sheet form ol.spell-list .spellbook-empty h4 {
  10959. margin: 0;
  10960. white-space: nowrap;
  10961. margin-right: auto;
  10962. }
  10963. .actor.npc.sheet form ol.spell-list .spellbook-empty a {
  10964. flex: 0 1 0;
  10965. white-space: nowrap;
  10966. margin-left: 8px;
  10967. }
  10968. .actor.npc.sheet form .npc-sheet-header {
  10969. display: flex;
  10970. flex: 1 0 auto;
  10971. flex-direction: column;
  10972. }
  10973. .actor.npc.sheet form .npc-sheet-header .name {
  10974. font-family: var(--sans-serif-condensed);
  10975. font-size: 1.75rem;
  10976. font-weight: 700;
  10977. width: 100%;
  10978. flex-wrap: nowrap;
  10979. }
  10980. .actor.npc.sheet form .npc-sheet-header .name input {
  10981. font-weight: inherit;
  10982. height: 2rem;
  10983. }
  10984. .actor.npc.sheet form .npc-sheet-header .name .name-value {
  10985. font-variant: small-caps;
  10986. margin-left: 6px;
  10987. margin-right: 1.125rem;
  10988. }
  10989. .actor.npc.sheet form .npc-sheet-header .name .level-label {
  10990. flex: 0;
  10991. text-align: right;
  10992. margin-right: 0.1em;
  10993. text-transform: uppercase;
  10994. }
  10995. .actor.npc.sheet form .npc-sheet-header .name input.level {
  10996. flex: 0 0 2.5rem;
  10997. text-align: center;
  10998. }
  10999. .actor.npc.sheet form .npc-sheet-header .rarity-alignment-size {
  11000. display: flex;
  11001. flex-direction: row;
  11002. justify-content: space-between;
  11003. }
  11004. .actor.npc.sheet form .npc-sheet-header .paizo-style {
  11005. margin-top: 2px;
  11006. padding-left: 0;
  11007. padding-right: 0;
  11008. }
  11009. .actor.npc.sheet form hr {
  11010. margin: 10px 6px 10px 0;
  11011. }
  11012. .actor.npc.sheet form select {
  11013. background: none;
  11014. }
  11015. .actor.npc.sheet form .sidebar {
  11016. flex: 10rem 0 0;
  11017. height: 100%;
  11018. overflow: hidden scroll;
  11019. padding-right: 0.25rem;
  11020. }
  11021. .actor.npc.sheet form .sidebar .image-container img.actor-image {
  11022. border: none;
  11023. border-radius: 8px;
  11024. }
  11025. .actor.npc.sheet form .sidebar .armor-section .armor-value {
  11026. flex: 0;
  11027. text-align: right;
  11028. font-weight: 700;
  11029. padding-right: 4px;
  11030. }
  11031. .actor.npc.sheet form .sidebar .health-section .hit-points,
  11032. .actor.npc.sheet form .sidebar .shield-section .hit-points {
  11033. display: flex;
  11034. flex-direction: row;
  11035. flex: 0;
  11036. margin-left: auto;
  11037. }
  11038. .actor.npc.sheet form .sidebar .health-section .hit-points input.current,
  11039. .actor.npc.sheet form .sidebar .shield-section .hit-points input.current {
  11040. width: 36px;
  11041. text-align: right;
  11042. padding-right: 3px;
  11043. }
  11044. .actor.npc.sheet form .sidebar .health-section .hit-points .slash,
  11045. .actor.npc.sheet form .sidebar .health-section .hit-points .max,
  11046. .actor.npc.sheet form .sidebar .shield-section .hit-points .slash,
  11047. .actor.npc.sheet form .sidebar .shield-section .hit-points .max {
  11048. align-items: center;
  11049. display: flex;
  11050. }
  11051. .actor.npc.sheet form .sidebar .health-section .hit-points .max,
  11052. .actor.npc.sheet form .sidebar .shield-section .hit-points .max {
  11053. font-weight: 700;
  11054. margin-right: 4px;
  11055. text-align: center;
  11056. }
  11057. .actor.npc.sheet form .sidebar .health-section .hit-points .max.lt10,
  11058. .actor.npc.sheet form .sidebar .shield-section .hit-points .max.lt10 {
  11059. width: 8px;
  11060. }
  11061. .actor.npc.sheet form .sidebar .health-section .hit-points .max.lt100,
  11062. .actor.npc.sheet form .sidebar .shield-section .hit-points .max.lt100 {
  11063. width: 24px;
  11064. }
  11065. .actor.npc.sheet form .sidebar .health-section .hit-points .max.lt1000,
  11066. .actor.npc.sheet form .sidebar .shield-section .hit-points .max.lt1000 {
  11067. width: 36px;
  11068. }
  11069. .actor.npc.sheet form .sidebar .shield-section .shield-details {
  11070. display: flex;
  11071. flex: auto;
  11072. flex-direction: row;
  11073. justify-content: flex-start;
  11074. align-items: baseline;
  11075. }
  11076. .actor.npc.sheet form .sidebar .shield-section .shield-details .label {
  11077. flex: 0;
  11078. font-weight: bold;
  11079. }
  11080. .actor.npc.sheet form .sidebar .shield-section .shield-details .value {
  11081. flex: auto;
  11082. font-weight: normal;
  11083. margin-left: 6px !important;
  11084. }
  11085. .actor.npc.sheet form .sidebar .shield-section.broken {
  11086. color: rgba(0, 0, 0, 0.4);
  11087. }
  11088. .actor.npc.sheet form .sidebar .shield-section.broken .shield-label {
  11089. color: rgba(0, 0, 0, 0.4);
  11090. }
  11091. .actor.npc.sheet form .sidebar .shield-section.broken .shield-label h4 {
  11092. text-decoration: line-through;
  11093. }
  11094. .actor.npc.sheet form .sidebar .shield-section.broken .shield-value {
  11095. color: rgba(0, 0, 0, 0.4);
  11096. }
  11097. .actor.npc.sheet form .sidebar .shield-section.broken .shield-value .shield-current {
  11098. color: rgba(0, 0, 0, 0.4);
  11099. }
  11100. .actor.npc.sheet form .sidebar .shield-section.broken .shield-value .shield-max {
  11101. color: rgba(0, 0, 0, 0.4);
  11102. }
  11103. .actor.npc.sheet form .sidebar .speed-section {
  11104. text-align: left;
  11105. }
  11106. .actor.npc.sheet form .sidebar .speed-section .land-speed-value {
  11107. flex: 0 0 30px;
  11108. text-align: right;
  11109. }
  11110. .actor.npc.sheet form .sidebar .speed-section .land-speed .speed-details {
  11111. flex: 1;
  11112. }
  11113. .actor.npc.sheet form .sidebar .speed-section .other-speeds {
  11114. display: flex;
  11115. justify-content: left;
  11116. align-items: left;
  11117. width: 100%;
  11118. flex-wrap: wrap;
  11119. }
  11120. .actor.npc.sheet form .sidebar .saves {
  11121. margin-top: 12px;
  11122. display: flex;
  11123. flex-direction: row;
  11124. width: 100%;
  11125. flex: 1 0 auto;
  11126. font-size: 1.1rem;
  11127. }
  11128. .actor.npc.sheet form .sidebar .saves .container {
  11129. display: flex;
  11130. flex-direction: column;
  11131. text-align: center;
  11132. }
  11133. .actor.npc.sheet form .sidebar .saves .container label {
  11134. font-weight: 600;
  11135. }
  11136. .actor.npc.sheet form .sidebar .saves .container input.modifier {
  11137. text-align: center;
  11138. z-index: 1;
  11139. }
  11140. .actor.npc.sheet form .side-bar-section {
  11141. display: flex;
  11142. flex: auto;
  11143. flex-direction: column;
  11144. justify-content: flex-start;
  11145. align-items: flex-start;
  11146. }
  11147. .actor.npc.sheet form .side-bar-section .controls {
  11148. padding-right: 4px;
  11149. }
  11150. .actor.npc.sheet form .side-bar-section.initiative a.roll-init {
  11151. display: flex;
  11152. flex-wrap: nowrap;
  11153. font-weight: 700;
  11154. margin-left: auto;
  11155. margin-bottom: 2px;
  11156. padding-right: 0.5em;
  11157. }
  11158. .actor.npc.sheet form .side-bar-section.initiative a.roll-init i.fa-dice-d20 {
  11159. font-size: 1rem;
  11160. margin-right: 0.2em;
  11161. }
  11162. .actor.npc.sheet form .side-bar-section.initiative select {
  11163. font-size: var(--font-size-11);
  11164. text-transform: unset;
  11165. }
  11166. .actor.npc.sheet form .side-bar-section .value0 {
  11167. color: darkgrey;
  11168. border-bottom: 1px darkgrey solid;
  11169. }
  11170. .actor.npc.sheet form .side-bar-section .value0 input {
  11171. color: darkgrey;
  11172. }
  11173. .actor.npc.sheet form .side-bar-section-content {
  11174. display: flex;
  11175. width: 100%;
  11176. flex-direction: row;
  11177. flex-wrap: wrap;
  11178. justify-content: flex-start;
  11179. align-items: flex-start;
  11180. padding-top: 2px;
  11181. }
  11182. .actor.npc.sheet form .side-bar-section-header {
  11183. display: flex;
  11184. width: 100%;
  11185. font-size: 1rem;
  11186. border-bottom: 1px solid;
  11187. border-color: #7a7971;
  11188. margin-top: 10px;
  11189. margin-bottom: 2px;
  11190. align-items: baseline;
  11191. }
  11192. .actor.npc.sheet form .side-bar-section-header .side-bar-label {
  11193. display: flex;
  11194. flex: auto;
  11195. flex-direction: row;
  11196. align-items: center;
  11197. }
  11198. .actor.npc.sheet form .side-bar-section-header .side-bar-label .fa {
  11199. font-size: 0.8rem;
  11200. }
  11201. .actor.npc.sheet form .side-bar-section-header .side-bar-label h4,
  11202. .actor.npc.sheet form .side-bar-section-header .side-bar-label label {
  11203. font-size: 0.8rem;
  11204. margin-bottom: 0px;
  11205. padding-left: 2px;
  11206. }
  11207. .actor.npc.sheet form .side-bar-section-header .side-bar-label input.modifier {
  11208. font-size: 0.9rem;
  11209. }
  11210. .actor.npc.sheet form .sheet-body {
  11211. flex: auto;
  11212. }
  11213. .actor.npc.sheet form .sheet-body .tab {
  11214. overflow: hidden scroll;
  11215. }
  11216. .actor.npc.sheet form .sheet-body .tab .identification-skills ul {
  11217. display: inline;
  11218. list-style-type: none;
  11219. padding: 0;
  11220. }
  11221. .actor.npc.sheet form .sheet-body .tab .identification-skills ul li {
  11222. display: inline;
  11223. }
  11224. .actor.npc.sheet form .sheet-body .tab .identification-skills ul li:not(:last-of-type):after {
  11225. content: ",";
  11226. }
  11227. .actor.npc.sheet form .sheet-body .inventory {
  11228. flex-direction: column;
  11229. overflow-y: hidden;
  11230. padding-bottom: 1.25rem;
  11231. }
  11232. .actor.npc.sheet form .sheet-body .inventory.active {
  11233. display: flex;
  11234. }
  11235. .actor.npc.sheet form .sheet-body .inventory .expandable {
  11236. display: none;
  11237. }
  11238. .actor.npc.sheet form .sheet-body .inventory .section-container.inventory-toggles {
  11239. padding: 4px 6px 6px 6px;
  11240. }
  11241. .actor.npc.sheet form .sheet-body .inventory .inventory-section {
  11242. --border-color: var(--secondary);
  11243. flex: 1 0 auto;
  11244. padding: 0px;
  11245. margin: 0px;
  11246. max-height: calc(100% - 1rem);
  11247. }
  11248. .actor.npc.sheet form .sheet-body .inventory .inventory-section .coinage {
  11249. margin-bottom: 8px;
  11250. }
  11251. .actor.npc.sheet form .sheet-body .inventory .inventory-section .inventory-list > :first-child {
  11252. border-radius: 3px 3px 0px 0px;
  11253. }
  11254. .actor.npc.sheet form .sheet-body .inventory .inventory-section .inventory-list .inventory-header {
  11255. align-items: center;
  11256. background-color: var(--primary-background);
  11257. color: var(--color-text-light-0);
  11258. display: flex;
  11259. flex-flow: row nowrap;
  11260. max-height: fit-content;
  11261. }
  11262. .actor.npc.sheet form .sheet-body .inventory .inventory-section .inventory-list .inventory-header h4 {
  11263. margin: 0;
  11264. }
  11265. .actor.npc.sheet form .sheet-body .inventory .inventory-section .inventory-list .inventory-header div {
  11266. border: none;
  11267. }
  11268. .actor.npc.sheet form .sheet-body .inventory .inventory-section .inventory-list .item .item-image {
  11269. border: 2px solid #7a7971;
  11270. border-radius: 3px;
  11271. margin: 2px 4px 2px 6px;
  11272. }
  11273. .actor.npc.sheet form .sheet-body .inventory .inventory-section .inventory-list .item .controls .item-toggle-equip {
  11274. color: rgba(0, 0, 0, 0.4);
  11275. }
  11276. .actor.npc.sheet form .sheet-body .inventory .inventory-section .inventory-list .item .controls .item-toggle-equip.active {
  11277. color: rgba(0, 0, 0, 0.75);
  11278. }
  11279. .actor.npc.sheet form .sheet-body .entries-list {
  11280. list-style: none;
  11281. padding: 2px;
  11282. margin: 0;
  11283. }
  11284. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry {
  11285. display: block;
  11286. width: 100%;
  11287. margin: 0px;
  11288. border: 1px solid var(--sub);
  11289. border-radius: 4px;
  11290. }
  11291. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry:not(:first-child) {
  11292. margin-top: 0.5rem;
  11293. }
  11294. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header {
  11295. align-items: baseline;
  11296. background-color: var(--primary);
  11297. border-radius: 3px 3px 0 0;
  11298. color: var(--text-light);
  11299. display: flex;
  11300. flex-direction: row;
  11301. flex-wrap: nowrap;
  11302. gap: 0.25em;
  11303. justify-content: space-between;
  11304. padding: 4px 0.5em;
  11305. }
  11306. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .drag-handle {
  11307. cursor: move;
  11308. }
  11309. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header h4.name {
  11310. flex: 1;
  11311. margin: 0 4px 0 0;
  11312. padding-right: 6px;
  11313. width: max-content;
  11314. }
  11315. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header h4.name input {
  11316. color: var(--text-light);
  11317. max-width: 100%;
  11318. font-weight: 500;
  11319. border: none;
  11320. }
  11321. .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 {
  11322. box-shadow: none;
  11323. }
  11324. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header h4.name input:read-only {
  11325. pointer-events: none;
  11326. }
  11327. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field {
  11328. flex: 0;
  11329. display: flex;
  11330. flex-direction: row;
  11331. flex-wrap: nowrap;
  11332. justify-content: flex-start;
  11333. align-items: baseline;
  11334. }
  11335. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field label {
  11336. margin-left: 2px;
  11337. flex: 1;
  11338. }
  11339. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field input {
  11340. margin-left: 4px;
  11341. }
  11342. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input,
  11343. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input {
  11344. flex: 1 0 32px;
  11345. text-align: center;
  11346. background-color: var(--text-light);
  11347. font-weight: bold;
  11348. width: 32px;
  11349. }
  11350. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select {
  11351. background: rgba(255, 255, 255, 0.5);
  11352. font-size: var(--font-size-10);
  11353. max-width: 55px;
  11354. padding: 2px;
  11355. }
  11356. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .item-controls {
  11357. display: flex;
  11358. justify-content: space-between;
  11359. }
  11360. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .item-controls a {
  11361. padding: 2px;
  11362. }
  11363. .actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input {
  11364. background: var(--text-light);
  11365. border: 1px solid transparent;
  11366. color: var(--text-dark);
  11367. flex: 1 0 2rem;
  11368. font-weight: 700;
  11369. height: 18px;
  11370. text-align: center;
  11371. width: 2rem;
  11372. }
  11373. .actor.npc.sheet form .sheet-body .footer {
  11374. display: flex;
  11375. flex: 1;
  11376. justify-content: center;
  11377. margin-top: 12px;
  11378. }
  11379. .actor.npc.sheet form .sheet-body .footer button.spellcasting-create {
  11380. align-items: center;
  11381. justify-content: center;
  11382. display: flex;
  11383. gap: 0.25rem;
  11384. margin: 0 0.5rem;
  11385. min-height: 1rem;
  11386. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11387. background: var(--primary);
  11388. color: var(--text-light);
  11389. white-space: nowrap;
  11390. border-radius: 3px;
  11391. border: none;
  11392. }
  11393. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list {
  11394. gap: 0.2em;
  11395. padding-left: 0px;
  11396. padding-right: 5px;
  11397. }
  11398. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item {
  11399. display: flex;
  11400. flex-wrap: wrap;
  11401. align-items: center;
  11402. justify-content: space-between;
  11403. padding: 2px 4px 2px 12px;
  11404. width: 100%;
  11405. }
  11406. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item p:empty {
  11407. display: none;
  11408. }
  11409. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-name {
  11410. display: flex;
  11411. align-items: center;
  11412. flex: 1;
  11413. }
  11414. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-name h4 {
  11415. cursor: pointer;
  11416. margin: 0;
  11417. }
  11418. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-name .item-image {
  11419. margin-right: 8px;
  11420. }
  11421. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-controls {
  11422. display: flex;
  11423. flex: 0;
  11424. font-size: var(--font-size-12);
  11425. gap: 1px;
  11426. white-space: nowrap;
  11427. }
  11428. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-controls a.info-only:hover {
  11429. cursor: default;
  11430. text-shadow: none;
  11431. }
  11432. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-controls a + a {
  11433. margin-left: 4px;
  11434. }
  11435. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .item-summary {
  11436. flex-basis: 100%;
  11437. }
  11438. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item.unidentified {
  11439. border-radius: 1px;
  11440. outline: 1px dotted rgba(75, 74, 68, 0.5);
  11441. background: var(--visibility-gm-bg);
  11442. }
  11443. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .button-group {
  11444. display: flex;
  11445. justify-content: flex-end;
  11446. align-items: center;
  11447. flex-wrap: nowrap;
  11448. width: 50%;
  11449. flex: 0;
  11450. }
  11451. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .button-group button {
  11452. margin: 0;
  11453. border: none;
  11454. cursor: pointer;
  11455. font-family: var(--sans-serif);
  11456. font-size: var(--font-size-10);
  11457. text-transform: uppercase;
  11458. letter-spacing: 0.05em;
  11459. text-rendering: optimizeLegibility;
  11460. padding: 5px;
  11461. color: var(--text-light);
  11462. width: 70px;
  11463. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11464. background: var(--secondary);
  11465. border-radius: 2px;
  11466. flex: 0;
  11467. white-space: nowrap;
  11468. margin-left: 4px;
  11469. flex: 0;
  11470. }
  11471. .actor.npc.sheet form .sheet-body .effects .section-body .effects-list .item .button-group button:hover {
  11472. box-shadow: none;
  11473. text-shadow: 0 0 2px white;
  11474. }
  11475. .actor.npc.sheet form .sheet-body .section-container {
  11476. display: flex;
  11477. flex-direction: column;
  11478. }
  11479. .actor.npc.sheet form .sheet-body .section-container .section-header {
  11480. border: 1px solid var(--primary);
  11481. border-radius: 3px 3px 0px 0px;
  11482. background: var(--primary);
  11483. display: flex;
  11484. flex: 0;
  11485. width: 100%;
  11486. flex-direction: row;
  11487. justify-content: space-between;
  11488. align-items: baseline;
  11489. text-align: left;
  11490. color: var(--text-light);
  11491. font-size: var(--font-size-13);
  11492. padding: 0 8px;
  11493. line-height: 2em;
  11494. }
  11495. .actor.npc.sheet form .sheet-body .section-container .section-header h4 {
  11496. flex: auto;
  11497. display: flex;
  11498. align-items: baseline;
  11499. gap: 4px;
  11500. margin-bottom: 0px;
  11501. text-transform: uppercase;
  11502. }
  11503. .actor.npc.sheet form .sheet-body .section-container .section-header input {
  11504. color: inherit;
  11505. width: auto;
  11506. }
  11507. .actor.npc.sheet form .sheet-body .section-container .section-header .controls {
  11508. gap: 0.5rem;
  11509. white-space: nowrap;
  11510. }
  11511. .actor.npc.sheet form .sheet-body .section-container .section-body {
  11512. border: 1px solid var(--primary);
  11513. border-radius: 0px 0px 3px 3px;
  11514. display: flex;
  11515. flex: auto;
  11516. flex-wrap: wrap;
  11517. flex-direction: row;
  11518. align-items: baseline;
  11519. justify-content: flex-start;
  11520. width: 100%;
  11521. }
  11522. .actor.npc.sheet form .sheet-body .section-container.headerless .section-body {
  11523. border-radius: 3px;
  11524. }
  11525. .actor.npc.sheet form .sheet-body .actions-list,
  11526. .actor.npc.sheet form .sheet-body .attacks-list {
  11527. margin: 0;
  11528. padding: 0;
  11529. width: 100%;
  11530. }
  11531. .actor.npc.sheet form .sheet-body .actions-list .controls,
  11532. .actor.npc.sheet form .sheet-body .attacks-list .controls {
  11533. align-items: baseline;
  11534. display: flex;
  11535. flex: 0;
  11536. flex-wrap: nowrap;
  11537. font-size: var(--font-size-12);
  11538. gap: 1px;
  11539. margin-left: auto;
  11540. }
  11541. .actor.npc.sheet form .sheet-body .actions-list .controls .chat,
  11542. .actor.npc.sheet form .sheet-body .attacks-list .controls .chat {
  11543. margin-right: 2px;
  11544. font-size: 0.9em;
  11545. }
  11546. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group,
  11547. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group,
  11548. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group,
  11549. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group {
  11550. display: flex;
  11551. gap: 0.25em;
  11552. justify-content: start;
  11553. min-width: 100%;
  11554. }
  11555. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .flexrow,
  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 .flexrow,
  11558. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .sub-section,
  11559. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .flexrow,
  11560. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .sub-section,
  11561. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .flexrow,
  11562. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .sub-section {
  11563. gap: 2px;
  11564. }
  11565. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .sub-section,
  11566. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .sub-section,
  11567. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .sub-section,
  11568. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .sub-section {
  11569. align-items: start;
  11570. display: flex;
  11571. flex-wrap: wrap;
  11572. justify-content: flex-start;
  11573. }
  11574. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .sub-section h4,
  11575. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .sub-section h4,
  11576. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .sub-section h4,
  11577. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .sub-section h4 {
  11578. margin-left: var(--font-size-12);
  11579. margin-right: var(--font-size-12);
  11580. }
  11581. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group button,
  11582. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group button,
  11583. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group button,
  11584. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group button {
  11585. align-items: center;
  11586. display: flex;
  11587. border-radius: 3px;
  11588. border: none;
  11589. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11590. color: var(--color-text-light-0);
  11591. cursor: pointer;
  11592. font-size: var(--font-size-11);
  11593. height: var(--font-size-18);
  11594. justify-content: center;
  11595. line-height: var(--font-size-18);
  11596. margin: 0;
  11597. padding: 0 8px;
  11598. white-space: nowrap;
  11599. width: auto;
  11600. }
  11601. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group button:first-child,
  11602. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group button:first-child,
  11603. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group button:first-child,
  11604. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group button:first-child {
  11605. margin-left: 0px;
  11606. }
  11607. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group button:hover,
  11608. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group button:hover,
  11609. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group button:hover,
  11610. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group button:hover {
  11611. box-shadow: none;
  11612. text-shadow: 0 0 2px var(--color-text-light-0);
  11613. }
  11614. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .attack-button,
  11615. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .attack-button,
  11616. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .attack-button,
  11617. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .attack-button {
  11618. background-color: var(--secondary);
  11619. }
  11620. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .damage-button,
  11621. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group .critical-button,
  11622. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .damage-button,
  11623. .actor.npc.sheet form .sheet-body .actions-list li.attack .button-group .critical-button,
  11624. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .damage-button,
  11625. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group .critical-button,
  11626. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .damage-button,
  11627. .actor.npc.sheet form .sheet-body .attacks-list li.attack .button-group .critical-button {
  11628. background-color: var(--primary);
  11629. }
  11630. .actor.npc.sheet form .sheet-body .actions-list li.attack,
  11631. .actor.npc.sheet form .sheet-body .attacks-list li.attack {
  11632. border-bottom: 1px solid var(--color-border-light-tertiary);
  11633. display: flex;
  11634. flex-direction: row;
  11635. justify-content: start;
  11636. gap: 0.25rem;
  11637. padding: 0.25rem 0;
  11638. }
  11639. .actor.npc.sheet form .sheet-body .actions-list li.attack:last-child,
  11640. .actor.npc.sheet form .sheet-body .attacks-list li.attack:last-child {
  11641. border-bottom: none;
  11642. }
  11643. .actor.npc.sheet form .sheet-body .actions-list li.attack > h4,
  11644. .actor.npc.sheet form .sheet-body .attacks-list li.attack > h4 {
  11645. align-items: center;
  11646. display: flex;
  11647. flex-wrap: wrap;
  11648. font-size: 0.9rem;
  11649. font-weight: 500;
  11650. gap: 2px;
  11651. margin: 0 4px 0 0;
  11652. white-space: nowrap;
  11653. }
  11654. .actor.npc.sheet form .sheet-body .actions-list li.attack > h4 > span,
  11655. .actor.npc.sheet form .sheet-body .actions-list li.attack > h4 > a,
  11656. .actor.npc.sheet form .sheet-body .attacks-list li.attack > h4 > span,
  11657. .actor.npc.sheet form .sheet-body .attacks-list li.attack > h4 > a {
  11658. display: flex;
  11659. gap: 3px;
  11660. line-height: 1.125rem;
  11661. margin-right: 4px;
  11662. }
  11663. .actor.npc.sheet form .sheet-body .actions-list li.attack > .description,
  11664. .actor.npc.sheet form .sheet-body .attacks-list li.attack > .description {
  11665. flex-basis: 100%;
  11666. }
  11667. .actor.npc.sheet form .sheet-body .actions-list li.action,
  11668. .actor.npc.sheet form .sheet-body .attacks-list li.action {
  11669. display: flex;
  11670. gap: 0.25rem;
  11671. }
  11672. .actor.npc.sheet form .sheet-body .actions-list li.action:not(:last-child),
  11673. .actor.npc.sheet form .sheet-body .attacks-list li.action:not(:last-child) {
  11674. border-bottom: 1px solid var(--color-border-light-tertiary);
  11675. }
  11676. .actor.npc.sheet form .sheet-body .actions-list li.action > h4,
  11677. .actor.npc.sheet form .sheet-body .attacks-list li.action > h4 {
  11678. align-items: center;
  11679. display: flex;
  11680. gap: 0.25rem;
  11681. flex: auto;
  11682. font-size: 0.9rem;
  11683. margin: 0;
  11684. }
  11685. .actor.npc.sheet form .sheet-body .actions-list li.action > h4 > a,
  11686. .actor.npc.sheet form .sheet-body .attacks-list li.action > h4 > a {
  11687. align-items: center;
  11688. display: flex;
  11689. gap: 2px;
  11690. }
  11691. .actor.npc.sheet form .sheet-body .actions-list li.action .button-group > button.use-action,
  11692. .actor.npc.sheet form .sheet-body .attacks-list li.action .button-group > button.use-action {
  11693. color: var(--color-text-light-0);
  11694. background-color: var(--secondary);
  11695. margin-right: 0.5rem;
  11696. }
  11697. .actor.npc.sheet form .sheet-body .actions-list li.action .action-traits,
  11698. .actor.npc.sheet form .sheet-body .attacks-list li.action .action-traits {
  11699. margin-left: var(--font-size-12);
  11700. }
  11701. .actor.npc.sheet form .sheet-body .actions-list li.action .tracking,
  11702. .actor.npc.sheet form .sheet-body .attacks-list li.action .tracking {
  11703. flex: 0;
  11704. align-items: center;
  11705. display: flex;
  11706. flex-direction: row;
  11707. flex-wrap: nowrap;
  11708. margin-left: auto;
  11709. margin-right: var(--font-size-16);
  11710. }
  11711. .actor.npc.sheet form .sheet-body .actions-list li.action .tracking input,
  11712. .actor.npc.sheet form .sheet-body .attacks-list li.action .tracking input {
  11713. background: none;
  11714. border: 0;
  11715. flex: 0 1 4rem;
  11716. flex: 1;
  11717. font-family: inherit;
  11718. font-size: 0.9rem;
  11719. height: auto;
  11720. padding: 0 3px;
  11721. text-align: center;
  11722. width: 0;
  11723. }
  11724. .actor.npc.sheet form .sheet-body .actions-list li.action .tracking span,
  11725. .actor.npc.sheet form .sheet-body .attacks-list li.action .tracking span {
  11726. white-space: nowrap;
  11727. }
  11728. .actor.npc.sheet form .sheet-body .actions-list li.action .item-summary,
  11729. .actor.npc.sheet form .sheet-body .attacks-list li.action .item-summary {
  11730. flex-basis: 100%;
  11731. }
  11732. .actor.npc.sheet form input.adjustable:not(:focus),
  11733. .actor.npc.sheet form span.adjustable,
  11734. .actor.npc.sheet form div.adjustable {
  11735. display: inline;
  11736. text-align: right;
  11737. }
  11738. .actor.npc.sheet form input.adjustable:not(:focus).adjusted-higher,
  11739. .actor.npc.sheet form span.adjustable.adjusted-higher,
  11740. .actor.npc.sheet form div.adjustable.adjusted-higher {
  11741. color: #009988;
  11742. }
  11743. .actor.npc.sheet form input.adjustable:not(:focus).adjusted-lower,
  11744. .actor.npc.sheet form span.adjustable.adjusted-lower,
  11745. .actor.npc.sheet form div.adjustable.adjusted-lower {
  11746. color: #cc3311;
  11747. }
  11748. .actor.npc.sheet form .disabled {
  11749. color: var(--color-disabled);
  11750. border-color: var(--color-disabled);
  11751. }
  11752. .actor.npc.sheet form .disabled:hover, .actor.npc.sheet form .disabled.active {
  11753. color: var(--color-rarity-common);
  11754. border-color: #7a7971;
  11755. }
  11756. .actor.npc.sheet form .trait {
  11757. flex: auto 0 0;
  11758. padding: 4px;
  11759. background: var(--primary);
  11760. border: 2px solid var(--color-border-trait);
  11761. color: var(--color-text-trait);
  11762. font-size: 0.9em;
  11763. font-weight: 500;
  11764. text-transform: uppercase;
  11765. }
  11766. .actor.npc.sheet form .effects-list {
  11767. display: flex;
  11768. flex: 1 0 auto;
  11769. flex-direction: row;
  11770. flex-wrap: wrap;
  11771. width: 100%;
  11772. }
  11773. .actor.npc.sheet form .effects-list .separator {
  11774. flex: 0 0 1px;
  11775. height: 32px;
  11776. margin-right: 4px;
  11777. border-left: 2px solid var(--color-rarity-common);
  11778. }
  11779. .actor.npc.sheet form .effects-list > .effect {
  11780. display: flex;
  11781. flex: 0 0 32px;
  11782. height: 32px;
  11783. margin-right: 4px;
  11784. margin-bottom: 4px;
  11785. border-bottom: none !important;
  11786. }
  11787. .actor.npc.sheet form .effects-list > .effect .item-image {
  11788. background-size: cover;
  11789. border: 1px solid var(--color-rarity-common);
  11790. border-bottom: 1px solid var(--color-rarity-common);
  11791. border-radius: 3px;
  11792. width: 32px;
  11793. }
  11794. .actor.npc.sheet form .effects-list > .effect .item-image:hover {
  11795. border: 1px solid var(--text-light);
  11796. border-radius: 3px;
  11797. }
  11798. .actor.npc.sheet form .actions-options .actions-option {
  11799. display: flex;
  11800. align-items: center;
  11801. width: 100%;
  11802. }
  11803. .actor.npc.sheet form .actions-options .actions-option label {
  11804. width: 100%;
  11805. }
  11806. .actor.npc.sheet form .actions-options .actions-option label * {
  11807. vertical-align: middle;
  11808. }
  11809. .actor.npc.sheet form .actions-options .actions-option label input {
  11810. margin: 0;
  11811. padding: 0;
  11812. }
  11813. .actor.npc.sheet form .actions-options .actions-option select {
  11814. background: none;
  11815. margin-left: 0.25em;
  11816. text-transform: none;
  11817. }
  11818. .actor.npc.sheet form .actions-list {
  11819. display: flex;
  11820. flex-direction: column;
  11821. gap: 0.25rem;
  11822. padding: 0.1rem 0.25rem;
  11823. }
  11824. .actor.npc.sheet form .actions-list .action {
  11825. width: 100%;
  11826. }
  11827. .actor.npc.sheet form .labelled-field {
  11828. display: flex;
  11829. flex-direction: row;
  11830. align-items: baseline;
  11831. }
  11832. .actor.npc.sheet form .labelled-field label,
  11833. .actor.npc.sheet form .labelled-field .rollable {
  11834. flex: 1;
  11835. font-weight: 600;
  11836. }
  11837. .actor.npc.sheet form .labelled-field input[type=text],
  11838. .actor.npc.sheet form .labelled-field input[type=number] {
  11839. flex: 0;
  11840. font-weight: normal;
  11841. margin: 1px 4px;
  11842. margin-left: auto;
  11843. min-width: 2.5em;
  11844. padding-right: 1px;
  11845. text-align: right;
  11846. }
  11847. .actor.npc.sheet form .labelled-field.hp-temp > label {
  11848. margin-right: 0.5em;
  11849. }
  11850. .actor.npc.sheet form .top-sections {
  11851. display: flex;
  11852. flex-direction: row;
  11853. justify-content: flex-start;
  11854. align-items: flex-start;
  11855. }
  11856. .actor.npc.sheet form .top-sections .skills {
  11857. flex: 3;
  11858. align-self: stretch;
  11859. }
  11860. .actor.npc.sheet form .top-sections .senses {
  11861. flex: 2;
  11862. }
  11863. .actor.npc.sheet form .top-sections .senses .perception {
  11864. width: 100%;
  11865. }
  11866. .actor.npc.sheet form .top-sections .senses .perception label {
  11867. flex-basis: 5em;
  11868. }
  11869. .actor.npc.sheet form .top-sections .senses .perception input {
  11870. flex: 0 0 24px;
  11871. z-index: 1;
  11872. }
  11873. .actor.npc.sheet form .top-sections .ability-scores {
  11874. flex: 2;
  11875. flex-direction: column;
  11876. }
  11877. .actor.npc.sheet form .top-sections .ability-scores .list {
  11878. display: grid;
  11879. padding-left: 0.75em;
  11880. grid-template-columns: repeat(3, minmax(0, 1fr));
  11881. }
  11882. .actor.npc.sheet form .top-sections .ability-scores .list input {
  11883. flex: 0 0 24px;
  11884. margin-right: 1em;
  11885. z-index: 1;
  11886. }
  11887. .actor.npc.sheet form .section-container {
  11888. padding: 0.25rem 0.25rem 0 0;
  11889. }
  11890. .actor.npc.sheet form .section-container .section-body {
  11891. padding: 0.25rem;
  11892. }
  11893. .actor.npc.sheet form .section-container.headerless .section-body {
  11894. border-radius: 3px;
  11895. }
  11896. .actor.npc.sheet form .section-container.skills > .section-body .list {
  11897. display: flex;
  11898. flex-direction: row;
  11899. flex-wrap: wrap;
  11900. }
  11901. .actor.npc.sheet form .section-container.recall-knowledge .section-header {
  11902. align-items: center;
  11903. }
  11904. .actor.npc.sheet form .section-container.recall-knowledge .section-header .breakdown {
  11905. width: auto;
  11906. cursor: pointer;
  11907. font-size: var(--font-size-9);
  11908. line-height: var(--font-size-15);
  11909. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11910. background: var(--secondary);
  11911. color: var(--text-light);
  11912. font-family: var(--sans-serif);
  11913. text-transform: uppercase;
  11914. border-radius: 3px;
  11915. border: none;
  11916. padding: 2px 4px 0;
  11917. }
  11918. .actor.npc.sheet form .section-container.recall-knowledge .section-header .breakdown:hover {
  11919. box-shadow: none;
  11920. text-shadow: 0 0 2px white;
  11921. }
  11922. .actor.npc.sheet form .section-container.languages {
  11923. flex: 1;
  11924. }
  11925. .actor.npc.sheet form select {
  11926. flex: auto 0 0;
  11927. padding: 4px;
  11928. height: auto;
  11929. font-family: var(--sans-serif);
  11930. font-weight: 500;
  11931. text-transform: uppercase;
  11932. }
  11933. .actor.npc.sheet form select option {
  11934. color: var(--text-light);
  11935. background-color: var(--alt);
  11936. }
  11937. .actor.npc.sheet form .adjustments {
  11938. align-items: center;
  11939. display: flex;
  11940. justify-content: end;
  11941. }
  11942. .actor.npc.sheet form .adjustments .adjustment.active {
  11943. background-color: var(--primary);
  11944. color: var(--text-light);
  11945. }
  11946. .actor.npc.sheet form .adjustments .adjustment:not(.active) {
  11947. background-color: var(--color-disabled);
  11948. color: var(--color-text-trait);
  11949. }
  11950. .actor.npc.sheet form .npc-body {
  11951. padding-left: 5px;
  11952. display: flex;
  11953. flex: auto;
  11954. flex-direction: column;
  11955. height: 100%;
  11956. width: 100%;
  11957. overflow-y: hidden;
  11958. }
  11959. .actor.npc.sheet form .notes.active {
  11960. display: flex;
  11961. flex-direction: column;
  11962. gap: 0.5rem;
  11963. padding-bottom: 0.5rem;
  11964. padding-right: 0.75rem;
  11965. }
  11966. .actor.npc.sheet form .notes .notes-section {
  11967. display: flex;
  11968. flex-direction: column;
  11969. }
  11970. .actor.npc.sheet form .notes .notes-section > h4 {
  11971. color: var(--primary);
  11972. font-family: var(--sans-serif);
  11973. font-size: var(--font-size-11);
  11974. font-weight: 700;
  11975. line-height: 1;
  11976. margin: 0 2px 0 0;
  11977. padding: 4px;
  11978. text-transform: uppercase;
  11979. white-space: nowrap;
  11980. }
  11981. .actor.npc.sheet form .notes .notes-section > .notes-text {
  11982. padding: 0 4px 4px;
  11983. color: var(--text-dark);
  11984. flex-grow: 1;
  11985. }
  11986. .actor.npc.sheet form .notes .notes-section > .notes-text .editor {
  11987. height: 100%;
  11988. }
  11989. .actor.npc.sheet form .notes .notes-section > .notes-text .editor .editor-content {
  11990. min-height: 75px;
  11991. }
  11992. .actor.npc.sheet form .notes .notes-section > .notes-text .editor .editor-edit {
  11993. background: var(--primary);
  11994. color: var(--text-light);
  11995. }
  11996. .actor.npc.sheet form .notes .notes-section > .notes-text .editor a.editor-edit {
  11997. padding: 2px 2px 2px 4px;
  11998. }
  11999. .actor.npc.sheet form .notes .notes-section.publication {
  12000. margin-top: auto;
  12001. }
  12002. .actor.npc.sheet form .notes .notes-section.publication .notes-text {
  12003. align-items: baseline;
  12004. gap: 0.25em;
  12005. display: grid;
  12006. grid-template: "title title title" 2fr "authors license remaster" 3fr/60% 20% 20%;
  12007. }
  12008. .actor.npc.sheet form .notes .notes-section.publication .notes-text label {
  12009. font-weight: 500;
  12010. min-width: unset;
  12011. }
  12012. .actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text] {
  12013. height: 1.6rem;
  12014. }
  12015. .actor.npc.sheet form .notes .notes-section.publication .notes-text .title {
  12016. grid-area: title;
  12017. margin-right: 0;
  12018. }
  12019. .actor.npc.sheet form .notes .notes-section.publication .notes-text .authors {
  12020. grid-area: authors;
  12021. }
  12022. .actor.npc.sheet form .notes .notes-section.publication .notes-text .license {
  12023. grid-area: license;
  12024. }
  12025. .actor.npc.sheet form .notes .notes-section.publication .notes-text .license select {
  12026. margin-top: 1px;
  12027. }
  12028. .actor.npc.sheet form .notes .notes-section.publication .notes-text .remaster {
  12029. grid-area: remaster;
  12030. }
  12031. .actor.npc.sheet form .notes .notes-section.publication .notes-text .license,
  12032. .actor.npc.sheet form .notes .notes-section.publication .notes-text .remaster {
  12033. text-align: center;
  12034. }
  12035. .actor.npc.sheet form .notes .notes-section.publication .notes-text .license label,
  12036. .actor.npc.sheet form .notes .notes-section.publication .notes-text .remaster label {
  12037. padding: 0;
  12038. }
  12039. .actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text] {
  12040. background: rgba(0, 0, 0, 0.05);
  12041. padding: 1px 3px;
  12042. }
  12043. .actor.npc.sheet form .notes .tox {
  12044. min-height: 20em;
  12045. }
  12046. .actor.npc.sheet form.dead .profile {
  12047. background-size: cover;
  12048. background-color: #dbd9cd;
  12049. box-sizing: border-box;
  12050. border: 1px solid black;
  12051. border-radius: 2px;
  12052. }
  12053. .actor.npc.sheet form.dead .profile > img {
  12054. border: none;
  12055. width: 100%;
  12056. opacity: 0.33;
  12057. }
  12058. .actor.npc.sheet form.dead h2.name {
  12059. margin-top: 3px;
  12060. text-align: center;
  12061. border-bottom: none;
  12062. }
  12063. .actor.npc.sheet form.simple .sheet-body {
  12064. overflow-y: auto;
  12065. }
  12066. .actor.npc.sheet.simple {
  12067. min-height: 500px;
  12068. }
  12069. .sheet.actor.loot form {
  12070. display: flex;
  12071. flex-direction: row;
  12072. height: 100%;
  12073. }
  12074. .sheet.actor.loot section.sidebar {
  12075. display: flex;
  12076. flex-direction: column;
  12077. width: 200px;
  12078. height: 100%;
  12079. border-right: 1px solid var(--color-text-light-7);
  12080. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  12081. }
  12082. .sheet.actor.loot section.sidebar > * {
  12083. flex: 0;
  12084. }
  12085. .sheet.actor.loot section.sidebar .image-container {
  12086. display: flex;
  12087. }
  12088. .sheet.actor.loot section.sidebar .image-container > img.actor-image {
  12089. flex: none;
  12090. border: none;
  12091. border-bottom: 1px solid var(--color-text-light-7);
  12092. }
  12093. .sheet.actor.loot section.sidebar .image-container [data-action=show-image] {
  12094. bottom: 3px;
  12095. right: 2px;
  12096. }
  12097. .sheet.actor.loot section.sidebar .gm-settings {
  12098. border-bottom: 1px solid var(--color-text-light-7);
  12099. display: flex;
  12100. flex-direction: column;
  12101. padding: 0.25rem;
  12102. }
  12103. .sheet.actor.loot section.sidebar .gm-settings .loot-distribution {
  12104. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  12105. background-color: var(--tertiary);
  12106. }
  12107. .sheet.actor.loot section.sidebar .gm-settings label {
  12108. display: flex;
  12109. align-items: center;
  12110. font-weight: bold;
  12111. }
  12112. .sheet.actor.loot section.sidebar .sidebar-meta {
  12113. border-top: 1px solid var(--color-text-light-7);
  12114. }
  12115. .sheet.actor.loot section.sidebar .hidden-when-empty,
  12116. .sheet.actor.loot section.sidebar .bulk {
  12117. align-self: end;
  12118. }
  12119. .sheet.actor.loot section.sidebar .bulk {
  12120. line-height: 1.5em;
  12121. margin-right: 8px;
  12122. }
  12123. .sheet.actor.loot section.sidebar > .editor,
  12124. .sheet.actor.loot section.sidebar .description {
  12125. flex-basis: auto;
  12126. min-height: 40px;
  12127. flex: 1;
  12128. }
  12129. .sheet.actor.loot section.sidebar > .editor > .tox-tinymce .tox-edit-area {
  12130. min-height: 120px;
  12131. }
  12132. .sheet.actor.loot section.sidebar .description,
  12133. .sheet.actor.loot section.sidebar .editor-content {
  12134. padding: 0.25rem;
  12135. overflow: hidden scroll;
  12136. }
  12137. .sheet.actor.loot .sheet-header {
  12138. display: flex;
  12139. flex-direction: row;
  12140. align-items: center;
  12141. gap: 0.2rem;
  12142. padding-top: 0.25rem;
  12143. border-bottom: 1px solid var(--color-text-light-7);
  12144. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  12145. }
  12146. .sheet.actor.loot .sheet-header h1 {
  12147. margin: 0;
  12148. border: none;
  12149. flex: 1;
  12150. padding-left: 0.5rem;
  12151. }
  12152. .sheet.actor.loot .sheet-header h1 > input {
  12153. height: 40px;
  12154. width: 100%;
  12155. margin: 2px;
  12156. border: none;
  12157. }
  12158. .sheet.actor.loot .sheet-header h1,
  12159. .sheet.actor.loot .sheet-header input {
  12160. font-family: var(--serif-condensed);
  12161. font-size: var(--font-size-36);
  12162. font-weight: 700;
  12163. }
  12164. .sheet.actor.loot .sheet-header .sheet-type i {
  12165. padding: 0 0.25rem 0 0.5rem;
  12166. font-size: var(--font-size-16);
  12167. }
  12168. .sheet.actor.loot .sheet-header .tags {
  12169. align-items: center;
  12170. display: flex;
  12171. flex: 0 0 auto;
  12172. margin-left: auto;
  12173. margin-right: 0.5em;
  12174. }
  12175. .sheet.actor.loot .sheet-header .tags .tag {
  12176. color: var(--text-light);
  12177. font-size: var(--font-size-16);
  12178. height: unset;
  12179. padding: 0.1em 0.4em;
  12180. }
  12181. .sheet.actor.loot .sheet-header .tags .tag option {
  12182. background-color: #5e0000;
  12183. color: inherit;
  12184. font-size: inherit;
  12185. }
  12186. .sheet.actor.loot .sheet-header .currency {
  12187. margin-bottom: 8px;
  12188. }
  12189. .sheet.actor.loot .sheet-body {
  12190. padding: 0.5rem;
  12191. }
  12192. .sheet.actor.loot section.content {
  12193. display: flex;
  12194. flex-direction: column;
  12195. flex: 1;
  12196. height: 100%;
  12197. }
  12198. .sheet.actor.loot section.content .inventory {
  12199. overflow: hidden;
  12200. }
  12201. .sheet.actor.loot section.content .inventory .inventory-list {
  12202. --border-color: var(--secondary-background);
  12203. margin-bottom: 2px;
  12204. }
  12205. .sheet.actor.loot section.content .inventory .inventory-list .item-controls {
  12206. flex: 0 0 4rem;
  12207. }
  12208. .sheet.actor.loot section.content .inventory .inventory-list .item-controls a.item-toggle-equip {
  12209. display: none;
  12210. }
  12211. .sheet.actor.loot section.content .inventory .inventory-header {
  12212. background: var(--primary-background);
  12213. color: var(--text-light);
  12214. }
  12215. .loot-actor-popup {
  12216. flex: unset;
  12217. }
  12218. .loot-actor-popup .confirm-button {
  12219. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  12220. width: calc(100% - 6px);
  12221. height: 2.5em;
  12222. margin-top: 1em;
  12223. background-color: var(--tertiary);
  12224. }
  12225. .loot-actor-popup .checkboxes label {
  12226. display: block;
  12227. padding-right: 10px;
  12228. padding-left: 22px;
  12229. text-indent: -22px;
  12230. }
  12231. .loot-actor-popup .checkboxes input {
  12232. vertical-align: middle;
  12233. }
  12234. .loot-actor-popup .checkboxes label span {
  12235. vertical-align: middle;
  12236. }
  12237. .sheet.party {
  12238. --color-border: rgba(0, 0, 0, 0.28);
  12239. /** White background navigation with little decorations on the left and right */
  12240. }
  12241. .sheet.party form {
  12242. display: flex;
  12243. flex-direction: column;
  12244. height: 100%;
  12245. background: url("../assets/sheet/background.webp");
  12246. background-repeat: no-repeat;
  12247. background-size: cover;
  12248. background-attachment: local;
  12249. }
  12250. .sheet.party form > header {
  12251. background: url("../assets/sheet/header-bw.webp"), url("../assets/sheet/background.webp");
  12252. background-repeat: repeat-x, no-repeat;
  12253. background-size: cover;
  12254. background-color: #2f9d50;
  12255. background-blend-mode: multiply;
  12256. color: var(--text-light);
  12257. width: 100%;
  12258. font-family: var(--sans-serif);
  12259. text-transform: uppercase;
  12260. font-weight: 600;
  12261. display: flex;
  12262. justify-content: space-between;
  12263. align-items: center;
  12264. padding: 0 0.75rem;
  12265. gap: 8px;
  12266. box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  12267. }
  12268. .sheet.party form > header .frame-container {
  12269. flex: 0 0 60px;
  12270. padding: 4px;
  12271. margin: 0.75rem 0;
  12272. }
  12273. .sheet.party form > header .frame-container .frame {
  12274. position: relative;
  12275. width: 2.5rem;
  12276. height: 2.5rem;
  12277. }
  12278. .sheet.party form > header .frame-container .player-image {
  12279. object-fit: cover;
  12280. object-position: top;
  12281. border: none;
  12282. border-radius: 0;
  12283. width: 100%;
  12284. cursor: pointer;
  12285. border: none;
  12286. 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;
  12287. }
  12288. .sheet.party form > header input[type=text],
  12289. .sheet.party form > header input[type=number] {
  12290. color: var(--text-light);
  12291. border: none;
  12292. border-bottom: 1px solid transparent;
  12293. }
  12294. .sheet.party form > header input[type=text]:not(:disabled):hover, .sheet.party form > header input[type=text]:focus,
  12295. .sheet.party form > header input[type=number]:not(:disabled):hover,
  12296. .sheet.party form > header input[type=number]:focus {
  12297. border: none;
  12298. border-bottom: 1px solid var(--text-light);
  12299. box-shadow: none;
  12300. }
  12301. .sheet.party form > header .details {
  12302. margin: 4px 0;
  12303. flex: 1;
  12304. }
  12305. .sheet.party form > header .details {
  12306. display: grid;
  12307. grid: "name type" 1fr "name visibility" auto/1fr auto;
  12308. align-items: center;
  12309. gap: 0 0.5rem;
  12310. font-family: var(--serif-condensed);
  12311. font-size: var(--font-size-28);
  12312. font-weight: 700;
  12313. }
  12314. .sheet.party form > header .details .name {
  12315. grid-area: name;
  12316. flex: 1;
  12317. font-size: var(--font-size-32);
  12318. }
  12319. .sheet.party form > header .details .actor-type {
  12320. grid-area: type;
  12321. text-align: end;
  12322. }
  12323. .sheet.party form > header .details .visibility {
  12324. grid-area: visibility;
  12325. font-size: var(--font-size-14);
  12326. opacity: 0.8;
  12327. }
  12328. .sheet.party form > header .details .visibility i {
  12329. font-size: 0.9em;
  12330. margin-right: 0.125rem;
  12331. }
  12332. .sheet.party nav.sheet-navigation {
  12333. display: inline-flex;
  12334. justify-content: center;
  12335. align-items: center;
  12336. height: 20px;
  12337. background: var(--secondary);
  12338. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  12339. transition: all 0.1s ease-out;
  12340. box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
  12341. border-top: 1px solid rgba(255, 255, 255, 0.1);
  12342. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  12343. position: relative;
  12344. }
  12345. .sheet.party nav.sheet-navigation .navigation-title {
  12346. color: var(--text-light);
  12347. margin-right: auto;
  12348. padding-left: 1em;
  12349. white-space: nowrap;
  12350. width: 7em;
  12351. }
  12352. .sheet.party nav.sheet-navigation > a {
  12353. display: flex;
  12354. justify-content: center;
  12355. align-items: center;
  12356. margin: 0 6px;
  12357. font-size: var(--font-size-12);
  12358. }
  12359. .sheet.party nav.sheet-navigation .item {
  12360. height: 24px;
  12361. width: 24px;
  12362. border-radius: 50%;
  12363. z-index: 1;
  12364. transition: all 0.1s ease-out;
  12365. color: var(--tertiary);
  12366. fill: var(--tertiary);
  12367. background-image: url("../assets/sheet/nav-item-inactive.webp");
  12368. background-size: contain;
  12369. /* prettier-ignore */
  12370. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25);
  12371. }
  12372. .sheet.party nav.sheet-navigation .item.active {
  12373. 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);
  12374. }
  12375. .sheet.party nav.sheet-navigation .item:last-child {
  12376. margin-right: 10px;
  12377. }
  12378. .sheet.party nav.sheet-navigation .item:hover, .sheet.party nav.sheet-navigation .item.active {
  12379. z-index: 2;
  12380. transform: scale(1.2);
  12381. color: var(--text-light);
  12382. fill: var(--text-light);
  12383. background-image: url("../assets/sheet/nav-item.webp");
  12384. }
  12385. .sheet.party nav.sheet-navigation .item .fas {
  12386. padding-bottom: 0;
  12387. }
  12388. .sheet.party nav.sheet-navigation .item:hover .pfs-icon {
  12389. filter: drop-shadow(0 0 8px var(--color-shadow-primary));
  12390. }
  12391. .sheet.party nav.sheet-navigation .item .action-icon {
  12392. font-family: "Pathfinder2eActions", sans-serif;
  12393. font-size: 1rem;
  12394. }
  12395. .sheet.party nav.sub-nav {
  12396. margin: 0;
  12397. padding: 0;
  12398. display: flex;
  12399. flex-wrap: nowrap;
  12400. justify-content: center;
  12401. align-items: center;
  12402. list-style: none;
  12403. background-color: var(--bg);
  12404. box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  12405. width: 100%;
  12406. flex: 0 0 2.5rem;
  12407. }
  12408. .sheet.party nav.sub-nav::before, .sheet.party nav.sub-nav::after {
  12409. content: "";
  12410. width: 37px;
  12411. height: 16px;
  12412. background: url("../assets/sheet/sub-nav-decoration.webp");
  12413. margin: 0 16px;
  12414. }
  12415. .sheet.party nav.sub-nav::after {
  12416. transform: scaleX(-100%);
  12417. }
  12418. .sheet.party nav.sub-nav a,
  12419. .sheet.party nav.sub-nav .tab {
  12420. border-left: 1px solid rgba(255, 255, 255, 0.3);
  12421. border-right: 1px solid rgba(0, 0, 0, 0.2);
  12422. color: var(--alt);
  12423. cursor: pointer;
  12424. display: block;
  12425. font: 400 var(--font-size-16) var(--serif);
  12426. flex: 1;
  12427. margin: 0 0.25rem;
  12428. max-width: 30%;
  12429. text-align: center;
  12430. text-decoration: none;
  12431. transition: all 0.1s ease-out;
  12432. }
  12433. .sheet.party nav.sub-nav a.active,
  12434. .sheet.party nav.sub-nav .tab.active {
  12435. color: var(--primary);
  12436. font-weight: 600;
  12437. }
  12438. .sheet.party nav.sub-nav a:first-child,
  12439. .sheet.party nav.sub-nav .tab:first-child {
  12440. border-left: none;
  12441. }
  12442. .sheet.party nav.sub-nav a:last-child,
  12443. .sheet.party nav.sub-nav .tab:last-child {
  12444. border-right: none;
  12445. }
  12446. .sheet.party nav.sub-nav a:hover,
  12447. .sheet.party nav.sub-nav .tab:hover {
  12448. text-shadow: 0 0 3px rgba(255, 255, 255, 0.5);
  12449. }
  12450. .sheet.party .tab nav.sub-nav {
  12451. padding-right: 20px;
  12452. }
  12453. .sheet.party .actor-link {
  12454. cursor: pointer;
  12455. }
  12456. .sheet.party .readonly {
  12457. pointer-events: none;
  12458. }
  12459. .sheet.party .readonly a,
  12460. .sheet.party .readonly button {
  12461. pointer-events: none;
  12462. }
  12463. .sheet.party .container {
  12464. height: 100%;
  12465. overflow: hidden;
  12466. }
  12467. .sheet.party .content {
  12468. overflow: hidden scroll;
  12469. flex: 1;
  12470. }
  12471. .sheet.party .tab.active {
  12472. display: flex;
  12473. height: 100%;
  12474. }
  12475. .sheet.party .item-list.directory-list {
  12476. gap: 0.2em;
  12477. margin: 0;
  12478. padding: 0;
  12479. display: flex;
  12480. flex-direction: column;
  12481. width: 100%;
  12482. }
  12483. .sheet.party .item-list.directory-list .item {
  12484. display: flex;
  12485. flex-wrap: wrap;
  12486. align-items: center;
  12487. justify-content: space-between;
  12488. padding: 2px 4px 2px 12px;
  12489. width: 100%;
  12490. }
  12491. .sheet.party .item-list.directory-list .item p:empty {
  12492. display: none;
  12493. }
  12494. .sheet.party .item-list.directory-list .item .item-name {
  12495. display: flex;
  12496. align-items: center;
  12497. flex: 1;
  12498. }
  12499. .sheet.party .item-list.directory-list .item .item-name h4 {
  12500. cursor: pointer;
  12501. margin: 0;
  12502. }
  12503. .sheet.party .item-list.directory-list .item .item-name .item-image {
  12504. margin-right: 8px;
  12505. }
  12506. .sheet.party .item-list.directory-list .item .item-controls {
  12507. display: flex;
  12508. flex: 0;
  12509. font-size: var(--font-size-12);
  12510. gap: 1px;
  12511. white-space: nowrap;
  12512. }
  12513. .sheet.party .item-list.directory-list .item .item-controls a.info-only:hover {
  12514. cursor: default;
  12515. text-shadow: none;
  12516. }
  12517. .sheet.party .item-list.directory-list .item .item-controls a + a {
  12518. margin-left: 4px;
  12519. }
  12520. .sheet.party .item-list.directory-list .item .item-summary {
  12521. flex-basis: 100%;
  12522. }
  12523. .sheet.party .item-list.directory-list .item.unidentified {
  12524. border-radius: 1px;
  12525. outline: 1px dotted rgba(75, 74, 68, 0.5);
  12526. background: var(--visibility-gm-bg);
  12527. }
  12528. .sheet.party .item-list.directory-list .item .button-group {
  12529. display: flex;
  12530. justify-content: flex-end;
  12531. align-items: center;
  12532. flex-wrap: nowrap;
  12533. width: 50%;
  12534. flex: 0;
  12535. }
  12536. .sheet.party .item-list.directory-list .item .button-group button {
  12537. margin: 0;
  12538. border: none;
  12539. cursor: pointer;
  12540. font-family: var(--sans-serif);
  12541. font-size: var(--font-size-10);
  12542. text-transform: uppercase;
  12543. letter-spacing: 0.05em;
  12544. text-rendering: optimizeLegibility;
  12545. padding: 5px;
  12546. color: var(--text-light);
  12547. width: 70px;
  12548. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  12549. background: var(--secondary);
  12550. border-radius: 2px;
  12551. flex: 0;
  12552. white-space: nowrap;
  12553. margin-left: 4px;
  12554. flex: 0;
  12555. }
  12556. .sheet.party .item-list.directory-list .item .button-group button:hover {
  12557. box-shadow: none;
  12558. text-shadow: 0 0 2px white;
  12559. }
  12560. .sheet.party .item-list.directory-list .item {
  12561. margin: 2px 0;
  12562. border: solid transparent;
  12563. border-width: 0 0 1px;
  12564. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  12565. }
  12566. .sheet.party .item-list.directory-list .item .item-summary {
  12567. margin-top: 8px;
  12568. }
  12569. .sheet.party header.content-header {
  12570. align-items: center;
  12571. background-color: var(--sub);
  12572. color: var(--text-light);
  12573. display: flex;
  12574. font-weight: 600;
  12575. margin-bottom: 0.5rem;
  12576. padding: 0 0.5rem;
  12577. line-height: 2.375rem;
  12578. }
  12579. .sheet.party header.content-header .buttons {
  12580. align-items: center;
  12581. display: flex;
  12582. margin-left: auto;
  12583. }
  12584. .sheet.party header.content-header button {
  12585. background-color: var(--tertiary);
  12586. border: 1px solid var(--alt-dark);
  12587. border-radius: 0;
  12588. color: var(--alt-dark);
  12589. min-width: 2.375rem;
  12590. height: 1.875rem;
  12591. margin: 0;
  12592. }
  12593. .sheet.party header.content-header button + button {
  12594. margin-left: -1px;
  12595. }
  12596. .sheet.party header.content-header button:hover {
  12597. z-index: 1;
  12598. }
  12599. .sheet.party .sidebar {
  12600. overflow: hidden scroll;
  12601. border-right: 1px solid #888;
  12602. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  12603. display: flex;
  12604. flex-direction: column;
  12605. gap: 8px;
  12606. height: 100%;
  12607. padding: 0.5rem;
  12608. width: 13.5rem;
  12609. }
  12610. .sheet.party .sidebar .box-list {
  12611. margin: 0;
  12612. padding: 0;
  12613. display: flex;
  12614. color: var(--alt-dark);
  12615. flex-direction: column;
  12616. font-family: var(--sans-serif);
  12617. gap: 0.5rem;
  12618. list-style-type: none;
  12619. }
  12620. .sheet.party .sidebar .box {
  12621. border: 1px solid var(--color-border);
  12622. box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.18);
  12623. font-family: var(--sans-serif);
  12624. border-radius: 3px;
  12625. font-size: var(--font-size-12);
  12626. }
  12627. .sheet.party .sidebar .box .summary-data > div {
  12628. align-items: center;
  12629. display: flex;
  12630. margin: 0.5rem;
  12631. }
  12632. .sheet.party .sidebar .box .summary-data > div label {
  12633. flex: 1;
  12634. font-weight: 600;
  12635. }
  12636. .sheet.party .sidebar .box .actor-link img {
  12637. border: none;
  12638. width: 2rem;
  12639. height: 2rem;
  12640. object-fit: contain;
  12641. }
  12642. .sheet.party .sidebar .box .name {
  12643. font-weight: 700;
  12644. overflow: hidden;
  12645. text-overflow: ellipsis;
  12646. white-space: nowrap;
  12647. }
  12648. .sheet.party .sidebar .box header,
  12649. .sheet.party .sidebar .box footer {
  12650. position: relative;
  12651. margin: -1px;
  12652. padding: 0 0.25rem;
  12653. }
  12654. .sheet.party .sidebar .box header {
  12655. background-color: var(--sub);
  12656. border-radius: 3px 3px 0 0;
  12657. color: var(--text-light);
  12658. font-weight: 700;
  12659. height: 1.125rem;
  12660. line-height: 1.125rem;
  12661. }
  12662. .sheet.party .sidebar .box footer {
  12663. background-color: var(--bg-dark);
  12664. border-radius: 0 0 3px 3px;
  12665. border: 1px solid var(--color-border);
  12666. border-top: none;
  12667. color: var(--sub);
  12668. font-weight: 500;
  12669. height: 1rem;
  12670. line-height: 1rem;
  12671. }
  12672. .sheet.party .tag-light {
  12673. --tag-color: var(--color-proficiency-untrained);
  12674. align-items: center;
  12675. border-radius: 2px;
  12676. border: 1px solid var(--tag-color);
  12677. color: var(--tag-color);
  12678. display: flex;
  12679. font: 700 var(--font-size-13)/1.25rem var(--sans-serif);
  12680. font-variant: all-small-caps;
  12681. gap: 0.125rem;
  12682. height: 1.25rem;
  12683. margin: 0;
  12684. padding: 0 0.25rem;
  12685. white-space: nowrap;
  12686. width: auto;
  12687. }
  12688. .sheet.party .tag-light .mod {
  12689. font-weight: 500;
  12690. }
  12691. .sheet.party [data-tab=inventory] .inventory-members .box .content {
  12692. align-items: center;
  12693. display: flex;
  12694. padding: 0.5rem;
  12695. overflow: hidden;
  12696. }
  12697. .sheet.party [data-tab=inventory] .inventory-members .box .content img {
  12698. grid-area: image;
  12699. margin-right: 0.4rem;
  12700. }
  12701. .sheet.party [data-tab=inventory] .inventory-members .box .content .sub-data {
  12702. display: flex;
  12703. flex-direction: column;
  12704. gap: 0.125rem;
  12705. }
  12706. .sheet.party [data-tab=inventory] .inventory-members .box footer {
  12707. align-items: center;
  12708. display: flex;
  12709. gap: 0.25rem;
  12710. }
  12711. .sheet.party [data-tab=inventory] .inventory-members .box footer i {
  12712. font-size: 0.8em;
  12713. }
  12714. .sheet.party [data-tab=inventory] .inventory-members .box .inventory-data {
  12715. display: flex;
  12716. gap: 0.25rem;
  12717. padding: 2px 3px;
  12718. font-size: var(--font-size-12);
  12719. }
  12720. .sheet.party [data-tab=inventory] .inventory {
  12721. flex: 1;
  12722. padding: 0.5rem 4px 0.5em 0.5em;
  12723. display: flex;
  12724. flex-direction: column;
  12725. height: 100%;
  12726. }
  12727. .sheet.party [data-tab=inventory] .inventory .item-controls {
  12728. max-width: 3.5rem;
  12729. }
  12730. .sheet.party [data-tab=overview] .content {
  12731. padding-top: 0.5rem;
  12732. padding-bottom: 0.25rem;
  12733. }
  12734. .sheet.party [data-tab=overview] .summary {
  12735. border-image-repeat: repeat;
  12736. border-image-slice: 11;
  12737. border-image-source: url("../assets/sheet/frame-elegant.svg");
  12738. border-image-width: 14px;
  12739. border-style: double;
  12740. display: flex;
  12741. flex-direction: column;
  12742. padding: 0.375rem 0.5rem;
  12743. margin: 0.25rem 1rem 0.25rem 12px;
  12744. }
  12745. .sheet.party [data-tab=overview] .summary nav {
  12746. color: var(--alt-dark);
  12747. display: flex;
  12748. gap: 0.25rem;
  12749. line-height: 1.25em;
  12750. margin-bottom: 0.375rem;
  12751. align-items: center;
  12752. }
  12753. .sheet.party [data-tab=overview] .summary nav button {
  12754. border: none;
  12755. font-size: var(--font-size-14);
  12756. font-weight: 500;
  12757. padding: 0 0.5rem;
  12758. white-space: nowrap;
  12759. width: auto;
  12760. }
  12761. .sheet.party [data-tab=overview] .summary nav button.active {
  12762. background: var(--secondary);
  12763. color: var(--text-light);
  12764. }
  12765. .sheet.party [data-tab=overview] .summary nav label {
  12766. margin-left: auto;
  12767. margin-right: 0.25rem;
  12768. }
  12769. .sheet.party [data-tab=overview] .summary .tags,
  12770. .sheet.party [data-tab=overview] .summary .skills {
  12771. margin: 0;
  12772. }
  12773. .sheet.party [data-tab=overview] .summary [hidden] {
  12774. display: none;
  12775. }
  12776. .sheet.party [data-tab=overview] .skills {
  12777. display: flex;
  12778. flex-wrap: wrap;
  12779. gap: 0.25rem;
  12780. }
  12781. .sheet.party [data-tab=overview] .skills .tag-light[data-rank="1"] {
  12782. --tag-color: var(--color-proficiency-trained);
  12783. }
  12784. .sheet.party [data-tab=overview] .skills .tag-light[data-rank="2"] {
  12785. --tag-color: var(--color-proficiency-expert);
  12786. }
  12787. .sheet.party [data-tab=overview] .skills .tag-light[data-rank="3"] {
  12788. --tag-color: var(--color-proficiency-master);
  12789. }
  12790. .sheet.party [data-tab=overview] .skills .tag-light[data-rank="4"] {
  12791. --tag-color: var(--color-proficiency-legendary);
  12792. }
  12793. .sheet.party [data-tab=overview] .skills .perception {
  12794. color: var(--text-light);
  12795. background-color: var(--tag-color);
  12796. }
  12797. .sheet.party [data-tab=overview] .member {
  12798. display: flex;
  12799. flex-direction: row;
  12800. font-family: var(--sans-serif);
  12801. padding: 0.5rem 1rem;
  12802. position: relative;
  12803. height: 7.375rem;
  12804. }
  12805. .sheet.party [data-tab=overview] .member:not(:last-child):after {
  12806. content: "";
  12807. background-color: rgba(68, 55, 48, 0.1);
  12808. width: 100%;
  12809. height: 1px;
  12810. position: absolute;
  12811. bottom: 0;
  12812. }
  12813. .sheet.party [data-tab=overview] .member > .portrait {
  12814. margin-right: 8px;
  12815. min-width: 5.5rem;
  12816. position: relative;
  12817. }
  12818. .sheet.party [data-tab=overview] .member > .portrait img {
  12819. position: absolute;
  12820. border: none;
  12821. height: 100%;
  12822. width: 100%;
  12823. object-fit: contain;
  12824. }
  12825. .sheet.party [data-tab=overview] .member > .portrait .health-bar {
  12826. background-color: var(--sub);
  12827. bottom: 0;
  12828. color: var(--text-light);
  12829. font-size: var(--font-size-12);
  12830. font-weight: 500;
  12831. height: 1.25rem;
  12832. line-height: 1.25rem;
  12833. position: absolute;
  12834. width: 100%;
  12835. }
  12836. .sheet.party [data-tab=overview] .member > .portrait .health-bar .bar {
  12837. position: absolute;
  12838. top: 0;
  12839. left: 0;
  12840. bottom: 0;
  12841. background-color: var(--primary);
  12842. box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.2);
  12843. }
  12844. .sheet.party [data-tab=overview] .member > .portrait .health-bar .temp {
  12845. background-color: var(--secondary);
  12846. top: -0.25rem;
  12847. height: 0.25rem;
  12848. }
  12849. .sheet.party [data-tab=overview] .member > .portrait .health-bar span {
  12850. padding-left: 0.25rem;
  12851. position: relative;
  12852. }
  12853. .sheet.party [data-tab=overview] .member > .data {
  12854. width: 100%;
  12855. }
  12856. .sheet.party [data-tab=overview] .member > .data header {
  12857. border-left: 1px solid #c9bfa9;
  12858. display: grid;
  12859. grid: "name hero-points" "blurb hero-points"/auto max-content;
  12860. margin-bottom: 0.25rem;
  12861. padding-left: 0.5rem;
  12862. }
  12863. .sheet.party [data-tab=overview] .member > .data header .name {
  12864. align-items: center;
  12865. display: flex;
  12866. font: 600 var(--font-size-18)/1 var(--serif);
  12867. grid-area: name;
  12868. }
  12869. .sheet.party [data-tab=overview] .member > .data header .name i {
  12870. font-size: 0.8em;
  12871. margin-left: 0.125rem;
  12872. }
  12873. .sheet.party [data-tab=overview] .member > .data header .blurb {
  12874. align-items: center;
  12875. color: var(--alt-dark);
  12876. display: flex;
  12877. font: 500 var(--font-size-14)/var(--font-size-14) var(--sans-serif);
  12878. font-variant: all-small-caps;
  12879. gap: 0.25rem;
  12880. grid-area: blurb;
  12881. position: relative;
  12882. }
  12883. .sheet.party [data-tab=overview] .member > .data header .blurb hr.vr {
  12884. border: 1px solid var(--color-border);
  12885. height: 0.5rem;
  12886. position: relative;
  12887. top: 1px;
  12888. }
  12889. .sheet.party [data-tab=overview] .member > .data header .hero-points {
  12890. align-items: end;
  12891. display: flex;
  12892. gap: 3px;
  12893. grid-area: hero-points;
  12894. width: fit-content;
  12895. }
  12896. .sheet.party [data-tab=overview] .member > .data header .hero-points > * {
  12897. width: 1.5rem;
  12898. height: 1.5rem;
  12899. }
  12900. .sheet.party [data-tab=overview] .member > .data header .hero-points .empty {
  12901. border: 2px dashed rgba(0, 0, 0, 0.5);
  12902. border-radius: 50%;
  12903. }
  12904. .sheet.party [data-tab=overview] .member > .data header .hero-points img {
  12905. border: none;
  12906. }
  12907. .sheet.party [data-tab=overview] .member > .data .main-stats {
  12908. display: flex;
  12909. gap: 0.5rem;
  12910. margin: 0.125rem 0 0.25rem 0;
  12911. }
  12912. .sheet.party [data-tab=overview] .member > .data .main-stats > section {
  12913. border: 1px solid var(--color-border);
  12914. border-radius: 2px;
  12915. height: 2.625rem;
  12916. display: flex;
  12917. align-items: center;
  12918. justify-content: space-between;
  12919. flex: 1 1 0;
  12920. }
  12921. .sheet.party [data-tab=overview] .member > .data .main-stats .score {
  12922. display: flex;
  12923. flex-direction: column;
  12924. align-items: center;
  12925. justify-content: center;
  12926. font-size: var(--font-size-18);
  12927. }
  12928. .sheet.party [data-tab=overview] .member > .data .main-stats .score label {
  12929. font-size: var(--font-size-10);
  12930. font-weight: 500;
  12931. }
  12932. .sheet.party [data-tab=overview] .member > .data .main-stats .ac {
  12933. border: none;
  12934. position: relative;
  12935. flex: 0 0 2.25rem;
  12936. }
  12937. .sheet.party [data-tab=overview] .member > .data .main-stats .ac::before {
  12938. content: " ";
  12939. position: absolute;
  12940. inset: 0;
  12941. background: url("../assets/sheet/shield-clear.svg") no-repeat center center;
  12942. background-size: contain;
  12943. }
  12944. .sheet.party [data-tab=overview] .member > .data .main-stats .ac .value {
  12945. color: var(--color-proficiency-trained);
  12946. font-weight: 700;
  12947. }
  12948. .sheet.party [data-tab=overview] .member > .data .main-stats .saving-throws {
  12949. flex: 0 0 9.5rem;
  12950. }
  12951. .sheet.party [data-tab=overview] .member > .data .main-stats .saving-throws .score {
  12952. flex: 1;
  12953. font-weight: 500;
  12954. }
  12955. .sheet.party [data-tab=overview] .member > .data .main-stats .senses {
  12956. align-items: center;
  12957. flex: 1.4;
  12958. overflow: hidden;
  12959. }
  12960. .sheet.party [data-tab=overview] .member > .data .main-stats .senses .value {
  12961. align-items: center;
  12962. display: flex;
  12963. font-size: var(--font-size-12);
  12964. gap: 0.125rem;
  12965. overflow-x: auto;
  12966. max-width: 100%;
  12967. padding: 0 0.5rem;
  12968. padding-bottom: 7px;
  12969. margin-bottom: -7px;
  12970. }
  12971. .sheet.party [data-tab=overview] .member > .data .main-stats .senses .value [data-acuity=imprecise],
  12972. .sheet.party [data-tab=overview] .member > .data .main-stats .senses .value [data-acuity=vague] {
  12973. border-style: dashed;
  12974. }
  12975. .sheet.party [data-tab=exploration] .exploration-members .actor-link {
  12976. display: flex;
  12977. align-items: center;
  12978. gap: 0.25rem;
  12979. }
  12980. .sheet.party [data-tab=exploration] .exploration-members .member .sub-data {
  12981. display: flex;
  12982. flex-direction: row;
  12983. background-color: rgba(68, 55, 48, 0.1);
  12984. font-size: var(--font-size-11);
  12985. font-weight: 500;
  12986. }
  12987. .sheet.party [data-tab=exploration] .exploration-members .member .sub-data > span {
  12988. flex: 1;
  12989. text-align: center;
  12990. padding: 0.2rem;
  12991. }
  12992. .sheet.party [data-tab=exploration] .exploration-members .member .sub-data > span:not(:last-child) {
  12993. border-right: 1px solid rgba(68, 55, 48, 0.1);
  12994. }
  12995. .sheet.party [data-tab=exploration] .exploration-members .member footer.health-bar {
  12996. background-color: var(--sub);
  12997. color: var(--text-light);
  12998. }
  12999. .sheet.party [data-tab=exploration] .exploration-members .member footer.health-bar .bar {
  13000. position: absolute;
  13001. top: 0;
  13002. left: 0;
  13003. bottom: 0;
  13004. background-color: var(--primary);
  13005. border-radius: 0 0 3px 3px;
  13006. box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.2);
  13007. }
  13008. .sheet.party [data-tab=exploration] .exploration-members .member footer.health-bar span {
  13009. position: relative;
  13010. }
  13011. .sheet.party [data-tab=exploration] .content {
  13012. padding: 0.5rem;
  13013. }
  13014. .sheet.party [data-tab=exploration] .activities {
  13015. display: flex;
  13016. flex-direction: column;
  13017. gap: 0.5rem;
  13018. }
  13019. .sheet.party [data-tab=exploration] .activities .member-activity {
  13020. border-image-repeat: repeat;
  13021. border-image-slice: 11;
  13022. border-image-source: url("../assets/sheet/frame-elegant.svg");
  13023. border-image-width: 14px;
  13024. border-style: double;
  13025. display: flex;
  13026. align-items: center;
  13027. }
  13028. .sheet.party [data-tab=exploration] .activities .member-activity img {
  13029. object-fit: contain;
  13030. border: none;
  13031. }
  13032. .sheet.party [data-tab=exploration] .activities .member-activity .actor-image {
  13033. flex: 0 0 auto;
  13034. }
  13035. .sheet.party [data-tab=exploration] .activities .member-activity .actor-image img {
  13036. width: 4rem;
  13037. height: 4rem;
  13038. margin: 0.375rem;
  13039. display: flex;
  13040. align-items: center;
  13041. justify-content: center;
  13042. }
  13043. .sheet.party [data-tab=exploration] .activities .member-activity .actor-image img i {
  13044. color: var(--text-dark);
  13045. font-size: var(--font-size-30);
  13046. }
  13047. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries {
  13048. display: flex;
  13049. flex-direction: column;
  13050. gap: 0.125rem;
  13051. overflow: hidden;
  13052. }
  13053. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity {
  13054. align-items: center;
  13055. display: flex;
  13056. gap: 0 0.5rem;
  13057. margin-left: 0.25rem;
  13058. white-space: nowrap;
  13059. }
  13060. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity .name {
  13061. font-weight: 500;
  13062. }
  13063. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity .tags {
  13064. flex-wrap: nowrap;
  13065. overflow: hidden;
  13066. }
  13067. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity.single {
  13068. align-items: start;
  13069. flex-direction: column;
  13070. }
  13071. .sheet.party [data-tab=exploration] .activities .member-activity .activity-entries .activity.single .name {
  13072. font-size: var(--font-size-16);
  13073. }
  13074. .sheet.party [data-tab=exploration] .activities .member-activity .empty {
  13075. align-items: center;
  13076. cursor: pointer;
  13077. display: flex;
  13078. font-family: var(--serif);
  13079. gap: 0.5rem;
  13080. }
  13081. .sheet.party [data-tab=exploration] .activities .member-activity .empty div {
  13082. margin: 0;
  13083. }
  13084. .sheet.party [data-tab=exploration] .activities .member-activity .empty .icon {
  13085. border: 1px dashed var(--color-border);
  13086. border-radius: 50%;
  13087. display: flex;
  13088. align-items: center;
  13089. justify-content: center;
  13090. font-size: var(--font-size-14);
  13091. height: 2.125rem;
  13092. width: 2.125rem;
  13093. }
  13094. .sheet.party [data-tab=exploration] .activities .member-activity .empty .name {
  13095. color: var(--primary-dark);
  13096. font-size: var(--font-size-16);
  13097. line-height: 1em;
  13098. }
  13099. .sheet.party [data-tab=exploration] .activities .member-activity .empty .hint {
  13100. color: var(--alt-dark);
  13101. line-height: 1em;
  13102. }
  13103. .sheet.party [data-tab=orphaned] .item-list {
  13104. margin: 16px;
  13105. }
  13106. .sheet.kingdom {
  13107. --paper-bg: rgba(221, 216, 200, 0.4);
  13108. --drop-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  13109. --gold: #ffd700;
  13110. --color-divider: rgba(68, 55, 48, 0.2);
  13111. /** White background navigation with little decorations on the left and right */
  13112. }
  13113. .sheet.kingdom form {
  13114. display: flex;
  13115. flex-direction: column;
  13116. height: 100%;
  13117. background: url("../assets/sheet/background.webp");
  13118. background-repeat: no-repeat;
  13119. background-size: cover;
  13120. background-attachment: local;
  13121. }
  13122. .sheet.kingdom form > header {
  13123. background: url("../assets/sheet/header-bw.webp"), url("../assets/sheet/background.webp");
  13124. background-repeat: repeat-x, no-repeat;
  13125. background-size: cover;
  13126. background-color: #66bc1a;
  13127. background-blend-mode: multiply;
  13128. color: var(--text-light);
  13129. width: 100%;
  13130. font-family: var(--sans-serif);
  13131. font-weight: 600;
  13132. display: flex;
  13133. justify-content: space-between;
  13134. align-items: center;
  13135. padding: 0 0.75rem;
  13136. gap: 0.75rem;
  13137. box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  13138. }
  13139. .sheet.kingdom form > header .frame-container {
  13140. padding: 4px;
  13141. margin: 0.75rem 0;
  13142. }
  13143. .sheet.kingdom form > header .frame-container .frame {
  13144. position: relative;
  13145. width: 3.25rem;
  13146. height: 3.25rem;
  13147. }
  13148. .sheet.kingdom form > header .frame-container .player-image {
  13149. object-fit: cover;
  13150. object-position: top;
  13151. border: none;
  13152. border-radius: 0;
  13153. width: 3.25rem;
  13154. height: 3.25rem;
  13155. cursor: pointer;
  13156. border: none;
  13157. 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;
  13158. }
  13159. .sheet.kingdom form > header .details {
  13160. display: grid;
  13161. grid-template: "title title title title level" auto "capital size rp fame level" auto/1fr auto auto auto auto;
  13162. align-items: center;
  13163. gap: 0 4px;
  13164. font-size: var(--font-size-22);
  13165. font-family: var(--serif-condensed);
  13166. font-weight: 700;
  13167. margin: 4px 0;
  13168. flex: 1;
  13169. }
  13170. .sheet.kingdom form > header .details input[type=text],
  13171. .sheet.kingdom form > header .details input[type=number] {
  13172. color: var(--text-light);
  13173. border: none;
  13174. border-bottom: 1px solid transparent;
  13175. padding: 0;
  13176. height: unset;
  13177. }
  13178. .sheet.kingdom form > header .details input[type=text]:hover, .sheet.kingdom form > header .details input[type=text]:focus,
  13179. .sheet.kingdom form > header .details input[type=number]:hover,
  13180. .sheet.kingdom form > header .details input[type=number]:focus {
  13181. border: none;
  13182. border-bottom: 1px solid var(--text-light);
  13183. box-shadow: none;
  13184. }
  13185. .sheet.kingdom form > header .details input[type=text]::placeholder,
  13186. .sheet.kingdom form > header .details input[type=number]::placeholder {
  13187. color: #bbb;
  13188. opacity: 0.4;
  13189. }
  13190. .sheet.kingdom form > header .details .title {
  13191. display: flex;
  13192. grid-area: title;
  13193. gap: 1rem;
  13194. font-size: var(--font-size-30);
  13195. }
  13196. .sheet.kingdom form > header .details label {
  13197. align-items: baseline;
  13198. display: flex;
  13199. gap: 0.5rem;
  13200. white-space: nowrap;
  13201. }
  13202. .sheet.kingdom form > header .details label span {
  13203. color: var(--gold);
  13204. font-size: 0.8em;
  13205. text-transform: uppercase;
  13206. }
  13207. .sheet.kingdom form > header .details .capital {
  13208. grid-area: capital;
  13209. }
  13210. .sheet.kingdom form > header .details .size {
  13211. grid-area: size;
  13212. margin-left: 0.5rem;
  13213. }
  13214. .sheet.kingdom form > header .details .size input {
  13215. width: 3ch;
  13216. text-align: center;
  13217. }
  13218. .sheet.kingdom form > header .details .resource-points {
  13219. grid-area: rp;
  13220. margin-left: 1rem;
  13221. }
  13222. .sheet.kingdom form > header .details .resource-points input {
  13223. width: 3ch;
  13224. text-align: center;
  13225. }
  13226. .sheet.kingdom form > header .details .fame {
  13227. align-items: center;
  13228. display: flex;
  13229. grid-area: fame;
  13230. margin-left: 0.25rem;
  13231. }
  13232. .sheet.kingdom form > header .details .fame .pips {
  13233. font-size: var(--font-size-12);
  13234. }
  13235. .sheet.kingdom form > header .details .level {
  13236. grid-area: level;
  13237. }
  13238. .sheet.kingdom form > header section.level {
  13239. display: flex;
  13240. justify-content: flex-start;
  13241. margin-left: 1rem;
  13242. text-transform: uppercase;
  13243. }
  13244. .sheet.kingdom form > header section.level .level {
  13245. position: relative;
  13246. display: flex;
  13247. justify-content: center;
  13248. align-items: center;
  13249. flex-direction: column;
  13250. height: 43px;
  13251. width: 40px;
  13252. background: url("../assets/sheet/level-badge.webp") no-repeat;
  13253. background-size: 40px 43px;
  13254. z-index: 2;
  13255. font-size: 0;
  13256. padding-top: 2px;
  13257. }
  13258. .sheet.kingdom form > header section.level .level label {
  13259. color: var(--sidebar-label);
  13260. font-family: var(--sans-serif);
  13261. font-size: var(--font-size-10);
  13262. text-transform: uppercase;
  13263. letter-spacing: 0.05em;
  13264. text-rendering: optimizeLegibility;
  13265. line-height: 1.5;
  13266. }
  13267. .sheet.kingdom form > header section.level .level input {
  13268. font-family: var(--serif);
  13269. font-size: var(--font-size-22);
  13270. font-weight: 400;
  13271. color: var(--text-light);
  13272. line-height: calc(1em + 1px);
  13273. height: 24px;
  13274. }
  13275. .sheet.kingdom form > header section.level .level label,
  13276. .sheet.kingdom form > header section.level .level input {
  13277. margin-left: 1px;
  13278. text-align: center;
  13279. }
  13280. .sheet.kingdom form > header section.level .exp-data {
  13281. display: flex;
  13282. flex-direction: column;
  13283. justify-content: flex-end;
  13284. position: relative;
  13285. width: 6rem;
  13286. }
  13287. .sheet.kingdom form > header section.level .exp-data .exp-input {
  13288. font-size: var(--font-size-13);
  13289. height: 1.5em;
  13290. margin-bottom: 0.5rem;
  13291. }
  13292. .sheet.kingdom form > header section.level .exp-data .exp-input input {
  13293. color: var(--text-light);
  13294. font-family: var(--sans-serif);
  13295. text-align: right;
  13296. width: 3em;
  13297. }
  13298. .sheet.kingdom form > header section.level .exp-data .exp-input .slash {
  13299. color: var(--sidebar-label);
  13300. }
  13301. .sheet.kingdom form > header section.level .exp-data progress {
  13302. background-color: unset;
  13303. border: 1px solid rgba(255, 255, 255, 0.1);
  13304. border-left: none;
  13305. bottom: 7px;
  13306. box-shadow: 0 0 2px var(--sidebar-label);
  13307. height: 5px;
  13308. left: -9px;
  13309. position: relative;
  13310. width: 100%;
  13311. }
  13312. .sheet.kingdom form > header section.level .exp-data progress::-moz-progress-bar {
  13313. background: var(--sidebar-title);
  13314. }
  13315. .sheet.kingdom form > header section.level .exp-data progress::-webkit-progress-bar {
  13316. background: rgba(0, 0, 0, 0.2);
  13317. }
  13318. .sheet.kingdom form > header section.level .exp-data progress::-webkit-progress-value {
  13319. background: var(--sidebar-title);
  13320. }
  13321. .sheet.kingdom nav.sheet-navigation {
  13322. display: inline-flex;
  13323. justify-content: center;
  13324. align-items: center;
  13325. height: 20px;
  13326. background: var(--secondary);
  13327. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  13328. transition: all 0.1s ease-out;
  13329. box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
  13330. border-top: 1px solid rgba(255, 255, 255, 0.1);
  13331. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  13332. position: relative;
  13333. }
  13334. .sheet.kingdom nav.sheet-navigation .navigation-title {
  13335. color: var(--text-light);
  13336. margin-right: auto;
  13337. padding-left: 1em;
  13338. white-space: nowrap;
  13339. width: 7em;
  13340. }
  13341. .sheet.kingdom nav.sheet-navigation > a {
  13342. display: flex;
  13343. justify-content: center;
  13344. align-items: center;
  13345. margin: 0 6px;
  13346. font-size: var(--font-size-12);
  13347. }
  13348. .sheet.kingdom nav.sheet-navigation .item {
  13349. height: 24px;
  13350. width: 24px;
  13351. border-radius: 50%;
  13352. z-index: 1;
  13353. transition: all 0.1s ease-out;
  13354. color: var(--tertiary);
  13355. fill: var(--tertiary);
  13356. background-image: url("../assets/sheet/nav-item-inactive.webp");
  13357. background-size: contain;
  13358. /* prettier-ignore */
  13359. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25);
  13360. }
  13361. .sheet.kingdom nav.sheet-navigation .item.active {
  13362. 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);
  13363. }
  13364. .sheet.kingdom nav.sheet-navigation .item:last-child {
  13365. margin-right: 10px;
  13366. }
  13367. .sheet.kingdom nav.sheet-navigation .item:hover, .sheet.kingdom nav.sheet-navigation .item.active {
  13368. z-index: 2;
  13369. transform: scale(1.2);
  13370. color: var(--text-light);
  13371. fill: var(--text-light);
  13372. background-image: url("../assets/sheet/nav-item.webp");
  13373. }
  13374. .sheet.kingdom nav.sheet-navigation .item .fas {
  13375. padding-bottom: 0;
  13376. }
  13377. .sheet.kingdom nav.sheet-navigation .item:hover .pfs-icon {
  13378. filter: drop-shadow(0 0 8px var(--color-shadow-primary));
  13379. }
  13380. .sheet.kingdom nav.sheet-navigation .item .action-icon {
  13381. font-family: "Pathfinder2eActions", sans-serif;
  13382. font-size: 1rem;
  13383. }
  13384. .sheet.kingdom nav.sub-nav {
  13385. margin: 0;
  13386. padding: 0;
  13387. display: flex;
  13388. flex-wrap: nowrap;
  13389. justify-content: center;
  13390. align-items: center;
  13391. list-style: none;
  13392. background-color: var(--bg);
  13393. box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  13394. width: 100%;
  13395. flex: 0 0 2.5rem;
  13396. }
  13397. .sheet.kingdom nav.sub-nav::before, .sheet.kingdom nav.sub-nav::after {
  13398. content: "";
  13399. width: 37px;
  13400. height: 16px;
  13401. background: url("../assets/sheet/sub-nav-decoration.webp");
  13402. margin: 0 16px;
  13403. }
  13404. .sheet.kingdom nav.sub-nav::after {
  13405. transform: scaleX(-100%);
  13406. }
  13407. .sheet.kingdom nav.sub-nav a,
  13408. .sheet.kingdom nav.sub-nav .tab {
  13409. border-left: 1px solid rgba(255, 255, 255, 0.3);
  13410. border-right: 1px solid rgba(0, 0, 0, 0.2);
  13411. color: var(--alt);
  13412. cursor: pointer;
  13413. display: block;
  13414. font: 400 var(--font-size-16) var(--serif);
  13415. flex: 1;
  13416. margin: 0 0.25rem;
  13417. max-width: 30%;
  13418. text-align: center;
  13419. text-decoration: none;
  13420. transition: all 0.1s ease-out;
  13421. }
  13422. .sheet.kingdom nav.sub-nav a.active,
  13423. .sheet.kingdom nav.sub-nav .tab.active {
  13424. color: var(--primary);
  13425. font-weight: 600;
  13426. }
  13427. .sheet.kingdom nav.sub-nav a:first-child,
  13428. .sheet.kingdom nav.sub-nav .tab:first-child {
  13429. border-left: none;
  13430. }
  13431. .sheet.kingdom nav.sub-nav a:last-child,
  13432. .sheet.kingdom nav.sub-nav .tab:last-child {
  13433. border-right: none;
  13434. }
  13435. .sheet.kingdom nav.sub-nav a:hover,
  13436. .sheet.kingdom nav.sub-nav .tab:hover {
  13437. text-shadow: 0 0 3px rgba(255, 255, 255, 0.5);
  13438. }
  13439. .sheet.kingdom .tab nav.sub-nav {
  13440. padding-right: 20px;
  13441. }
  13442. .sheet.kingdom .container {
  13443. height: 100%;
  13444. overflow: hidden;
  13445. }
  13446. .sheet.kingdom input.adjusted-higher {
  13447. color: #009988;
  13448. }
  13449. .sheet.kingdom input.adjusted-lower {
  13450. color: #cc3311;
  13451. }
  13452. .sheet.kingdom .content {
  13453. overflow: hidden scroll;
  13454. flex: 1;
  13455. }
  13456. .sheet.kingdom .tab.active {
  13457. display: flex;
  13458. height: 100%;
  13459. }
  13460. .sheet.kingdom [hidden] {
  13461. display: none !important;
  13462. }
  13463. .sheet.kingdom .drag-gap {
  13464. visibility: hidden;
  13465. }
  13466. .sheet.kingdom .sidebar {
  13467. overflow: hidden scroll;
  13468. border-right: 1px solid #888;
  13469. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  13470. display: flex;
  13471. flex-direction: column;
  13472. gap: 8px;
  13473. height: 100%;
  13474. padding: 0.5rem;
  13475. width: 13.5rem;
  13476. }
  13477. .sheet.kingdom .sidebar .box {
  13478. border: 1px solid rgba(0, 0, 0, 0.28);
  13479. filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.18));
  13480. font-family: var(--sans-serif);
  13481. border-radius: 3px;
  13482. font-size: var(--font-size-12);
  13483. }
  13484. .sheet.kingdom .sidebar .box header,
  13485. .sheet.kingdom .sidebar .box footer {
  13486. margin: -1px;
  13487. padding: 0.25rem;
  13488. }
  13489. .sheet.kingdom .sidebar .box header {
  13490. background-color: var(--sub);
  13491. border-radius: 3px 3px 0 0;
  13492. color: var(--text-light);
  13493. font-weight: 700;
  13494. }
  13495. .sheet.kingdom .sidebar .box footer {
  13496. background-color: var(--bg-dark);
  13497. border-radius: 0 0 3px 3px;
  13498. color: var(--sub);
  13499. border: 1px solid rgba(0, 0, 0, 0.28);
  13500. border-top: none;
  13501. }
  13502. .sheet.kingdom .tag-light {
  13503. --tag-color: var(--color-proficiency-untrained);
  13504. border: 1px solid var(--tag-color);
  13505. border-radius: 2px;
  13506. color: var(--tag-color);
  13507. padding: 0 4px 0.1em 4px;
  13508. height: 1.25rem;
  13509. white-space: nowrap;
  13510. font-size: var(--font-size-13);
  13511. font-variant: all-small-caps;
  13512. font-weight: 500;
  13513. display: flex;
  13514. align-items: center;
  13515. }
  13516. .sheet.kingdom .directory-list {
  13517. padding: 0;
  13518. margin: 0;
  13519. }
  13520. .sheet.kingdom .directory-list h4 {
  13521. padding: 0;
  13522. margin: 0;
  13523. }
  13524. .sheet.kingdom .effects .directory-list {
  13525. gap: 0.2em;
  13526. display: flex;
  13527. flex-direction: column;
  13528. width: 100%;
  13529. }
  13530. .sheet.kingdom .effects .directory-list .item {
  13531. display: flex;
  13532. flex-wrap: wrap;
  13533. align-items: center;
  13534. justify-content: space-between;
  13535. padding: 2px 4px 2px 12px;
  13536. width: 100%;
  13537. }
  13538. .sheet.kingdom .effects .directory-list .item p:empty {
  13539. display: none;
  13540. }
  13541. .sheet.kingdom .effects .directory-list .item .item-name {
  13542. display: flex;
  13543. align-items: center;
  13544. flex: 1;
  13545. }
  13546. .sheet.kingdom .effects .directory-list .item .item-name h4 {
  13547. cursor: pointer;
  13548. margin: 0;
  13549. }
  13550. .sheet.kingdom .effects .directory-list .item .item-name .item-image {
  13551. margin-right: 8px;
  13552. }
  13553. .sheet.kingdom .effects .directory-list .item .item-controls {
  13554. display: flex;
  13555. flex: 0;
  13556. font-size: var(--font-size-12);
  13557. gap: 1px;
  13558. white-space: nowrap;
  13559. }
  13560. .sheet.kingdom .effects .directory-list .item .item-controls a.info-only:hover {
  13561. cursor: default;
  13562. text-shadow: none;
  13563. }
  13564. .sheet.kingdom .effects .directory-list .item .item-controls a + a {
  13565. margin-left: 4px;
  13566. }
  13567. .sheet.kingdom .effects .directory-list .item .item-summary {
  13568. flex-basis: 100%;
  13569. }
  13570. .sheet.kingdom .effects .directory-list .item.unidentified {
  13571. border-radius: 1px;
  13572. outline: 1px dotted rgba(75, 74, 68, 0.5);
  13573. background: var(--visibility-gm-bg);
  13574. }
  13575. .sheet.kingdom .effects .directory-list .item .button-group {
  13576. display: flex;
  13577. justify-content: flex-end;
  13578. align-items: center;
  13579. flex-wrap: nowrap;
  13580. width: 50%;
  13581. flex: 0;
  13582. }
  13583. .sheet.kingdom .effects .directory-list .item .button-group button {
  13584. margin: 0;
  13585. border: none;
  13586. cursor: pointer;
  13587. font-family: var(--sans-serif);
  13588. font-size: var(--font-size-10);
  13589. text-transform: uppercase;
  13590. letter-spacing: 0.05em;
  13591. text-rendering: optimizeLegibility;
  13592. padding: 5px;
  13593. color: var(--text-light);
  13594. width: 70px;
  13595. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  13596. background: var(--secondary);
  13597. border-radius: 2px;
  13598. flex: 0;
  13599. white-space: nowrap;
  13600. margin-left: 4px;
  13601. flex: 0;
  13602. }
  13603. .sheet.kingdom .effects .directory-list .item .button-group button:hover {
  13604. box-shadow: none;
  13605. text-shadow: 0 0 2px white;
  13606. }
  13607. .sheet.kingdom .effects .directory-list .item {
  13608. margin: 2px 0;
  13609. border: solid transparent;
  13610. border-width: 0 0 1px;
  13611. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  13612. }
  13613. .sheet.kingdom .effects .directory-list .item .item-summary {
  13614. margin-top: 8px;
  13615. }
  13616. .sheet.kingdom h3.header {
  13617. position: relative;
  13618. margin-top: 0.75em;
  13619. font-size: var(--font-size-16);
  13620. font-family: var(--serif);
  13621. font-weight: 600;
  13622. color: var(--primary);
  13623. line-height: 1;
  13624. border-bottom: 1px solid var(--color-border-divider);
  13625. }
  13626. .sheet.kingdom h3.header > button, .sheet.kingdom h3.header > .controls {
  13627. position: absolute;
  13628. bottom: -1px;
  13629. right: 0;
  13630. }
  13631. .sheet.kingdom h3.header .controls {
  13632. display: flex;
  13633. }
  13634. .sheet.kingdom h3.header button {
  13635. background: transparent;
  13636. border-radius: 2px 2px 0 0;
  13637. border: 1px solid var(--color-border-divider);
  13638. color: var(--primary);
  13639. cursor: pointer;
  13640. font-family: var(--sans-serif);
  13641. font-size: var(--font-size-12);
  13642. font-weight: 500;
  13643. height: 20px;
  13644. line-height: var(--font-size-12);
  13645. margin: 0;
  13646. outline: none;
  13647. text-transform: uppercase;
  13648. width: auto;
  13649. }
  13650. .sheet.kingdom button.small-button,
  13651. .sheet.kingdom select.proficiency,
  13652. .sheet.kingdom span.proficiency {
  13653. font-family: var(--sans-serif);
  13654. font-size: var(--font-size-10);
  13655. text-transform: uppercase;
  13656. letter-spacing: 0.05em;
  13657. text-rendering: optimizeLegibility;
  13658. align-items: center;
  13659. background: var(--color-proficiency-untrained);
  13660. border: 1px solid rgba(0, 0, 0, 0.5);
  13661. border-radius: 2px;
  13662. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  13663. color: var(--text-light);
  13664. display: flex;
  13665. font-weight: 500;
  13666. height: unset;
  13667. justify-content: center;
  13668. line-height: unset;
  13669. padding: 1px 2px 1px 2px;
  13670. }
  13671. .sheet.kingdom .proficiency {
  13672. text-align-last: center;
  13673. appearance: none;
  13674. }
  13675. .sheet.kingdom .proficiency.readonly {
  13676. pointer-events: none;
  13677. }
  13678. .sheet.kingdom .proficiency option[value="0"] {
  13679. background: var(--color-proficiency-untrained);
  13680. }
  13681. .sheet.kingdom .proficiency[data-rank="1"],
  13682. .sheet.kingdom .proficiency option[value="1"] {
  13683. background: var(--color-proficiency-trained);
  13684. }
  13685. .sheet.kingdom .proficiency[data-rank="2"],
  13686. .sheet.kingdom .proficiency option[value="2"] {
  13687. background: var(--color-proficiency-expert);
  13688. }
  13689. .sheet.kingdom .proficiency[data-rank="3"],
  13690. .sheet.kingdom .proficiency option[value="3"] {
  13691. background: var(--color-proficiency-master);
  13692. }
  13693. .sheet.kingdom .proficiency[data-rank="4"],
  13694. .sheet.kingdom .proficiency option[value="4"] {
  13695. background: var(--color-proficiency-legendary);
  13696. }
  13697. .sheet.kingdom select.proficiency {
  13698. cursor: pointer;
  13699. }
  13700. .sheet.kingdom .tab.active[data-tab=main] {
  13701. overflow: hidden scroll;
  13702. flex-direction: column;
  13703. }
  13704. .sheet.kingdom .tab.active[data-tab=main] input[type=text],
  13705. .sheet.kingdom .tab.active[data-tab=main] input[type=number] {
  13706. border: none;
  13707. }
  13708. .sheet.kingdom .tab.active[data-tab=main] .content {
  13709. display: grid;
  13710. grid-template: "leaders resources" 1fr "leaders abilities" min-content/0.9fr 1fr;
  13711. width: 100%;
  13712. gap: 0 1rem;
  13713. padding: 0.5rem;
  13714. flex: 0 0 auto;
  13715. }
  13716. .sheet.kingdom .tab.active[data-tab=main] .leaders {
  13717. grid-area: leaders;
  13718. }
  13719. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader {
  13720. display: grid;
  13721. grid-template-areas: "img name" "img label";
  13722. grid-template-columns: auto 1fr;
  13723. grid-template-rows: 1fr auto;
  13724. }
  13725. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader:not(:last-child) {
  13726. margin-bottom: 0.375rem;
  13727. }
  13728. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .image {
  13729. border: none;
  13730. border-radius: 2px;
  13731. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  13732. grid-area: img;
  13733. width: 2.75rem;
  13734. height: 2.75rem;
  13735. z-index: 1;
  13736. }
  13737. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .image img {
  13738. border: none;
  13739. width: 100%;
  13740. height: 100%;
  13741. }
  13742. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .name {
  13743. grid-area: name;
  13744. background: rgba(0, 0, 0, 0.025);
  13745. padding: 0 8px;
  13746. border: 0;
  13747. height: auto;
  13748. line-height: 1.5em;
  13749. height: 1.5em;
  13750. align-self: end;
  13751. display: flex;
  13752. justify-content: space-between;
  13753. }
  13754. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .details {
  13755. grid-area: label;
  13756. align-self: flex-end;
  13757. align-items: center;
  13758. display: flex;
  13759. justify-content: space-between;
  13760. background: var(--paper-bg);
  13761. box-shadow: var(--drop-shadow);
  13762. font-size: var(--font-size-12);
  13763. padding: 0 8px;
  13764. position: relative;
  13765. margin-bottom: 1px;
  13766. height: 1.5rem;
  13767. }
  13768. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .details .role {
  13769. font-variant: small-caps;
  13770. font-weight: 500;
  13771. }
  13772. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .invested,
  13773. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .vacant {
  13774. font-size: var(--font-size-12);
  13775. }
  13776. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .invested input,
  13777. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .vacant input {
  13778. margin: 0;
  13779. width: 1em;
  13780. height: 1em;
  13781. }
  13782. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .invested i,
  13783. .sheet.kingdom .tab.active[data-tab=main] .leaders .leader .vacant i {
  13784. font-size: 1.2em;
  13785. }
  13786. .sheet.kingdom .tab.active[data-tab=main] .resources {
  13787. grid-area: resources;
  13788. }
  13789. .sheet.kingdom .tab.active[data-tab=main] .resources input[type=number] {
  13790. width: 3ch;
  13791. text-align: center;
  13792. padding-left: 0;
  13793. padding-right: 0;
  13794. }
  13795. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-data {
  13796. background: var(--paper-bg);
  13797. box-shadow: var(--drop-shadow);
  13798. display: grid;
  13799. grid-template: "resource resource" min-content "commodities stats" 1fr/auto 1fr;
  13800. }
  13801. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-data .resource-dice {
  13802. grid-area: resource;
  13803. }
  13804. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-data .commodities {
  13805. grid-area: commodities;
  13806. }
  13807. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-data .stats {
  13808. grid-area: stats;
  13809. }
  13810. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-dice {
  13811. align-items: center;
  13812. border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  13813. display: flex;
  13814. gap: 0.25rem;
  13815. padding: 0 0.5rem;
  13816. }
  13817. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-dice .rollable {
  13818. flex: 1;
  13819. }
  13820. .sheet.kingdom .tab.active[data-tab=main] .resources .resource-dice input {
  13821. width: 2ch;
  13822. text-align: center;
  13823. }
  13824. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities,
  13825. .sheet.kingdom .tab.active[data-tab=main] .resources .stats {
  13826. padding: 0.25rem 0.5rem;
  13827. white-space: nowrap;
  13828. }
  13829. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities > label, .sheet.kingdom .tab.active[data-tab=main] .resources .commodities > div,
  13830. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities input[type=number],
  13831. .sheet.kingdom .tab.active[data-tab=main] .resources .stats > label,
  13832. .sheet.kingdom .tab.active[data-tab=main] .resources .stats > div,
  13833. .sheet.kingdom .tab.active[data-tab=main] .resources .stats input[type=number] {
  13834. height: 1.5em;
  13835. line-height: 1.5em;
  13836. }
  13837. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities > label .number, .sheet.kingdom .tab.active[data-tab=main] .resources .commodities > div .number,
  13838. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities input[type=number] .number,
  13839. .sheet.kingdom .tab.active[data-tab=main] .resources .stats > label .number,
  13840. .sheet.kingdom .tab.active[data-tab=main] .resources .stats > div .number,
  13841. .sheet.kingdom .tab.active[data-tab=main] .resources .stats input[type=number] .number {
  13842. display: inline-block;
  13843. width: 3ch;
  13844. text-align: center;
  13845. }
  13846. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities .commodity {
  13847. align-items: center;
  13848. display: flex;
  13849. gap: 0.25rem;
  13850. }
  13851. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities .commodity .type {
  13852. width: 4.25rem;
  13853. }
  13854. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities .commodity .value-max {
  13855. align-items: center;
  13856. display: flex;
  13857. gap: 0.125rem;
  13858. flex: 1;
  13859. }
  13860. .sheet.kingdom .tab.active[data-tab=main] .resources .commodities .commodity .value-max input {
  13861. width: 2ch;
  13862. }
  13863. .sheet.kingdom .tab.active[data-tab=main] .resources .stats {
  13864. justify-self: end;
  13865. text-align: end;
  13866. }
  13867. .sheet.kingdom .tab.active[data-tab=main] .ability-scores {
  13868. grid-area: abilities;
  13869. flex: 0;
  13870. }
  13871. .sheet.kingdom .tab.active[data-tab=main] .ability-scores input {
  13872. height: auto;
  13873. }
  13874. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability {
  13875. display: flex;
  13876. flex-direction: row;
  13877. align-items: end;
  13878. width: 100%;
  13879. }
  13880. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability:not(:last-child) {
  13881. margin-bottom: 0.375rem;
  13882. }
  13883. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .score {
  13884. display: flex;
  13885. flex-direction: column;
  13886. justify-content: center;
  13887. align-items: center;
  13888. background: var(--paper-bg);
  13889. box-shadow: var(--drop-shadow);
  13890. width: 4.5rem;
  13891. text-align: center;
  13892. padding: 0.375rem 0;
  13893. z-index: 1;
  13894. }
  13895. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .score .value {
  13896. font-size: var(--font-size-20);
  13897. }
  13898. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section {
  13899. display: flex;
  13900. flex-wrap: wrap;
  13901. flex: 1;
  13902. box-shadow: var(--drop-shadow);
  13903. }
  13904. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section > .stat {
  13905. display: flex;
  13906. flex-direction: column;
  13907. text-align: center;
  13908. flex: 1;
  13909. }
  13910. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section .ruin-value {
  13911. display: flex;
  13912. gap: 2px;
  13913. justify-content: center;
  13914. }
  13915. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section .ruin-value input {
  13916. width: 3ch;
  13917. }
  13918. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section .progress {
  13919. flex-basis: 100%;
  13920. margin: 0;
  13921. padding: 0;
  13922. height: 8px;
  13923. border-top: 1px solid rgba(0, 0, 0, 0.15);
  13924. margin-top: 0.125rem;
  13925. background: #ddd;
  13926. }
  13927. .sheet.kingdom .tab.active[data-tab=main] .ability-scores .ability .corruption-section .progress::after {
  13928. display: block;
  13929. content: " ";
  13930. background-color: var(--color-border-highlight-alt);
  13931. width: calc(100% * var(--value) / var(--max));
  13932. max-width: 100%;
  13933. height: 100%;
  13934. }
  13935. .sheet.kingdom .tab.active[data-tab=activities] {
  13936. display: flex;
  13937. flex-direction: row;
  13938. padding: 0 1rem;
  13939. height: 100%;
  13940. }
  13941. .sheet.kingdom .tab.active[data-tab=activities] .skills,
  13942. .sheet.kingdom .tab.active[data-tab=activities] .actions {
  13943. display: flex;
  13944. height: 100%;
  13945. flex-direction: column;
  13946. }
  13947. .sheet.kingdom .tab.active[data-tab=activities] .skill-list,
  13948. .sheet.kingdom .tab.active[data-tab=activities] .actions-list {
  13949. overflow: hidden scroll;
  13950. margin-bottom: 0.25rem;
  13951. }
  13952. .sheet.kingdom .tab.active[data-tab=activities] .skills {
  13953. padding-right: 0.5rem;
  13954. }
  13955. .sheet.kingdom .tab.active[data-tab=activities] .skills .control-dc {
  13956. align-items: center;
  13957. background: var(--paper-bg);
  13958. box-shadow: var(--drop-shadow);
  13959. display: flex;
  13960. gap: 8px;
  13961. margin: 0.5rem 0;
  13962. }
  13963. .sheet.kingdom .tab.active[data-tab=activities] .skills .control-dc .mod {
  13964. color: var(--secondary);
  13965. display: inline-block;
  13966. font-family: var(--serif);
  13967. font-size: 1.25em;
  13968. font-weight: bold;
  13969. min-width: 3rem;
  13970. text-align: right;
  13971. }
  13972. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill {
  13973. display: flex;
  13974. align-items: center;
  13975. padding: 1px 0;
  13976. padding-right: 0.5rem;
  13977. gap: 8px;
  13978. }
  13979. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .mod {
  13980. display: flex;
  13981. color: var(--primary);
  13982. font-family: var(--serif);
  13983. font-weight: 600;
  13984. font-size: 1.25em;
  13985. line-height: 1em;
  13986. min-width: 3rem;
  13987. padding: 3px 0;
  13988. }
  13989. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .mod i {
  13990. color: var(--text-dark);
  13991. font-size: 0.8em;
  13992. margin-right: 2px;
  13993. }
  13994. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .name {
  13995. flex: 1;
  13996. color: var(--alt-dark);
  13997. }
  13998. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .name.selected {
  13999. color: var(--text-dark);
  14000. font-weight: 600;
  14001. }
  14002. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill:not(:last-child) {
  14003. border-bottom: 1px solid var(--color-divider);
  14004. }
  14005. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .button-group {
  14006. display: flex;
  14007. padding-left: 0.25rem;
  14008. }
  14009. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .button-group .proficiency {
  14010. min-width: 11ch;
  14011. }
  14012. .sheet.kingdom .tab.active[data-tab=activities] .skills .skill .button-group .small-button {
  14013. flex: 0;
  14014. }
  14015. .sheet.kingdom .tab.active[data-tab=activities] .actions {
  14016. flex: 1;
  14017. }
  14018. .sheet.kingdom .tab.active[data-tab=activities] .actions h3.header .filters {
  14019. float: right;
  14020. margin: -0.125rem 0 0.125rem auto;
  14021. }
  14022. .sheet.kingdom .tab.active[data-tab=activities] .actions h3.header .filters .choice {
  14023. cursor: pointer;
  14024. opacity: 0.6;
  14025. transition: opacity 0.2s ease-in-out;
  14026. }
  14027. .sheet.kingdom .tab.active[data-tab=activities] .actions h3.header .filters .choice.active {
  14028. opacity: 1;
  14029. }
  14030. .sheet.kingdom .tab.active[data-tab=activities] .actions h3.header .filters .choice:hover {
  14031. box-shadow: 0 0 5px var(--primary);
  14032. }
  14033. .sheet.kingdom .tab.active[data-tab=activities] .actions .phase-summary {
  14034. background: var(--paper-bg);
  14035. box-shadow: var(--drop-shadow);
  14036. margin: 0 12px 0.5rem 2px;
  14037. padding: 0.25rem 0.5rem;
  14038. }
  14039. .sheet.kingdom .tab.active[data-tab=activities] .actions .phase-summary header {
  14040. font-size: 1.2em;
  14041. font-weight: bold;
  14042. color: var(--color-text-dark-input);
  14043. margin-top: 0.25rem;
  14044. }
  14045. .sheet.kingdom .tab.active[data-tab=activities] .actions .action {
  14046. align-items: center;
  14047. display: flex;
  14048. flex-wrap: wrap;
  14049. padding: 4px;
  14050. width: 100%;
  14051. gap: 0.5rem;
  14052. padding-right: 0.5rem;
  14053. }
  14054. .sheet.kingdom .tab.active[data-tab=activities] .actions .action:not(:last-child) {
  14055. border-bottom: 1px solid var(--color-divider);
  14056. }
  14057. .sheet.kingdom .tab.active[data-tab=activities] .actions .action .item-name {
  14058. align-items: center;
  14059. cursor: pointer;
  14060. display: flex;
  14061. flex: 1;
  14062. }
  14063. .sheet.kingdom .tab.active[data-tab=activities] .actions .action .item-summary {
  14064. flex-basis: 100%;
  14065. margin-bottom: 0.5rem;
  14066. }
  14067. .sheet.kingdom .tab.active[data-tab=activities] .actions .action .item-summary .tags {
  14068. display: none;
  14069. }
  14070. .sheet.kingdom .tab.active[data-tab=activities] .actions .action .tags {
  14071. margin-left: 0.25rem;
  14072. }
  14073. .sheet.kingdom .tab.active[data-tab=world] {
  14074. padding: 0.75rem;
  14075. }
  14076. .sheet.kingdom .tab.active[data-tab=world] input[type=text],
  14077. .sheet.kingdom .tab.active[data-tab=world] input[type=number] {
  14078. border: none;
  14079. height: 1.5em;
  14080. line-height: 1.5em;
  14081. }
  14082. .sheet.kingdom .tab.active[data-tab=world] .content {
  14083. padding-right: 0.5rem;
  14084. margin-right: 0.5rem;
  14085. }
  14086. .sheet.kingdom .tab.active[data-tab=world] .settlement {
  14087. display: flex;
  14088. align-items: center;
  14089. flex-wrap: wrap;
  14090. gap: 0 1rem;
  14091. padding: 0.25rem 0.25rem 0.25rem 0;
  14092. }
  14093. .sheet.kingdom .tab.active[data-tab=world] .settlement:not(.expanded, :last-child) {
  14094. border-bottom: 1px solid var(--color-divider);
  14095. }
  14096. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name {
  14097. flex: 1;
  14098. display: flex;
  14099. white-space: nowrap;
  14100. display: flex;
  14101. align-items: center;
  14102. gap: 0.25rem;
  14103. }
  14104. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name h4 {
  14105. cursor: pointer;
  14106. min-height: 1em;
  14107. }
  14108. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .level {
  14109. display: flex;
  14110. align-items: center;
  14111. }
  14112. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .level input[type=number] {
  14113. width: 3ch;
  14114. text-align: center;
  14115. padding: 0;
  14116. }
  14117. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .name {
  14118. flex: 1;
  14119. font-size: var(--font-size-16);
  14120. }
  14121. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name select {
  14122. margin-left: 2rem;
  14123. }
  14124. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .level {
  14125. font-size: var(--font-size-16);
  14126. margin-left: 0.5rem;
  14127. }
  14128. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-name .level input {
  14129. width: 3ch;
  14130. text-align: center;
  14131. }
  14132. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary {
  14133. flex-basis: 100%;
  14134. background: var(--paper-bg);
  14135. box-shadow: var(--drop-shadow);
  14136. margin-top: 0.5rem;
  14137. }
  14138. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data {
  14139. display: flex;
  14140. justify-content: space-between;
  14141. margin: 0 0.125rem 0 0;
  14142. border-bottom: 1px solid var(--color-divider);
  14143. }
  14144. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data > section {
  14145. flex: 1 0 auto;
  14146. padding: 0.5rem;
  14147. }
  14148. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data > section + section {
  14149. border-left: 1px solid var(--color-divider);
  14150. }
  14151. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data input[type=number] {
  14152. width: 3ch;
  14153. text-align: center;
  14154. padding: 0;
  14155. }
  14156. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data input[type=checkbox] {
  14157. margin: 0;
  14158. width: 1rem;
  14159. height: 1rem;
  14160. }
  14161. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data label,
  14162. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data div.value {
  14163. align-items: center;
  14164. display: flex;
  14165. gap: 0.25rem;
  14166. line-height: 1.5em;
  14167. }
  14168. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data .stats {
  14169. display: flex;
  14170. flex-direction: column;
  14171. justify-content: center;
  14172. }
  14173. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data .storage-items {
  14174. display: grid;
  14175. grid-template-columns: repeat(2, 1fr);
  14176. column-gap: 0.25rem;
  14177. }
  14178. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary .settlement-data .storage-items label {
  14179. display: flex;
  14180. align-items: center;
  14181. justify-content: space-between;
  14182. }
  14183. .sheet.kingdom .tab.active[data-tab=world] .settlement .item-summary > .details {
  14184. padding: 0.5rem;
  14185. }
  14186. .sheet.kingdom .tab.active[data-tab=world] .settlement .editor {
  14187. display: flex;
  14188. flex-direction: column;
  14189. }
  14190. .sheet.kingdom .tab.active[data-tab=world] .settlement .editor .tox {
  14191. flex: 1;
  14192. min-height: 16rem;
  14193. }
  14194. .sheet.kingdom .tab.active[data-tab=world] aside {
  14195. background: var(--paper-bg);
  14196. box-shadow: var(--drop-shadow);
  14197. padding: 0.5rem;
  14198. display: flex;
  14199. flex-direction: column;
  14200. gap: 1rem;
  14201. }
  14202. .sheet.kingdom .tab.active[data-tab=world] aside input[type=number] {
  14203. width: 3ch;
  14204. text-align: center;
  14205. padding: 0;
  14206. }
  14207. .sheet.kingdom .tab.active[data-tab=world] aside section .row,
  14208. .sheet.kingdom .tab.active[data-tab=world] aside section label {
  14209. display: flex;
  14210. align-items: center;
  14211. gap: 0.25rem;
  14212. }
  14213. .sheet.kingdom .tab.active[data-tab=world] aside .work-sites .value span {
  14214. min-width: 7rem;
  14215. }
  14216. .sheet.kingdom .tab.active[data-tab=world] aside .other-data label {
  14217. width: 100%;
  14218. justify-content: space-between;
  14219. }
  14220. .sheet.kingdom .tab.active[data-tab=features] .content {
  14221. padding: 12px;
  14222. padding-bottom: 1em;
  14223. font-family: var(--body-serif);
  14224. }
  14225. .sheet.kingdom .tab.active[data-tab=features] .feat-section {
  14226. padding-bottom: 1em;
  14227. }
  14228. .sheet.kingdom .tab.active[data-tab=features] .feat-item {
  14229. display: grid;
  14230. grid: "name ctrl" min-content "content content" min-content/1fr min-content;
  14231. align-items: center;
  14232. padding: 2px 0;
  14233. }
  14234. .sheet.kingdom .tab.active[data-tab=features] .feat-item:nth-child(odd) {
  14235. background-color: rgba(120, 100, 82, 0.1);
  14236. }
  14237. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name,
  14238. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-controls {
  14239. margin: 0;
  14240. }
  14241. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name {
  14242. grid-area: name;
  14243. display: flex;
  14244. flex: 1;
  14245. align-items: center;
  14246. width: 100%;
  14247. }
  14248. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name .feat-slot-title {
  14249. display: flex;
  14250. font-family: var(--serif);
  14251. font-size: 1.1em;
  14252. font-weight: 600;
  14253. color: var(--secondary);
  14254. justify-content: center;
  14255. width: 20px;
  14256. margin-left: 6px;
  14257. }
  14258. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name .item-placeholder {
  14259. margin-left: 40px;
  14260. margin-right: 4px;
  14261. }
  14262. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name h4 {
  14263. cursor: pointer;
  14264. display: flex;
  14265. align-items: center;
  14266. font-family: var(--serif);
  14267. }
  14268. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name h4:hover {
  14269. color: var(--primary);
  14270. text-shadow: 0 0 3px var(--tertiary);
  14271. }
  14272. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name .item-image {
  14273. margin-left: 8px;
  14274. margin-right: 8px;
  14275. }
  14276. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-controls {
  14277. align-items: center;
  14278. display: flex;
  14279. font-size: var(--font-size-12);
  14280. grid-area: ctrl;
  14281. height: 100%;
  14282. white-space: nowrap;
  14283. width: 100%;
  14284. }
  14285. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-controls a:last-child {
  14286. margin-right: 6px;
  14287. }
  14288. .sheet.kingdom .tab.active[data-tab=features] .feat-item .item-summary {
  14289. flex: 100%;
  14290. grid-area: content;
  14291. padding: 0 8px 8px;
  14292. margin: 4px 0 0 4px;
  14293. }
  14294. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts {
  14295. font-family: var(--font-primary);
  14296. }
  14297. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts section {
  14298. align-items: center;
  14299. display: flex;
  14300. gap: 4px;
  14301. }
  14302. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts section .abilities {
  14303. display: flex;
  14304. gap: 3px;
  14305. }
  14306. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts strong {
  14307. line-height: 1.5em;
  14308. }
  14309. .sheet.kingdom .tab.active[data-tab=features] .feat-item .build-entry-boosts .tag {
  14310. border-radius: 4px;
  14311. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3);
  14312. line-height: unset;
  14313. padding: 0.15em;
  14314. font-size: 0.9em;
  14315. }
  14316. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items {
  14317. grid-column: span 2;
  14318. border-left: 3px dotted #786452;
  14319. display: flex;
  14320. margin: 1px 0 0 45px;
  14321. padding: 0;
  14322. flex-basis: 100%;
  14323. flex-direction: column;
  14324. }
  14325. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li {
  14326. align-items: center;
  14327. display: flex;
  14328. flex-wrap: wrap;
  14329. gap: 2px;
  14330. margin: 2px 0;
  14331. padding-bottom: 1px;
  14332. }
  14333. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li:last-child {
  14334. padding-bottom: 0;
  14335. }
  14336. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li .item-name .feat-slot-title {
  14337. width: 0;
  14338. }
  14339. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li .item-name img {
  14340. margin-left: 0;
  14341. }
  14342. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li .item-controls {
  14343. flex: 0;
  14344. }
  14345. .sheet.kingdom .tab.active[data-tab=features] .feat-item ol.nested-items li ol.nested-items {
  14346. margin-left: 25px;
  14347. }
  14348. .sheet.kingdom .tab.active[data-tab=ongoing] {
  14349. padding: 0.75rem;
  14350. gap: 1rem;
  14351. }
  14352. .sheet.kingdom .tab.active[data-tab=ongoing] .events {
  14353. flex: 1;
  14354. display: flex;
  14355. flex-direction: column;
  14356. gap: 0.5rem;
  14357. }
  14358. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc {
  14359. display: flex;
  14360. gap: 1ch;
  14361. background: var(--paper-bg);
  14362. box-shadow: var(--drop-shadow);
  14363. line-height: 1.5em;
  14364. padding: 0.5rem 1rem;
  14365. }
  14366. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc,
  14367. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc input {
  14368. font-size: var(--font-size-18);
  14369. }
  14370. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc input {
  14371. width: 3ch;
  14372. background: none;
  14373. border: none;
  14374. padding: 0;
  14375. }
  14376. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-dc .dc {
  14377. margin-left: auto;
  14378. }
  14379. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-details {
  14380. background: var(--paper-bg);
  14381. box-shadow: var(--drop-shadow);
  14382. display: flex;
  14383. flex: 1;
  14384. flex-direction: column;
  14385. padding: 0.5rem;
  14386. overflow: auto;
  14387. }
  14388. .sheet.kingdom .tab.active[data-tab=ongoing] .events .event-details .editor {
  14389. flex: 1;
  14390. }
  14391. .sheet.kingdom .tab.active[data-tab=ongoing] aside {
  14392. width: 18rem;
  14393. }
  14394. .sheet.kingdom .tab.active[data-tab=ongoing] aside > h3.header {
  14395. margin-top: 0;
  14396. }
  14397. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list {
  14398. gap: 0.2em;
  14399. }
  14400. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item {
  14401. display: flex;
  14402. flex-wrap: wrap;
  14403. align-items: center;
  14404. justify-content: space-between;
  14405. padding: 2px 4px 2px 12px;
  14406. width: 100%;
  14407. }
  14408. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item p:empty {
  14409. display: none;
  14410. }
  14411. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-name {
  14412. display: flex;
  14413. align-items: center;
  14414. flex: 1;
  14415. }
  14416. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-name h4 {
  14417. cursor: pointer;
  14418. margin: 0;
  14419. }
  14420. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-name .item-image {
  14421. margin-right: 8px;
  14422. }
  14423. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-controls {
  14424. display: flex;
  14425. flex: 0;
  14426. font-size: var(--font-size-12);
  14427. gap: 1px;
  14428. white-space: nowrap;
  14429. }
  14430. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-controls a.info-only:hover {
  14431. cursor: default;
  14432. text-shadow: none;
  14433. }
  14434. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-controls a + a {
  14435. margin-left: 4px;
  14436. }
  14437. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .item-summary {
  14438. flex-basis: 100%;
  14439. }
  14440. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item.unidentified {
  14441. border-radius: 1px;
  14442. outline: 1px dotted rgba(75, 74, 68, 0.5);
  14443. background: var(--visibility-gm-bg);
  14444. }
  14445. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .button-group {
  14446. display: flex;
  14447. justify-content: flex-end;
  14448. align-items: center;
  14449. flex-wrap: nowrap;
  14450. width: 50%;
  14451. flex: 0;
  14452. }
  14453. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .button-group button {
  14454. margin: 0;
  14455. border: none;
  14456. cursor: pointer;
  14457. font-family: var(--sans-serif);
  14458. font-size: var(--font-size-10);
  14459. text-transform: uppercase;
  14460. letter-spacing: 0.05em;
  14461. text-rendering: optimizeLegibility;
  14462. padding: 5px;
  14463. color: var(--text-light);
  14464. width: 70px;
  14465. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  14466. background: var(--secondary);
  14467. border-radius: 2px;
  14468. flex: 0;
  14469. white-space: nowrap;
  14470. margin-left: 4px;
  14471. flex: 0;
  14472. }
  14473. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item .button-group button:hover {
  14474. box-shadow: none;
  14475. text-shadow: 0 0 2px white;
  14476. }
  14477. .sheet.kingdom .tab.active[data-tab=ongoing] aside .effects-list .item {
  14478. padding-left: 0;
  14479. }
  14480. .sheet.kingdom-builder .window-content {
  14481. padding: 0;
  14482. overflow: hidden;
  14483. }
  14484. .sheet.kingdom-builder h3 {
  14485. font-family: var(--sans-serif);
  14486. }
  14487. .sheet.kingdom-builder form {
  14488. display: flex;
  14489. flex-direction: column;
  14490. background: url("../assets/sheet/background.webp");
  14491. background-repeat: no-repeat;
  14492. background-size: cover;
  14493. background-attachment: local;
  14494. }
  14495. .sheet.kingdom-builder form > nav {
  14496. display: flex;
  14497. font-family: var(--serif-condensed);
  14498. font-size: var(--font-size-22);
  14499. margin-top: 0.125rem;
  14500. align-items: flex-end;
  14501. width: 100%;
  14502. }
  14503. .sheet.kingdom-builder form > nav a {
  14504. border-radius: 3px 3px 0 0;
  14505. padding: 0.25rem 0.5rem;
  14506. white-space: nowrap;
  14507. flex: 1;
  14508. text-align: center;
  14509. position: relative;
  14510. }
  14511. .sheet.kingdom-builder form > nav a:not(.active) {
  14512. margin-top: 1px;
  14513. border-bottom: 1px solid var(--alt-dark);
  14514. }
  14515. .sheet.kingdom-builder form > nav a.active {
  14516. border: 1px solid var(--alt-dark);
  14517. border-bottom-color: transparent;
  14518. margin-left: -1px;
  14519. margin-right: -1px;
  14520. }
  14521. .sheet.kingdom-builder form > nav a .complete {
  14522. font-size: 0.8em;
  14523. }
  14524. .sheet.kingdom-builder form > nav:before, .sheet.kingdom-builder form > nav:after {
  14525. content: "";
  14526. width: 0.25rem;
  14527. border-bottom: 1px solid var(--alt-dark);
  14528. }
  14529. .sheet.kingdom-builder .container {
  14530. height: 100%;
  14531. overflow: hidden;
  14532. }
  14533. .sheet.kingdom-builder .tab.active {
  14534. display: flex;
  14535. flex: 1;
  14536. }
  14537. .sheet.kingdom-builder button.complete {
  14538. color: var(--text-light);
  14539. background: var(--secondary);
  14540. height: 35px;
  14541. width: 131px;
  14542. border: 1px solid var(--tertiary);
  14543. }
  14544. .sheet.kingdom-builder button.complete:disabled {
  14545. background: var(--sub);
  14546. pointer-events: none;
  14547. opacity: 0.75;
  14548. }
  14549. .sheet.kingdom-builder .build-element {
  14550. display: flex;
  14551. flex-direction: column;
  14552. flex: 1;
  14553. }
  14554. .sheet.kingdom-builder .build-element .choices {
  14555. display: flex;
  14556. margin: 0.5rem 0.25rem;
  14557. }
  14558. .sheet.kingdom-builder .build-element .choices .choice {
  14559. display: flex;
  14560. cursor: pointer;
  14561. flex: 1 1 0;
  14562. flex-direction: column;
  14563. align-items: center;
  14564. margin: 0.5rem 0;
  14565. text-align: center;
  14566. white-space: nowrap;
  14567. }
  14568. .sheet.kingdom-builder .build-element .choices .choice img {
  14569. border-radius: 3px;
  14570. width: 2.5rem;
  14571. height: 2.5rem;
  14572. object-fit: contain;
  14573. }
  14574. .sheet.kingdom-builder .build-element .choices .choice.selected, .sheet.kingdom-builder .build-element .choices .choice:hover {
  14575. text-shadow: 0 0 8px var(--color-shadow-primary);
  14576. }
  14577. .sheet.kingdom-builder .build-element .choices .choice.selected img, .sheet.kingdom-builder .build-element .choices .choice:hover img {
  14578. box-shadow: 0 0 8px var(--color-shadow-primary);
  14579. }
  14580. .sheet.kingdom-builder .build-element .build-entry-boosts {
  14581. font-family: var(--font-primary);
  14582. }
  14583. .sheet.kingdom-builder .build-element .build-entry-boosts section {
  14584. align-items: center;
  14585. display: flex;
  14586. gap: 4px;
  14587. }
  14588. .sheet.kingdom-builder .build-element .build-entry-boosts section .abilities {
  14589. display: flex;
  14590. gap: 3px;
  14591. }
  14592. .sheet.kingdom-builder .build-element .build-entry-boosts strong {
  14593. line-height: 1.5em;
  14594. }
  14595. .sheet.kingdom-builder .build-element .build-entry-boosts .tag {
  14596. border-radius: 4px;
  14597. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3);
  14598. line-height: unset;
  14599. padding: 0.15em;
  14600. font-size: 0.9em;
  14601. }
  14602. .sheet.kingdom-builder .build-element .selection {
  14603. display: flex;
  14604. flex: 1;
  14605. flex-direction: column;
  14606. margin: 0.5rem;
  14607. }
  14608. .sheet.kingdom-builder .build-element .selection .text {
  14609. display: flex;
  14610. flex-direction: column;
  14611. flex: 1;
  14612. overflow: hidden;
  14613. }
  14614. .sheet.kingdom-builder .build-element .selection .text h3 {
  14615. display: flex;
  14616. justify-content: space-between;
  14617. }
  14618. .sheet.kingdom-builder .build-element .selection .text .description {
  14619. overflow-y: auto;
  14620. overflow-x: hidden;
  14621. height: 8rem;
  14622. }
  14623. .sheet.kingdom-builder .build-element .selection footer {
  14624. display: flex;
  14625. width: 100%;
  14626. align-items: end;
  14627. min-height: 4.5em;
  14628. }
  14629. .sheet.kingdom-builder .build-element .selection footer .build-entry-boosts {
  14630. flex: 1;
  14631. }
  14632. .sheet.kingdom-builder .build-element .selection footer button {
  14633. flex: 0;
  14634. white-space: nowrap;
  14635. }
  14636. .sheet.kingdom-builder .build-element .selection a[disabled] {
  14637. opacity: 0.7;
  14638. cursor: unset;
  14639. text-shadow: unset;
  14640. }
  14641. .sheet.kingdom-builder .build-element .selection {
  14642. padding: 0.5rem;
  14643. background-color: #eee;
  14644. box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  14645. }
  14646. .sheet.kingdom-builder .ability-builder {
  14647. padding: 6px;
  14648. width: 100%;
  14649. }
  14650. .sheet.kingdom-builder .ability-builder h3 {
  14651. font: 400 var(--font-size-24) var(--serif-condensed);
  14652. line-height: var(--font-size-24);
  14653. }
  14654. .sheet.kingdom-builder .ability-builder h4 {
  14655. font: 400 var(--font-size-10) var(--sans-serif);
  14656. text-transform: uppercase;
  14657. color: #605856;
  14658. }
  14659. .sheet.kingdom-builder .ability-builder button:focus:not(:focus-visible) {
  14660. box-shadow: none;
  14661. }
  14662. .sheet.kingdom-builder .ability-builder .row {
  14663. display: flex;
  14664. align-items: center;
  14665. }
  14666. .sheet.kingdom-builder .ability-builder .row .row-heading {
  14667. width: 220px;
  14668. }
  14669. .sheet.kingdom-builder .ability-builder .row.not-eligible {
  14670. pointer-events: none;
  14671. filter: blur(1px);
  14672. opacity: 0.6;
  14673. }
  14674. .sheet.kingdom-builder .ability-builder .row.not-eligible .remaining {
  14675. visibility: hidden;
  14676. }
  14677. .sheet.kingdom-builder .ability-builder .row .abilities {
  14678. display: grid;
  14679. grid-template-columns: repeat(4, 1fr);
  14680. grid-template-rows: auto;
  14681. flex: 1;
  14682. }
  14683. .sheet.kingdom-builder .ability-builder .row .full-row {
  14684. display: flex;
  14685. flex: 1;
  14686. justify-content: center;
  14687. }
  14688. .sheet.kingdom-builder .ability-builder header.row {
  14689. align-items: normal;
  14690. padding-top: 10px;
  14691. margin-bottom: 0.5rem;
  14692. }
  14693. .sheet.kingdom-builder .ability-builder header.row .row-column {
  14694. display: block;
  14695. }
  14696. .sheet.kingdom-builder .ability-builder header.row .abilities {
  14697. align-items: normal;
  14698. }
  14699. .sheet.kingdom-builder .ability-builder .row-heading {
  14700. display: grid;
  14701. grid-template-columns: 42px 1fr auto;
  14702. grid-template-areas: "img description remaining";
  14703. align-items: center;
  14704. }
  14705. .sheet.kingdom-builder .ability-builder .row-heading h3 {
  14706. grid-column: 1/4;
  14707. align-self: start;
  14708. font-size: var(--font-size-24);
  14709. }
  14710. .sheet.kingdom-builder .ability-builder .row-heading .hint-container {
  14711. grid-column: 1/4;
  14712. }
  14713. .sheet.kingdom-builder .ability-builder .row-heading img {
  14714. grid-area: img;
  14715. border: 0;
  14716. }
  14717. .sheet.kingdom-builder .ability-builder .row-heading div.label {
  14718. grid-area: description;
  14719. display: flex;
  14720. flex-direction: column;
  14721. overflow: hidden;
  14722. white-space: nowrap;
  14723. text-overflow: ellipsis;
  14724. margin-right: 10px;
  14725. }
  14726. .sheet.kingdom-builder .ability-builder .row-heading div.remaining {
  14727. grid-area: remaining;
  14728. display: flex;
  14729. margin-right: 10px;
  14730. width: 1.6rem;
  14731. height: 1.6rem;
  14732. border-radius: 50%;
  14733. background: rgba(68, 55, 48, 0.1);
  14734. align-self: center;
  14735. align-items: center;
  14736. justify-content: center;
  14737. text-align: center;
  14738. }
  14739. .sheet.kingdom-builder .ability-builder .row-heading div.remaining.extra {
  14740. animation: glow 0.75s infinite alternate;
  14741. }
  14742. @keyframes glow {
  14743. from {
  14744. box-shadow: 0 0 1px 1px #ffb351;
  14745. }
  14746. to {
  14747. box-shadow: 0 0 3px 3px #ffb351;
  14748. }
  14749. }
  14750. .sheet.kingdom-builder .ability-builder .row-column {
  14751. align-items: center;
  14752. display: flex;
  14753. flex-direction: column;
  14754. justify-content: center;
  14755. text-align: center;
  14756. }
  14757. .sheet.kingdom-builder .ability-builder .row-column button {
  14758. align-items: center;
  14759. border: 1px solid var(--button-color);
  14760. color: var(--button-color);
  14761. display: flex;
  14762. font-size: var(--font-size-12);
  14763. justify-content: space-around;
  14764. outline: none;
  14765. margin: 0;
  14766. padding: 0.1em 0 0;
  14767. position: relative;
  14768. text-transform: uppercase;
  14769. width: 6em;
  14770. height: 1.5em;
  14771. }
  14772. .sheet.kingdom-builder .ability-builder .row-column button.boost {
  14773. margin-top: auto;
  14774. --button-color: #316549;
  14775. --button-locked-color: #1b3c2a;
  14776. }
  14777. .sheet.kingdom-builder .ability-builder .row-column button.flaw {
  14778. margin-bottom: auto;
  14779. --button-color: #5e0000;
  14780. --button-locked-color: #5e0000;
  14781. }
  14782. .sheet.kingdom-builder .ability-builder .row-column button:disabled {
  14783. pointer-events: none;
  14784. background: rgba(0, 0, 0, 0.04);
  14785. opacity: 0.4;
  14786. }
  14787. .sheet.kingdom-builder .ability-builder .row-column button.selected {
  14788. background: var(--button-color);
  14789. }
  14790. .sheet.kingdom-builder .ability-builder .row-column button:hover {
  14791. cursor: pointer;
  14792. box-shadow: 0 0 5px var(--button-color);
  14793. }
  14794. .sheet.kingdom-builder .ability-builder .row-column button:hover.key-ability.selected {
  14795. box-shadow: none;
  14796. cursor: default;
  14797. }
  14798. .sheet.kingdom-builder .ability-builder .row-column button:hover:disabled {
  14799. background: rgba(0, 0, 0, 0.04);
  14800. box-shadow: none;
  14801. cursor: not-allowed;
  14802. }
  14803. .sheet.kingdom-builder .ability-builder .row-column button i.fas {
  14804. font-size: var(--font-size-10);
  14805. left: 0.5em;
  14806. position: absolute;
  14807. text-align: left;
  14808. }
  14809. .sheet.kingdom-builder .ability-builder .row-column button.hidden {
  14810. pointer-events: none;
  14811. visibility: hidden;
  14812. }
  14813. .sheet.kingdom-builder .ability-builder .row-column button.locked {
  14814. pointer-events: none;
  14815. background: var(--button-locked-color);
  14816. border-color: var(--button-locked-color);
  14817. }
  14818. .sheet.kingdom-builder .ability-builder .row-column button.locked, .sheet.kingdom-builder .ability-builder .row-column button.selected {
  14819. color: var(--text-light);
  14820. }
  14821. .sheet.kingdom-builder .ability-builder .row-column div + .boost,
  14822. .sheet.kingdom-builder .ability-builder .row-column button + .boost {
  14823. margin-top: 4px;
  14824. }
  14825. .sheet.kingdom-builder .ability-builder .summary-row .row-heading {
  14826. display: block;
  14827. }
  14828. .sheet.kingdom-builder .ability-builder .summary-row .hint-container {
  14829. background: rgba(211, 204, 188, 0.4);
  14830. padding: 12px;
  14831. margin-right: 10px;
  14832. border: 1px solid rgb(211, 204, 188);
  14833. border-radius: 3px;
  14834. align-self: end;
  14835. }
  14836. .sheet.kingdom-builder .ability-builder .summary-row .hint-container h3 {
  14837. color: var(--primary);
  14838. font-variant: small-caps;
  14839. font-size: var(--font-size-20);
  14840. line-height: var(--font-size-16);
  14841. font-family: var(--sans-serif-condensed);
  14842. font-weight: 500;
  14843. }
  14844. .sheet.kingdom-builder .ability-builder .summary-row .hint-container p {
  14845. font-style: italic;
  14846. font-size: var(--font-size-12);
  14847. line-height: var(--font-size-14);
  14848. font-family: var(--sans-serif);
  14849. font-weight: 500;
  14850. margin-bottom: 3px;
  14851. }
  14852. .sheet.kingdom-builder .ability-builder .summary-row .hint-container label {
  14853. display: flex;
  14854. align-items: center;
  14855. margin-top: 8px;
  14856. }
  14857. .sheet.kingdom-builder .ability-builder .summary-row .hint-container .aspiration {
  14858. display: flex;
  14859. gap: 8px;
  14860. }
  14861. .sheet.kingdom-builder .ability-builder .summary-row .hint-container .aspiration select {
  14862. flex: 1;
  14863. }
  14864. .sheet.kingdom-builder .ability-builder .summary-row .abilities {
  14865. grid-template-rows: auto auto;
  14866. }
  14867. .sheet.kingdom-builder .ability-builder .summary-row .row-column {
  14868. display: flex;
  14869. flex-direction: column;
  14870. padding-top: 10px;
  14871. }
  14872. .sheet.kingdom-builder .ability-builder .summary-row .row-column .value {
  14873. height: 40px;
  14874. font: 700 var(--font-size-24) var(--serif);
  14875. line-height: var(--font-size-30);
  14876. }
  14877. .sheet.kingdom-builder .ability-builder .summary-row .row-column input {
  14878. width: calc(100% - 20px);
  14879. flex-grow: 0;
  14880. height: 30px;
  14881. color: var(--text-dark);
  14882. font: 500 var(--font-size-24) var(--serif);
  14883. border: 0;
  14884. border-bottom: 1px solid #d3ccbc;
  14885. border-radius: 0;
  14886. background-color: transparent;
  14887. margin: 0 10px 10px 10px;
  14888. text-align: center;
  14889. }
  14890. .sheet.kingdom-builder .ability-builder .summary-row .row-column input::placeholder {
  14891. filter: opacity(0.5);
  14892. }
  14893. .sheet.kingdom-builder .ability-builder .summary-row .row-column input:focus {
  14894. border-bottom: 1px solid var(--alt);
  14895. }
  14896. .sheet.kingdom-builder .ability-builder .summary-row .row-column input[type=number] {
  14897. padding-bottom: 0;
  14898. padding-left: 4px;
  14899. }
  14900. .sheet.kingdom-builder .ability-builder .summary-row div.complete {
  14901. grid-row: 2;
  14902. grid-column: 1/7;
  14903. display: flex;
  14904. align-items: flex-end;
  14905. justify-content: flex-end;
  14906. margin-top: 10px;
  14907. margin-left: auto;
  14908. }
  14909. .sheet.kingdom-builder .ability-builder .title {
  14910. color: var(--primary);
  14911. font: 500 var(--font-size-10) var(--sans-serif-condensed);
  14912. line-height: var(--font-size-10);
  14913. text-transform: uppercase;
  14914. }
  14915. .sheet.kingdom-builder .ability-builder .description {
  14916. font: 600 var(--font-size-16) var(--serif);
  14917. }
  14918. .sheet.kingdom-builder .ability-builder .extra {
  14919. display: flex;
  14920. align-items: center;
  14921. font-size: var(--font-size-12);
  14922. margin-top: -0.25rem;
  14923. }
  14924. .sheet.kingdom-builder .ability-builder .extra .fas {
  14925. margin-left: 0.125rem;
  14926. }
  14927. .sheet.kingdom-builder .ability-builder .extra input[type=checkbox] {
  14928. height: var(--font-size-12);
  14929. margin: 0;
  14930. }
  14931. .pf2e.chat-card.kingdom {
  14932. --color-confirmation: #2c4f0d;
  14933. }
  14934. .pf2e.chat-card.kingdom .confirmation {
  14935. align-items: center;
  14936. color: var(--color-confirmation);
  14937. display: flex;
  14938. border: 1px dashed var(--color-confirmation);
  14939. font-size: 1.2em;
  14940. gap: 0.5rem;
  14941. justify-content: center;
  14942. padding: 0.25rem 0;
  14943. }
  14944. /* Mystification data revealed to GMs */
  14945. .gm-mystified-data {
  14946. opacity: 0.75;
  14947. }
  14948. #compendium-browser > section.window-content > .content-box,
  14949. #license-viewer > section.window-content > .content-box {
  14950. flex: 1;
  14951. overflow: hidden;
  14952. height: inherit;
  14953. }
  14954. #compendium-browser > section.window-content > .content-box div[class^=slider-],
  14955. #license-viewer > section.window-content > .content-box div[class^=slider-] {
  14956. height: 10px;
  14957. width: 80%;
  14958. border: 1px solid black;
  14959. }
  14960. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base,
  14961. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base {
  14962. background: #dddddd;
  14963. }
  14964. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle,
  14965. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle {
  14966. background: none;
  14967. border: none;
  14968. box-shadow: none;
  14969. color: var(--text-light);
  14970. cursor: grab;
  14971. font-size: var(--font-size-16);
  14972. height: 14px;
  14973. right: -7px;
  14974. text-shadow: 0 0 4px black;
  14975. top: -4px;
  14976. width: 14px;
  14977. }
  14978. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle:active,
  14979. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle:active {
  14980. cursor: grabbing;
  14981. }
  14982. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle.handle,
  14983. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle.handle {
  14984. background: #c85019;
  14985. border-radius: 2px;
  14986. border: 1px solid black;
  14987. box-shadow: 1px 1px 4px black;
  14988. }
  14989. #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,
  14990. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle::before,
  14991. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle::after {
  14992. background: none;
  14993. }
  14994. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle .noUi-touch-area,
  14995. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle .noUi-touch-area {
  14996. cursor: pointer;
  14997. }
  14998. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-tooltip,
  14999. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-tooltip {
  15000. display: none;
  15001. }
  15002. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-active .noUi-tooltip,
  15003. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-active .noUi-tooltip {
  15004. display: block;
  15005. background-color: rgba(0, 0, 0, 0.9);
  15006. color: var(--text-light);
  15007. line-height: 18px;
  15008. padding: 6px 14px;
  15009. }
  15010. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-connect.range_selected,
  15011. #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-connect.range_selected {
  15012. background: rgba(255, 255, 240, 0.8);
  15013. }
  15014. #compendium-browser > section.window-content > .content-box > nav,
  15015. #license-viewer > section.window-content > .content-box > nav {
  15016. border-style: solid;
  15017. border-image-outset: 0;
  15018. border-width: 9px;
  15019. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  15020. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  15021. flex: 0;
  15022. width: 100%;
  15023. display: inline-flex;
  15024. justify-content: space-evenly;
  15025. align-items: center;
  15026. background: var(--secondary);
  15027. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  15028. }
  15029. #compendium-browser > section.window-content > .content-box > nav > a,
  15030. #license-viewer > section.window-content > .content-box > nav > a {
  15031. color: var(--sidebar-label);
  15032. padding: 4px 0;
  15033. font-family: var(--sans-serif);
  15034. font-size: var(--font-size-12);
  15035. position: relative;
  15036. }
  15037. #compendium-browser > section.window-content > .content-box > nav > a.active::after,
  15038. #license-viewer > section.window-content > .content-box > nav > a.active::after {
  15039. bottom: -2px;
  15040. right: 39%;
  15041. position: absolute;
  15042. content: "";
  15043. width: 0;
  15044. height: 0;
  15045. border-left: 4px solid transparent;
  15046. border-right: 4px solid transparent;
  15047. border-top: 4px solid var(--sidebar-label);
  15048. }
  15049. #compendium-browser > section.window-content > .content-box .compendium-browser-settings,
  15050. #license-viewer > section.window-content > .content-box .compendium-browser-settings {
  15051. height: 100%;
  15052. }
  15053. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form,
  15054. #license-viewer > section.window-content > .content-box .compendium-browser-settings form {
  15055. display: flex;
  15056. height: 88%;
  15057. flex-direction: column;
  15058. margin-bottom: 10px;
  15059. }
  15060. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section,
  15061. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section {
  15062. border: 1px solid #bbb;
  15063. border-radius: 5px;
  15064. margin-top: 5px;
  15065. padding: 2px;
  15066. /* Checkbox */
  15067. }
  15068. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section h3,
  15069. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section h3 {
  15070. margin: 0;
  15071. cursor: pointer;
  15072. }
  15073. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section dt,
  15074. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section dt {
  15075. width: 10%;
  15076. }
  15077. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section dt > input[type=checkbox],
  15078. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section dt > input[type=checkbox] {
  15079. transform: none;
  15080. flex: none;
  15081. height: auto;
  15082. margin: 3px 3px;
  15083. }
  15084. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section dd,
  15085. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section dd {
  15086. width: 88%;
  15087. }
  15088. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form dl,
  15089. #license-viewer > section.window-content > .content-box .compendium-browser-settings form dl {
  15090. margin: 5px 0;
  15091. }
  15092. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form dt,
  15093. #license-viewer > section.window-content > .content-box .compendium-browser-settings form dt {
  15094. display: inline-block;
  15095. width: 40%;
  15096. padding-left: 5px;
  15097. }
  15098. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form dd,
  15099. #license-viewer > section.window-content > .content-box .compendium-browser-settings form dd {
  15100. display: inline-block;
  15101. width: 58%;
  15102. margin-left: 0;
  15103. }
  15104. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container,
  15105. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container {
  15106. overflow-y: auto;
  15107. display: flex;
  15108. flex-wrap: wrap;
  15109. }
  15110. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container .tab[data-tab].active,
  15111. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container .tab[data-tab].active {
  15112. display: flex;
  15113. flex-direction: row;
  15114. flex-wrap: wrap;
  15115. justify-content: center;
  15116. width: 100%;
  15117. }
  15118. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container .single-column,
  15119. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container .single-column {
  15120. width: 100%;
  15121. }
  15122. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container h2,
  15123. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container h2 {
  15124. margin-top: 1em;
  15125. margin-bottom: 0.5em;
  15126. width: 100%;
  15127. }
  15128. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container div,
  15129. #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container div {
  15130. width: 365px;
  15131. margin-right: 1em;
  15132. }
  15133. #compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav,
  15134. #license-viewer > section.window-content > .content-box .compendium-browser-settings > nav {
  15135. border-style: solid;
  15136. border-image-outset: 0;
  15137. border-width: 9px;
  15138. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  15139. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  15140. flex: 0;
  15141. width: 100%;
  15142. display: inline-flex;
  15143. justify-content: space-evenly;
  15144. align-items: center;
  15145. background: var(--secondary);
  15146. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  15147. }
  15148. #compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav > a,
  15149. #license-viewer > section.window-content > .content-box .compendium-browser-settings > nav > a {
  15150. color: var(--sidebar-label);
  15151. padding: 4px 0;
  15152. font-family: var(--sans-serif);
  15153. font-size: var(--font-size-12);
  15154. position: relative;
  15155. }
  15156. #compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav > a.active::after,
  15157. #license-viewer > section.window-content > .content-box .compendium-browser-settings > nav > a.active::after {
  15158. bottom: -2px;
  15159. right: 39%;
  15160. position: absolute;
  15161. content: "";
  15162. width: 0;
  15163. height: 0;
  15164. border-left: 4px solid transparent;
  15165. border-right: 4px solid transparent;
  15166. border-top: 4px solid var(--sidebar-label);
  15167. }
  15168. #compendium-browser > section.window-content > .content-box .compendium-browser-settings nav,
  15169. #license-viewer > section.window-content > .content-box .compendium-browser-settings nav {
  15170. border-width: unset;
  15171. }
  15172. #compendium-browser > section.window-content > .content-box .compendium-browser-settings button.save-settings,
  15173. #license-viewer > section.window-content > .content-box .compendium-browser-settings button.save-settings {
  15174. background: rgba(0, 0, 0, 0.1);
  15175. border: 2px groove var(--color-border-light-highlight);
  15176. }
  15177. #compendium-browser > section.window-content > .content-box .spell-browser,
  15178. #license-viewer > section.window-content > .content-box .spell-browser {
  15179. display: flex;
  15180. min-height: 100px;
  15181. height: 100%;
  15182. /* Sort and filter areas */
  15183. }
  15184. #compendium-browser > section.window-content > .content-box .spell-browser .control-area,
  15185. #license-viewer > section.window-content > .content-box .spell-browser .control-area {
  15186. position: sticky;
  15187. display: block;
  15188. min-width: 320px;
  15189. width: 320px;
  15190. padding-right: 5px;
  15191. overflow: auto;
  15192. }
  15193. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer,
  15194. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer,
  15195. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer,
  15196. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer {
  15197. border: 1px solid #bbb;
  15198. border-radius: 5px;
  15199. margin-top: 5px;
  15200. padding: 2px;
  15201. }
  15202. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer div.title,
  15203. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer div.title,
  15204. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer div.title,
  15205. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer div.title {
  15206. display: flex;
  15207. flex-direction: row;
  15208. justify-content: space-between;
  15209. height: 22px;
  15210. }
  15211. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer div.title h3,
  15212. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer div.title h3,
  15213. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer div.title h3,
  15214. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer div.title h3 {
  15215. margin: 0;
  15216. cursor: pointer;
  15217. }
  15218. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer div.title button,
  15219. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer div.title button,
  15220. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer div.title button,
  15221. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer div.title button {
  15222. width: fit-content;
  15223. line-height: 22px;
  15224. }
  15225. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer button.clear-filters,
  15226. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer button.clear-filters,
  15227. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer button.clear-filters,
  15228. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer button.clear-filters {
  15229. margin-bottom: 5px;
  15230. }
  15231. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer > dl dt > input[type=checkbox],
  15232. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer > dl dt > input[type=checkbox],
  15233. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer > dl dt > input[type=checkbox],
  15234. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer > dl dt > input[type=checkbox] {
  15235. transform: none;
  15236. flex: none;
  15237. height: auto;
  15238. margin: 3px 3px;
  15239. }
  15240. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer > dl dd > a.direction,
  15241. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer > dl dd > a.direction,
  15242. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer > dl dd > a.direction,
  15243. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer > dl dd > a.direction {
  15244. padding: 2px;
  15245. }
  15246. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer dt,
  15247. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer dt {
  15248. width: 10%;
  15249. }
  15250. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer dd,
  15251. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer dd {
  15252. width: 82%;
  15253. }
  15254. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer .filter-conjunction input[type=radio],
  15255. #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer .filter-conjunction input[type=radio] {
  15256. margin: 0 5px 0 3px;
  15257. }
  15258. #compendium-browser > section.window-content > .content-box .spell-browser .rangecontainer div,
  15259. #license-viewer > section.window-content > .content-box .spell-browser .rangecontainer div {
  15260. text-align: center;
  15261. margin-top: 5px;
  15262. }
  15263. #compendium-browser > section.window-content > .content-box .spell-browser .rangecontainer input,
  15264. #license-viewer > section.window-content > .content-box .spell-browser .rangecontainer input {
  15265. width: 45%;
  15266. }
  15267. #compendium-browser > section.window-content > .content-box .spell-browser .slidercontainer-flex,
  15268. #license-viewer > section.window-content > .content-box .spell-browser .slidercontainer-flex {
  15269. display: flex;
  15270. justify-content: space-around;
  15271. align-items: baseline;
  15272. }
  15273. #compendium-browser > section.window-content > .content-box .spell-browser .slidercontainer-flex label,
  15274. #license-viewer > section.window-content > .content-box .spell-browser .slidercontainer-flex label {
  15275. width: 10px;
  15276. }
  15277. #compendium-browser > section.window-content > .content-box .spell-browser dl,
  15278. #license-viewer > section.window-content > .content-box .spell-browser dl {
  15279. margin: 5px 0;
  15280. }
  15281. #compendium-browser > section.window-content > .content-box .spell-browser dt,
  15282. #license-viewer > section.window-content > .content-box .spell-browser dt {
  15283. display: inline-block;
  15284. padding-left: 5px;
  15285. }
  15286. #compendium-browser > section.window-content > .content-box .spell-browser dd,
  15287. #license-viewer > section.window-content > .content-box .spell-browser dd {
  15288. text-transform: capitalize;
  15289. display: inline-block;
  15290. }
  15291. #compendium-browser > section.window-content > .content-box .spell-browser dd select,
  15292. #license-viewer > section.window-content > .content-box .spell-browser dd select {
  15293. width: 6em;
  15294. margin-left: 0.5em;
  15295. }
  15296. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list,
  15297. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list {
  15298. width: 100%;
  15299. float: right;
  15300. display: block;
  15301. margin: 0;
  15302. height: 100%;
  15303. overflow: visible scroll;
  15304. }
  15305. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li,
  15306. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li {
  15307. line-height: var(--font-size-32);
  15308. margin: 2px 0;
  15309. }
  15310. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li:nth-child(odd),
  15311. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li:nth-child(odd) {
  15312. background-color: rgba(0, 0, 0, 0.12);
  15313. }
  15314. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > *,
  15315. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > * {
  15316. align-self: center;
  15317. }
  15318. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .image,
  15319. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .image {
  15320. height: 32px;
  15321. max-width: 32px;
  15322. }
  15323. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .name,
  15324. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .name {
  15325. line-height: 1em;
  15326. padding-left: 5px;
  15327. }
  15328. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .tags,
  15329. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .tags {
  15330. justify-content: center;
  15331. margin-left: 0.5em;
  15332. max-width: 6em;
  15333. }
  15334. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .level,
  15335. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .level {
  15336. flex-grow: 1;
  15337. font-weight: 900;
  15338. height: 32px;
  15339. max-width: 18px;
  15340. text-align: center;
  15341. }
  15342. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .price,
  15343. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .price {
  15344. flex: none;
  15345. height: 32px;
  15346. margin-right: 10px;
  15347. min-width: 5em;
  15348. text-align: right;
  15349. }
  15350. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .end,
  15351. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .end {
  15352. font-weight: 900;
  15353. height: 32px;
  15354. margin-right: 3px;
  15355. max-width: 100px;
  15356. text-align: right;
  15357. }
  15358. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li:hover,
  15359. #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li:hover {
  15360. background-color: rgba(255, 255, 255, 0.25);
  15361. cursor: grab;
  15362. }
  15363. #compendium-browser > section.window-content > .content-box .spell-browser #tagfilter input,
  15364. #license-viewer > section.window-content > .content-box .spell-browser #tagfilter input {
  15365. width: 100%;
  15366. }
  15367. #compendium-browser > section.window-content > .content-box .spell-browser .hint,
  15368. #license-viewer > section.window-content > .content-box .spell-browser .hint {
  15369. font-size: var(--font-size-12);
  15370. border: 1px solid rgba(0, 255, 5, 0.2784313725);
  15371. border-radius: 5px;
  15372. padding: 3px;
  15373. }
  15374. #compendium-browser > section.window-content > .content-box .spell-browser .spacer,
  15375. #license-viewer > section.window-content > .content-box .spell-browser .spacer {
  15376. display: inline-block;
  15377. min-width: 5px;
  15378. }
  15379. #compendium-browser > section.window-content > .content-box .spell-browser .spacer-large,
  15380. #license-viewer > section.window-content > .content-box .spell-browser .spacer-large {
  15381. display: inline-block;
  15382. min-width: 15px;
  15383. }
  15384. #compendium-browser > section.window-content > .content-box .spell-browser .equipment-controls,
  15385. #license-viewer > section.window-content > .content-box .spell-browser .equipment-controls {
  15386. margin-left: 0.25em;
  15387. margin-right: 0.25em;
  15388. max-width: 1em;
  15389. width: 1em;
  15390. }
  15391. #compendium-browser > section.window-content > .content-box .spell-browser .list-buttons,
  15392. #license-viewer > section.window-content > .content-box .spell-browser .list-buttons {
  15393. position: absolute;
  15394. bottom: 3px;
  15395. right: 22px;
  15396. width: 54%;
  15397. display: flex;
  15398. justify-content: space-between;
  15399. }
  15400. #compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button,
  15401. #license-viewer > section.window-content > .content-box .spell-browser .list-buttons button {
  15402. line-height: 19px;
  15403. background: rgb(255, 255, 240);
  15404. }
  15405. #compendium-browser > section.window-content > .content-box > section.content,
  15406. #license-viewer > section.window-content > .content-box > section.content {
  15407. height: 96%;
  15408. }
  15409. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active,
  15410. #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active {
  15411. height: inherit;
  15412. }
  15413. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active > div,
  15414. #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active > div {
  15415. display: grid;
  15416. grid-template-columns: 320px auto;
  15417. }
  15418. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active > div .control-area,
  15419. #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active > div .control-area {
  15420. grid-column-start: 1;
  15421. }
  15422. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active > div ul,
  15423. #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active > div ul {
  15424. grid-column-start: 2;
  15425. }
  15426. #compendium-browser > section.window-content > .content-box > section.content > .tab.settings.active,
  15427. #license-viewer > section.window-content > .content-box > section.content > .tab.settings.active {
  15428. height: 98%;
  15429. }
  15430. .pf2e.item.sheet h3 {
  15431. border-bottom: none;
  15432. }
  15433. .pf2e.item.sheet button > i {
  15434. margin-right: 0;
  15435. }
  15436. .pf2e.item.sheet .sheet-header {
  15437. display: flex;
  15438. flex: 0 0 70px;
  15439. align-items: bottom;
  15440. width: 100%;
  15441. padding-bottom: 6px;
  15442. border-bottom: 1px solid var(--secondary-background);
  15443. }
  15444. .pf2e.item.sheet .sheet-header img {
  15445. border: none;
  15446. object-fit: contain;
  15447. flex: 0 0 64px;
  15448. margin-right: 6px;
  15449. }
  15450. .pf2e.item.sheet .sheet-header .details {
  15451. display: flex;
  15452. flex-wrap: wrap;
  15453. align-items: baseline;
  15454. }
  15455. .pf2e.item.sheet .sheet-header .details input,
  15456. .pf2e.item.sheet .sheet-header .details .level {
  15457. font-family: var(--serif-condensed);
  15458. font-size: var(--font-size-36);
  15459. font-weight: 700;
  15460. }
  15461. .pf2e.item.sheet .sheet-header input[type=text],
  15462. .pf2e.item.sheet .sheet-header input[type=number] {
  15463. border: none;
  15464. height: var(--font-size-34);
  15465. }
  15466. .pf2e.item.sheet .sheet-header input[type=text]:hover, .pf2e.item.sheet .sheet-header input[type=text]:focus,
  15467. .pf2e.item.sheet .sheet-header input[type=number]:hover,
  15468. .pf2e.item.sheet .sheet-header input[type=number]:focus {
  15469. box-shadow: none;
  15470. }
  15471. .pf2e.item.sheet .sheet-header input[name=name] {
  15472. flex: 1;
  15473. }
  15474. .pf2e.item.sheet .sheet-header .level {
  15475. flex: 0;
  15476. white-space: nowrap;
  15477. margin-left: auto;
  15478. padding-left: 8px;
  15479. }
  15480. .pf2e.item.sheet .sheet-header .level i {
  15481. font-size: 0.6em;
  15482. vertical-align: middle;
  15483. }
  15484. .pf2e.item.sheet .sheet-header .level input {
  15485. width: 40px;
  15486. text-align: center;
  15487. }
  15488. .pf2e.item.sheet .sheet-header .feat-action-cost {
  15489. font-size: 2.5rem;
  15490. margin-top: -0.6rem;
  15491. margin-bottom: -0.3rem;
  15492. padding-left: 0.4rem;
  15493. }
  15494. .pf2e.item.sheet .sheet-header .paizo-style {
  15495. flex-basis: 100%;
  15496. width: 0;
  15497. border: none;
  15498. margin-top: 2px;
  15499. padding-left: 0;
  15500. padding-right: 0;
  15501. }
  15502. .pf2e.item.sheet .sheet-body {
  15503. height: calc(100% - 35px);
  15504. overflow: hidden;
  15505. display: flex;
  15506. flex-direction: column;
  15507. flex-wrap: nowrap;
  15508. }
  15509. .pf2e.item.sheet.action form .drop-zone {
  15510. align-items: center;
  15511. border: 1px solid var(--color-border-light-tertiary);
  15512. display: flex;
  15513. gap: 0.25rem;
  15514. max-width: fit-content;
  15515. padding: 0 4px 0 0;
  15516. }
  15517. .pf2e.item.sheet.action form .drop-zone.empty {
  15518. font-weight: normal;
  15519. min-width: 12rem;
  15520. padding: 4px;
  15521. }
  15522. .pf2e.item.sheet.action form .drop-zone.empty .name {
  15523. font-style: italic;
  15524. flex: 1;
  15525. text-align: center;
  15526. }
  15527. .pf2e.item.sheet.action form .drop-zone picture,
  15528. .pf2e.item.sheet.action form .drop-zone img {
  15529. border: 1px solid var(--color-border-dark);
  15530. border-radius: 2px;
  15531. box-sizing: border-box;
  15532. display: block;
  15533. float: left;
  15534. height: 24px;
  15535. width: 24px;
  15536. }
  15537. .pf2e.item.sheet.action form .drop-zone a.content-link {
  15538. align-items: center;
  15539. border: none;
  15540. border-right: 1px solid var(--color-border-light-2);
  15541. display: flex;
  15542. gap: 0.5em;
  15543. min-width: 9rem;
  15544. padding: 4px;
  15545. }
  15546. .pf2e.item.sheet.action form .drop-zone a.delete {
  15547. display: flex;
  15548. }
  15549. .pf2e.item.sheet.affliction form .affliction-stage .link:not(.linked) {
  15550. opacity: 0.6;
  15551. color: #a00;
  15552. }
  15553. .pf2e.item.sheet.deity form .tab.details .checkbox-pair {
  15554. align-items: center;
  15555. display: flex;
  15556. }
  15557. .pf2e.item.sheet.deity form .tab.details .checkbox-pair span {
  15558. font-weight: 400;
  15559. }
  15560. .pf2e.item.sheet.effect form .sheet-content .sidebar .inventory-details .form-group select {
  15561. max-width: fit-content;
  15562. }
  15563. .pf2e.item.sheet.effect form .sheet-content .sidebar .inventory-details .form-group .form-group.duration label {
  15564. max-width: fit-content;
  15565. padding-right: 0.1em;
  15566. }
  15567. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row {
  15568. align-items: center;
  15569. display: flex;
  15570. gap: 4px;
  15571. width: 100%;
  15572. }
  15573. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row label {
  15574. cursor: pointer;
  15575. max-width: unset;
  15576. }
  15577. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row input[type=radio] {
  15578. margin: 0;
  15579. top: 0;
  15580. }
  15581. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row .badge-value {
  15582. margin-right: 0.1rem;
  15583. width: 3ch;
  15584. font-weight: bold;
  15585. text-align: end;
  15586. }
  15587. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-row input[type=text] {
  15588. flex: 1;
  15589. text-align: end;
  15590. }
  15591. .pf2e.item.sheet.effect form .sheet-content .sidebar .badge-label-header {
  15592. display: flex;
  15593. align-items: center;
  15594. justify-content: space-between;
  15595. margin: 0.5em 0 0.25em 0;
  15596. }
  15597. .pf2e.item.sheet.effect form .sheet-content .sidebar .add-badge {
  15598. display: flex;
  15599. align-items: center;
  15600. }
  15601. .pf2e.item.sheet.effect form .sheet-content .sidebar .add-badge select {
  15602. flex: 1;
  15603. max-width: unset;
  15604. }
  15605. .pf2e.item.sheet.effect form .sheet-content .sidebar .add-badge button {
  15606. flex: 0;
  15607. line-height: 1.2em;
  15608. }
  15609. .pf2e.item.sheet.feat form .drop-zone {
  15610. align-items: center;
  15611. border: 1px solid var(--color-border-light-tertiary);
  15612. display: flex;
  15613. gap: 0.25rem;
  15614. max-width: fit-content;
  15615. padding: 0 4px 0 0;
  15616. }
  15617. .pf2e.item.sheet.feat form .drop-zone.empty {
  15618. font-weight: normal;
  15619. min-width: 12rem;
  15620. padding: 4px;
  15621. }
  15622. .pf2e.item.sheet.feat form .drop-zone.empty .name {
  15623. font-style: italic;
  15624. flex: 1;
  15625. text-align: center;
  15626. }
  15627. .pf2e.item.sheet.feat form .drop-zone picture,
  15628. .pf2e.item.sheet.feat form .drop-zone img {
  15629. border: 1px solid var(--color-border-dark);
  15630. border-radius: 2px;
  15631. box-sizing: border-box;
  15632. display: block;
  15633. float: left;
  15634. height: 24px;
  15635. width: 24px;
  15636. }
  15637. .pf2e.item.sheet.feat form .drop-zone a.content-link {
  15638. align-items: center;
  15639. border: none;
  15640. border-right: 1px solid var(--color-border-light-2);
  15641. display: flex;
  15642. gap: 0.5em;
  15643. min-width: 9rem;
  15644. padding: 4px;
  15645. }
  15646. .pf2e.item.sheet.feat form .drop-zone a.delete {
  15647. display: flex;
  15648. }
  15649. .pf2e.item.sheet.feat form .tab.details .form-group > label {
  15650. min-width: fit-content;
  15651. margin-right: 1em;
  15652. }
  15653. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry {
  15654. flex-wrap: nowrap;
  15655. width: 100%;
  15656. white-space: nowrap;
  15657. max-width: 100%;
  15658. }
  15659. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry label {
  15660. flex: 0;
  15661. }
  15662. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone {
  15663. background-color: rgba(0, 0, 0, 0.05);
  15664. border-radius: 2px;
  15665. border: 1px dotted var(--alt-dark);
  15666. display: flex;
  15667. font-weight: normal;
  15668. justify-content: center;
  15669. margin: 2px 3px 0 auto;
  15670. max-width: 8em;
  15671. padding: 3px;
  15672. position: relative;
  15673. }
  15674. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone span {
  15675. display: inline-block;
  15676. overflow: hidden;
  15677. text-overflow: ellipsis;
  15678. }
  15679. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone.ancestry-ref-broken {
  15680. background-color: rgba(255, 0, 0, 0.15);
  15681. border-color: var(--primary);
  15682. }
  15683. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone a.remove-ancestry {
  15684. display: none;
  15685. position: absolute;
  15686. right: -0.5em;
  15687. top: -0.25em;
  15688. }
  15689. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone a.remove-ancestry:hover {
  15690. display: flex;
  15691. }
  15692. .pf2e.item.sheet.heritage form section.sidebar .required-ancestry .drop-zone:hover a.remove-ancestry {
  15693. display: flex;
  15694. }
  15695. .pf2e.item.sheet.kit form .kit-list ul.kit-items {
  15696. padding: 0;
  15697. }
  15698. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item {
  15699. display: grid;
  15700. grid-template-columns: 26px 30px auto 10px;
  15701. align-items: center;
  15702. }
  15703. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item:nth-of-type(even) {
  15704. background-color: rgba(120, 100, 82, 0.1);
  15705. }
  15706. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item .kit-item-name {
  15707. line-height: 1em;
  15708. height: 1em;
  15709. }
  15710. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item .kit-item-name .fa.fa-globe {
  15711. padding: 0 3px;
  15712. float: right;
  15713. }
  15714. .pf2e.item.sheet.kit form .kit-list ul.kit-items ul {
  15715. padding-left: 0.5em;
  15716. margin-top: 0;
  15717. grid-column: 1/5;
  15718. }
  15719. .pf2e.item.sheet.kit form .kit-list ul.kit-items ul:empty {
  15720. display: none;
  15721. }
  15722. .pf2e.item.sheet.melee form .sheet-body .tab.details .form-group.attack-modifier label,
  15723. .pf2e.item.sheet.melee form .sheet-body .tab.details li.damage-partial form-group label {
  15724. max-width: fit-content;
  15725. }
  15726. .pf2e.item.sheet.melee form .sheet-body .tab.details .form-group.attack-modifier input,
  15727. .pf2e.item.sheet.melee form .sheet-body .tab.details li.damage-partial form-group input {
  15728. max-width: 6ch;
  15729. }
  15730. .pf2e.item.sheet.melee form .sheet-body .tab.details ol.form-list li.damage-partial {
  15731. align-items: center;
  15732. display: flex;
  15733. gap: 1em;
  15734. }
  15735. .pf2e.item.sheet.melee form .sheet-body .tab.details ol.form-list li.damage-partial input {
  15736. max-width: 12ch;
  15737. }
  15738. .pf2e.item.sheet.melee form .sheet-body .tab.details ol.form-list li.damage-partial .type {
  15739. gap: 0.25em;
  15740. }
  15741. .pf2e.item.sheet.melee form .sheet-body .tab.details ol.form-list li.damage-partial .remove-partial {
  15742. margin: 0 0.5em 0 auto;
  15743. }
  15744. .pf2e.item.sheet.spell form .damage-formulas {
  15745. margin-top: 8px;
  15746. }
  15747. .pf2e.item.sheet.spell form .damage-formulas .form-fields {
  15748. gap: 2px;
  15749. margin-top: 4px;
  15750. }
  15751. .pf2e.item.sheet.spell form .damage-formulas input[type=checkbox] {
  15752. margin-left: 2px;
  15753. }
  15754. .pf2e.item.sheet.spell form .damage-formulas .traits-list {
  15755. display: flex;
  15756. margin-top: 2px;
  15757. }
  15758. .pf2e.item.sheet.spell form .damage-formulas .tag {
  15759. float: none;
  15760. }
  15761. .pf2e.item.sheet.spell form button[data-action=damage-add] {
  15762. margin-top: 4px;
  15763. }
  15764. .pf2e.item.sheet.spell form .variants .variant {
  15765. display: grid;
  15766. grid-template-columns: 1fr 1fr 0.2fr;
  15767. }
  15768. .pf2e.item.sheet.spell form .variants .variant .item-controls {
  15769. justify-self: end;
  15770. }
  15771. .pf2e.item.sheet.weapon form .tab.details label {
  15772. min-width: 9em;
  15773. }
  15774. .pf2e.item.sheet.weapon form .tab.details .precious-material select {
  15775. width: 19.5em;
  15776. }
  15777. .pf2e.item.sheet form {
  15778. display: flex;
  15779. flex-direction: column;
  15780. flex-wrap: nowrap;
  15781. width: 100%;
  15782. height: 100%;
  15783. overflow: hidden;
  15784. }
  15785. .pf2e.item.sheet form .item-ref-group ul.item-refs {
  15786. border: 1px solid var(--color-border-light-2);
  15787. border-radius: 3px;
  15788. padding: 0;
  15789. }
  15790. .pf2e.item.sheet form .item-ref-group ul.item-refs.empty {
  15791. background-color: rgba(120, 100, 82, 0.1);
  15792. height: 28px;
  15793. }
  15794. .pf2e.item.sheet form .item-ref-group ul.item-refs > li {
  15795. align-items: center;
  15796. display: grid;
  15797. grid-template-columns: 26px auto 2em 1em;
  15798. padding: 1px;
  15799. }
  15800. .pf2e.item.sheet form .item-ref-group ul.item-refs > li:nth-of-type(even) {
  15801. background-color: rgba(120, 100, 82, 0.1);
  15802. }
  15803. .pf2e.item.sheet form .item-ref-group ul.item-refs > li .name {
  15804. display: block;
  15805. margin-left: 0.25em;
  15806. line-height: 1em;
  15807. height: 1em;
  15808. }
  15809. .pf2e.item.sheet form .item-ref-group ul.item-refs > li .name .fa.fa-globe {
  15810. padding: 0 3px;
  15811. float: right;
  15812. }
  15813. .pf2e.item.sheet form .item-ref-group ul.item-refs > li .level {
  15814. font-weight: bold;
  15815. height: 1.25em;
  15816. text-align: center;
  15817. }
  15818. .pf2e.item.sheet form .item-ref-group ul.item-refs > li a.remove {
  15819. padding: 0 2px;
  15820. }
  15821. .pf2e.item.sheet form .item-ref-group ul.item-refs ul {
  15822. grid-column: 1/5;
  15823. margin-top: 0;
  15824. padding-left: 0.5em;
  15825. }
  15826. .pf2e.item.sheet form .item-ref-group ul.item-refs ul:empty {
  15827. display: none;
  15828. }
  15829. .pf2e.item.sheet form .item-ref-list {
  15830. align-items: start;
  15831. }
  15832. .pf2e.item.sheet form .form-group.form-group-trait {
  15833. height: auto;
  15834. margin: 2px 0;
  15835. }
  15836. .pf2e.item.sheet form .form-group.form-group-trait label {
  15837. vertical-align: top;
  15838. }
  15839. .pf2e.item.sheet form .form-group.form-group-trait > ul.abc-traits-list {
  15840. list-style: none;
  15841. margin: 0;
  15842. padding: 0;
  15843. display: flex;
  15844. flex-wrap: wrap;
  15845. }
  15846. .pf2e.item.sheet form .form-group.form-group-trait > ul.abc-traits-list span.tag {
  15847. float: none;
  15848. }
  15849. .pf2e.item.sheet form .form-group.other-weapons input {
  15850. flex: 2;
  15851. }
  15852. .pf2e.item.sheet form .form-group.other-weapons select {
  15853. flex: 1;
  15854. }
  15855. .pf2e.item.sheet form .form-group.additional-language input {
  15856. flex: 0.5;
  15857. }
  15858. .pf2e.item.sheet form .form-group.additional-language span {
  15859. flex: 2.5;
  15860. padding-left: 4px;
  15861. }
  15862. .pf2e.item.sheet form .item-activations {
  15863. padding: 8px 8px 0;
  15864. overflow: hidden scroll;
  15865. }
  15866. .pf2e.item.sheet form .item-activations .activation + .activation, .pf2e.item.sheet form .item-activations .activation + button {
  15867. margin-top: 0.5em;
  15868. }
  15869. .pf2e.item.sheet form .item-activations .activation .editor {
  15870. min-height: 28px;
  15871. }
  15872. .pf2e.item.sheet form .item-activations header {
  15873. font-size: 1.05em;
  15874. margin-bottom: 0.25em;
  15875. line-height: 1.25em;
  15876. }
  15877. .pf2e.item.sheet form .item-activations .activation-time {
  15878. flex: 1;
  15879. height: 20px;
  15880. }
  15881. .pf2e.item.sheet form .item-activations .frequency {
  15882. flex: 1;
  15883. gap: 4px;
  15884. padding-right: 6px;
  15885. }
  15886. .pf2e.item.sheet form .item-activations .frequency input[type=number] {
  15887. border: none;
  15888. background: none;
  15889. text-align: right;
  15890. margin: 0 0 0 24px;
  15891. }
  15892. .pf2e.item.sheet form .item-activations .frequency > select:first-child {
  15893. margin-left: 24px;
  15894. }
  15895. .pf2e.item.sheet form .item-activations .frequency.empty {
  15896. text-align: right;
  15897. }
  15898. .pf2e.item.sheet form .item-activations .tags {
  15899. margin-top: 4px;
  15900. }
  15901. .pf2e.item.sheet form .item-activations .tags label {
  15902. margin-right: 3px;
  15903. }
  15904. .pf2e.item.sheet form .item-activations .tox {
  15905. min-height: 150px;
  15906. }
  15907. .pf2e.item.sheet form .identify-popup {
  15908. min-width: 300px;
  15909. }
  15910. .pf2e.item.sheet form .sheet-body .tab.mystification.active .mystification-status select {
  15911. max-width: fit-content;
  15912. margin-right: auto;
  15913. }
  15914. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified {
  15915. display: flex;
  15916. align-items: center;
  15917. gap: 0.5rem;
  15918. flex-wrap: wrap;
  15919. }
  15920. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified > * {
  15921. display: flex;
  15922. }
  15923. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified img {
  15924. height: 42px;
  15925. width: 42px;
  15926. }
  15927. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified input {
  15928. width: 50%;
  15929. }
  15930. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified .editor {
  15931. min-height: 100px;
  15932. width: 100%;
  15933. }
  15934. .pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified .tox.tox-tinymce {
  15935. min-height: 200px;
  15936. }
  15937. .pf2e.item.sheet form .tab.active.rules select {
  15938. font-size: var(--font-size-12);
  15939. height: 1.36rem;
  15940. width: auto;
  15941. }
  15942. .pf2e.item.sheet form .tab.active.rules select span {
  15943. padding: 0;
  15944. }
  15945. .pf2e.item.sheet form .tab.active.rules fieldset {
  15946. border-radius: 5px;
  15947. border: 1px solid var(--secondary-background);
  15948. padding: 0.25em;
  15949. }
  15950. .pf2e.item.sheet form .tab.active.rules fieldset legend {
  15951. font-weight: 500;
  15952. }
  15953. .pf2e.item.sheet form .tab.active.rules .nerd-details {
  15954. margin-bottom: 10px;
  15955. }
  15956. .pf2e.item.sheet form .tab.active.rules .nerd-details .form-group {
  15957. margin: 0;
  15958. }
  15959. .pf2e.item.sheet form .tab.active.rules .nerd-details label {
  15960. align-items: center;
  15961. display: flex;
  15962. flex: 0 0 70px;
  15963. line-height: 1.5em;
  15964. margin-right: 4px;
  15965. min-width: 8em;
  15966. }
  15967. .pf2e.item.sheet form .tab.active.rules .nerd-details label i.fa-info-circle {
  15968. margin-left: auto;
  15969. margin-right: 0.5em;
  15970. }
  15971. .pf2e.item.sheet form .tab.active.rules .rules {
  15972. padding-top: 7px;
  15973. padding-right: 7px;
  15974. }
  15975. .pf2e.item.sheet form .tab.active.rules .rules .add-rule-element {
  15976. text-align: right;
  15977. }
  15978. .pf2e.item.sheet form .tab.active.rules .rules textarea {
  15979. padding: 4px;
  15980. min-height: 60px;
  15981. resize: vertical;
  15982. }
  15983. .pf2e.item.sheet form .tab.active.rules .create-rule-element {
  15984. display: flex;
  15985. align-items: center;
  15986. white-space: nowrap;
  15987. gap: 6px;
  15988. justify-content: flex-end;
  15989. }
  15990. .pf2e.item.sheet form .tab.active.rules .rule-editing {
  15991. display: flex;
  15992. flex-direction: column;
  15993. height: 100%;
  15994. gap: 5px;
  15995. }
  15996. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor {
  15997. flex: 1;
  15998. background-color: white;
  15999. overflow: hidden;
  16000. }
  16001. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor .cm-scroller {
  16002. overflow: hidden scroll;
  16003. overflow: scroll;
  16004. }
  16005. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor button {
  16006. width: auto;
  16007. line-height: normal;
  16008. }
  16009. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor input[type=checkbox] {
  16010. width: auto;
  16011. height: auto;
  16012. }
  16013. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor label {
  16014. display: inline;
  16015. }
  16016. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor .cm-search .cm-textfield {
  16017. width: 100px;
  16018. }
  16019. .pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor ::selection {
  16020. color: var(--text-dark);
  16021. }
  16022. .pf2e.item.sheet form .tab.active.rules .rule-editing .item-controls {
  16023. margin: 0;
  16024. }
  16025. .pf2e.item.sheet form .tab.active.rules .rule-form {
  16026. --form-field-height: normal;
  16027. border-bottom: 1px solid var(--color-border-light-primary);
  16028. padding-bottom: 0.5rem;
  16029. margin-bottom: 0.5rem;
  16030. }
  16031. .pf2e.item.sheet form .tab.active.rules .rule-form.drag-preview {
  16032. background: url(../ui/parchment.jpg) repeat;
  16033. }
  16034. .pf2e.item.sheet form .tab.active.rules .rule-form.drag-gap {
  16035. visibility: hidden;
  16036. }
  16037. .pf2e.item.sheet form .tab.active.rules .rule-form input::placeholder {
  16038. opacity: 0.9;
  16039. }
  16040. .pf2e.item.sheet form .tab.active.rules .rule-form label {
  16041. align-items: center;
  16042. display: flex;
  16043. gap: 4px;
  16044. font-weight: 500;
  16045. white-space: nowrap;
  16046. }
  16047. .pf2e.item.sheet form .tab.active.rules .rule-form label:not(:first-child) {
  16048. padding-left: 2px;
  16049. }
  16050. .pf2e.item.sheet form .tab.active.rules .rule-form label input,
  16051. .pf2e.item.sheet form .tab.active.rules .rule-form label tags {
  16052. flex: 1;
  16053. }
  16054. .pf2e.item.sheet form .tab.active.rules .rule-form label input[type=checkbox] {
  16055. width: 1rem;
  16056. height: 1rem;
  16057. flex-basis: auto;
  16058. }
  16059. .pf2e.item.sheet form .tab.active.rules .rule-form label input[type=checkbox]:first-child:last-child {
  16060. margin-left: auto;
  16061. justify-self: flex-end;
  16062. }
  16063. .pf2e.item.sheet form .tab.active.rules .rule-form select.short {
  16064. flex: 0 0 auto;
  16065. }
  16066. .pf2e.item.sheet form .tab.active.rules .rule-form .content-link {
  16067. display: flex;
  16068. flex: 0 0 auto;
  16069. flex-direction: row;
  16070. align-items: center;
  16071. gap: 3px;
  16072. }
  16073. .pf2e.item.sheet form .tab.active.rules .rule-form .content-link img {
  16074. width: 16px;
  16075. height: 16px;
  16076. }
  16077. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header {
  16078. display: flex;
  16079. align-items: center;
  16080. margin-bottom: 0.25rem;
  16081. }
  16082. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header .drag-handle {
  16083. cursor: grab;
  16084. font-weight: normal;
  16085. margin-right: 0.375rem;
  16086. padding: 0.125rem;
  16087. }
  16088. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header h3 {
  16089. flex: 1;
  16090. margin: 0;
  16091. }
  16092. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header h3.unrecognized {
  16093. color: #880000;
  16094. }
  16095. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header .priority {
  16096. margin-right: 0.75rem;
  16097. }
  16098. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header .priority input {
  16099. width: 4ch;
  16100. }
  16101. .pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header .item-controls {
  16102. margin-left: auto;
  16103. }
  16104. .pf2e.item.sheet form .tab.active.rules .rule-form .form-fields [data-action] {
  16105. flex: 0 0 auto;
  16106. }
  16107. .pf2e.item.sheet form .tab.active.rules .rule-form .range {
  16108. display: flex;
  16109. gap: 3px;
  16110. align-items: center;
  16111. }
  16112. .pf2e.item.sheet form .tab.active.rules .rule-form .range input {
  16113. width: 40px;
  16114. }
  16115. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input {
  16116. align-items: center;
  16117. display: flex;
  16118. flex: 2;
  16119. justify-content: center;
  16120. }
  16121. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .attachment,
  16122. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input input,
  16123. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .tags {
  16124. z-index: 0;
  16125. }
  16126. .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,
  16127. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input input:hover,
  16128. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input input:focus,
  16129. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .tags:hover,
  16130. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .tags:focus {
  16131. z-index: 1;
  16132. }
  16133. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .attachment {
  16134. display: flex;
  16135. justify-content: center;
  16136. align-items: center;
  16137. padding: 0 6px;
  16138. margin: 0;
  16139. line-height: unset;
  16140. flex: 0 0 auto;
  16141. width: auto;
  16142. min-width: 68px;
  16143. align-self: stretch;
  16144. border: 1px solid #aaa;
  16145. border-right: none;
  16146. border-radius: 3px 0 0 3px;
  16147. }
  16148. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .file-picker {
  16149. line-height: unset;
  16150. }
  16151. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input input,
  16152. .pf2e.item.sheet form .tab.active.rules .rule-form .attached-input tags {
  16153. border-top-left-radius: 0;
  16154. border-bottom-left-radius: 0;
  16155. margin: 0;
  16156. flex: 1;
  16157. }
  16158. .pf2e.item.sheet form .tab.active.rules .rule-form .brackets {
  16159. margin-left: 9.5em;
  16160. }
  16161. .pf2e.item.sheet form .tab.active.rules .rule-form .brackets .bracket {
  16162. align-items: center;
  16163. display: flex;
  16164. gap: 4px;
  16165. }
  16166. .pf2e.item.sheet form .tab.active.rules .rule-form .brackets .bracket .value {
  16167. flex: 1;
  16168. }
  16169. .pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs {
  16170. border-bottom: 1px solid var(--secondary-background);
  16171. }
  16172. .pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 {
  16173. display: flex;
  16174. justify-content: space-evenly;
  16175. width: 100%;
  16176. margin-top: 0.5em;
  16177. font-weight: 200;
  16178. }
  16179. .pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs a.active {
  16180. font-weight: 600;
  16181. text-decoration: underline;
  16182. }
  16183. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container {
  16184. display: flex;
  16185. justify-content: center;
  16186. align-items: center;
  16187. width: 100%;
  16188. height: 4em;
  16189. }
  16190. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone {
  16191. display: flex;
  16192. justify-content: center;
  16193. align-items: center;
  16194. width: 40%;
  16195. height: 3.5em;
  16196. border: 1px solid var(--color-border-light-primary);
  16197. border-radius: 3px;
  16198. color: #222;
  16199. background-color: #ddd;
  16200. cursor: default;
  16201. padding: 1px 6px;
  16202. font-family: var(--font-primary);
  16203. font-size: var(--font-size-14);
  16204. line-height: 28px;
  16205. }
  16206. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone i {
  16207. border: 1px solid #bbb;
  16208. border-radius: 2px;
  16209. align-items: center;
  16210. display: flex;
  16211. height: 1.6em;
  16212. justify-content: center;
  16213. margin-right: 0.5em;
  16214. width: 1.6em;
  16215. }
  16216. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone i:after {
  16217. font-size: var(--font-size-20);
  16218. }
  16219. .pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone span {
  16220. color: var(--text-dark);
  16221. }
  16222. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .grid-item {
  16223. display: grid;
  16224. grid: 1fr/5em 1fr;
  16225. }
  16226. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .grid-item.long-label {
  16227. grid: 1fr/9em 1fr;
  16228. }
  16229. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .checkbox {
  16230. display: flex;
  16231. justify-content: flex-end;
  16232. }
  16233. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .item-controls {
  16234. justify-content: flex-end;
  16235. }
  16236. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .item-controls a {
  16237. margin: 2px 5px 0 0;
  16238. }
  16239. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .stacked {
  16240. display: grid;
  16241. grid-template-columns: 1fr 1fr;
  16242. column-gap: 0.5rem;
  16243. }
  16244. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .column-span-two {
  16245. grid-column: span 2;
  16246. }
  16247. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .resolvable {
  16248. grid-column: span 2;
  16249. display: flex;
  16250. align-items: center;
  16251. }
  16252. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .brackets-container {
  16253. grid-column: span 3;
  16254. }
  16255. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] label {
  16256. min-width: 5em;
  16257. font-weight: 500;
  16258. }
  16259. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] label.short {
  16260. max-width: 5em;
  16261. }
  16262. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] label.with-hint {
  16263. margin-right: 5px;
  16264. }
  16265. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] fieldset {
  16266. grid-column: span 2;
  16267. padding-bottom: 0.4rem;
  16268. }
  16269. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] .brackets {
  16270. margin-left: 6em;
  16271. }
  16272. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab] hr {
  16273. grid-column: span 2;
  16274. width: 100%;
  16275. }
  16276. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] {
  16277. height: 90px;
  16278. overflow-y: auto;
  16279. }
  16280. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .item-container {
  16281. grid-column: span 2;
  16282. display: grid;
  16283. grid: 1fr/5em 10fr 1fr;
  16284. }
  16285. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .item-container a.content-link {
  16286. display: flex;
  16287. align-items: center;
  16288. gap: 0.5em;
  16289. width: fit-content;
  16290. min-width: 12rem;
  16291. height: 2em;
  16292. padding: 4px;
  16293. }
  16294. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .item-container a.content-link img {
  16295. border: 1px solid var(--color-border-dark);
  16296. border-radius: 2px;
  16297. box-sizing: border-box;
  16298. display: block;
  16299. float: left;
  16300. height: 24px;
  16301. width: 24px;
  16302. }
  16303. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .item-container a.content-link span {
  16304. text-wrap: wrap;
  16305. }
  16306. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .three-items {
  16307. grid-column: span 2;
  16308. display: grid;
  16309. grid: 1fr/5em 8fr 7em 5fr 6em 1fr;
  16310. margin-top: 5px;
  16311. }
  16312. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .three-items select {
  16313. width: fit-content;
  16314. min-width: 10em;
  16315. }
  16316. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .saves-container {
  16317. display: grid;
  16318. grid: 1fr/5em 8.8fr;
  16319. align-items: center;
  16320. row-gap: 5px;
  16321. }
  16322. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .saves-container select {
  16323. width: fit-content;
  16324. min-width: 10em;
  16325. }
  16326. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=effects] .rules-drop-container {
  16327. grid-column: span 2;
  16328. }
  16329. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .translation input {
  16330. width: 5em;
  16331. }
  16332. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] input[type=checkbox] {
  16333. margin-left: unset;
  16334. }
  16335. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items {
  16336. display: flex;
  16337. justify-content: space-between;
  16338. gap: 0.5em;
  16339. }
  16340. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items > label {
  16341. min-width: unset;
  16342. width: fit-content;
  16343. }
  16344. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker {
  16345. align-items: center;
  16346. display: flex;
  16347. width: 16rem;
  16348. white-space: nowrap;
  16349. }
  16350. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker input[type=text] {
  16351. flex: 1;
  16352. }
  16353. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker input[type=color] {
  16354. flex: 2;
  16355. height: 94%;
  16356. }
  16357. .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 {
  16358. background: rgba(0, 0, 0, 0.05);
  16359. border: 1px solid transparent;
  16360. }
  16361. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker .user {
  16362. flex: 0;
  16363. gap: 0;
  16364. justify-content: start;
  16365. }
  16366. .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] {
  16367. flex: 0;
  16368. margin-left: 0;
  16369. }
  16370. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .two-items .color-picker .user span {
  16371. font-size: small;
  16372. }
  16373. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items {
  16374. display: grid;
  16375. grid-template-columns: 5em 2.5fr 1fr;
  16376. align-items: center;
  16377. }
  16378. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items.long-label {
  16379. grid: 1fr/9em 2.5fr 1fr;
  16380. }
  16381. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items input[type=color] {
  16382. min-width: 7em;
  16383. }
  16384. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items.image-path {
  16385. grid-column: span 2;
  16386. grid: 1fr/9em 8fr 1fr;
  16387. }
  16388. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Aura] div[data-rule-tab=appearance] .three-items.image-path button.file-picker {
  16389. margin: unset;
  16390. }
  16391. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=Note] {
  16392. display: flex;
  16393. flex-direction: column;
  16394. gap: 2px;
  16395. }
  16396. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] {
  16397. display: grid;
  16398. grid: "label content" 1fr/1fr 1fr;
  16399. column-gap: 5px;
  16400. }
  16401. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] fieldset.radii {
  16402. display: flex;
  16403. flex-direction: column;
  16404. grid-column: span 2;
  16405. }
  16406. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] fieldset.radii .brackets {
  16407. margin-left: 6.5em;
  16408. }
  16409. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] label {
  16410. display: flex;
  16411. flex: unset;
  16412. margin-left: 5px;
  16413. margin-right: 5px;
  16414. }
  16415. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] label.short {
  16416. min-width: 5em;
  16417. }
  16418. .pf2e.item.sheet form .tab.active.rules .rule-form[data-key=TokenLight] div[data-rule-tab] .column-span-two {
  16419. grid-column: span 2;
  16420. }
  16421. .pf2e.item.sheet form label {
  16422. display: block;
  16423. }
  16424. .pf2e.item.sheet form input:not(:disabled) {
  16425. color: var(--color-text-dark-input);
  16426. }
  16427. .pf2e.item.sheet form .mce-panel span {
  16428. display: inherit;
  16429. }
  16430. .pf2e.item.sheet form.editable .rollable:hover {
  16431. color: var(--text-dark);
  16432. text-shadow: 0 0 10px #00005a;
  16433. cursor: pointer;
  16434. }
  16435. .pf2e.item.sheet form .tab {
  16436. flex: 1;
  16437. }
  16438. .pf2e.item.sheet form:has(.tab.active.rules) .sidebar-summary {
  16439. visibility: hidden;
  16440. }
  16441. .pf2e.item.sheet form:has(.tab.active.rules) section.sidebar {
  16442. display: none;
  16443. }
  16444. .pf2e.item.sheet form .tag-legacy {
  16445. float: left;
  16446. margin: 0 2px 2px 0;
  16447. padding: 0 3px;
  16448. font-size: var(--font-size-10);
  16449. line-height: 16px;
  16450. border: 1px solid #999;
  16451. border-radius: 3px;
  16452. white-space: normal;
  16453. font-weight: 500;
  16454. }
  16455. .pf2e.item.sheet form p.hint {
  16456. font-family: var(--font-primary);
  16457. font-weight: normal;
  16458. }
  16459. .pf2e.item.sheet form .item-controls {
  16460. display: flex;
  16461. margin: 0 0 0 4px;
  16462. align-items: baseline;
  16463. gap: 2px;
  16464. }
  16465. .pf2e.item.sheet form > nav {
  16466. display: flex;
  16467. align-items: baseline;
  16468. border-bottom: 1px solid var(--secondary-background);
  16469. flex: 0 0 30px;
  16470. line-height: 30px;
  16471. margin-bottom: 0.5rem;
  16472. }
  16473. .pf2e.item.sheet form > nav a {
  16474. flex: 1 1 auto;
  16475. }
  16476. .pf2e.item.sheet form > nav a.active {
  16477. text-decoration: underline;
  16478. }
  16479. .pf2e.item.sheet form > nav .sidebar-summary {
  16480. flex: 0 0 220px;
  16481. margin: 0;
  16482. text-align: center;
  16483. }
  16484. .pf2e.item.sheet form > nav .sheet-tabs {
  16485. font-weight: 500;
  16486. margin: 0;
  16487. flex: 1;
  16488. align-items: baseline;
  16489. }
  16490. .pf2e.item.sheet form > nav .sheet-tabs > .list-row {
  16491. font-size: var(--font-size-12);
  16492. text-align: center;
  16493. }
  16494. .pf2e.item.sheet form > nav .sheet-tabs > .list-row:last-of-type {
  16495. padding-right: 4px;
  16496. }
  16497. .pf2e.item.sheet form > nav .sheet-tabs > .list-row.active {
  16498. font-weight: 600;
  16499. }
  16500. .pf2e.item.sheet form .sheet-content {
  16501. width: 100%;
  16502. display: flex;
  16503. flex-direction: row;
  16504. flex-wrap: wrap;
  16505. justify-content: flex-start;
  16506. height: calc(100% - 35px);
  16507. overflow: hidden;
  16508. }
  16509. .pf2e.item.sheet form .sheet-content > * {
  16510. flex: 1;
  16511. }
  16512. .pf2e.item.sheet form .sheet-content > section.sidebar,
  16513. .pf2e.item.sheet form .sheet-content > .sheet-body {
  16514. height: calc(100% - 10px);
  16515. overflow-y: auto;
  16516. }
  16517. .pf2e.item.sheet form .sheet-content section.sidebar {
  16518. flex: 0 0 220px;
  16519. display: flex;
  16520. flex-direction: column;
  16521. flex-wrap: nowrap;
  16522. }
  16523. .pf2e.item.sheet form .sheet-content section.sidebar > * {
  16524. flex: 1;
  16525. }
  16526. .pf2e.item.sheet form .sheet-content section.sidebar .item-summary {
  16527. font-family: var(--serif-condensed);
  16528. font-weight: 700;
  16529. flex: 0 0 28px;
  16530. line-height: 28px;
  16531. text-align: center;
  16532. font-size: var(--font-size-18);
  16533. color: #444;
  16534. }
  16535. .pf2e.item.sheet form .sheet-content section.sidebar ol.item-tags {
  16536. padding-left: 0;
  16537. flex: 0;
  16538. list-style: none;
  16539. }
  16540. .pf2e.item.sheet form .sheet-content section.sidebar ol.item-tags .tag {
  16541. align-items: center;
  16542. justify-content: center;
  16543. width: 100%;
  16544. }
  16545. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details,
  16546. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details {
  16547. overflow: hidden scroll;
  16548. padding: 0 4px 0 0;
  16549. }
  16550. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details label,
  16551. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details label {
  16552. font-weight: 500;
  16553. max-width: 6em;
  16554. white-space: nowrap;
  16555. }
  16556. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group,
  16557. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group {
  16558. margin: 3px 0;
  16559. }
  16560. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group input,
  16561. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group input {
  16562. text-align: right;
  16563. }
  16564. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group input.left-of-select,
  16565. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group input.left-of-select {
  16566. min-width: 4ch;
  16567. padding-right: 0.25em;
  16568. }
  16569. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group select,
  16570. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group select {
  16571. max-width: 12em;
  16572. }
  16573. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group.longtext,
  16574. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group.longtext {
  16575. height: fit-content;
  16576. align-items: start;
  16577. margin: 0 0 0.5em 0;
  16578. }
  16579. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group.longtext label,
  16580. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group.longtext label {
  16581. max-width: 6em;
  16582. white-space: normal;
  16583. line-height: unset;
  16584. }
  16585. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group.longtext .editor-content,
  16586. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group.longtext .editor-content {
  16587. min-height: 3em;
  16588. }
  16589. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .form-group.longtext .editor-content > p,
  16590. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .form-group.longtext .editor-content > p {
  16591. font-weight: 400;
  16592. margin: 0;
  16593. }
  16594. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .price-fields,
  16595. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .price-fields {
  16596. display: flex;
  16597. gap: 4px;
  16598. }
  16599. .pf2e.item.sheet form .sheet-content section.sidebar .inventory-details .price-fields input[name="system.price.per"],
  16600. .pf2e.item.sheet form .sheet-content section.sidebar .feat-details .price-fields input[name="system.price.per"] {
  16601. width: 22px;
  16602. }
  16603. .pf2e.item.sheet form .sheet-content section.sidebar select {
  16604. font-family: inherit;
  16605. font-size: 0.85em;
  16606. height: 1.8em;
  16607. }
  16608. .pf2e.item.sheet form .sheet-content section.sidebar button {
  16609. padding-top: 0;
  16610. padding-bottom: 0;
  16611. white-space: nowrap;
  16612. }
  16613. .pf2e.item.sheet form .sheet-content input[type=text], .pf2e.item.sheet form .sheet-content input[type=number] {
  16614. border: 1px solid transparent;
  16615. height: calc(100% - 2px);
  16616. margin: 1px 0;
  16617. width: calc(100% - 2px);
  16618. }
  16619. .pf2e.item.sheet form .sheet-content select {
  16620. background: rgba(255, 255, 255, 0.5);
  16621. }
  16622. .pf2e.item.sheet form .sheet-content button:hover:not(:disabled), .pf2e.item.sheet form .sheet-content button:focus,
  16623. .pf2e.item.sheet form .sheet-content input:not([type=range]):hover:not(:disabled),
  16624. .pf2e.item.sheet form .sheet-content input:not([type=range]):focus,
  16625. .pf2e.item.sheet form .sheet-content select:hover:not(:disabled),
  16626. .pf2e.item.sheet form .sheet-content select:focus {
  16627. border-color: var(--color-border-dark-1);
  16628. box-shadow: 0 0 5px var(--secondary);
  16629. }
  16630. .pf2e.item.sheet form .sheet-body input[type=text],
  16631. .pf2e.item.sheet form .sheet-body input[type=number] {
  16632. padding: 3px;
  16633. }
  16634. .pf2e.item.sheet form .sheet-body input[type=text]:not(:disabled),
  16635. .pf2e.item.sheet form .sheet-body input[type=number]:not(:disabled) {
  16636. background: rgba(255, 255, 255, 0.5);
  16637. border: 1px solid var(--color-text-light-5);
  16638. }
  16639. .pf2e.item.sheet form .sheet-body .tab.active {
  16640. overflow: hidden scroll;
  16641. padding-left: 0.5rem;
  16642. }
  16643. .pf2e.item.sheet form .sheet-body .tab.active.description {
  16644. display: flex;
  16645. flex-direction: column;
  16646. gap: 3px;
  16647. height: 100%;
  16648. padding: 0 0.25em;
  16649. }
  16650. .pf2e.item.sheet form .sheet-body .tab.active.description > * {
  16651. display: flex;
  16652. overflow: hidden;
  16653. }
  16654. .pf2e.item.sheet form .sheet-body .tab.active.description .editor {
  16655. min-height: 2.5em;
  16656. flex: 1;
  16657. }
  16658. .pf2e.item.sheet form .sheet-body .tab.active.description.editing {
  16659. overflow: hidden;
  16660. }
  16661. .pf2e.item.sheet form .sheet-body .tab.active.description.editing > section {
  16662. flex: 1;
  16663. }
  16664. .pf2e.item.sheet form .sheet-body .tab.active.description .gm-notes {
  16665. background-color: var(--visibility-gm-bg);
  16666. border: 1px dotted rgba(75, 74, 68, 0.5);
  16667. padding: 0 0.25em;
  16668. flex: 0 0 auto;
  16669. }
  16670. .pf2e.item.sheet form .sheet-body .tab.active.description .gm-notes:not(.has-content) {
  16671. display: none;
  16672. }
  16673. .pf2e.item.sheet form .sheet-body .tab.active.description .main {
  16674. flex: 1 0 auto;
  16675. }
  16676. .pf2e.item.sheet form .sheet-body .tab.active.description .editor {
  16677. display: flex;
  16678. flex-direction: column;
  16679. }
  16680. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes,
  16681. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit {
  16682. font-size: 1.33em;
  16683. background: rgb(205, 205, 205);
  16684. }
  16685. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes i,
  16686. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit i {
  16687. width: 1em;
  16688. text-align: center;
  16689. }
  16690. .pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes {
  16691. border-radius: 4px;
  16692. border: 1px solid var(--color-border-dark-1);
  16693. box-shadow: 0 0 1px var(--color-shadow-dark);
  16694. display: none;
  16695. padding: 1px 2px;
  16696. position: absolute;
  16697. right: 35px;
  16698. top: 5px;
  16699. }
  16700. .pf2e.item.sheet form .sheet-body .tab.active.description .editor:hover a.add-gm-notes {
  16701. display: block;
  16702. }
  16703. .pf2e.item.sheet form .sheet-body .tab.active.description .editor .tox {
  16704. flex: 1;
  16705. }
  16706. .pf2e.item.sheet form .sheet-body .tab.active.details {
  16707. padding: 0.5rem 0.5rem 0;
  16708. }
  16709. .pf2e.item.sheet form .sheet-body .tab.active.details label {
  16710. color: var(--color-text-dark-2);
  16711. font-weight: 500;
  16712. padding-right: 0.5em;
  16713. white-space: nowrap;
  16714. }
  16715. .pf2e.item.sheet form .sheet-body .tab.active.details label.no-data {
  16716. color: var(--color-text-dark-4);
  16717. }
  16718. .pf2e.item.sheet form .sheet-body .tab.active.details select {
  16719. font-size: var(--font-size-12);
  16720. height: 1.5rem;
  16721. padding-right: 1em;
  16722. }
  16723. .pf2e.item.sheet form .sheet-body .tab.active.details .tags .tag {
  16724. font-size: var(--font-size-10);
  16725. }
  16726. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data {
  16727. align-items: baseline;
  16728. gap: 0.25em;
  16729. display: grid;
  16730. grid-template: "title title title" 2fr "authors license remaster" 3fr/60% 20% 20%;
  16731. }
  16732. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data label {
  16733. font-weight: 500;
  16734. min-width: unset;
  16735. }
  16736. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data input[type=text] {
  16737. height: 1.6rem;
  16738. }
  16739. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .title {
  16740. grid-area: title;
  16741. margin-right: 0;
  16742. }
  16743. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .authors {
  16744. grid-area: authors;
  16745. }
  16746. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license {
  16747. grid-area: license;
  16748. }
  16749. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select {
  16750. margin-top: 1px;
  16751. }
  16752. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .remaster {
  16753. grid-area: remaster;
  16754. }
  16755. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license,
  16756. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .remaster {
  16757. text-align: center;
  16758. }
  16759. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license label,
  16760. .pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .remaster label {
  16761. padding: 0;
  16762. }
  16763. .pf2e.item.sheet form .sheet-body fieldset {
  16764. border: 1px solid var(--color-border-medium);
  16765. border-radius: 2px;
  16766. margin-bottom: 0.5rem;
  16767. padding: 0 0.5em 0.25em;
  16768. }
  16769. .pf2e.item.sheet form .sheet-body fieldset legend {
  16770. font-weight: 600;
  16771. }
  16772. .pf2e.item.sheet form .sheet-body fieldset.basics {
  16773. border-color: transparent;
  16774. padding: 0;
  16775. }
  16776. .pf2e.item.sheet form .sheet-body .editor {
  16777. --space-s: 0.25em;
  16778. --space-m: 0.5em;
  16779. --space-l: 1em;
  16780. --space-xl: 1.5em;
  16781. --space-2xl: 2em;
  16782. --radius: 3px;
  16783. }
  16784. .pf2e.item.sheet form .sheet-body .editor p {
  16785. min-height: unset;
  16786. }
  16787. .pf2e.item.sheet form .sheet-body .editor :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  16788. margin-top: 1em;
  16789. }
  16790. .pf2e.item.sheet form .sheet-body .editor .inline-header {
  16791. display: flex;
  16792. align-items: center;
  16793. gap: var(--space-l);
  16794. background-color: var(--alt);
  16795. font-family: var(--sans-serif);
  16796. color: var(--text-light);
  16797. padding: 0;
  16798. font-size: 0.8em;
  16799. font-weight: 400;
  16800. border: none;
  16801. }
  16802. .pf2e.item.sheet form .sheet-body .editor .inline-header strong {
  16803. display: inline-flex;
  16804. padding: 0 var(--space-m);
  16805. background-color: var(--primary);
  16806. min-width: 15ch;
  16807. border-right: 1px solid rgba(0, 0, 0, 0.4);
  16808. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  16809. font-weight: 400;
  16810. }
  16811. .pf2e.item.sheet form .sheet-body .editor .inline-header + p {
  16812. margin-top: var(--space-s);
  16813. }
  16814. .pf2e.item.sheet form .sheet-body .editor .info {
  16815. background-color: var(--secondary);
  16816. padding: var(--space-m);
  16817. color: var(--text-light);
  16818. margin-left: auto;
  16819. margin-right: auto;
  16820. padding: 0;
  16821. border-radius: var(--radius);
  16822. font-family: var(--sans-serif);
  16823. padding-bottom: var(--space-m);
  16824. }
  16825. .pf2e.item.sheet form .sheet-body .editor .info > * + * {
  16826. margin-top: var(--space-m);
  16827. }
  16828. .pf2e.item.sheet form .sheet-body .editor .info + * {
  16829. margin-top: var(--space-xl);
  16830. }
  16831. .pf2e.item.sheet form .sheet-body .editor .info + .pf2e.item.sheet form .sheet-body .editor .info {
  16832. margin-top: var(--space-s);
  16833. }
  16834. .pf2e.item.sheet form .sheet-body .editor .info h4 {
  16835. font-size: 0.9em;
  16836. font-weight: 400;
  16837. line-height: 1.2;
  16838. font-family: var(--sans-serif);
  16839. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  16840. padding: var(--space-m) var(--space-l);
  16841. position: relative;
  16842. display: flex;
  16843. align-items: center;
  16844. justify-content: space-between;
  16845. color: var(--text-light);
  16846. }
  16847. .pf2e.item.sheet form .sheet-body .editor .info h4::after {
  16848. font-family: "Font Awesome 6";
  16849. content: "\f05a";
  16850. font-weight: 900;
  16851. margin-right: var(--space-s);
  16852. }
  16853. .pf2e.item.sheet form .sheet-body .editor .info p {
  16854. font-size: 0.8em;
  16855. margin: 0;
  16856. padding: 0 var(--space-l);
  16857. }
  16858. .pf2e.item.sheet form .sheet-body .editor .info p:first-of-type {
  16859. padding-top: var(--space-m);
  16860. border-top: 1px solid rgba(255, 255, 255, 0.1);
  16861. }
  16862. .pf2e.item.sheet form .sheet-body .editor .traits {
  16863. display: flex;
  16864. flex-wrap: wrap;
  16865. padding: 0;
  16866. }
  16867. .pf2e.item.sheet form .sheet-body .editor .traits p {
  16868. display: inline-flex;
  16869. padding: 0.16rem 0.25rem;
  16870. margin: 0;
  16871. background-color: var(--primary);
  16872. border: 2px solid var(--color-border-trait);
  16873. color: var(--text-light);
  16874. font: 500 var(--font-size-10) var(--sans-serif);
  16875. text-transform: uppercase;
  16876. }
  16877. .pf2e.item.sheet form .sheet-body .editor .statblock {
  16878. font-family: var(--sans-serif-condensed);
  16879. color: var(--text-dark);
  16880. line-height: 1.2;
  16881. margin-bottom: var(--space-m);
  16882. }
  16883. .pf2e.item.sheet form .sheet-body .editor .statblock > * + * {
  16884. margin-top: var(--space-s);
  16885. margin-bottom: 0;
  16886. }
  16887. .pf2e.item.sheet form .sheet-body .editor .statblock p {
  16888. --indent: var(--space-l);
  16889. margin-left: var(--indent);
  16890. position: relative;
  16891. }
  16892. .pf2e.item.sheet form .sheet-body .editor .statblock p strong:first-of-type {
  16893. margin-left: calc(var(--indent) * -1);
  16894. }
  16895. .pf2e.item.sheet form .sheet-body .editor .statblock p .trait:first-of-type {
  16896. margin-left: calc(var(--indent) * -1 - 2px);
  16897. }
  16898. .pf2e.item.sheet form .sheet-body .editor .statblock span.pf2-icon {
  16899. line-height: 1;
  16900. }
  16901. .pf2e.item.sheet form .sheet-body .editor .statblock h1,
  16902. .pf2e.item.sheet form .sheet-body .editor .statblock h2,
  16903. .pf2e.item.sheet form .sheet-body .editor .statblock h3,
  16904. .pf2e.item.sheet form .sheet-body .editor .statblock h4 {
  16905. display: flex;
  16906. align-items: baseline;
  16907. justify-content: space-between;
  16908. border-bottom: 1px solid var(--color-border-dark);
  16909. text-transform: uppercase;
  16910. letter-spacing: -0.05em;
  16911. font-family: var(--sans-serif-condensed);
  16912. font-weight: 700;
  16913. }
  16914. .pf2e.item.sheet form .sheet-body .editor .statblock hr {
  16915. border: none;
  16916. border-bottom: 1px solid var(--color-border-dark);
  16917. }
  16918. .pf2e.item.sheet form .sheet-body .editor .message {
  16919. font-family: var(--journal-cursive);
  16920. font-size: 2em;
  16921. line-height: 1.2;
  16922. }
  16923. .pf2e.item.sheet form h3 .item-controls,
  16924. .pf2e.item.sheet form header .item-controls {
  16925. float: right;
  16926. }
  16927. .pf2e.item.sheet form .form-list {
  16928. border-radius: 5px;
  16929. border: 1px solid var(--secondary-background);
  16930. list-style-type: none;
  16931. margin: 0.5em 0;
  16932. padding: 0.25em;
  16933. }
  16934. .pf2e.item.sheet form .form-list:first-child {
  16935. margin-top: 0;
  16936. }
  16937. .pf2e.item.sheet form .form-list h3 {
  16938. font-weight: 600;
  16939. font-size: 1.05em;
  16940. margin-bottom: 0.25em;
  16941. }
  16942. .pf2e.item.sheet form .form-list.subsection {
  16943. padding: 0;
  16944. }
  16945. .pf2e.item.sheet form .form-list.subsection > * {
  16946. padding: 0.25rem;
  16947. }
  16948. .pf2e.item.sheet form .form-list.subsection > header {
  16949. align-items: baseline;
  16950. background-color: var(--secondary);
  16951. border-radius: 5px 5px 0 0;
  16952. color: var(--text-light);
  16953. display: flex;
  16954. justify-content: space-between;
  16955. margin: -1px -1px 0 -1px;
  16956. padding: 1px;
  16957. }
  16958. .pf2e.item.sheet form .form-list.subsection > header h3,
  16959. .pf2e.item.sheet form .form-list.subsection > header .item-controls {
  16960. padding: 0.25rem;
  16961. margin-bottom: 0;
  16962. }
  16963. .pf2e.item.sheet form .two-by-two {
  16964. display: grid;
  16965. grid-template-columns: 1fr 1fr;
  16966. column-gap: 0.25rem;
  16967. }
  16968. .pf2e.item.sheet form .two-by-two .item-controls {
  16969. margin-left: 2px;
  16970. gap: 0;
  16971. }
  16972. .pf2e.item.sheet form .form-group.scalable {
  16973. height: auto;
  16974. min-height: 1.5rem;
  16975. }
  16976. .pf2e.item.sheet form .form-group.scalable ul.traits-list {
  16977. list-style-type: none;
  16978. }
  16979. .pf2e.item.sheet form .form-group > label:not(.large) {
  16980. max-width: 11em;
  16981. }
  16982. .pf2e.item.sheet form .form-group > label.short {
  16983. max-width: 9em;
  16984. }
  16985. .pf2e.item.sheet form .form-group .item-controls {
  16986. flex: 0 1 auto;
  16987. }
  16988. .pf2e.item.sheet form .form-group input.adjusted-higher:not(:focus) {
  16989. font-weight: 700;
  16990. color: #009988;
  16991. }
  16992. .pf2e.item.sheet form .form-group input.adjusted-lower:not(:focus) {
  16993. font-weight: 700;
  16994. color: #cc3311;
  16995. }
  16996. .pf2e.item.sheet form .details-container,
  16997. .pf2e.item.sheet form .dice-data {
  16998. display: grid;
  16999. grid: "dice die type"/40px 60px auto;
  17000. }
  17001. .pf2e.item.sheet form .effects-container {
  17002. display: grid;
  17003. grid: "effect number"/auto 40px;
  17004. }
  17005. .pf2e.item.sheet form .details-container-two-columns {
  17006. display: grid;
  17007. grid: "size type"/50% 50%;
  17008. }
  17009. .pf2e.item.sheet form .details-container-three-columns {
  17010. display: grid;
  17011. grid-template-columns: 1fr 1fr 1fr;
  17012. }
  17013. .pf2e.item.sheet form .form-fields > label {
  17014. display: flex;
  17015. align-items: center;
  17016. white-space: nowrap;
  17017. }
  17018. .pf2e.item.sheet form .form-fields select {
  17019. flex: 1;
  17020. width: auto;
  17021. }
  17022. .pf2e.item.sheet form .toggle-button-list {
  17023. display: flex;
  17024. gap: 2px;
  17025. margin: 4px 0;
  17026. }
  17027. .pf2e.item.sheet form .toggle-button-list button {
  17028. margin: 0;
  17029. font-size: var(--font-size-10);
  17030. line-height: 16px;
  17031. display: flex;
  17032. align-items: center;
  17033. white-space: nowrap;
  17034. padding: 3px 4px;
  17035. }
  17036. .pf2e.item.sheet form .consumable-details {
  17037. flex: 0 0 24px;
  17038. }
  17039. .pf2e.item.sheet form .consumable-details label {
  17040. font-weight: bold;
  17041. }
  17042. .pf2e.item.sheet form .consumable-details input {
  17043. flex: 0 0 24px;
  17044. margin-right: 6px;
  17045. text-align: right;
  17046. }
  17047. .pf2e.item.sheet form .consumable-details span {
  17048. line-height: 24px;
  17049. }
  17050. .pf2e.item.sheet form .consumable-details .max-charges {
  17051. flex: 0 0 16px;
  17052. text-align: center;
  17053. }
  17054. .pf2e.item.sheet form .consumable-charges label {
  17055. flex: 0 0 144px;
  17056. }
  17057. .pf2e.item.sheet form .consumable-charges input {
  17058. flex: 0 0 64px;
  17059. text-align: center;
  17060. }
  17061. .pf2e.item.sheet form .consumable-charges span.flex0 {
  17062. line-height: 24px;
  17063. }
  17064. .pf2e.item.sheet form .feat-uses select {
  17065. flex: 2;
  17066. margin-right: 5px;
  17067. }
  17068. .pf2e.item.sheet form .feat-uses input {
  17069. flex: 1;
  17070. text-align: center;
  17071. }
  17072. .pf2e.item.sheet form .feat-uses span.sep {
  17073. flex: 0 0 16px;
  17074. line-height: 24px;
  17075. font-size: var(--font-size-14);
  17076. text-align: center;
  17077. }
  17078. .pf2e.item.sheet form .spell-components input {
  17079. margin-left: 0;
  17080. }
  17081. .pf2e.item.sheet form .spell-components label {
  17082. padding-right: 6px;
  17083. }
  17084. .pf2e.item.sheet form input.adjusted:not(:focus) {
  17085. font-weight: 700;
  17086. color: #009988;
  17087. }
  17088. .pf2e.item.sheet form .frequency {
  17089. align-items: baseline;
  17090. display: flex;
  17091. gap: 0.2rem;
  17092. text-align: end;
  17093. }
  17094. .pf2e.item.sheet form .frequency.empty {
  17095. justify-content: flex-end;
  17096. }
  17097. .pf2e.item.sheet form .frequency select {
  17098. flex: 1 1 auto;
  17099. }
  17100. .pf2e.item.sheet form .frequency a {
  17101. align-self: center;
  17102. }
  17103. .persistent-damage-dialog {
  17104. /** Work around Font Awesome styling bug present as of version 6.2 */
  17105. }
  17106. .persistent-damage-dialog i.fa-fw {
  17107. min-width: 1em;
  17108. }
  17109. .persistent-damage-dialog h3 {
  17110. display: flex;
  17111. align-items: baseline;
  17112. justify-content: space-between;
  17113. }
  17114. .persistent-damage-dialog h3 a {
  17115. float: right;
  17116. font-size: 0.8em;
  17117. }
  17118. .persistent-damage-dialog h3 a:hover i {
  17119. animation: rotation 2s infinite linear;
  17120. }
  17121. .persistent-damage-dialog .entries {
  17122. display: flex;
  17123. flex-direction: column;
  17124. gap: 0.125rem;
  17125. }
  17126. .persistent-damage-dialog .entries:not(.new) {
  17127. margin-bottom: 0.5rem;
  17128. }
  17129. .persistent-damage-dialog .persistent-entry {
  17130. display: flex;
  17131. align-items: baseline;
  17132. gap: 0.25rem;
  17133. }
  17134. .persistent-damage-dialog .persistent-entry.inactive .input-fields input span,
  17135. .persistent-damage-dialog .persistent-entry.inactive .input-fields input i, .persistent-damage-dialog .persistent-entry.inactive .input-fields input:not(:focus),
  17136. .persistent-damage-dialog .persistent-entry.inactive .input-fields select span,
  17137. .persistent-damage-dialog .persistent-entry.inactive .input-fields select i,
  17138. .persistent-damage-dialog .persistent-entry.inactive .input-fields select:not(:focus),
  17139. .persistent-damage-dialog .persistent-entry.inactive .input-fields label:not(:focus-within) span,
  17140. .persistent-damage-dialog .persistent-entry.inactive .input-fields label:not(:focus-within) i,
  17141. .persistent-damage-dialog .persistent-entry.inactive .input-fields label:not(:focus-within):not(:focus) {
  17142. opacity: 0.7;
  17143. text-decoration: line-through;
  17144. }
  17145. .persistent-damage-dialog .persistent-entry a {
  17146. padding: 0.25em;
  17147. }
  17148. .persistent-damage-dialog .persistent-entry .input-fields {
  17149. display: flex;
  17150. gap: 0.25rem;
  17151. align-items: baseline;
  17152. select-height: var(--form-field-height);
  17153. }
  17154. .persistent-damage-dialog .persistent-entry .input-fields label {
  17155. display: flex;
  17156. align-items: baseline;
  17157. gap: 0.19rem;
  17158. height: 100%;
  17159. }
  17160. .persistent-damage-dialog .persistent-entry .input-fields .dc {
  17161. width: 2.5rem;
  17162. }
  17163. .persistent-damage-dialog .persistent-entry .input-fields .invalid {
  17164. box-shadow: 0 0 5px 0px red;
  17165. border-color: red;
  17166. }
  17167. #darkness-adjuster {
  17168. background: none;
  17169. box-shadow: 0 0 10px black;
  17170. height: 38px !important;
  17171. }
  17172. #darkness-adjuster .window-header {
  17173. display: none;
  17174. }
  17175. #darkness-adjuster .window-content {
  17176. background: rgba(0, 0, 0, 0.5);
  17177. border: 1px solid black;
  17178. border-radius: 5px;
  17179. padding: 6px 12px 0;
  17180. }
  17181. #darkness-adjuster .slider {
  17182. height: 6px;
  17183. }
  17184. #darkness-adjuster .slider .noUi-base {
  17185. background: #ecc1b3;
  17186. cursor: pointer;
  17187. }
  17188. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle {
  17189. background: none;
  17190. border: none;
  17191. box-shadow: none;
  17192. color: var(--text-light);
  17193. font-size: var(--font-size-16);
  17194. height: 14px;
  17195. width: 14px;
  17196. top: -5px;
  17197. right: -7px;
  17198. text-shadow: 0 0 4px black;
  17199. }
  17200. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.threshold_bright-light, #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.threshold_darkness {
  17201. pointer-events: none;
  17202. }
  17203. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.threshold_darkness {
  17204. font-size: var(--font-size-14);
  17205. }
  17206. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.darkness-level {
  17207. background: #c85019;
  17208. border: 1px solid black;
  17209. border-radius: 2px;
  17210. box-shadow: 1px 1px 4px black;
  17211. height: 12px;
  17212. width: 12px;
  17213. right: -6px;
  17214. top: -4px;
  17215. }
  17216. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.darkness-level .noUi-touch-area {
  17217. cursor: grab;
  17218. }
  17219. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.darkness-level:active .noUi-touch-area {
  17220. cursor: grabbing;
  17221. }
  17222. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle::before, #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle::after {
  17223. background: none;
  17224. }
  17225. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle i.fa-solid {
  17226. cursor: default;
  17227. left: -1px;
  17228. opacity: 0.6;
  17229. position: absolute;
  17230. top: 0;
  17231. }
  17232. #darkness-adjuster .slider .noUi-base .noUi-connect.range_bright-light {
  17233. background: #fdfbd3;
  17234. }
  17235. #darkness-adjuster .slider .noUi-base .noUi-connect.range_darkness {
  17236. background: #16193a;
  17237. }
  17238. #darkness-adjuster .slider .noUi-pips {
  17239. height: 12px;
  17240. }
  17241. #darkness-adjuster .slider .noUi-pips .noUi-marker.noUi-marker-large {
  17242. height: 12px;
  17243. }
  17244. #darkness-adjuster .slider .noUi-pips .noUi-value {
  17245. display: none;
  17246. }
  17247. #darkness-adjuster .synchronized .slider .noUi-base {
  17248. cursor: not-allowed;
  17249. }
  17250. #darkness-adjuster .synchronized .slider .message {
  17251. display: flex;
  17252. justify-content: center;
  17253. position: relative;
  17254. top: 0.5em;
  17255. width: 100%;
  17256. }
  17257. #darkness-adjuster .synchronized .slider .message span {
  17258. color: var(--color-text-light-1);
  17259. text-shadow: 1px 1px black;
  17260. z-index: 1;
  17261. }
  17262. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle {
  17263. cursor: not-allowed;
  17264. }
  17265. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle.darkness-level {
  17266. background: var(--color-disabled);
  17267. border: none;
  17268. box-shadow: none;
  17269. }
  17270. #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 {
  17271. cursor: inherit;
  17272. }
  17273. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle i.fas {
  17274. cursor: inherit;
  17275. }
  17276. #darkness-adjuster .synchronized .slider .noUi-pips {
  17277. visibility: hidden;
  17278. }
  17279. .scene-sheet nav .action-glyph {
  17280. font-size: var(--font-size-15);
  17281. }
  17282. .scene-sheet span.range-value.disabled {
  17283. border: none;
  17284. color: #777;
  17285. }
  17286. .scene-sheet button.automation-settings {
  17287. align-self: end;
  17288. display: flex;
  17289. margin: -1px 0 -1px 4px;
  17290. padding: 0.3125rem 0.5em;
  17291. }
  17292. .scene-sheet button.automation-settings > i {
  17293. margin: 0;
  17294. }
  17295. .app.token-sheet .tab.active[data-tab=appearance] fieldset {
  17296. border: 1px solid var(--color-border-light-primary);
  17297. }
  17298. .app.token-sheet .tab.active[data-tab=appearance] fieldset > legend {
  17299. font-size: var(--font-size-15);
  17300. color: #333;
  17301. }
  17302. .app.token-sheet .tab.active[data-tab=appearance] fieldset input[type=number] {
  17303. max-width: 60px;
  17304. text-align: center;
  17305. }
  17306. .app.token-sheet .tab.active[data-tab=appearance] fieldset input[type=number]:disabled {
  17307. border: none;
  17308. color: var(--color-text-dark-6);
  17309. }
  17310. .app.token-sheet .tab.active[data-tab=appearance] fieldset select.alternate-images {
  17311. max-width: 20em;
  17312. }
  17313. .app.token-sheet .tab.active[data-tab=appearance] fieldset:last-child {
  17314. margin: 6px 0;
  17315. }
  17316. .app.token-sheet .tab[data-tab=vision] .disabled[data-tab] {
  17317. color: var(--color-text-dark-6);
  17318. pointer-events: none;
  17319. }
  17320. .app.token-sheet .tab[data-tab=vision] a.managed-by-rbv {
  17321. padding-left: 0.33em;
  17322. }
  17323. .app.token-sheet .form-group.children-disabled .range-value {
  17324. border: none;
  17325. background-color: rgba(0, 0, 0, 0.05);
  17326. color: #777;
  17327. }
  17328. #homebrew-settings section.window-content {
  17329. display: block;
  17330. }
  17331. #homebrew-settings section.window-content .form-group.setting {
  17332. display: inherit;
  17333. }
  17334. #homebrew-settings section.window-content .form-group.setting tags {
  17335. background-color: rgba(0, 0, 0, 0.05);
  17336. border: 1px solid #7a7971;
  17337. border-radius: 3px;
  17338. }
  17339. #homebrew-settings section.window-content .form-group.setting tags.tagify--focus {
  17340. border: 1px solid #7a7971;
  17341. box-shadow: 0 0 5px red;
  17342. }
  17343. #homebrew-settings section.window-content .form-group.setting .homebrew {
  17344. --tag-text-color--edit: #111;
  17345. --tag-pad: 0.2em 0.4em;
  17346. --tag-remove-bg: var(--tag-hover);
  17347. --tag-remove-btn-bg--hover: black;
  17348. font-size: var(--font-size-13);
  17349. min-width: 0;
  17350. }
  17351. #homebrew-settings section.window-content .form-group.buttons {
  17352. margin-top: 0.5em;
  17353. }
  17354. .damage-types th,
  17355. .damage-types td {
  17356. white-space: nowrap;
  17357. }
  17358. .damage-types th:not(:last-child),
  17359. .damage-types td:not(:last-child) {
  17360. padding-right: 0.25rem;
  17361. }
  17362. .damage-types .icon-preview {
  17363. display: flex;
  17364. align-items: center;
  17365. gap: 0.125rem;
  17366. }
  17367. .damage-types .delete-cell {
  17368. text-align: end;
  17369. width: 1rem;
  17370. }
  17371. .damage-types .delete-cell i {
  17372. padding: 0.125rem 0.25rem;
  17373. cursor: pointer;
  17374. }
  17375. #variant-rules-settings form .form-group.abp select {
  17376. flex: 0;
  17377. }
  17378. #variant-rules-settings form .proficiency-modifiers {
  17379. column-gap: 0.5em;
  17380. display: grid;
  17381. grid-template: "untrained trained expert master legendary" auto "hint hint hint hint hint" auto/1fr 1fr 1fr 1fr 1fr;
  17382. }
  17383. #variant-rules-settings form .proficiency-modifiers .hint {
  17384. grid-area: hint;
  17385. }
  17386. #variant-rules-settings form .proficiency-modifiers .modifier label {
  17387. font-size: var(--font-size-12);
  17388. }
  17389. #world-clock-settings form .form-group .form-fields {
  17390. flex-grow: 1;
  17391. }
  17392. #world-clock-settings form .form-group button.reset-world-time {
  17393. flex: 1;
  17394. }
  17395. #game-details > .system-links {
  17396. gap: 0.5rem;
  17397. margin-bottom: 0.35rem;
  17398. }
  17399. #game-details > .system-links > a[href] {
  17400. flex: 0;
  17401. font-size: var(--font-size-12);
  17402. text-transform: uppercase;
  17403. }
  17404. #game-details > .system-links > a[href]:hover {
  17405. text-shadow: 0 0 8px var(--color-text-hyperlink);
  17406. }
  17407. #client-settings form .form-group > label {
  17408. flex: 2.5;
  17409. }
  17410. .settings-menu form .form-group > label {
  17411. flex: 2.5;
  17412. }
  17413. .settings-menu .instructions {
  17414. text-align: center;
  17415. }
  17416. #metagame-settings form .form-group > label {
  17417. flex: 3;
  17418. }
  17419. .select-craft-item-dialog .drop-item-zone {
  17420. display: flex;
  17421. align-items: center;
  17422. margin: 0 2px 5px;
  17423. }
  17424. .select-craft-item-dialog .item-icon {
  17425. height: 32px;
  17426. width: 32px;
  17427. margin-right: 3px;
  17428. }
  17429. .select-craft-item-dialog .button-panel {
  17430. display: flex;
  17431. }
  17432. .select-repair-item-dialog .drop-item-zone {
  17433. display: flex;
  17434. align-items: center;
  17435. margin: 0 2px 5px;
  17436. }
  17437. .select-repair-item-dialog .item-icon {
  17438. height: 32px;
  17439. width: 32px;
  17440. margin-right: 3px;
  17441. }
  17442. .select-repair-item-dialog .button-panel {
  17443. display: flex;
  17444. }
  17445. .app.choice-set-prompt .window-content h3 {
  17446. display: flex;
  17447. justify-content: center;
  17448. }
  17449. .app.choice-set-prompt .window-content button,
  17450. .app.choice-set-prompt .window-content select {
  17451. display: flex;
  17452. margin: 4px auto;
  17453. }
  17454. .app.choice-set-prompt .window-content .choices {
  17455. max-width: max-content;
  17456. justify-items: center;
  17457. margin: auto;
  17458. }
  17459. .app.choice-set-prompt .window-content .choices.select-menu {
  17460. min-width: 18em;
  17461. }
  17462. .app.choice-set-prompt .window-content .choices.select-menu tags {
  17463. background-color: rgba(0, 0, 0, 0.05);
  17464. border: 1px solid var(--color-border-light-tertiary);
  17465. border-radius: 3px;
  17466. height: 2rem;
  17467. width: 100%;
  17468. }
  17469. .app.choice-set-prompt .window-content .choices.select-menu tags .tagify__input {
  17470. align-items: center;
  17471. display: flex;
  17472. height: 100%;
  17473. margin: 0;
  17474. }
  17475. .app.choice-set-prompt .window-content .choices button,
  17476. .app.choice-set-prompt .window-content .choices .drop-zone {
  17477. cursor: pointer;
  17478. max-width: 100%;
  17479. }
  17480. .app.choice-set-prompt .window-content .choices button:not(.with-image),
  17481. .app.choice-set-prompt .window-content .choices .drop-zone:not(.with-image) {
  17482. min-width: 120px;
  17483. justify-content: center;
  17484. }
  17485. .app.choice-set-prompt .window-content .choices button.with-image,
  17486. .app.choice-set-prompt .window-content .choices .drop-zone.with-image {
  17487. align-items: center;
  17488. }
  17489. .app.choice-set-prompt .window-content .choices button.with-image img,
  17490. .app.choice-set-prompt .window-content .choices .drop-zone.with-image img {
  17491. border: 1px solid #444;
  17492. height: 1.6em;
  17493. margin-right: 0.5em;
  17494. }
  17495. .app.choice-set-prompt .window-content .choices .choice-buttons {
  17496. align-items: center;
  17497. display: flex;
  17498. flex-direction: column;
  17499. }
  17500. .app.choice-set-prompt .window-content .choices .choice-buttons .choice {
  17501. align-items: center;
  17502. display: flex;
  17503. gap: 0.5em;
  17504. width: 100%;
  17505. }
  17506. .app.choice-set-prompt .window-content .choices .choice-buttons .choice.select {
  17507. margin-bottom: 0.5rem;
  17508. }
  17509. .app.choice-set-prompt .window-content .choices .choice-buttons .choice a.item-info {
  17510. align-items: center;
  17511. border-radius: 2px;
  17512. border: 1px solid var(--color-text-light-primary);
  17513. display: flex;
  17514. height: var(--font-size-20);
  17515. justify-content: center;
  17516. min-width: var(--font-size-20);
  17517. }
  17518. .app.choice-set-prompt .window-content .choices .choice-buttons .choice a.item-info.disabled {
  17519. color: var(--color-disabled);
  17520. cursor: default;
  17521. }
  17522. .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 {
  17523. text-shadow: none;
  17524. }
  17525. .app.choice-set-prompt .window-content .choices .drop-zone {
  17526. border: 1px solid var(--color-border-light-primary);
  17527. border-radius: 3px;
  17528. color: #222;
  17529. cursor: default;
  17530. display: flex;
  17531. padding: 1px 6px;
  17532. font-family: var(--font-primary);
  17533. font-size: var(--font-size-14);
  17534. line-height: 28px;
  17535. }
  17536. .app.choice-set-prompt .window-content .choices .drop-zone i {
  17537. border: 1px solid #bbb;
  17538. border-radius: 2px;
  17539. align-items: center;
  17540. display: flex;
  17541. height: 1.6em;
  17542. justify-content: center;
  17543. margin-right: 0.5em;
  17544. width: 1.6em;
  17545. }
  17546. .app.choice-set-prompt .window-content .choices .drop-zone i:after {
  17547. font-size: var(--font-size-20);
  17548. }
  17549. .app.choice-set-prompt .window-content .choices .drop-zone span {
  17550. color: var(--text-dark);
  17551. flex: 1;
  17552. }
  17553. .compendium-migration-status .content {
  17554. min-width: 15rem;
  17555. }
  17556. .compendium-migration-status table * {
  17557. user-select: text;
  17558. }
  17559. .compendium-migration-status table * th, .compendium-migration-status table * td {
  17560. padding: 0.25em 0.5em;
  17561. white-space: nowrap;
  17562. }
  17563. .compendium-migration-status table * th {
  17564. padding-left: 1em;
  17565. text-align: end;
  17566. }
  17567. .compendium-migration-status table * td {
  17568. width: 100%;
  17569. }
  17570. .compendium-migration-status .empty {
  17571. opacity: 0.8;
  17572. }
  17573. .compendium-migration-status .updated {
  17574. border: 1px dashed var(--alt);
  17575. line-height: 28px;
  17576. text-align: center;
  17577. }
  17578. .compendium-migration-status .migrate {
  17579. display: flex;
  17580. padding: 0.125rem;
  17581. }
  17582. .compendium-migration-status .migrate > * {
  17583. flex: 1;
  17584. }
  17585. #effects-panel {
  17586. pointer-events: initial;
  17587. position: absolute;
  17588. top: 5px;
  17589. right: 0;
  17590. }
  17591. #effects-panel .effect-item {
  17592. display: flex;
  17593. justify-content: end;
  17594. height: 52px;
  17595. }
  17596. #effects-panel .effect-item[data-badge-type=formula] .icon {
  17597. cursor: pointer;
  17598. }
  17599. #effects-panel .effect-item[data-badge-type=formula] .icon:hover::before {
  17600. content: "\f6cf";
  17601. background: rgba(0, 0, 0, 0.5);
  17602. font-family: "Font Awesome 5 Free";
  17603. font-weight: 900;
  17604. font-size: var(--font-size-26);
  17605. color: var(--text-light);
  17606. position: absolute;
  17607. width: 100%;
  17608. height: 100%;
  17609. display: flex;
  17610. align-items: center;
  17611. justify-content: center;
  17612. padding-bottom: 4px;
  17613. }
  17614. #effects-panel .effect-item:hover .effect-info {
  17615. display: flex;
  17616. align-items: end;
  17617. flex-direction: column;
  17618. }
  17619. #effects-panel .effect-item .effect-info {
  17620. background-color: rgba(0, 0, 0, 0.75);
  17621. color: var(--color-text-light-2);
  17622. display: none;
  17623. gap: 3px;
  17624. height: min-content;
  17625. margin-right: 0.5em;
  17626. max-width: 350px;
  17627. padding: 0.25em 0.5rem;
  17628. }
  17629. #effects-panel .effect-item .effect-info h1 {
  17630. margin: 0;
  17631. padding: 0;
  17632. border: none;
  17633. display: flex;
  17634. font-size: var(--font-size-14);
  17635. padding-top: 0.25em;
  17636. text-align: right;
  17637. }
  17638. #effects-panel .effect-item .effect-info h1 a[data-action=send-to-chat] i {
  17639. font-size: var(--font-size-13);
  17640. margin-left: 2px;
  17641. }
  17642. #effects-panel .effect-item .effect-info > a.inline-check {
  17643. font-size: var(--font-size-13);
  17644. font-weight: normal;
  17645. line-height: normal;
  17646. vertical-align: middle;
  17647. }
  17648. #effects-panel .effect-item .effect-info .tags {
  17649. justify-content: end;
  17650. }
  17651. #effects-panel .effect-item .effect-info .tags .tag {
  17652. margin-bottom: 0;
  17653. }
  17654. #effects-panel .effect-item .effect-info .tags .tag + .tag, #effects-panel .effect-item .effect-info .tags .tag:first-child {
  17655. margin-left: 3px;
  17656. margin-right: -2px;
  17657. }
  17658. #effects-panel .effect-item .effect-info .instructions,
  17659. #effects-panel .effect-item .effect-info .description {
  17660. font-size: var(--font-size-12);
  17661. }
  17662. #effects-panel .effect-item .effect-info .instructions {
  17663. display: flex;
  17664. flex-direction: column;
  17665. gap: 2px;
  17666. text-align: right;
  17667. }
  17668. #effects-panel .effect-item .effect-info .description {
  17669. background: rgba(0, 0, 0, 0.7);
  17670. max-height: 16em;
  17671. overflow-y: auto;
  17672. padding: 0 0.5em;
  17673. text-align: left;
  17674. }
  17675. #effects-panel .effect-item .effect-info .description a,
  17676. #effects-panel .effect-item .effect-info .description span[data-pf2-effect-area] {
  17677. color: var(--color-text-dark-primary);
  17678. }
  17679. #effects-panel .effect-item > .icon {
  17680. border: 1px solid rgba(0, 0, 0, 0.5);
  17681. box-shadow: 0 0 0 1px #c0c0c0, 0 0 0 2px #808080;
  17682. align-items: center;
  17683. background-repeat: no-repeat;
  17684. background-size: contain;
  17685. box-shadow: 0 0 0 1px #c0c0c0, 0 0 0 2px #808080, inset 0 0 4px rgba(0, 0, 0, 0.5);
  17686. color: transparent;
  17687. display: flex;
  17688. justify-content: center;
  17689. position: relative;
  17690. margin: 2px 0;
  17691. height: 48px;
  17692. width: 48px;
  17693. }
  17694. #effects-panel .effect-item > .icon.aura {
  17695. border-radius: 50%;
  17696. box-shadow: 0px 0px 10px 5px white;
  17697. }
  17698. #effects-panel .effect-item > .icon.unidentified {
  17699. filter: drop-shadow(0 0 8px var(--visibility-gm-bg));
  17700. }
  17701. #effects-panel .effect-item > .icon .expired {
  17702. position: absolute;
  17703. left: 0;
  17704. bottom: -1px;
  17705. width: 100%;
  17706. padding: 2px 1px;
  17707. font-family: var(--sans-serif);
  17708. font-size: var(--font-size-10);
  17709. text-transform: uppercase;
  17710. letter-spacing: 0.05em;
  17711. text-rendering: optimizeLegibility;
  17712. color: var(--text-light);
  17713. background-color: var(--primary);
  17714. }
  17715. #effects-panel .effect-item > .icon .linked {
  17716. position: absolute;
  17717. display: inline-block;
  17718. bottom: -1px;
  17719. right: -1px;
  17720. padding: 0px 2px;
  17721. color: var(--text-light);
  17722. background-color: rgba(0, 0, 0, 0.75);
  17723. }
  17724. #effects-panel .effect-item > .icon .value-wrapper {
  17725. position: absolute;
  17726. bottom: -1px;
  17727. left: -1px;
  17728. max-width: calc(100% + 2px);
  17729. padding: 0px 2px;
  17730. color: var(--text-light);
  17731. background-color: rgba(0, 0, 0, 0.75);
  17732. font-size: var(--font-size-13);
  17733. letter-spacing: -0.05em;
  17734. white-space: nowrap;
  17735. overflow: hidden;
  17736. }
  17737. #effects-panel .effect-item > .icon .value-wrapper .value {
  17738. overflow: hidden;
  17739. text-overflow: ellipsis;
  17740. }
  17741. #effects-panel .effect-item > .icon .value-wrapper .value strong {
  17742. display: inline-block;
  17743. padding-right: 1px;
  17744. }
  17745. #effects-panel > hr {
  17746. margin-right: 0;
  17747. width: 48px;
  17748. }
  17749. .journal-entry-page .journal-page-content {
  17750. --space-s: 0.25em;
  17751. --space-m: 0.5em;
  17752. --space-l: 1em;
  17753. --space-xl: 1.5em;
  17754. --space-2xl: 2em;
  17755. --radius: 3px;
  17756. }
  17757. .journal-entry-page .journal-page-content p {
  17758. min-height: unset;
  17759. }
  17760. .journal-entry-page .journal-page-content :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  17761. margin-top: 1em;
  17762. }
  17763. .journal-entry-page .journal-page-content .inline-header {
  17764. display: flex;
  17765. align-items: center;
  17766. gap: var(--space-l);
  17767. background-color: var(--alt);
  17768. font-family: var(--sans-serif);
  17769. color: var(--text-light);
  17770. padding: 0;
  17771. font-size: 0.8em;
  17772. font-weight: 400;
  17773. border: none;
  17774. }
  17775. .journal-entry-page .journal-page-content .inline-header strong {
  17776. display: inline-flex;
  17777. padding: 0 var(--space-m);
  17778. background-color: var(--primary);
  17779. min-width: 15ch;
  17780. border-right: 1px solid rgba(0, 0, 0, 0.4);
  17781. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  17782. font-weight: 400;
  17783. }
  17784. .journal-entry-page .journal-page-content .inline-header + p {
  17785. margin-top: var(--space-s);
  17786. }
  17787. .journal-entry-page .journal-page-content .info {
  17788. background-color: var(--secondary);
  17789. padding: var(--space-m);
  17790. color: var(--text-light);
  17791. margin-left: auto;
  17792. margin-right: auto;
  17793. padding: 0;
  17794. border-radius: var(--radius);
  17795. font-family: var(--sans-serif);
  17796. padding-bottom: var(--space-m);
  17797. }
  17798. .journal-entry-page .journal-page-content .info > * + * {
  17799. margin-top: var(--space-m);
  17800. }
  17801. .journal-entry-page .journal-page-content .info + * {
  17802. margin-top: var(--space-xl);
  17803. }
  17804. .journal-entry-page .journal-page-content .info + .journal-entry-page .journal-page-content .info {
  17805. margin-top: var(--space-s);
  17806. }
  17807. .journal-entry-page .journal-page-content .info h4 {
  17808. font-size: 0.9em;
  17809. font-weight: 400;
  17810. line-height: 1.2;
  17811. font-family: var(--sans-serif);
  17812. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  17813. padding: var(--space-m) var(--space-l);
  17814. position: relative;
  17815. display: flex;
  17816. align-items: center;
  17817. justify-content: space-between;
  17818. color: var(--text-light);
  17819. }
  17820. .journal-entry-page .journal-page-content .info h4::after {
  17821. font-family: "Font Awesome 6";
  17822. content: "\f05a";
  17823. font-weight: 900;
  17824. margin-right: var(--space-s);
  17825. }
  17826. .journal-entry-page .journal-page-content .info p {
  17827. font-size: 0.8em;
  17828. margin: 0;
  17829. padding: 0 var(--space-l);
  17830. }
  17831. .journal-entry-page .journal-page-content .info p:first-of-type {
  17832. padding-top: var(--space-m);
  17833. border-top: 1px solid rgba(255, 255, 255, 0.1);
  17834. }
  17835. .journal-entry-page .journal-page-content .traits {
  17836. display: flex;
  17837. flex-wrap: wrap;
  17838. padding: 0;
  17839. }
  17840. .journal-entry-page .journal-page-content .traits p {
  17841. display: inline-flex;
  17842. padding: 0.16rem 0.25rem;
  17843. margin: 0;
  17844. background-color: var(--primary);
  17845. border: 2px solid var(--color-border-trait);
  17846. color: var(--text-light);
  17847. font: 500 var(--font-size-10) var(--sans-serif);
  17848. text-transform: uppercase;
  17849. }
  17850. .journal-entry-page .journal-page-content .statblock {
  17851. font-family: var(--sans-serif-condensed);
  17852. color: var(--text-dark);
  17853. line-height: 1.2;
  17854. margin-bottom: var(--space-m);
  17855. }
  17856. .journal-entry-page .journal-page-content .statblock > * + * {
  17857. margin-top: var(--space-s);
  17858. margin-bottom: 0;
  17859. }
  17860. .journal-entry-page .journal-page-content .statblock p {
  17861. --indent: var(--space-l);
  17862. margin-left: var(--indent);
  17863. position: relative;
  17864. }
  17865. .journal-entry-page .journal-page-content .statblock p strong:first-of-type {
  17866. margin-left: calc(var(--indent) * -1);
  17867. }
  17868. .journal-entry-page .journal-page-content .statblock p .trait:first-of-type {
  17869. margin-left: calc(var(--indent) * -1 - 2px);
  17870. }
  17871. .journal-entry-page .journal-page-content .statblock span.pf2-icon {
  17872. line-height: 1;
  17873. }
  17874. .journal-entry-page .journal-page-content .statblock h1,
  17875. .journal-entry-page .journal-page-content .statblock h2,
  17876. .journal-entry-page .journal-page-content .statblock h3,
  17877. .journal-entry-page .journal-page-content .statblock h4 {
  17878. display: flex;
  17879. align-items: baseline;
  17880. justify-content: space-between;
  17881. border-bottom: 1px solid var(--color-border-dark);
  17882. text-transform: uppercase;
  17883. letter-spacing: -0.05em;
  17884. font-family: var(--sans-serif-condensed);
  17885. font-weight: 700;
  17886. }
  17887. .journal-entry-page .journal-page-content .statblock hr {
  17888. border: none;
  17889. border-bottom: 1px solid var(--color-border-dark);
  17890. }
  17891. .journal-entry-page .journal-page-content .message {
  17892. font-family: var(--journal-cursive);
  17893. font-size: 2em;
  17894. line-height: 1.2;
  17895. }
  17896. .journal-entry-page .journal-page-content .fumble-deck h1 {
  17897. font-family: var(--font-primary);
  17898. font-size: 1.75em;
  17899. font-weight: bold;
  17900. line-height: normal;
  17901. text-transform: uppercase;
  17902. color: var(--text-dark);
  17903. border: 2px solid;
  17904. border-radius: 15px;
  17905. padding: 0 0 0 1.5em;
  17906. background-size: 1.22em;
  17907. background-repeat: no-repeat;
  17908. background-color: #e5bf85;
  17909. position: relative;
  17910. top: 1em;
  17911. width: 80%;
  17912. }
  17913. .journal-entry-page .journal-page-content .fumble-deck h1:first-child {
  17914. background-image: url("../icons/equipment/weapons/gnome-hooked-hammer.webp");
  17915. }
  17916. .journal-entry-page .journal-page-content .fumble-deck h1:nth-of-type(2) {
  17917. background-image: url("../icons/equipment/weapons/longbow.webp");
  17918. }
  17919. .journal-entry-page .journal-page-content .fumble-deck h1:nth-of-type(3) {
  17920. background-image: url("../icons/equipment/weapons/fist.webp");
  17921. }
  17922. .journal-entry-page .journal-page-content .fumble-deck h1:nth-of-type(4) {
  17923. background-image: url("../icons/spells/chain-lightning.webp");
  17924. }
  17925. .journal-entry-page .journal-page-content .fumble-deck blockquote {
  17926. font-family: var(--font-primary);
  17927. border-left: none;
  17928. background-color: #000059;
  17929. color: var(--text-light);
  17930. font-size: 120%;
  17931. margin-left: 0.7em;
  17932. padding: 1.2em 1.25em 0.75em;
  17933. border-radius: 8px;
  17934. }
  17935. .journal-entry-page .journal-page-content .fumble-deck blockquote a {
  17936. color: var(--text-dark);
  17937. }
  17938. .journal-entry-page .journal-page-content .fumble-deck blockquote span.with-repost {
  17939. color: var(--text-dark);
  17940. }
  17941. .journal-entry-page .journal-page-content .fumble-deck code {
  17942. font-family: var(--font-primary);
  17943. font-weight: bold;
  17944. font-size: 100%;
  17945. line-height: normal;
  17946. background-image: url("../assets/critfumble-banner.webp");
  17947. background-size: 100% 100%;
  17948. box-shadow: 5px 5px 10px 3px #282a2d;
  17949. display: inline-block;
  17950. float: right;
  17951. text-align: center;
  17952. margin-top: -1.75em;
  17953. margin-right: 0.75em;
  17954. width: 7em;
  17955. padding: 0.5em;
  17956. }
  17957. .journal-entry-page .journal-page-content .critical-deck h1 {
  17958. font-family: var(--font-primary);
  17959. font-size: 1.75em;
  17960. font-weight: bold;
  17961. line-height: normal;
  17962. text-transform: uppercase;
  17963. color: var(--text-dark);
  17964. border: 2px solid;
  17965. border-radius: 15px;
  17966. padding: 0 0 0 1.5em;
  17967. background-size: 1.22em;
  17968. background-repeat: no-repeat;
  17969. background-color: #e5bf85;
  17970. position: relative;
  17971. top: 1em;
  17972. width: 80%;
  17973. }
  17974. .journal-entry-page .journal-page-content .critical-deck h1:first-child {
  17975. background-image: url("../icons/equipment/weapons/light-hammer.webp");
  17976. }
  17977. .journal-entry-page .journal-page-content .critical-deck h1:nth-of-type(2) {
  17978. background-image: url("../../../icons/weapons/polearms/javelin.webp");
  17979. }
  17980. .journal-entry-page .journal-page-content .critical-deck h1:nth-of-type(3) {
  17981. background-image: url("../../../icons/weapons/axes/axe-battle-worn.webp");
  17982. }
  17983. .journal-entry-page .journal-page-content .critical-deck h1:nth-of-type(4) {
  17984. background-image: url("../../../icons/weapons/thrown/bomb-fuse-cloth-pink.webp");
  17985. }
  17986. .journal-entry-page .journal-page-content .critical-deck blockquote {
  17987. font-family: var(--font-primary);
  17988. border-left: none;
  17989. background: rgb(14, 40, 17);
  17990. background: radial-gradient(circle, rgb(14, 40, 17) 10%, rgb(20, 59, 25) 50%, rgb(14, 40, 17) 90%);
  17991. color: var(--text-light);
  17992. font-size: 120%;
  17993. margin-left: 0.7em;
  17994. padding: 1.2em 1.25em 0.75em;
  17995. border-radius: 8px;
  17996. }
  17997. .journal-entry-page .journal-page-content .critical-deck blockquote a {
  17998. color: var(--text-dark);
  17999. }
  18000. .journal-entry-page .journal-page-content .critical-deck blockquote span.with-repost {
  18001. color: var(--text-dark);
  18002. }
  18003. .journal-entry-page .journal-page-content .critical-deck code {
  18004. font-family: var(--font-primary);
  18005. font-weight: bold;
  18006. font-size: 100%;
  18007. line-height: normal;
  18008. background-image: url("../assets/critfumble-banner.webp");
  18009. background-size: 100% 100%;
  18010. box-shadow: 5px 5px 10px 3px #282a2d;
  18011. display: inline-block;
  18012. float: right;
  18013. text-align: center;
  18014. margin-top: -1.75em;
  18015. margin-right: 0.75em;
  18016. width: 9em;
  18017. padding: 0.5em;
  18018. }
  18019. #migration-summary > .window-content > h3 {
  18020. margin: auto;
  18021. }
  18022. #migration-summary > .window-content > .dialog-content > table i.fa-check {
  18023. color: green;
  18024. }
  18025. #migration-summary > .window-content > .dialog-content > table i.fa-times {
  18026. color: red;
  18027. }
  18028. #migration-summary > .window-content > .dialog-content > table td {
  18029. text-align: center;
  18030. }
  18031. #migration-summary > .window-content > .dialog-buttons {
  18032. display: flex;
  18033. }
  18034. #migration-summary > .window-content > .dialog-buttons:disabled::hover {
  18035. box-shadow: none;
  18036. }
  18037. #upw-viewer .window-content {
  18038. background: no-repeat right url("../assets/upw-logo.webp") black;
  18039. }
  18040. #upw-viewer .window-content .content {
  18041. color: #eee;
  18042. width: 435px;
  18043. font-size: larger;
  18044. }
  18045. #upw-viewer .window-content .content a[href] {
  18046. color: #8b6cae;
  18047. font-size: large;
  18048. display: block;
  18049. text-align: center;
  18050. }
  18051. #world-clock section.window-content {
  18052. font-size: 1rem;
  18053. }
  18054. #world-clock section.window-content h1 {
  18055. font-size: inherit;
  18056. text-align: center;
  18057. }
  18058. #world-clock section.window-content .input-grid {
  18059. align-items: center;
  18060. display: flex;
  18061. flex-wrap: wrap;
  18062. font-size: 0.8rem;
  18063. justify-content: space-evenly;
  18064. }
  18065. #world-clock section.window-content .input-grid > * {
  18066. flex-basis: 32%;
  18067. height: 1.5rem;
  18068. line-height: 20px;
  18069. }
  18070. #world-clock section.window-content .input-grid .sign {
  18071. font-family: var(--sans-serif-monospace);
  18072. font-size: inherit;
  18073. }
  18074. #world-clock section.window-content .input-grid button {
  18075. align-items: center;
  18076. display: flex;
  18077. font-size: inherit;
  18078. justify-content: center;
  18079. margin: 1px;
  18080. }
  18081. #world-clock section.window-content .input-grid button img {
  18082. border: none;
  18083. height: 1.5em;
  18084. }
  18085. #world-clock section.window-content .input-grid .time-of-day {
  18086. display: flex;
  18087. flex-basis: 100%;
  18088. margin: 0 3px;
  18089. }
  18090. #world-clock section.window-content .input-grid .time-of-day img.midnight {
  18091. height: 1.05rem;
  18092. }
  18093. .tags {
  18094. display: flex;
  18095. flex-wrap: wrap;
  18096. gap: 2px;
  18097. list-style-type: none;
  18098. margin-bottom: 2px;
  18099. padding-left: 0;
  18100. }
  18101. .tags .tag,
  18102. .tags .tag option {
  18103. font-family: var(--sans-serif);
  18104. font-size: var(--font-size-10);
  18105. text-transform: uppercase;
  18106. letter-spacing: 0.05em;
  18107. text-rendering: optimizeLegibility;
  18108. align-items: center;
  18109. background-color: var(--primary);
  18110. border-radius: 2px;
  18111. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  18112. color: var(--color-text-trait);
  18113. display: flex;
  18114. font-weight: 500;
  18115. height: var(--font-size-18);
  18116. padding: 0 0.33em;
  18117. }
  18118. .tags .tag.tag_secondary,
  18119. .tags .tag option.tag_secondary {
  18120. background-color: var(--secondary);
  18121. }
  18122. .tags .tag.tag_tertiary,
  18123. .tags .tag option.tag_tertiary {
  18124. background-color: var(--tertiary);
  18125. }
  18126. .tags .tag.tag_alt,
  18127. .tags .tag option.tag_alt {
  18128. background-color: var(--alt);
  18129. }
  18130. .tags .tag.tag_material,
  18131. .tags .tag option.tag_material {
  18132. background-color: var(--alt-dark);
  18133. }
  18134. .tags .tag.tag_transparent,
  18135. .tags .tag option.tag_transparent {
  18136. background-color: transparent;
  18137. border-radius: 4px;
  18138. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3);
  18139. color: var(--color-text-dark-secondary);
  18140. font-family: var(--font-primary);
  18141. font-size: var(--font-size-10);
  18142. height: unset;
  18143. text-transform: none;
  18144. }
  18145. .tags .tag.mystified,
  18146. .tags .tag option.mystified {
  18147. opacity: 0.7;
  18148. }
  18149. li.chat-message .tags .tag_transparent {
  18150. line-height: 1.25em;
  18151. padding: 0.1em 0.25em;
  18152. }
  18153. .tags.paizo-style {
  18154. align-items: center;
  18155. border: none;
  18156. border-radius: 3px;
  18157. padding: 0.05em;
  18158. gap: 0;
  18159. }
  18160. .tags.paizo-style tag,
  18161. .tags.paizo-style .tag,
  18162. .tags.paizo-style select.tag {
  18163. background-color: var(--color-bg-trait);
  18164. border: solid var(--color-border-trait);
  18165. box-shadow: none;
  18166. margin: 0;
  18167. }
  18168. .tags.paizo-style tag x,
  18169. .tags.paizo-style .tag x,
  18170. .tags.paizo-style select.tag x {
  18171. align-items: start;
  18172. margin: 0;
  18173. }
  18174. .tags.paizo-style tag__removeBtn,
  18175. .tags.paizo-style .tag__removeBtn,
  18176. .tags.paizo-style select.tag__removeBtn {
  18177. align-items: baseline;
  18178. }
  18179. .tags.paizo-style tag,
  18180. .tags.paizo-style select.tag {
  18181. border-width: 2px 3px 2px 2px;
  18182. height: var(--font-size-22);
  18183. }
  18184. .tags.paizo-style tag:first-child,
  18185. .tags.paizo-style select.tag:first-child {
  18186. border-left-width: 5px;
  18187. }
  18188. .tags.paizo-style tag:last-child,
  18189. .tags.paizo-style select.tag:last-child {
  18190. border-right-width: 5px;
  18191. }
  18192. .tags.paizo-style tag:last-of-type {
  18193. border-right-width: 5px;
  18194. }
  18195. .tags.paizo-style .tag {
  18196. border-width: 1px 2px 1px 1px;
  18197. height: var(--font-size-19);
  18198. }
  18199. .tags.paizo-style .tag:first-child {
  18200. border-left-width: 3px;
  18201. }
  18202. .tags.paizo-style .tag:last-child {
  18203. border-right-width: 3px;
  18204. }
  18205. .tags.paizo-style .tag.rarity.common, .tags.paizo-style .tag.rarity[value=common],
  18206. .tags.paizo-style .tag.rarity > option[value=common] {
  18207. background-color: var(--color-rarity-common);
  18208. }
  18209. .tags.paizo-style .tag.rarity.uncommon, .tags.paizo-style .tag.rarity[value=uncommon],
  18210. .tags.paizo-style .tag.rarity > option[value=uncommon] {
  18211. background-color: var(--color-rarity-uncommon);
  18212. }
  18213. .tags.paizo-style .tag.rarity.rare, .tags.paizo-style .tag.rarity[value=rare],
  18214. .tags.paizo-style .tag.rarity > option[value=rare] {
  18215. background-color: var(--color-rarity-rare);
  18216. }
  18217. .tags.paizo-style .tag.rarity.unique, .tags.paizo-style .tag.rarity[value=unique],
  18218. .tags.paizo-style .tag.rarity > option[value=unique] {
  18219. background-color: var(--color-rarity-unique);
  18220. }
  18221. .tags.paizo-style .tag.alignment {
  18222. background-color: var(--color-bg-alignment);
  18223. }
  18224. .tags.paizo-style .tag.size {
  18225. background-color: var(--color-bg-size);
  18226. }
  18227. .tags.paizo-style tag > div {
  18228. padding: 0 0.09rem 0 0.25rem;
  18229. }
  18230. .tags.paizo-style tag > div,
  18231. .tags.paizo-style .tag,
  18232. .tags.paizo-style select {
  18233. border-radius: 0;
  18234. display: flex;
  18235. font: 500 var(--font-size-10) var(--sans-serif);
  18236. }
  18237. .tags.paizo-style tag > div .tagify__tag-text,
  18238. .tags.paizo-style .tag .tagify__tag-text,
  18239. .tags.paizo-style select .tagify__tag-text {
  18240. text-transform: uppercase;
  18241. }
  18242. .tags.paizo-style hr.vr {
  18243. height: 1.25em;
  18244. margin: 1px 2px;
  18245. }
  18246. .tags.paizo-style[disabled] {
  18247. filter: none;
  18248. }
  18249. .tags.paizo-style[disabled] tag > div::before {
  18250. animation: none !important;
  18251. }
  18252. .tags.paizo-style[disabled] > .tagify__input {
  18253. display: none;
  18254. }
  18255. tags.tags.paizo-style {
  18256. background-color: rgba(0, 0, 0, 0.075);
  18257. --tag-bg: var(--color-bg-trait);
  18258. --tag-hover: var(--color-bg-trait);
  18259. --tag-remove-btn-color: var(--color-text-trait);
  18260. --tag-text-color: var(--color-text-trait);
  18261. --tags-border-color: var(--color-border-trait);
  18262. --tags-focus-border-color: var(--color-border-trait);
  18263. --tags-hover-border-color: var(--color-border-trait);
  18264. --readonly-striped: 0;
  18265. }
  18266. tags.tags.paizo-style .tagify__input {
  18267. margin: 0;
  18268. padding: 0.1em 0.5em;
  18269. }
  18270. tags.tags.paizo-style .tagify__input::before {
  18271. align-items: center;
  18272. color: var(--color-text-dark-secondary);
  18273. display: flex;
  18274. font: 500 var(--font-size-10) var(--sans-serif);
  18275. letter-spacing: 0.05em;
  18276. margin: 0;
  18277. min-height: 22px;
  18278. text-rendering: optimizeLegibility;
  18279. text-transform: uppercase;
  18280. width: fit-content;
  18281. }
  18282. tags.tags.paizo-style .conjunction-not .tagify__tag-text {
  18283. text-decoration: line-through;
  18284. text-decoration-color: var(--color-text-trait);
  18285. }
  18286. tags.tags.paizo-style tag[readonly=true] {
  18287. padding-right: 2px;
  18288. }
  18289. tags.tagify.pf2e-tagify {
  18290. --tag-bg: var(--color-text-light-3);
  18291. --tags-border-color: var(--color-text-light-5);
  18292. --tags-hover-border-color: var(--color-text-light-5);
  18293. align-items: center;
  18294. background-color: rgba(255, 255, 255, 0.5);
  18295. border-radius: 3px;
  18296. gap: 3px;
  18297. padding: 2px;
  18298. }
  18299. tags.tagify.pf2e-tagify:hover {
  18300. box-shadow: 0 0 10px #00005a;
  18301. }
  18302. tags.tagify.pf2e-tagify tag {
  18303. margin: 0;
  18304. padding: 1px;
  18305. }
  18306. tags.tagify.pf2e-tagify tag x {
  18307. margin: 0;
  18308. }
  18309. tags.tagify.pf2e-tagify tag > div {
  18310. padding: 2px;
  18311. }
  18312. tags.tagify.pf2e-tagify tag > div .tagify__tag-text {
  18313. font-weight: normal;
  18314. }
  18315. tags.tagify.pf2e-tagify tag .tagify__tag__removeBtn {
  18316. align-items: baseline;
  18317. }
  18318. tags.tagify.pf2e-tagify .tagify__input {
  18319. margin: 0;
  18320. }
  18321. tags.pf2e-tagify.tagify--hasMaxTags > span,
  18322. tags.tags.paizo-style.tagify--hasMaxTags > span {
  18323. display: none;
  18324. }
  18325. tags.pf2e-tagify:not(.tagify--select) > span,
  18326. tags.tags.paizo-style:not(.tagify--select) > span {
  18327. min-width: 20px;
  18328. }
  18329. .damage-tag {
  18330. white-space: nowrap;
  18331. margin: 0 1px 1px 0;
  18332. padding: 0 3px;
  18333. font-size: var(--font-size-10);
  18334. line-height: 16px;
  18335. border: 1px solid #999;
  18336. border-radius: 3px;
  18337. }
  18338. .damage-tag-base {
  18339. color: var(--text-light);
  18340. background: rgba(0, 0, 0, 0.45);
  18341. }
  18342. .damage-tag-modifier {
  18343. background: rgba(0, 0, 0, 0.05);
  18344. }
  18345. .tagify {
  18346. --tag-inset-shadow-size: 10em;
  18347. }
  18348. .tagify__tag__removeBtn {
  18349. overflow: visible;
  18350. }
  18351. #generate-check-prompt {
  18352. height: auto !important;
  18353. }
  18354. #generate-check-prompt .dialog-content > nav a.active {
  18355. text-decoration: underline;
  18356. }
  18357. #generate-check-prompt .dialog-content section.check-prompt-content .form-group.secret {
  18358. justify-content: end;
  18359. text-align: right;
  18360. }
  18361. #generate-check-prompt .dialog-content section.check-prompt-content .roll-options {
  18362. display: none;
  18363. }
  18364. #generate-check-prompt .dialog-content section.check-prompt-content a.add-roll-options i.fa-plus {
  18365. display: inline;
  18366. }
  18367. #generate-check-prompt .dialog-content section.check-prompt-content a.add-roll-options i.fa-minus {
  18368. display: none;
  18369. }
  18370. #generate-check-prompt .dialog-content section.check-prompt-content input#check-prompt-secret,
  18371. #generate-check-prompt .dialog-content section.check-prompt-content input#check-prompt-basic-save {
  18372. margin-right: 0;
  18373. }
  18374. #generate-check-prompt .dialog-content section.check-prompt-content.show-roll-options .roll-options {
  18375. display: block;
  18376. }
  18377. #generate-check-prompt .dialog-content section.check-prompt-content.show-roll-options a.add-roll-options i.fa-plus {
  18378. display: none;
  18379. }
  18380. #generate-check-prompt .dialog-content section.check-prompt-content.show-roll-options a.add-roll-options i.fa-minus {
  18381. display: inline;
  18382. }
  18383. #generate-check-prompt .dialog-content select {
  18384. height: var(--form-field-height);
  18385. text-transform: capitalize;
  18386. }
  18387. #generate-check-prompt .dialog-content tags.tagify {
  18388. background-color: rgba(0, 0, 0, 0.075);
  18389. border: 1px solid var(--color-border-light-tertiary);
  18390. border-radius: 3px;
  18391. }
  18392. #generate-check-prompt .dialog-buttons {
  18393. flex: 0 1 auto;
  18394. }
  18395. .travel-duration h2 {
  18396. margin-top: 10px;
  18397. margin-bottom: 30px;
  18398. }
  18399. .travel-duration table td {
  18400. padding: 5px 10px;
  18401. }
  18402. .travel-duration table td.centered {
  18403. text-align: center;
  18404. }
  18405. .travel-duration .journey-input {
  18406. display: grid;
  18407. column-gap: 5px;
  18408. grid: "size type"/50px 1fr 1fr;
  18409. }
  18410. .travel-duration .fraction-input {
  18411. text-align: center;
  18412. }
  18413. .travel-duration .fraction-input input {
  18414. width: 30px;
  18415. }
  18416. .travel-duration .speed-input {
  18417. width: 30px;
  18418. }