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.

15740 lines
511 KiB

1 year ago
  1. @charset "UTF-8";.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}
  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. }
  526. :root {
  527. /** Font-size variables not defined by Foundry */
  528. --font-size-5: 0.3125rem;
  529. --font-size-8: 0.5rem;
  530. --font-size-9: 0.5625rem;
  531. --font-size-10: 0.625rem;
  532. --font-size-15: 0.9375rem;
  533. --font-size-17: 1.0625rem;
  534. --font-size-19: 1.1875rem;
  535. --font-size-21: 1.3125rem;
  536. --font-size-22: 1.375rem;
  537. --font-size-26: 1.625rem;
  538. --font-size-30: 1.875rem;
  539. --font-size-34: 2.125rem;
  540. --font-size-36: 2.25rem;
  541. --font-size-42: 2.625rem;
  542. /** Font families */
  543. --body-serif: Gelasio, Georgia, serif;
  544. --sans-serif: Roboto, sans-serif;
  545. --sans-serif-condensed: "Roboto Condensed", var(--sans-serif);
  546. --sans-serif-monospace: "Roboto Mono", monospace;
  547. --serif: Eczar, Georgia, serif;
  548. --serif-condensed: "Modesto Condensed", serif;
  549. --journal-cursive: "La Belle Aurore", cursive;
  550. --journal-serif: "Vollkorn", var(--serif);
  551. }
  552. /* ----------------------------------------- */
  553. /* Color definitions */
  554. /* ----------------------------------------- */
  555. /* Colors */
  556. /* Global */
  557. /* used for mini headers, alternate primary color */
  558. /* compliments the primary color, usually used in combination */
  559. /* for all other uses */
  560. /* Lighter / Darker */
  561. /* Text */
  562. /* Damage */
  563. /* ----------------------------------------- */
  564. /* Color schemes */
  565. /* ----------------------------------------- */
  566. /* Proficiency ranks */
  567. /* Rarities */
  568. /* Degrees of success */
  569. /* Value adjustments (e.g. weak/elite) */
  570. /* ----------------------------------------- */
  571. /* CSS Custom Properties */
  572. /* ----------------------------------------- */
  573. :root {
  574. /* Global */
  575. --primary: #5e0000;
  576. --secondary: #171f69;
  577. --tertiary: #E9D7A1;
  578. --alt: #786452;
  579. --alt-dark: #443730;
  580. --bg: #F8F4F1;
  581. --bg-dark: #e7d9cf;
  582. --sub: #605856;
  583. --color-disabled: #ababab;
  584. --inline-link-bg: #ddd;
  585. --inline-repost-bg: #eaeaea;
  586. --visibility-gm-bg: #e8e8ef;
  587. --visibility-owner-bg: #ddebe1;
  588. --blind-roll: #f5eaf5;
  589. /* Lighter / Darker */
  590. --light: #910000;
  591. --dark: #2b0000;
  592. --tertiary-dark: #dfc578;
  593. --tertiary-light: #f3e9ca;
  594. /* Text */
  595. --body: var(--text-dark);
  596. --color-text-trait: #f5efe0;
  597. --text-dark: #1C1C1C;
  598. --text-light: white;
  599. /* Borders */
  600. --color-border-trait: #d8c384;
  601. --color-border-divider: #baa991;
  602. /* Headers w/ boxes */
  603. --header-color: var(--text-light);
  604. --header-bg: var(--secondary);
  605. /* Sidebar */
  606. --sidebar-label: var(--tertiary-dark);
  607. --sidebar-title: var(--tertiary);
  608. }
  609. @keyframes fadein {
  610. from {
  611. opacity: 0;
  612. }
  613. to {
  614. opacity: 1;
  615. }
  616. }
  617. /**
  618. * Legacy is for the old css unrelated
  619. * to the current design (crb-style).
  620. * Only use the legacy folder if you need
  621. * to make changes to the old css.
  622. *
  623. * If you're adding a new feature, put it
  624. * in the appropriate folder in src/styles.
  625. * Just make sure to update the relevant
  626. * _index.scss so that it will get compiled.
  627. *
  628. */
  629. :root {
  630. --primary-background:#454a7c;
  631. --secondary-background:gray;
  632. --tertiary-background:#454a7c;
  633. --alternate-background:darkgray;
  634. }
  635. .tab[data-tab].active {
  636. display: initial;
  637. }
  638. /* ----------------------------------------- */
  639. /* Sheet Structure */
  640. /* ----------------------------------------- */
  641. .pf2e.actor .window-content {
  642. padding: 5px;
  643. font-size: var(--font-size-13);
  644. overflow-y: hidden;
  645. }
  646. .pf2e.actor .sheet-header {
  647. display: flex;
  648. flex-direction: row;
  649. flex-wrap: wrap;
  650. justify-content: flex-start;
  651. flex: 0 0 100%;
  652. height: 48px;
  653. }
  654. .pf2e.actor .sheet-header > * {
  655. flex: 1;
  656. }
  657. .pf2e.actor .sheet-header h1 {
  658. margin: 0;
  659. border: none;
  660. }
  661. .pf2e.actor .sheet-header h1 > input {
  662. font-family: var(--serif-condensed);
  663. font-weight: 700;
  664. height: 40px;
  665. width: 100%;
  666. margin: 2px;
  667. color: #444;
  668. font-size: var(--font-size-36);
  669. border: none;
  670. }
  671. .pf2e.actor .sheet-body {
  672. height: calc(100% - 35px);
  673. overflow: hidden;
  674. display: flex;
  675. flex-direction: column;
  676. flex-wrap: nowrap;
  677. }
  678. .pf2e.actor form {
  679. width: 100%;
  680. height: 100%;
  681. overflow: hidden;
  682. }
  683. .pf2e.actor form input[type=text], .pf2e.actor form input[type=number] {
  684. width: calc(100% - 2px);
  685. height: calc(100% - 2px);
  686. background: none;
  687. padding: 0;
  688. margin: 1px 0;
  689. color: #333;
  690. border: 1px solid transparent;
  691. }
  692. .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 {
  693. border: 1px solid black;
  694. box-shadow: 0 0 10px #00005a;
  695. }
  696. .pf2e.actor form select {
  697. font-size: var(--font-size-10);
  698. height: 18px;
  699. background: rgba(255, 255, 255, 0.5);
  700. }
  701. .pf2e.actor form label {
  702. display: block;
  703. }
  704. .pf2e.actor form .mce-panel span {
  705. display: inherit;
  706. }
  707. .pf2e.actor form.editable .rollable:hover {
  708. color: #000;
  709. text-shadow: 0 0 10px #00005a;
  710. cursor: pointer;
  711. }
  712. .pf2e.actor form .sheet-tabs {
  713. font-weight: 500;
  714. height: 30px;
  715. }
  716. .pf2e.actor form .sheet-tabs > .list-row {
  717. line-height: 24px;
  718. padding-top: 3px;
  719. font-size: var(--font-size-12);
  720. text-align: center;
  721. }
  722. .pf2e.actor form .sheet-tabs > .list-row:last-of-type {
  723. padding-right: 4px;
  724. }
  725. .pf2e.actor form .sheet-tabs > .list-row.active {
  726. color: #000;
  727. font-weight: 700;
  728. }
  729. .pf2e.actor form .tab {
  730. flex: 1;
  731. overflow: hidden;
  732. }
  733. .pf2e.actor form .tag-legacy {
  734. float: left;
  735. margin: 0 2px 2px 0;
  736. padding: 0 3px;
  737. font-size: var(--font-size-10);
  738. line-height: 16px;
  739. border: 1px solid #999;
  740. border-radius: 3px;
  741. white-space: normal;
  742. font-weight: 500;
  743. }
  744. /* ---------------------------------------- */
  745. /* Actor Sheet */
  746. /* ---------------------------------------- */
  747. .pf2e.actor {
  748. min-width: 650px;
  749. min-height: 450px;
  750. }
  751. .pf2e.actor .sidebar {
  752. float: left;
  753. width: 220px;
  754. }
  755. .pf2e.actor .content {
  756. float: right;
  757. width: calc(100% - 220px);
  758. }
  759. .pf2e.actor .floatright {
  760. float: right;
  761. }
  762. .pf2e.actor .sheet-upper {
  763. height: 268px;
  764. }
  765. .pf2e.actor .sheet-upper .sheet-header {
  766. height: 48px;
  767. }
  768. .pf2e.actor .sheet-upper .sheet-profile, .pf2e.actor .sheet-upper .sheet-showcase {
  769. height: 220px;
  770. }
  771. .pf2e.actor .sheet-navigation {
  772. height: 32px;
  773. /* width: 100%;
  774. */
  775. float: right;
  776. width: calc(100% - 220px);
  777. }
  778. .pf2e.actor .sheet-lower {
  779. width: 100%;
  780. height: calc(100% - 48px);
  781. }
  782. .pf2e.actor .sheet-lower .sheet-content {
  783. height: calc(100% - 32px);
  784. }
  785. .pf2e.actor .sheet-sidebar {
  786. height: calc(100% - 48px);
  787. display: flex;
  788. flex-direction: column;
  789. flex-wrap: nowrap;
  790. overflow-x: hidden;
  791. overflow-y: auto;
  792. }
  793. .pf2e.actor .sheet-sidebar > * {
  794. flex: 1;
  795. }
  796. .pf2e.actor .sheet-sidebar .sidebar-summary {
  797. overflow-y: hidden;
  798. }
  799. .pf2e.actor.npc-sheet .sheet-upper {
  800. height: 220px;
  801. }
  802. .pf2e.actor.npc-sheet .sheet-upper .sheet-showcase {
  803. height: 172px;
  804. }
  805. .pf2e.actor.npc-sheet .sheet-lower {
  806. height: calc(100% - 220px - 32px);
  807. }
  808. .pf2e.actor.npc-sheet section.sheet-body {
  809. height: calc(100% - 48px);
  810. }
  811. .pf2e.actor .sheet-navigation {
  812. border-top: 1px solid var(--secondary-background);
  813. border-bottom: 1px solid var(--primary-background);
  814. }
  815. .pf2e.actor .sheet-navigation .sheet-tabs > .list-row {
  816. border-radius: 5px 5px 0 0;
  817. }
  818. .pf2e.actor .sheet-navigation .sheet-tabs > .list-row.active {
  819. border: 1px solid #666;
  820. border-bottom: none;
  821. /* box-shadow: 0 0 10px inset #ff6400;
  822. */
  823. background: var(--primary-background);
  824. color: #fff;
  825. text-shadow: none;
  826. }
  827. .pf2e.actor .sheet-header {
  828. border-bottom: 1px solid var(--primary-background);
  829. }
  830. .pf2e.actor .sheet-header h1 {
  831. margin: 0;
  832. border: none;
  833. }
  834. .pf2e.actor .sheet-header h1.charname {
  835. flex-basis: 50%;
  836. }
  837. .pf2e.actor .sheet-header .editsheet {
  838. flex: 3;
  839. font-size: 0.625rem;
  840. text-align: center;
  841. margin-top: 3px;
  842. }
  843. .pf2e.actor .sheet-header .charlevel {
  844. flex: 0 0 150px;
  845. display: flex;
  846. align-items: center;
  847. text-align: right;
  848. }
  849. .pf2e.actor .sheet-header .charlevel > * {
  850. flex: 1;
  851. }
  852. .pf2e.actor .sheet-header .charlevel .level {
  853. font-family: var(--serif-condensed);
  854. font-weight: 700;
  855. align-items: center;
  856. color: #444;
  857. display: flex;
  858. justify-content: end;
  859. }
  860. .pf2e.actor .sheet-header .charlevel .level input {
  861. flex-basis: 1.5rem;
  862. margin-left: 0.1em;
  863. text-align: center;
  864. }
  865. .pf2e.actor .sheet-header .charlevel .xpbar {
  866. width: 100%;
  867. flex: 0 0 8px;
  868. background: #666;
  869. border: 1px solid #000;
  870. border-radius: 3px;
  871. }
  872. .pf2e.actor .sheet-header .charlevel .xpbar .bar {
  873. height: 4px;
  874. margin: 1px;
  875. display: block;
  876. background: #afebff;
  877. border: 1px solid #000;
  878. border-radius: 2px;
  879. }
  880. .pf2e.actor .sheet-header .charlevel .experience {
  881. flex: 0 0 16px;
  882. display: flex;
  883. flex-direction: row;
  884. flex-wrap: wrap;
  885. justify-content: flex-start;
  886. justify-content: flex-end;
  887. }
  888. .pf2e.actor .sheet-header .charlevel .experience > * {
  889. flex: 1;
  890. }
  891. .pf2e.actor .sheet-header .charlevel .experience > input[type=text], .pf2e.actor .sheet-header .charlevel .experience > input[type=number] {
  892. flex: 1;
  893. text-align: right;
  894. height: 16px;
  895. }
  896. .pf2e.actor .primary-attributes {
  897. height: 80px;
  898. width: 100%;
  899. display: flex;
  900. flex-direction: row;
  901. flex-wrap: wrap;
  902. justify-content: flex-start;
  903. border-bottom: 1px solid var(--secondary-background);
  904. }
  905. .pf2e.actor .primary-attributes > * {
  906. flex: 1;
  907. }
  908. .pf2e.actor .primary-attributes .attribute {
  909. flex: 0 0 25%;
  910. height: 79px;
  911. padding: 4px;
  912. border-right: 1px solid var(--secondary-background);
  913. }
  914. .pf2e.actor .primary-attributes .attribute:last-child {
  915. margin-right: 0;
  916. border-right: none;
  917. }
  918. .pf2e.actor .primary-attributes .attribute .attribute-name {
  919. font-family: var(--serif-condensed);
  920. font-weight: 700;
  921. position: relative;
  922. height: 22px;
  923. margin: 0 0 2px;
  924. line-height: 22px;
  925. font-size: var(--font-size-18);
  926. color: #444;
  927. text-align: center;
  928. border-bottom: 1px solid var(--secondary-background);
  929. }
  930. .pf2e.actor .primary-attributes .attribute .attribute-name .npc-roll-hp {
  931. position: absolute;
  932. right: 2px;
  933. }
  934. .pf2e.actor .primary-attributes .attribute .attribute-value {
  935. font-family: var(--serif-condensed);
  936. font-weight: 700;
  937. display: flex;
  938. flex-direction: row;
  939. flex-wrap: wrap;
  940. justify-content: flex-start;
  941. height: 32px;
  942. color: #444;
  943. font-size: var(--font-size-20);
  944. line-height: 32px;
  945. text-align: center;
  946. }
  947. .pf2e.actor .primary-attributes .attribute .attribute-value > * {
  948. flex: 1;
  949. }
  950. .pf2e.actor .primary-attributes .attribute .attribute-footer {
  951. height: 16px;
  952. text-align: center;
  953. }
  954. .pf2e.actor .primary-attributes .attribute .attribute-footer span {
  955. display: inline-block;
  956. }
  957. .pf2e.actor .primary-attributes .attribute .attribute-footer input {
  958. max-width: 24px;
  959. }
  960. .pf2e.actor .primary-attributes .attribute .attribute-footer input.temphp {
  961. max-width: 45%;
  962. }
  963. .pf2e.actor .primary-attributes .attribute .attribute-footer input.hit-dice {
  964. min-width: 16px;
  965. max-width: 16px;
  966. text-align: right;
  967. }
  968. .pf2e.actor .primary-attributes .attribute .attribute-footer input[name="system.attributes.speed.value"] {
  969. max-width: none;
  970. text-align: left;
  971. }
  972. .pf2e.actor .primary-attributes .attribute .attribute-footer input.speed, .pf2e.actor .primary-attributes .attribute .attribute-footer input.hpformula {
  973. max-width: 90%;
  974. }
  975. .pf2e.actor .primary-attributes .attribute .attribute-footer.recharge input[type=checkbox] {
  976. margin: 1px;
  977. }
  978. .pf2e.actor .statuses {
  979. width: 100%;
  980. height: 30px;
  981. margin: 0;
  982. display: flex;
  983. flex-direction: row;
  984. flex-wrap: wrap;
  985. justify-content: flex-start;
  986. }
  987. .pf2e.actor .statuses > * {
  988. flex: 1;
  989. }
  990. .pf2e.actor .statuses .status {
  991. line-height: 30px;
  992. padding: 0 6px;
  993. border-right: 1px solid var(--secondary-background);
  994. font-size: var(--font-size-14);
  995. display: flex;
  996. flex-direction: row;
  997. flex-wrap: wrap;
  998. justify-content: flex-start;
  999. }
  1000. .pf2e.actor .statuses .status > * {
  1001. flex: 1;
  1002. }
  1003. .pf2e.actor .statuses .status.death {
  1004. flex: 0 0 50%;
  1005. }
  1006. .pf2e.actor .statuses .status:last-child {
  1007. border-right: none;
  1008. }
  1009. .pf2e.actor .statuses .status h4 {
  1010. font-family: var(--serif-condensed);
  1011. font-weight: 700;
  1012. flex: 1;
  1013. margin: 0;
  1014. font-size: var(--font-size-18);
  1015. color: #444;
  1016. }
  1017. .pf2e.actor .statuses .status .status-value {
  1018. flex: none;
  1019. }
  1020. .pf2e.actor .statuses .status .status-value > * {
  1021. display: inline-block;
  1022. margin-right: 5px;
  1023. }
  1024. .pf2e.actor .statuses .status .status-value > input[type=text], .pf2e.actor .statuses .status .status-value > input[type=number] {
  1025. height: 20px;
  1026. max-width: 20px;
  1027. margin: 0;
  1028. }
  1029. .pf2e.actor .statuses .status .status-value > input[type=checkbox] {
  1030. position: relative;
  1031. top: 2px;
  1032. }
  1033. .pf2e.actor img.sheet-profile {
  1034. /* border: none;
  1035. */
  1036. border: 1px solid var(--secondary-background);
  1037. object-fit: contain;
  1038. }
  1039. .pf2e.actor .sheet-sidebar {
  1040. border-right: 1px solid var(--primary-background);
  1041. }
  1042. .pf2e.actor .sheet-sidebar .tab {
  1043. height: 100%;
  1044. padding-top: 2px;
  1045. overflow-y: auto;
  1046. }
  1047. .pf2e.actor .abilities .ac-list {
  1048. display: grid;
  1049. grid: "score items" 38px "score items" 38px/73px auto;
  1050. margin: unset;
  1051. padding: unset;
  1052. background: var(--secondary-background);
  1053. }
  1054. .pf2e.actor .abilities .ac-grid {
  1055. display: grid;
  1056. grid: "item item item" 32px/33% 33% 33%;
  1057. margin: unset;
  1058. margin-top: 1px;
  1059. padding: unset;
  1060. background: var(--secondary-background);
  1061. height: 32px;
  1062. }
  1063. .pf2e.actor .abilities .ac-list .ac-value {
  1064. height: 16px;
  1065. font-size: var(--font-size-12);
  1066. width: 46px;
  1067. }
  1068. .pf2e.actor .abilities .ac-list .ac-item {
  1069. height: 13px;
  1070. font-size: var(--font-size-11);
  1071. width: 46px;
  1072. }
  1073. .pf2e.actor .abilities .shield-value {
  1074. grid-row-start: 1;
  1075. grid-row-end: 3;
  1076. grid-column-start: 1;
  1077. grid-column-end: 2;
  1078. align-self: end;
  1079. justify-self: end;
  1080. height: 26px;
  1081. width: 26px;
  1082. background: #fff;
  1083. border: 1px solid;
  1084. font-size: var(--font-size-22);
  1085. text-align: center;
  1086. border-radius: 14px;
  1087. margin-right: 2px;
  1088. margin-bottom: 2px;
  1089. }
  1090. .pf2e.actor .bio-container {
  1091. display: grid;
  1092. grid: "image bio" 220px/220px auto;
  1093. margin: unset;
  1094. padding: unset;
  1095. }
  1096. .pf2e.actor .biography .sheet-profile {
  1097. grid-area: image;
  1098. }
  1099. .pf2e.actor .biography .bio-list {
  1100. grid-area: bio;
  1101. display: grid;
  1102. grid: "bio" 40px/auto auto;
  1103. grid-auto-rows: 40px;
  1104. margin: unset;
  1105. padding: unset;
  1106. background: var(--secondary-background);
  1107. }
  1108. .pf2e.actor .biography .bio-3way {
  1109. display: grid;
  1110. grid: "bio" 40px/33% 33% 33%;
  1111. grid-auto-rows: 40px;
  1112. margin: unset;
  1113. padding: unset;
  1114. background: var(--secondary-background);
  1115. }
  1116. .pf2e.actor .abilities .bio-list {
  1117. grid-area: bio;
  1118. display: grid;
  1119. grid: "bio" 40px/102px auto;
  1120. grid-auto-rows: 40px;
  1121. margin: unset;
  1122. padding: unset;
  1123. height: 32px;
  1124. background: var(--secondary-background);
  1125. margin-top: 3px;
  1126. margin-bottom: 8px;
  1127. }
  1128. .pf2e.actor .abilities .bio-list .npc-bio-item {
  1129. width: 100px;
  1130. }
  1131. .pf2e.actor .biography .bio-3way > * {
  1132. width: 125px;
  1133. }
  1134. .pf2e.actor .biography .bio-list > * {
  1135. width: 94px;
  1136. }
  1137. .pf2e.actor .biography .bio-list .bio-appearance, .pf2e.actor .biography .bio-list .bio-attitude {
  1138. grid-column-start: 1;
  1139. grid-column-end: 3;
  1140. width: 170px;
  1141. }
  1142. .pf2e.actor .biography .bio-list .bio-appearance > input, .pf2e.actor .biography .bio-list .bio-attitude > input {
  1143. text-align: start;
  1144. word-break: break-all;
  1145. }
  1146. .pf2e.actor .biography .editor {
  1147. grid-row-start: 2;
  1148. grid-row-end: 3;
  1149. grid-column-start: 1;
  1150. grid-column-end: 3;
  1151. height: 230px;
  1152. padding-left: 8px;
  1153. }
  1154. .pf2e.actor .list-row .skill-input > input {
  1155. font-family: var(--serif-condensed);
  1156. font-weight: 700;
  1157. width: 22px;
  1158. height: 22px;
  1159. margin: 1px;
  1160. font-size: var(--font-size-20);
  1161. text-align: center;
  1162. background: #fff;
  1163. border: 1px solid;
  1164. }
  1165. .pf2e.actor .abilities .defense {
  1166. grid-row-start: auto;
  1167. align-self: center;
  1168. display: grid;
  1169. grid: "score name rank item" 32px/34px auto 52px 52px;
  1170. background: var(--secondary-background);
  1171. margin-right: 4px;
  1172. }
  1173. .pf2e.actor .abilities .defense .save-name, .pf2e.actor .abilities .defense .attribute-name, .pf2e.actor .abilities .defense .attribute-name-non-rollable {
  1174. grid-area: auto;
  1175. margin: 0;
  1176. background: var(--secondary-background);
  1177. color: white;
  1178. align-self: center;
  1179. font-size: var(--font-size-15);
  1180. }
  1181. .pf2e.actor .abilities .defense .defense-score {
  1182. font-family: var(--serif-condensed);
  1183. font-weight: 700;
  1184. grid-area: auto;
  1185. font-size: var(--font-size-28);
  1186. text-align: center;
  1187. background: var(--secondary-background);
  1188. color: white;
  1189. }
  1190. .pf2e.actor .abilities .defense .defense-score > input {
  1191. font-family: var(--serif-condensed);
  1192. font-weight: 700;
  1193. width: 30px;
  1194. height: 30px;
  1195. margin: 3px;
  1196. font-size: var(--font-size-28);
  1197. text-align: center;
  1198. background: #fff;
  1199. border: 1px solid;
  1200. }
  1201. .pf2e.actor .abilities .defense .proficiency-name {
  1202. grid-area: auto;
  1203. font-size: var(--font-size-11);
  1204. height: 13px;
  1205. }
  1206. .pf2e.actor .abilities .defense .proficiency-rank {
  1207. letter-spacing: -3px;
  1208. grid-area: auto;
  1209. height: 16px;
  1210. font-size: var(--font-size-12);
  1211. }
  1212. .pf2e.actor .npc-abilities .ability-title, .pf2e.actor .abilities .ability-title {
  1213. font-family: var(--serif-condensed);
  1214. font-weight: 700;
  1215. flex: 0 0 24px;
  1216. font-size: var(--font-size-24);
  1217. line-height: 24px;
  1218. color: #fff;
  1219. background: var(--primary-background);
  1220. text-align: center;
  1221. margin: 0;
  1222. padding: 0;
  1223. }
  1224. .pf2e.actor .npc-abilities .abilities-list {
  1225. display: grid;
  1226. grid: 38px 38px/33.3% 33.3% 33.3%;
  1227. grid-auto-rows: 54px;
  1228. list-style: none;
  1229. margin: 0;
  1230. padding: 0;
  1231. }
  1232. .pf2e.actor .npc-abilities .ability {
  1233. grid-row-start: auto;
  1234. display: grid;
  1235. grid: [row1-start] "id" 26px [row1-end] [row2-start] "mod" 26px [row2-end]/100%;
  1236. height: 26px;
  1237. line-height: 26px;
  1238. }
  1239. .pf2e.actor .npc-abilities .ability .ability-score {
  1240. grid-area: score;
  1241. align-self: center;
  1242. justify-self: right;
  1243. flex: 0 0 26px;
  1244. height: 26px;
  1245. }
  1246. .pf2e.actor .npc-abilities .ability .ability-mod {
  1247. font-family: var(--serif-condensed);
  1248. font-weight: 700;
  1249. flex: 0 0 24px;
  1250. font-size: var(--font-size-24);
  1251. line-height: 26px;
  1252. color: #666;
  1253. text-align: center;
  1254. }
  1255. .pf2e.actor .npc-abilities .ability .ability-mod .ability-input {
  1256. font-family: var(--serif-condensed);
  1257. font-weight: 700;
  1258. width: 30px;
  1259. height: 30px;
  1260. margin: 3px;
  1261. font-size: var(--font-size-28);
  1262. text-align: center;
  1263. background: #fff;
  1264. border: 1px solid;
  1265. border-radius: 4px;
  1266. margin-left: 18px;
  1267. }
  1268. .pf2e.actor .npc-abilities .ability .ability-name {
  1269. margin: 2px;
  1270. }
  1271. .pf2e.actor .abilities .abilities-list {
  1272. display: grid;
  1273. grid: "ability ability" 50px/50%;
  1274. grid-auto-rows: 50px;
  1275. list-style: none;
  1276. margin: 0;
  1277. padding: 0;
  1278. }
  1279. .pf2e.actor .abilities .ability {
  1280. grid-row-start: auto;
  1281. display: grid;
  1282. grid: [row1-start] "header header header header" 16px [row1-end] [row2-start] "id mod score blank" 26px [row2-end]/46% 31% 18% 5%;
  1283. height: 36px;
  1284. line-height: 36px;
  1285. }
  1286. .pf2e.actor .npc-abilities .ability > *, .pf2e.actor .abilities .ability > * {
  1287. flex: 1;
  1288. align-self: center;
  1289. }
  1290. .pf2e.actor .npc-abilities .ability .ability-proficiency, .pf2e.actor .abilities .ability .ability-proficiency {
  1291. flex: 0 0 20px;
  1292. height: 100%;
  1293. text-align: left;
  1294. padding-left: 3px;
  1295. }
  1296. .pf2e.actor .npc-abilities .ability .ability-proficiency i.fa-circle, .pf2e.actor .abilities .ability .ability-proficiency i.fa-circle {
  1297. font-size: var(--font-size-10);
  1298. }
  1299. .pf2e.actor .npc-abilities .ability .ability-name {
  1300. grid-area: header;
  1301. font-size: var(--font-size-12);
  1302. color: #444;
  1303. margin: 0;
  1304. }
  1305. .pf2e.actor .abilities .ability .ability-name {
  1306. grid-area: header;
  1307. font-size: var(--font-size-12);
  1308. color: #444;
  1309. margin: 0;
  1310. }
  1311. .pf2e.actor .abilities .ability .ability-score {
  1312. grid-area: score;
  1313. align-self: center;
  1314. justify-self: right;
  1315. flex: 0 0 36px;
  1316. height: 36px;
  1317. }
  1318. .pf2e.actor .npc-abilities .ability .ability-score > input {
  1319. width: 20px;
  1320. height: 20px;
  1321. margin: 3px;
  1322. font-size: var(--font-size-12);
  1323. color: #444;
  1324. text-align: center;
  1325. background: #fff;
  1326. border: 1px solid;
  1327. }
  1328. .pf2e.actor .abilities .ability .ability-score > input {
  1329. width: 20px;
  1330. height: 20px;
  1331. margin: 3px;
  1332. font-size: var(--font-size-12);
  1333. color: #444;
  1334. text-align: center;
  1335. background: #fff;
  1336. border: 1px solid;
  1337. }
  1338. .pf2e.actor .abilities .ability .ability-mod {
  1339. font-family: var(--serif-condensed);
  1340. font-weight: 700;
  1341. flex: 0 0 24px;
  1342. font-size: var(--font-size-24);
  1343. line-height: 36px;
  1344. color: #666;
  1345. text-align: center;
  1346. }
  1347. .pf2e.actor .npc-abilities .npc-defense .ability-name, .pf2e.actor .abilities .ability .ability-id {
  1348. font-family: var(--serif-condensed);
  1349. font-weight: 700;
  1350. flex: 0 0 24px;
  1351. font-size: var(--font-size-32);
  1352. background: var(--secondary-background);
  1353. border-radius: 8px;
  1354. line-height: 28px;
  1355. color: #fff;
  1356. text-align: center;
  1357. }
  1358. .pf2e.actor .npc-abilities .ability .ability-mod, .pf2e.actor .abilities .ability .ability-mod {
  1359. grid-area: mod;
  1360. align-self: center;
  1361. }
  1362. .pf2e.actor .npc-abilities .ability .ability-name, .pf2e.actor .abilities .ability .ability-id {
  1363. grid-area: id;
  1364. align-self: center;
  1365. }
  1366. .pf2e.actor .class-levels {
  1367. margin: 0 5px 0 0;
  1368. height: 156px;
  1369. overflow: hidden;
  1370. }
  1371. .pf2e.actor .class-levels .class-header {
  1372. line-height: 20px;
  1373. position: relative;
  1374. margin: 3px 0 1px;
  1375. }
  1376. .pf2e.actor .class-levels .class-header h3 {
  1377. font-family: var(--serif-condensed);
  1378. font-weight: 700;
  1379. text-align: center;
  1380. color: #444;
  1381. font-size: var(--font-size-18);
  1382. color: #222;
  1383. margin: 0;
  1384. }
  1385. .pf2e.actor .class-levels .class-header a.item-create {
  1386. position: absolute;
  1387. top: 0;
  1388. right: 0;
  1389. font-size: var(--font-size-11);
  1390. color: #666;
  1391. }
  1392. .pf2e.actor .class-levels .class-list {
  1393. overflow-y: hidden;
  1394. }
  1395. .pf2e.actor .class-levels .class-list .list-row {
  1396. height: 44px;
  1397. background: rgba(0, 0, 0, 0.03);
  1398. padding: 2px;
  1399. border: 1px solid var(--secondary-background);
  1400. border-radius: 2px;
  1401. margin-bottom: 2px;
  1402. }
  1403. .pf2e.actor .class-levels .class-list .list-row h4, .pf2e.actor .class-levels .class-list .list-row h5 {
  1404. width: calc(100% - 44px);
  1405. float: left;
  1406. margin: 0;
  1407. line-height: 20px;
  1408. font-weight: strong;
  1409. }
  1410. .pf2e.actor .class-levels .class-list .list-row .item-header {
  1411. flex: 0 0 100%;
  1412. height: 20px;
  1413. }
  1414. .pf2e.actor .class-levels .class-list .list-row .item-header .class-levels {
  1415. font-family: var(--serif-condensed);
  1416. font-weight: 700;
  1417. width: 44px;
  1418. height: 100%;
  1419. float: right;
  1420. margin: 0;
  1421. font-size: var(--font-size-10);
  1422. text-align: right;
  1423. font-size: var(--font-size-18);
  1424. color: #222;
  1425. }
  1426. .pf2e.actor .class-levels .class-list .list-row .class-subclass {
  1427. flex: 0 0 100%;
  1428. height: 20px;
  1429. }
  1430. .pf2e.actor .class-levels .class-list .list-row .class-subclass .item-controls {
  1431. width: 44px;
  1432. float: right;
  1433. }
  1434. .pf2e.actor .class-levels .class-list .list-row .class-subclass .item-controls a {
  1435. text-align: right;
  1436. }
  1437. .pf2e.actor .skills .skills-list {
  1438. margin: 0;
  1439. padding: 0;
  1440. display: grid;
  1441. grid: "skill skill" 36px/50% 50%;
  1442. grid-auto-rows: 36px;
  1443. }
  1444. .pf2e.actor .pf-three-grid {
  1445. grid-area: auto;
  1446. display: grid;
  1447. grid: "one two three" 100%/auto 90px 20px;
  1448. }
  1449. .pf2e.actor .pf-two-grid {
  1450. grid-area: auto;
  1451. display: grid;
  1452. grid: "one two" 100%/auto 90px;
  1453. }
  1454. .pf2e.actor .pf-justify-center {
  1455. justify-self: center;
  1456. }
  1457. .pf2e.actor .skills .martial {
  1458. grid-area: auto;
  1459. display: grid;
  1460. grid: "name rank space" 100%/auto 46px 20px;
  1461. }
  1462. .pf2e.actor .skills .skill {
  1463. grid-area: auto;
  1464. display: grid;
  1465. grid: "value name rank item armor" 100%/35px auto 46px 46px 20px;
  1466. }
  1467. .pf2e.actor .skill-container .item-item {
  1468. height: 16px;
  1469. margin-top: 2px;
  1470. font-size: var(--font-size-12);
  1471. }
  1472. .pf2e.actor .skills .skill-container {
  1473. display: grid;
  1474. grid: "title" 12px "value" 18px/auto;
  1475. background: var(--secondary-background);
  1476. height: 32px;
  1477. align-self: center;
  1478. }
  1479. .pf2e.actor .skills .skill-container .skill-proficiency {
  1480. font-size: var(--font-size-12);
  1481. }
  1482. .pf2e.actor .skills .skill-container > * {
  1483. width: 43px;
  1484. }
  1485. .pf2e.actor .skills .skill > *, .pf2e.actor .skills .list-row > * {
  1486. flex: 1;
  1487. }
  1488. .pf2e.actor .skills .skill-name {
  1489. margin: 0;
  1490. align-self: center;
  1491. background: var(--secondary-background);
  1492. line-height: 32px;
  1493. color: white;
  1494. }
  1495. .pf2e.actor .skills .lore-name, .pf2e.actor .skills .lore-name-input {
  1496. margin: 0;
  1497. align-self: center;
  1498. background: var(--secondary-background);
  1499. line-height: 32px;
  1500. color: white;
  1501. }
  1502. .pf2e.actor .skills .skill-proficiency {
  1503. margin-top: 2px;
  1504. }
  1505. .pf2e.actor .skills .skill-item {
  1506. margin-top: 2px;
  1507. font-size: var(--font-size-11);
  1508. }
  1509. .pf2e.actor .skills .skill-ability {
  1510. flex: 0 0 36px;
  1511. color: #666;
  1512. text-align: right;
  1513. margin-right: 4px;
  1514. flex: 0 0 36px;
  1515. color: #666;
  1516. text-align: right;
  1517. margin-right: 4px;
  1518. }
  1519. .pf2e.actor .skills .skill-armor {
  1520. align-self: center;
  1521. background: var(--secondary-background);
  1522. line-height: 32px;
  1523. color: white;
  1524. width: 16px;
  1525. margin: unset;
  1526. }
  1527. .pf2e.actor .skills .skill-score {
  1528. font-family: var(--serif-condensed);
  1529. font-weight: 700;
  1530. font-size: var(--font-size-28);
  1531. text-align: center;
  1532. align-self: center;
  1533. background: var(--secondary-background);
  1534. color: white;
  1535. }
  1536. .pf2e.actor.locked .ability-proficiency, .pf2e.actor.locked .skill-proficiency {
  1537. text-shadow: none;
  1538. cursor: default;
  1539. }
  1540. .pf2e.actor .traits label {
  1541. font-weight: bold;
  1542. }
  1543. .pf2e.actor .traits select {
  1544. margin: 2px 0;
  1545. }
  1546. .pf2e.actor .traits .trait-perception > input {
  1547. flex: 0 0 32px;
  1548. text-align: center;
  1549. }
  1550. .pf2e.actor .traits .tag-selector {
  1551. float: right;
  1552. margin-right: 3px;
  1553. color: #999;
  1554. font-size: var(--font-size-10);
  1555. line-height: 16px;
  1556. }
  1557. .pf2e.actor .traits .configure-flags i.fas {
  1558. float: right;
  1559. margin-right: 3px;
  1560. text-align: right;
  1561. color: #999;
  1562. line-height: 24px;
  1563. }
  1564. .pf2e.actor .traits .configure-flags i.fas:hover {
  1565. color: #111;
  1566. text-shadow: 0 0 10px #ff6400;
  1567. }
  1568. .pf2e.actor.npc-sheet .biography .editor {
  1569. height: 465px;
  1570. }
  1571. .pf2e.actor .inventory-header {
  1572. list-style: none;
  1573. margin: 0;
  1574. padding: 0;
  1575. }
  1576. .pf2e.actor .action-header .item-controls {
  1577. flex: 0 0 44px;
  1578. }
  1579. .pf2e.actor .action-header .item-controls a {
  1580. display: block;
  1581. float: left;
  1582. width: 44px;
  1583. font-size: var(--font-size-14);
  1584. text-align: center;
  1585. }
  1586. .pf2e.actor .spellcastingEntry-list {
  1587. list-style: none;
  1588. margin: 0;
  1589. padding: 0;
  1590. height: calc(100% - 20px);
  1591. overflow-y: auto;
  1592. }
  1593. .pf2e.actor .overflow-list {
  1594. list-style: none;
  1595. margin: 0;
  1596. padding: 0;
  1597. height: 100%;
  1598. overflow-y: auto;
  1599. }
  1600. .pf2e.actor .list-row.action-header .item-controls a {
  1601. display: block;
  1602. float: left;
  1603. width: 22px;
  1604. font-size: var(--font-size-10);
  1605. text-align: center;
  1606. color: #666;
  1607. }
  1608. .pf2e.actor .action-header .item-controls a.item-create, .pf2e.actor .action-header .item-controls a.item-delete, .pf2e.actor .action-header .item-controls a.feat-browse, .pf2e.actor .action-header .item-controls a.action-browse {
  1609. width: 100%;
  1610. color: #fff;
  1611. background: var(--primary-background);
  1612. }
  1613. .pf2e.actor .encumbrance {
  1614. background: rgba(0, 0, 0, 0.1);
  1615. height: 12px;
  1616. margin-top: 5px;
  1617. border: 1px solid #111;
  1618. border-radius: 3px;
  1619. position: relative;
  1620. width: calc(100% - 20px);
  1621. }
  1622. .pf2e.actor .encumbrance .encumbrance-bar {
  1623. position: absolute;
  1624. top: 1px;
  1625. left: 1px;
  1626. background: var(--secondary-background);
  1627. height: 8px;
  1628. border: 1px solid #6f5439;
  1629. border-radius: 3px;
  1630. }
  1631. .pf2e.actor .encumbrance .encumbrance-label {
  1632. position: absolute;
  1633. top: -3px;
  1634. height: 16px;
  1635. font-size: var(--font-size-16);
  1636. line-height: 16px;
  1637. color: #000;
  1638. background: rgba(255, 255, 255, 0.4);
  1639. padding: 0 3px;
  1640. }
  1641. .pf2e.actor .encumbrance .encumbrance-breakpoint {
  1642. position: absolute;
  1643. left: 66%;
  1644. }
  1645. .pf2e.actor .encumbrance .arrow-up {
  1646. bottom: 0;
  1647. width: 0;
  1648. height: 0;
  1649. border-left: 4px solid transparent;
  1650. border-right: 4px solid transparent;
  1651. border-bottom: 4px solid #666;
  1652. }
  1653. .pf2e.actor .encumbrance .arrow-down {
  1654. top: 0;
  1655. width: 0;
  1656. height: 0;
  1657. border-left: 4px solid transparent;
  1658. border-right: 4px solid transparent;
  1659. border-top: 4px solid #666;
  1660. }
  1661. .pf2e.actor .encumbrance.encumbered {
  1662. background-color: yellow;
  1663. }
  1664. .pf2e.actor .encumbrance.over-limit {
  1665. background-color: red;
  1666. }
  1667. .pf2e.actor .encumbrance.encumbered .arrow-up {
  1668. border-bottom: 4px solid #000;
  1669. }
  1670. .pf2e.actor .encumbrance.encumbered .arrow-down {
  1671. border-top: 4px solid #000;
  1672. }
  1673. .pf2e.actor .list-row .spell-school, .pf2e.actor .list-row .spell-action {
  1674. flex: 1;
  1675. font-size: var(--font-size-12);
  1676. color: #666;
  1677. text-align: center;
  1678. border-right: 1px solid var(--secondary-background);
  1679. }
  1680. .pf2e.actor .list-row .spell-slots, .pf2e.actor .list-row .spell-max {
  1681. flex: 0 0 24px;
  1682. font-size: var(--font-size-12);
  1683. text-align: center;
  1684. }
  1685. .pf2e.actor .list-row .spell-slots-input, .pf2e.actor .list-row .spell-max-input {
  1686. flex: 0 0 24px;
  1687. font-size: var(--font-size-12);
  1688. text-align: center;
  1689. background: white;
  1690. border: 1px solid;
  1691. border-radius: 17px;
  1692. height: 18px;
  1693. margin-top: 1px;
  1694. }
  1695. .pf2e.actor .list-row .spell-max {
  1696. border-right: 1px solid var(--secondary-background);
  1697. }
  1698. .pf2e.actor .feats .feats-list {
  1699. height: 100%;
  1700. }
  1701. .pf2e.actor .feats .feats-list .item-name {
  1702. flex: 2;
  1703. }
  1704. .pf2e.actor .feat-uses {
  1705. display: inline;
  1706. font-size: var(--font-size-11);
  1707. color: #444;
  1708. }
  1709. /* ----------------------------------------- */
  1710. /* Item Buttons
  1711. /* ----------------------------------------- */
  1712. .pf2e.sheet .item-buttons button {
  1713. font-size: var(--font-size-10);
  1714. line-height: 12px;
  1715. margin: 0;
  1716. }
  1717. .pf2e.sheet .item-buttons span {
  1718. padding: 0;
  1719. }
  1720. /* ----------------------------------------- */
  1721. /* Compendium tab
  1722. /* ----------------------------------------- */
  1723. #compendium.flexcolumn.active {
  1724. display: flex;
  1725. flex-direction: column;
  1726. }
  1727. #compendium.flexcolumn > .directory-list {
  1728. width: 100%;
  1729. height: auto;
  1730. flex-basis: 0;
  1731. flex-grow: 1;
  1732. }
  1733. #compendium.flexcolumn > .directory-footer {
  1734. height: auto;
  1735. }
  1736. #compendium.flexcolumn > .directory-footer > * {
  1737. margin-top: 5px;
  1738. }
  1739. #compendium .create-compendium {
  1740. flex-basis: 100%;
  1741. }
  1742. /* Updated NPC Sheet Styles */
  1743. .npc-detail-text {
  1744. display: flex;
  1745. background: var(--secondary-background);
  1746. color: #fff;
  1747. flex-wrap: wrap;
  1748. }
  1749. .pf2e.sheet form .npc-detail-text input[type=text], .pf2e.sheet form .npc-detail-text input[type=number] {
  1750. background: rgba(255, 255, 255, 0.8);
  1751. color: black;
  1752. border: 1px solid black;
  1753. }
  1754. .pf2e.sheet form .npc-detail-text textarea {
  1755. height: fit-content;
  1756. overflow-y: hidden;
  1757. resize: none;
  1758. width: calc(100% - 2px);
  1759. min-height: 26px;
  1760. font-family: inherit;
  1761. }
  1762. .pf2e.actor .sheet-header .charlevel .level > input[type=checkbox] {
  1763. flex: 0 0 26px;
  1764. }
  1765. .pf2e.actor .inventory-list .list-row .spell-buttons {
  1766. flex: none;
  1767. display: inline-flex;
  1768. justify-content: flex-end;
  1769. align-items: flex-end;
  1770. flex-wrap: wrap;
  1771. }
  1772. /* HEADER */
  1773. /* TRAITS */
  1774. .traits-bar {
  1775. align-items: center;
  1776. display: flex;
  1777. }
  1778. .traits-bar .trait {
  1779. background-color: #5e0000;
  1780. border: 2px solid #d8c483;
  1781. color: white;
  1782. font-family: var(--sans-serif);
  1783. padding: 0.25em 0.5em;
  1784. text-transform: uppercase;
  1785. }
  1786. .traits-bar .trait.alignment {
  1787. background-color: #5e657a;
  1788. }
  1789. .traits-bar .trait.size {
  1790. background-color: #447b5c;
  1791. }
  1792. .traits-bar .trait.uncommon {
  1793. background-color: #c45500;
  1794. }
  1795. .traits-bar .trait.rare {
  1796. background-color: #0c1466;
  1797. }
  1798. .traits-bar .trait.unique {
  1799. background-color: #54166e;
  1800. }
  1801. /* Top-section */
  1802. .pf2e.sheet form .list-row .melee-name.rollable .item-image {
  1803. min-height: 24px;
  1804. }
  1805. /* Items */
  1806. /** Hide Attack headers */
  1807. li.list-row.hover-container {
  1808. background-color: #aaa !important;
  1809. }
  1810. .dice-total-shield-btn.shield-activated {
  1811. background-color: #333;
  1812. color: white;
  1813. }
  1814. .message-content .dice-roll .statuseffect-message {
  1815. word-break: normal;
  1816. font-weight: 400;
  1817. font-size: var(--font-size-12);
  1818. text-align: left;
  1819. }
  1820. .message-content .dice-roll .statuseffect-message ul {
  1821. list-style-type: none;
  1822. }
  1823. .message-content .dice-roll .statuseffect-message li {
  1824. display: flex;
  1825. flex-direction: row;
  1826. align-items: center;
  1827. height: 24px;
  1828. }
  1829. .message-content .dice-roll .statuseffect-message li:not(:last-child) {
  1830. margin-bottom: 3px;
  1831. }
  1832. .message-content .dice-roll .statuseffect-message li img {
  1833. width: 24px;
  1834. height: 24px;
  1835. vertical-align: middle;
  1836. margin-right: 3px;
  1837. }
  1838. .message-content .dice-roll .statuseffect-li {
  1839. position: relative;
  1840. display: inline-block;
  1841. vertical-align: middle;
  1842. }
  1843. .message-content .dice-roll .statuseffect-li-text {
  1844. display: inline-block;
  1845. width: 200px;
  1846. }
  1847. .message-content .dice-roll .statuseffect-rules {
  1848. visibility: hidden;
  1849. width: 264px;
  1850. padding: 8px;
  1851. position: absolute;
  1852. z-index: 1;
  1853. bottom: 110%;
  1854. left: -42px;
  1855. text-align: left;
  1856. font-size: var(--font-size-14);
  1857. font-weight: 400;
  1858. line-height: normal;
  1859. background: url("../assets/sheet/parchment.webp") repeat;
  1860. border: 1px solid #999;
  1861. border-radius: 3px;
  1862. box-shadow: 0 0 3px #fff inset;
  1863. opacity: 0;
  1864. transition: opacity 1s;
  1865. }
  1866. .message-content .dice-roll .statuseffect-rules p {
  1867. margin: 0;
  1868. }
  1869. .statuseffect-li-text:hover + .statuseffect-rules {
  1870. visibility: visible;
  1871. opacity: 1;
  1872. }
  1873. .dice-roll .dice-tooltip.dmg-tooltip span {
  1874. font-size: var(--font-size-10);
  1875. }
  1876. .dice-roll .dice-tooltip.dmg-tooltip span:not(:first-child) {
  1877. display: block;
  1878. border-top: 1px;
  1879. border-top-color: #999;
  1880. border-top-style: solid;
  1881. }
  1882. .npc-title-bar .creature-adjustment {
  1883. display: flex;
  1884. flex-direction: column;
  1885. justify-content: center;
  1886. margin-left: auto;
  1887. margin-right: 1em;
  1888. }
  1889. .npc-title-bar .creature-adjustment * {
  1890. width: 100%;
  1891. }
  1892. .sheet-header .creature-adjustment, .npc-title-bar .creature-adjustment a.hidden {
  1893. font-size: var(--font-size-12);
  1894. }
  1895. .sheet-header .creature-adjustment a, .npc-title-bar .creature-adjustment a.hidden {
  1896. margin-left: 1px;
  1897. background-color: var(--secondary-background);
  1898. border-color: #bbb68f;
  1899. }
  1900. .sheet-header .creature-adjustment a.active, .npc-title-bar .creature-adjustment a.hidden {
  1901. margin-left: 1px;
  1902. background-color: #5e0000;
  1903. border-color: #bbb68f;
  1904. }
  1905. .sheet-header .creature-adjustment a.hidden, .npc-title-bar .creature-adjustment a.hidden {
  1906. display: none;
  1907. }
  1908. .recall-knowledge-table th {
  1909. padding: 5px 8px;
  1910. }
  1911. .recall-knowledge-table td {
  1912. text-align: center;
  1913. padding: 5px 8px;
  1914. }
  1915. .recall-knowledge-table td:first-child {
  1916. text-align: right;
  1917. }
  1918. .recall-knowledge-table th:first-child {
  1919. text-align: right;
  1920. }
  1921. button:hover::not(:disabled) {
  1922. box-shadow: 0 0 3px #c00;
  1923. }
  1924. button:disabled {
  1925. color: #666;
  1926. }
  1927. button:active {
  1928. box-shadow: 0 0 5px red;
  1929. }
  1930. /* ----------------------------------------- */
  1931. /* Item Card Structure */
  1932. /* ----------------------------------------- */
  1933. .pf2e.chat-card {
  1934. font-style: normal;
  1935. }
  1936. .pf2e.chat-card .card-header {
  1937. padding: 2px 0;
  1938. border-top: 2px groove #fff;
  1939. border-bottom: 2px groove #fff;
  1940. align-items: center;
  1941. min-height: 36px;
  1942. }
  1943. .pf2e.chat-card .card-header img {
  1944. flex: 0 0 36px;
  1945. margin-right: 5px;
  1946. height: 36px;
  1947. width: 36px;
  1948. }
  1949. .pf2e.chat-card .card-header h3 {
  1950. flex: 1;
  1951. margin: 0;
  1952. }
  1953. .pf2e.chat-card .card-header h4 {
  1954. flex: 0;
  1955. margin: 0 5px 0 0;
  1956. white-space: nowrap;
  1957. }
  1958. .pf2e.chat-card .tags {
  1959. margin: 3px 0 0;
  1960. }
  1961. .pf2e.chat-card .card-content {
  1962. margin: 4px 0;
  1963. }
  1964. .pf2e.chat-card .card-content p {
  1965. margin: 4px 0;
  1966. min-height: unset;
  1967. }
  1968. .pf2e.chat-card .card-buttons {
  1969. display: flex;
  1970. flex-basis: 100%;
  1971. flex-direction: column;
  1972. margin: 4px 0;
  1973. }
  1974. .pf2e.chat-card .card-buttons span {
  1975. display: block;
  1976. line-height: 28px;
  1977. text-align: center;
  1978. border: 1px solid var(--secondary-background);
  1979. }
  1980. .pf2e.chat-card .card-buttons button {
  1981. margin: 2px 0;
  1982. }
  1983. .pf2e.chat-card .card-buttons button.with-image {
  1984. display: flex;
  1985. align-items: center;
  1986. justify-content: center;
  1987. }
  1988. .pf2e.chat-card .card-buttons button.with-image img {
  1989. border: none;
  1990. height: 2em;
  1991. margin-right: 0.5em;
  1992. }
  1993. .pf2e.chat-card .card-buttons button span {
  1994. border: none;
  1995. }
  1996. .pf2e.chat-card .card-buttons .owner-buttons {
  1997. display: flex;
  1998. flex-basis: 100%;
  1999. flex-direction: column;
  2000. }
  2001. .pf2e.chat-card .card-buttons .spell-attack-buttons, .pf2e.chat-card .card-buttons .spell-button {
  2002. display: flex;
  2003. flex-direction: row;
  2004. }
  2005. .pf2e.chat-card .card-buttons .spell-attack-buttons *, .pf2e.chat-card .card-buttons .spell-button * {
  2006. flex-grow: 1;
  2007. flex-basis: 0;
  2008. }
  2009. .pf2e.chat-card .card-buttons .spell-attack-buttons :first-child, .pf2e.chat-card .card-buttons .spell-button :first-child {
  2010. flex-grow: 2;
  2011. }
  2012. .pf2e.chat-card .card-buttons .hidden-to-others {
  2013. background: var(--visibility-gm-bg);
  2014. }
  2015. .pf2e.chat-card .card-footer {
  2016. padding: 3px 0 0;
  2017. border-top: 2px groove #fff;
  2018. }
  2019. .pf2e.chat-card .card-footer span {
  2020. border-right: 2px groove #fff;
  2021. padding: 0 5px 0 0;
  2022. font-size: var(--font-size-12);
  2023. }
  2024. .pf2e.chat-card .card-footer span:last-child {
  2025. border-right: none;
  2026. padding-right: 0;
  2027. }
  2028. .pf2e.chat-card .card-buttons-multiattack {
  2029. display: grid;
  2030. grid-template-columns: auto 40px 40px;
  2031. grid-column-gap: 4px;
  2032. }
  2033. .pf2e.chat-card .card-buttons-two-column {
  2034. display: grid;
  2035. grid-template-columns: 1fr 1fr;
  2036. grid-column-gap: 4px;
  2037. }
  2038. /* This is the core CSS of Tooltipster */
  2039. /* GENERAL STRUCTURE RULES (do not edit this section) */
  2040. .tooltipster-base {
  2041. /* this ensures that a constrained height set by functionPosition,
  2042. if greater that the natural height of the tooltip, will be enforced
  2043. in browsers that support display:flex */
  2044. display: flex;
  2045. pointer-events: none;
  2046. /* this may be overriden in JS for fixed position origins */
  2047. position: absolute;
  2048. }
  2049. .tooltipster-box {
  2050. /* see .tooltipster-base. flex-shrink 1 is only necessary for IE10-
  2051. and flex-basis auto for IE11- (at least) */
  2052. flex: 1 1 auto;
  2053. }
  2054. .tooltipster-content {
  2055. /* prevents an overflow if the user adds padding to the div */
  2056. box-sizing: border-box;
  2057. /* these make sure we'll be able to detect any overflow */
  2058. max-height: 100%;
  2059. max-width: 100%;
  2060. overflow: auto;
  2061. }
  2062. .tooltipster-ruler {
  2063. /* these let us test the size of the tooltip without overflowing the window */
  2064. bottom: 0;
  2065. left: 0;
  2066. overflow: hidden;
  2067. position: fixed;
  2068. right: 0;
  2069. top: 0;
  2070. visibility: hidden;
  2071. }
  2072. /* ANIMATIONS */
  2073. /* Open/close animations */
  2074. /* fade */
  2075. .tooltipster-fade {
  2076. opacity: 0;
  2077. -webkit-transition-property: opacity;
  2078. -moz-transition-property: opacity;
  2079. -o-transition-property: opacity;
  2080. -ms-transition-property: opacity;
  2081. transition-property: opacity;
  2082. }
  2083. .tooltipster-fade.tooltipster-show {
  2084. opacity: 1;
  2085. }
  2086. /* grow */
  2087. .tooltipster-grow {
  2088. -webkit-transform: scale(0, 0);
  2089. -moz-transform: scale(0, 0);
  2090. -o-transform: scale(0, 0);
  2091. -ms-transform: scale(0, 0);
  2092. transform: scale(0, 0);
  2093. -webkit-transition-property: -webkit-transform;
  2094. -moz-transition-property: -moz-transform;
  2095. -o-transition-property: -o-transform;
  2096. -ms-transition-property: -ms-transform;
  2097. transition-property: transform;
  2098. -webkit-backface-visibility: hidden;
  2099. backface-visibility: hidden;
  2100. }
  2101. .tooltipster-grow.tooltipster-show {
  2102. -webkit-transform: scale(1, 1);
  2103. -moz-transform: scale(1, 1);
  2104. -o-transform: scale(1, 1);
  2105. -ms-transform: scale(1, 1);
  2106. transform: scale(1, 1);
  2107. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  2108. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2109. -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2110. -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2111. -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2112. transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2113. }
  2114. /* swing */
  2115. .tooltipster-swing {
  2116. opacity: 0;
  2117. -webkit-transform: rotateZ(4deg);
  2118. -moz-transform: rotateZ(4deg);
  2119. -o-transform: rotateZ(4deg);
  2120. -ms-transform: rotateZ(4deg);
  2121. transform: rotateZ(4deg);
  2122. -webkit-transition-property: -webkit-transform, opacity;
  2123. -moz-transition-property: -moz-transform;
  2124. -o-transition-property: -o-transform;
  2125. -ms-transition-property: -ms-transform;
  2126. transition-property: transform;
  2127. }
  2128. .tooltipster-swing.tooltipster-show {
  2129. opacity: 1;
  2130. -webkit-transform: rotateZ(0deg);
  2131. -moz-transform: rotateZ(0deg);
  2132. -o-transform: rotateZ(0deg);
  2133. -ms-transform: rotateZ(0deg);
  2134. transform: rotateZ(0deg);
  2135. -webkit-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 1);
  2136. -webkit-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  2137. -moz-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  2138. -ms-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  2139. -o-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  2140. transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  2141. }
  2142. /* fall */
  2143. .tooltipster-fall {
  2144. -webkit-transition-property: top;
  2145. -moz-transition-property: top;
  2146. -o-transition-property: top;
  2147. -ms-transition-property: top;
  2148. transition-property: top;
  2149. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  2150. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2151. -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2152. -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2153. -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2154. transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2155. }
  2156. .tooltipster-fall.tooltipster-initial {
  2157. top: 0 !important;
  2158. }
  2159. .tooltipster-fall.tooltipster-dying {
  2160. -webkit-transition-property: all;
  2161. -moz-transition-property: all;
  2162. -o-transition-property: all;
  2163. -ms-transition-property: all;
  2164. transition-property: all;
  2165. top: 0 !important;
  2166. opacity: 0;
  2167. }
  2168. /* slide */
  2169. .tooltipster-slide {
  2170. -webkit-transition-property: left;
  2171. -moz-transition-property: left;
  2172. -o-transition-property: left;
  2173. -ms-transition-property: left;
  2174. transition-property: left;
  2175. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  2176. -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2177. -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2178. -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2179. -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2180. transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  2181. }
  2182. .tooltipster-slide.tooltipster-initial {
  2183. left: -40px !important;
  2184. }
  2185. .tooltipster-slide.tooltipster-dying {
  2186. -webkit-transition-property: all;
  2187. -moz-transition-property: all;
  2188. -o-transition-property: all;
  2189. -ms-transition-property: all;
  2190. transition-property: all;
  2191. left: 0 !important;
  2192. opacity: 0;
  2193. }
  2194. /* Update animations */
  2195. /* We use animations rather than transitions here because
  2196. transition durations may be specified in the style tag due to
  2197. animationDuration, and we try to avoid collisions and the use
  2198. of !important */
  2199. /* fade */
  2200. @keyframes tooltipster-fading {
  2201. 0% {
  2202. opacity: 0;
  2203. }
  2204. 100% {
  2205. opacity: 1;
  2206. }
  2207. }
  2208. .tooltipster-update-fade {
  2209. animation: tooltipster-fading 400ms;
  2210. }
  2211. /* rotate */
  2212. @keyframes tooltipster-rotating {
  2213. 25% {
  2214. transform: rotate(-2deg);
  2215. }
  2216. 75% {
  2217. transform: rotate(2deg);
  2218. }
  2219. 100% {
  2220. transform: rotate(0);
  2221. }
  2222. }
  2223. .tooltipster-update-rotate {
  2224. animation: tooltipster-rotating 600ms;
  2225. }
  2226. /* scale */
  2227. @keyframes tooltipster-scaling {
  2228. 50% {
  2229. transform: scale(1.1);
  2230. }
  2231. 100% {
  2232. transform: scale(1);
  2233. }
  2234. }
  2235. .tooltipster-update-scale {
  2236. animation: tooltipster-scaling 600ms;
  2237. }
  2238. /**
  2239. * DEFAULT STYLE OF THE SIDETIP PLUGIN
  2240. *
  2241. * All styles are "namespaced" with .tooltipster-sidetip to prevent
  2242. * conflicts between plugins.
  2243. */
  2244. /* .tooltipster-box */
  2245. .tooltipster-sidetip .tooltipster-box {
  2246. background: #565656;
  2247. border: 2px solid black;
  2248. border-radius: 4px;
  2249. }
  2250. .tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
  2251. margin-top: 8px;
  2252. }
  2253. .tooltipster-sidetip.tooltipster-left .tooltipster-box {
  2254. margin-right: 8px;
  2255. }
  2256. .tooltipster-sidetip.tooltipster-right .tooltipster-box {
  2257. margin-left: 8px;
  2258. }
  2259. .tooltipster-sidetip.tooltipster-top .tooltipster-box {
  2260. margin-bottom: 8px;
  2261. }
  2262. /* .tooltipster-content */
  2263. .tooltipster-sidetip .tooltipster-content {
  2264. color: white;
  2265. line-height: 18px;
  2266. padding: 6px 14px;
  2267. }
  2268. /* .tooltipster-arrow : will keep only the zone of .tooltipster-arrow-uncropped that
  2269. corresponds to the arrow we want to display */
  2270. .tooltipster-sidetip .tooltipster-arrow {
  2271. overflow: hidden;
  2272. position: absolute;
  2273. }
  2274. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow {
  2275. height: 10px;
  2276. /* half the width, for centering */
  2277. margin-left: -10px;
  2278. top: 0;
  2279. width: 20px;
  2280. }
  2281. .tooltipster-sidetip.tooltipster-left .tooltipster-arrow {
  2282. height: 20px;
  2283. margin-top: -10px;
  2284. right: 0;
  2285. /* top 0 to keep the arrow from overflowing .tooltipster-base when it has not
  2286. been positioned yet */
  2287. top: 0;
  2288. width: 10px;
  2289. }
  2290. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
  2291. height: 20px;
  2292. margin-top: -10px;
  2293. left: 0;
  2294. /* same as .tooltipster-left .tooltipster-arrow */
  2295. top: 0;
  2296. width: 10px;
  2297. }
  2298. .tooltipster-sidetip.tooltipster-top .tooltipster-arrow {
  2299. bottom: 0;
  2300. height: 10px;
  2301. margin-left: -10px;
  2302. width: 20px;
  2303. }
  2304. /* common rules between .tooltipster-arrow-background and .tooltipster-arrow-border */
  2305. .tooltipster-sidetip .tooltipster-arrow-background,
  2306. .tooltipster-sidetip .tooltipster-arrow-border {
  2307. height: 0;
  2308. position: absolute;
  2309. width: 0;
  2310. }
  2311. /* .tooltipster-arrow-background */
  2312. .tooltipster-sidetip .tooltipster-arrow-background {
  2313. border: 10px solid transparent;
  2314. }
  2315. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background {
  2316. border-bottom-color: #565656;
  2317. left: 0;
  2318. top: 3px;
  2319. }
  2320. .tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background {
  2321. border-left-color: #565656;
  2322. left: -3px;
  2323. top: 0;
  2324. }
  2325. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background {
  2326. border-right-color: #565656;
  2327. left: 3px;
  2328. top: 0;
  2329. }
  2330. .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
  2331. border-top-color: #565656;
  2332. left: 0;
  2333. top: -3px;
  2334. }
  2335. /* .tooltipster-arrow-border */
  2336. .tooltipster-sidetip .tooltipster-arrow-border {
  2337. border: 10px solid transparent;
  2338. left: 0;
  2339. top: 0;
  2340. }
  2341. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border {
  2342. border-bottom-color: black;
  2343. }
  2344. .tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border {
  2345. border-left-color: black;
  2346. }
  2347. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
  2348. border-right-color: black;
  2349. }
  2350. .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
  2351. border-top-color: black;
  2352. }
  2353. /* tooltipster-arrow-uncropped */
  2354. .tooltipster-sidetip .tooltipster-arrow-uncropped {
  2355. position: relative;
  2356. }
  2357. .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped {
  2358. top: -10px;
  2359. }
  2360. .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped {
  2361. left: -10px;
  2362. }
  2363. @-webkit-keyframes wobble {
  2364. from {
  2365. -webkit-transform: translate3d(0, 0, 0);
  2366. transform: translate3d(0, 0, 0);
  2367. }
  2368. 15% {
  2369. -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  2370. transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  2371. }
  2372. 30% {
  2373. -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  2374. transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  2375. }
  2376. 45% {
  2377. -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  2378. transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  2379. }
  2380. 60% {
  2381. -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  2382. transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  2383. }
  2384. 75% {
  2385. -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  2386. transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  2387. }
  2388. to {
  2389. -webkit-transform: translate3d(0, 0, 0);
  2390. transform: translate3d(0, 0, 0);
  2391. }
  2392. }
  2393. @keyframes wobble {
  2394. from {
  2395. -webkit-transform: translate3d(0, 0, 0);
  2396. transform: translate3d(0, 0, 0);
  2397. }
  2398. 15% {
  2399. -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  2400. transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  2401. }
  2402. 30% {
  2403. -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  2404. transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  2405. }
  2406. 45% {
  2407. -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  2408. transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  2409. }
  2410. 60% {
  2411. -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  2412. transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  2413. }
  2414. 75% {
  2415. -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  2416. transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  2417. }
  2418. to {
  2419. -webkit-transform: translate3d(0, 0, 0);
  2420. transform: translate3d(0, 0, 0);
  2421. }
  2422. }
  2423. @keyframes rotation {
  2424. from {
  2425. -webkit-transform: rotate(0deg);
  2426. }
  2427. to {
  2428. -webkit-transform: rotate(359deg);
  2429. }
  2430. }
  2431. /* ----------------------------------------- */
  2432. /* Animation */
  2433. /* ----------------------------------------- */
  2434. :root {
  2435. --animate-duration: 1s;
  2436. --animate-delay: 1s;
  2437. --animate-repeat: 1;
  2438. }
  2439. /* ----------------------------------------- */
  2440. /* Layout */
  2441. /* ----------------------------------------- */
  2442. /** A vertical rule in a flexbox */
  2443. .vr {
  2444. border: 1px inset;
  2445. margin: 1px;
  2446. }
  2447. /* ----------------------------------------- */
  2448. /* Typography */
  2449. /* ----------------------------------------- */
  2450. .pf2e, .app.sheet.actor {
  2451. font-family: var(--sans-serif);
  2452. }
  2453. .pf2e h1, .pf2e h2, .pf2e h3, .pf2e h4, .app.sheet.actor h1, .app.sheet.actor h2, .app.sheet.actor h3, .app.sheet.actor h4 {
  2454. font-weight: 600;
  2455. }
  2456. .pf2e p, .app.sheet.actor p {
  2457. font-weight: 500;
  2458. }
  2459. .pf2e.sheet form span.pf2-icon,
  2460. .pf2e.sheet form span[data-pf2-action],
  2461. .pf2e.sheet form span[data-pf2-action] *,
  2462. .pf2e.sheet form span[data-pf2-check],
  2463. .pf2e.sheet form span[data-pf2-check] *,
  2464. .pf2-icon {
  2465. display: inline;
  2466. }
  2467. .pf2e.sheet form span.pf2-icon,
  2468. .pf2-icon {
  2469. font-family: "Pathfinder2eActions";
  2470. font-size: 1.2em;
  2471. }
  2472. .pf2e.sheet form span.pf2-icon.larger,
  2473. .pf2-icon.larger {
  2474. font-size: 1.5em;
  2475. }
  2476. section.roll-note, p.compact-text {
  2477. display: inline-block;
  2478. font-weight: normal;
  2479. line-height: 1.4em;
  2480. margin: 0.5em 0;
  2481. min-height: 1rem;
  2482. }
  2483. .activity-icon {
  2484. align-self: center;
  2485. display: inline;
  2486. margin: 0;
  2487. padding: 0;
  2488. font-family: Pathfinder2eActions;
  2489. font-size: 1.2em;
  2490. }
  2491. /* ----------------------------------------- */
  2492. /* Styled table */
  2493. /* ----------------------------------------- */
  2494. table.pf2-table {
  2495. border: solid 1px #000000;
  2496. border-collapse: collapse;
  2497. font-size: var(--font-size-13);
  2498. color: #191813;
  2499. user-select: text;
  2500. }
  2501. table.pf2-table thead, table.pf2-table tbody, table.pf2-table tr, table.pf2-table th, table.pf2-table td {
  2502. box-sizing: border-box;
  2503. user-select: text;
  2504. }
  2505. table.pf2-table tr:nth-child(odd) {
  2506. background-color: #eee5c8;
  2507. }
  2508. table.pf2-table tr:nth-child(even) {
  2509. background-color: #f6f1e1;
  2510. }
  2511. table.pf2-table th {
  2512. color: white;
  2513. font-weight: bold;
  2514. background-color: #522e2c;
  2515. }
  2516. table.pf2-table th, table.pf2-table td {
  2517. border: solid 1px #808080;
  2518. padding: 6px 15px;
  2519. text-align: center;
  2520. }
  2521. a.inline-roll, a.content-link {
  2522. font-weight: 500;
  2523. line-height: 1.6em;
  2524. }
  2525. a.foundry-href {
  2526. color: var(--primary);
  2527. font-weight: 500;
  2528. text-decoration: underline;
  2529. }
  2530. /* ----------------------------------------- */
  2531. /* PF2E Action Custom Element */
  2532. /* ----------------------------------------- */
  2533. [data-pf2-action] {
  2534. background: var(--inline-link-bg);
  2535. border-radius: 2px;
  2536. border: 1px solid var(--color-border-dark-tertiary);
  2537. box-sizing: border-box;
  2538. cursor: pointer;
  2539. font-weight: 500;
  2540. line-height: 1.5em;
  2541. padding: 1px 0.2em 0;
  2542. white-space: nowrap;
  2543. word-break: break-all;
  2544. }
  2545. [data-pf2-action][data-pf2-glyph]::before {
  2546. font-family: "Pathfinder2eActions";
  2547. font-size: 1.5em;
  2548. margin-right: 2px;
  2549. color: var(--color-text-dark-inactive);
  2550. }
  2551. [data-pf2-action]:not([data-pf2-glyph])::before,
  2552. [data-pf2-action][data-pf2-glyph=""]::before {
  2553. display: inline-block;
  2554. height: 15px;
  2555. width: 15px;
  2556. background-image: url("../icons/actions/Passive.webp");
  2557. background-repeat: no-repeat;
  2558. background-size: 15px 15px;
  2559. opacity: 0.4;
  2560. margin-bottom: -3px;
  2561. margin-right: 2px;
  2562. content: "";
  2563. }
  2564. [data-pf2-action][data-pf2-glyph=A]::before,
  2565. [data-pf2-action][data-pf2-glyph=a]::before,
  2566. [data-pf2-action][data-pf2-glyph="1"]::before {
  2567. content: "A";
  2568. }
  2569. [data-pf2-action][data-pf2-glyph=D]::before,
  2570. [data-pf2-action][data-pf2-glyph=d]::before,
  2571. [data-pf2-action][data-pf2-glyph="2"]::before {
  2572. content: "D";
  2573. }
  2574. [data-pf2-action][data-pf2-glyph=T]::before,
  2575. [data-pf2-action][data-pf2-glyph=t]::before,
  2576. [data-pf2-action][data-pf2-glyph="3"]::before {
  2577. content: "T";
  2578. }
  2579. [data-pf2-action][data-pf2-glyph=F]::before,
  2580. [data-pf2-action][data-pf2-glyph=f]::before {
  2581. content: "F";
  2582. }
  2583. [data-pf2-action][data-pf2-glyph=R]::before,
  2584. [data-pf2-action][data-pf2-glyph=r]::before {
  2585. content: "R";
  2586. }
  2587. /* ----------------------------------------- */
  2588. /* PF2E Check Custom Element */
  2589. /* ----------------------------------------- */
  2590. span[data-pf2-check] {
  2591. background: var(--inline-link-bg);
  2592. border-radius: 2px;
  2593. border: 1px solid var(--color-border-dark-tertiary);
  2594. box-sizing: border-box;
  2595. cursor: pointer;
  2596. font-weight: 500;
  2597. line-height: 1.5em;
  2598. padding: 1px 0.2em 0;
  2599. white-space: nowrap;
  2600. word-break: break-all;
  2601. }
  2602. span[data-pf2-check]::before {
  2603. font-family: "Font Awesome 5 Free";
  2604. font-weight: 900;
  2605. margin-right: 0.25em;
  2606. color: var(--color-text-dark-inactive);
  2607. content: "\f6cf";
  2608. }
  2609. span[data-pf2-check][data-pf2-check=reflex]::before {
  2610. content: "\f70c";
  2611. }
  2612. span[data-pf2-check][data-pf2-check=will]::before {
  2613. content: "\f5dc";
  2614. }
  2615. span[data-pf2-check][data-pf2-check=fortitude]::before {
  2616. content: "\f21e";
  2617. }
  2618. span[data-pf2-check][data-pf2-check=perception]::before {
  2619. content: "\f06e";
  2620. }
  2621. span[data-pf2-check][data-pf2-traits*=secret] {
  2622. background: var(--blind-roll);
  2623. border-color: #720073;
  2624. }
  2625. /* ----------------------------------------- */
  2626. /* PF2E Inline Template Custom Element */
  2627. /* ----------------------------------------- */
  2628. span[data-pf2-effect-area] {
  2629. background: var(--inline-link-bg);
  2630. border-radius: 2px;
  2631. border: 1px solid var(--color-border-dark-tertiary);
  2632. box-sizing: border-box;
  2633. cursor: pointer;
  2634. font-weight: 500;
  2635. line-height: 1.5em;
  2636. padding: 1px 0.2em 0;
  2637. white-space: nowrap;
  2638. word-break: break-all;
  2639. }
  2640. span[data-pf2-effect-area]::before {
  2641. color: var(--color-text-dark-inactive);
  2642. font-family: "Font Awesome 5 Free";
  2643. font-weight: 900;
  2644. margin-right: 0.25em;
  2645. }
  2646. span[data-pf2-effect-area][data-pf2-effect-area=cone]::before {
  2647. content: "\f104";
  2648. }
  2649. span[data-pf2-effect-area][data-pf2-effect-area=line]::before {
  2650. content: "\f7a5";
  2651. }
  2652. span[data-pf2-effect-area][data-pf2-effect-area=burst]::before {
  2653. content: "\f111";
  2654. }
  2655. span[data-pf2-effect-area][data-pf2-effect-area=emanation]::before {
  2656. content: "\f192";
  2657. }
  2658. span[data-pf2-effect-area][data-pf2-effect-area=rect]::before {
  2659. content: "\f0c8";
  2660. }
  2661. /* ----------------------------------------- */
  2662. /* PF2E Inline Repost Element */
  2663. /* ----------------------------------------- */
  2664. i[data-pf2-repost] {
  2665. 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;
  2666. background: var(--inline-repost-bg);
  2667. color: var(--color-text-dark-inactive);
  2668. border-left: 1px solid var(--color-border-dark-tertiary);
  2669. background: rgba(255, 255, 255, 0.6);
  2670. padding: 2px;
  2671. margin-right: -3px;
  2672. margin-left: 2px;
  2673. text-shadow: none;
  2674. }
  2675. i[data-pf2-repost]:hover {
  2676. color: white;
  2677. text-shadow: 0px 0px 2px black;
  2678. }
  2679. [data-visibility]:not([data-visibility=all]) {
  2680. border-radius: 1px;
  2681. box-sizing: border-box;
  2682. display: inline-block;
  2683. line-height: 1em;
  2684. outline: 1px dotted rgba(75, 74, 68, 0.5);
  2685. padding: 2px 1px 0px;
  2686. /* ----------------------------------------- */
  2687. /* GM Visibility Elements */
  2688. /* ----------------------------------------- */
  2689. /* ----------------------------------------- */
  2690. /* Owner Visibility Elements */
  2691. /* ----------------------------------------- */
  2692. }
  2693. [data-visibility]:not([data-visibility=all])[data-visibility=gm] {
  2694. background: var(--visibility-gm-bg);
  2695. }
  2696. [data-visibility]:not([data-visibility=all])[data-visibility=gm].message-sender {
  2697. max-width: fit-content;
  2698. }
  2699. [data-visibility]:not([data-visibility=all])[data-visibility=gm] [data-visibility=gm] {
  2700. outline: none;
  2701. padding: initial;
  2702. }
  2703. [data-visibility]:not([data-visibility=all])[data-visibility=owner] {
  2704. background: var(--visibility-owner-bg);
  2705. }
  2706. [data-visibility]:not([data-visibility=all])[data-visibility=owner] [data-visibility=owner] {
  2707. outline: none;
  2708. padding: initial;
  2709. }
  2710. /* ----------------------------------------- */
  2711. /* Forms */
  2712. /* ----------------------------------------- */
  2713. .crb-style {
  2714. display: flex;
  2715. }
  2716. .crb-style .details-label {
  2717. font-family: var(--sans-serif);
  2718. font-size: 0.625rem;
  2719. font-weight: 800;
  2720. line-height: 1;
  2721. text-transform: uppercase;
  2722. color: var(--primary);
  2723. margin-right: 2px;
  2724. white-space: nowrap;
  2725. }
  2726. .crb-style .details-input {
  2727. color: var(--text-dark);
  2728. font-family: var(--body-serif);
  2729. font-weight: bold;
  2730. width: calc(100% - 6px);
  2731. border-bottom: 1px solid #d3ccbc;
  2732. background-color: rgba(28, 28, 28, 0.1);
  2733. }
  2734. .crb-style .details-input::placeholder {
  2735. filter: opacity(0.5);
  2736. }
  2737. .crb-style .details-input:focus {
  2738. border-bottom: 1px solid var(--alt);
  2739. }
  2740. .crb-style .details-input[type=number] {
  2741. padding-bottom: 0;
  2742. padding-left: 4px;
  2743. }
  2744. .crb-style input {
  2745. border: none;
  2746. border-radius: 0;
  2747. }
  2748. .crb-style input:focus {
  2749. box-shadow: none;
  2750. }
  2751. .crb-style input:focus::placeholder {
  2752. color: transparent;
  2753. }
  2754. .crb-style input::placeholder {
  2755. color: inherit;
  2756. }
  2757. .crb-style input::-webkit-outer-spin-button, .crb-style input::-webkit-inner-spin-button {
  2758. -webkit-appearance: none;
  2759. margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
  2760. }
  2761. .crb-style input[type=number] {
  2762. -moz-appearance: textfield;
  2763. }
  2764. .crb-style select {
  2765. font-size: var(--font-size-14);
  2766. font-family: var(--serif);
  2767. font-weight: 500;
  2768. color: var(--text-light);
  2769. position: relative;
  2770. background-color: var(--alt);
  2771. border-radius: 2px;
  2772. line-height: 1;
  2773. cursor: pointer;
  2774. padding: 4px 18px 3px 5px;
  2775. -webkit-appearance: none;
  2776. -moz-appearance: none;
  2777. text-overflow: ellipsis;
  2778. background-image: url("../assets/icons/chevron-down.svg");
  2779. background-repeat: no-repeat;
  2780. background-position: right 0.25em top 50%;
  2781. background-size: 1em auto;
  2782. height: auto;
  2783. border: 1px solid #53422a;
  2784. }
  2785. .crb-style select option {
  2786. background-color: var(--alt);
  2787. }
  2788. .crb-style .dots span {
  2789. cursor: pointer;
  2790. }
  2791. input[type=range]:disabled::-webkit-slider-runnable-track {
  2792. background: rgba(0, 0, 0, 0.1);
  2793. border: rgba(0, 0, 0, 0.1);
  2794. box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1), 0px 0px 1px rgba(0, 0, 0, 0.1);
  2795. cursor: default;
  2796. }
  2797. input[type=range]:disabled::-moz-range-track {
  2798. background: rgba(0, 0, 0, 0.1);
  2799. border: rgba(0, 0, 0, 0.1);
  2800. box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1), 0px 0px 1px rgba(0, 0, 0, 0.1);
  2801. cursor: default;
  2802. }
  2803. input[type=range]:disabled::-webkit-slider-thumb {
  2804. background: var(--color-text-light-1);
  2805. border: var(--color-text-light-1);
  2806. box-shadow: 1px 1px 1px var(--color-text-light-1), 0px 0px 1px var(--color-text-light-1);
  2807. cursor: default;
  2808. }
  2809. input[type=range]:disabled::-moz-range-thumb {
  2810. background: var(--color-text-light-1);
  2811. border: var(--color-text-light-1);
  2812. box-shadow: 1px 1px 1px var(--color-text-light-1), 0px 0px 1px var(--color-text-light-1);
  2813. cursor: default;
  2814. }
  2815. a[href]:hover {
  2816. text-shadow: 0 0 8px var(--color-text-hyperlink);
  2817. }
  2818. .crb-style.sheet .window-content {
  2819. background: url("../assets/sheet/background.webp") no-repeat;
  2820. background-size: cover;
  2821. }
  2822. .actors-sidebar .directory-item.actor h4 {
  2823. line-height: normal;
  2824. display: flex;
  2825. flex-direction: column;
  2826. justify-content: center;
  2827. }
  2828. .actors-sidebar .directory-item.actor .actor-level {
  2829. font-size: x-small;
  2830. color: var(--color-text-light-primary);
  2831. }
  2832. .actors-sidebar .party-list {
  2833. flex: 0 1 auto;
  2834. margin: 0;
  2835. padding: 0;
  2836. }
  2837. .actors-sidebar .party .party-header {
  2838. background: rgba(255, 255, 255, 0.2);
  2839. border-top: 1px solid var(--color-border-dark);
  2840. border-bottom: 1px solid var(--color-border-dark);
  2841. line-height: 1.5rem;
  2842. padding: 6px;
  2843. display: flex;
  2844. align-items: center;
  2845. }
  2846. .actors-sidebar .party .party-header .fa-fw {
  2847. cursor: pointer;
  2848. flex: 0 0 auto;
  2849. margin-right: 10px;
  2850. font-size: var(--font-size-16);
  2851. }
  2852. .actors-sidebar .party .party-header h3 {
  2853. flex: 1;
  2854. margin: 0;
  2855. overflow: hidden;
  2856. white-space: nowrap;
  2857. font-size: var(--font-size-16);
  2858. }
  2859. .actors-sidebar .party .party-header .controls {
  2860. flex: 0;
  2861. display: flex;
  2862. font-size: var(--font-size-14);
  2863. }
  2864. .actors-sidebar .party.collapsed .party-header {
  2865. background: rgba(0, 0, 0, 0.5);
  2866. }
  2867. .actors-sidebar .party.collapsed .subdirectory {
  2868. display: none;
  2869. }
  2870. .directory-item.item img.thumbnail {
  2871. object-fit: contain;
  2872. }
  2873. .directory-item.item h4 {
  2874. line-height: normal;
  2875. display: flex;
  2876. flex-direction: column;
  2877. justify-content: center;
  2878. }
  2879. .directory-item.item .item-level {
  2880. font-size: x-small;
  2881. color: var(--color-text-light-primary);
  2882. }
  2883. #chat-log {
  2884. display: flex;
  2885. flex-direction: column;
  2886. }
  2887. #chat-log > .message:first-child {
  2888. margin-top: auto;
  2889. }
  2890. .chat-roll-details .window-content {
  2891. display: flex;
  2892. flex-direction: column;
  2893. gap: 1em;
  2894. width: 100%;
  2895. flex: 1 1 auto;
  2896. overflow: hidden;
  2897. }
  2898. .chat-roll-details .summary {
  2899. flex: 0 1 auto;
  2900. }
  2901. .chat-roll-details .summary .type {
  2902. display: flex;
  2903. align-items: baseline;
  2904. gap: 2px;
  2905. }
  2906. .chat-roll-details .summary .domains.tags {
  2907. margin-top: 4px;
  2908. justify-items: flex-end;
  2909. }
  2910. .chat-roll-details .summary .domains.tags .tag {
  2911. text-transform: none;
  2912. }
  2913. .chat-roll-details .body {
  2914. display: flex;
  2915. flex-direction: row;
  2916. gap: 1em;
  2917. width: 100%;
  2918. }
  2919. .chat-roll-details .roll-options, .chat-roll-details .modifiers {
  2920. display: flex;
  2921. flex: 1;
  2922. flex-direction: column;
  2923. height: 100%;
  2924. overflow: hidden;
  2925. }
  2926. .chat-roll-details .roll-options ul {
  2927. overflow: hidden scroll;
  2928. scrollbar-width: thin;
  2929. scrollbar-color: var(--primary) transparent;
  2930. margin: 0;
  2931. padding: 0;
  2932. flex: 1 0 0;
  2933. list-style-type: none;
  2934. border-radius: 3px;
  2935. white-space: nowrap;
  2936. border: 1px solid var(--color-border-dark-tertiary);
  2937. overflow-x: auto;
  2938. }
  2939. .chat-roll-details .roll-options li {
  2940. user-select: text;
  2941. line-height: 1.5em;
  2942. padding-left: 5px;
  2943. }
  2944. .chat-roll-details .roll-options li:nth-child(even) {
  2945. background-color: rgba(0, 0, 0, 0.0666666667);
  2946. }
  2947. .chat-roll-details .modifier-list {
  2948. overflow: hidden scroll;
  2949. scrollbar-width: thin;
  2950. scrollbar-color: var(--primary) transparent;
  2951. flex: 1 0 0;
  2952. display: flex;
  2953. flex-direction: column;
  2954. gap: 4px;
  2955. }
  2956. .chat-roll-details .modifier-list .modifier {
  2957. border: 1px solid black;
  2958. border-radius: 3px;
  2959. padding: 4px;
  2960. }
  2961. .chat-roll-details .modifier-list .modifier.disabled {
  2962. border-style: dashed;
  2963. opacity: 0.6;
  2964. }
  2965. .chat-roll-details .modifier-list .modifier h4 {
  2966. font-size: 1.1em;
  2967. }
  2968. .chat-roll-details .modifier-list .modifier > div {
  2969. display: flex;
  2970. justify-content: space-between;
  2971. align-items: baseline;
  2972. }
  2973. .chat-message h3 {
  2974. border-bottom: none;
  2975. }
  2976. .chat-message button > i {
  2977. margin-right: 0;
  2978. }
  2979. .chat-message.emote > .message-content {
  2980. font-style: italic;
  2981. }
  2982. .chat-message.emote > .message-content p.action-content {
  2983. display: flex;
  2984. align-items: center;
  2985. font-weight: normal;
  2986. }
  2987. .chat-message.emote > .message-content p.action-content img {
  2988. height: 2.33em;
  2989. width: 2.33em;
  2990. float: left;
  2991. margin-right: 0.5em;
  2992. }
  2993. .chat-message.emote > .message-content hr.action-divider {
  2994. margin: 0;
  2995. }
  2996. .chat-message > .message-header .flavor-text h4.action {
  2997. font-weight: 700;
  2998. line-height: 1.5em;
  2999. margin: 0;
  3000. }
  3001. .chat-message > .message-header .flavor-text .target-dc-result {
  3002. line-height: 0.75rem;
  3003. margin-bottom: 4px;
  3004. }
  3005. .chat-message > .message-header .flavor-text .target-dc-result .target-dc, .chat-message > .message-header .flavor-text .target-dc-result .result {
  3006. display: block;
  3007. margin: 1px 0;
  3008. width: fit-content;
  3009. }
  3010. .chat-message > .message-header .flavor-text .target-dc-result .unadjusted {
  3011. text-decoration: line-through;
  3012. }
  3013. .chat-message > .message-header .flavor-text .target-dc-result .adjusted {
  3014. text-decoration: underline dotted;
  3015. }
  3016. .chat-message > .message-header .flavor-text .target-dc-result .adjusted.increased {
  3017. color: rgb(0, 128, 0);
  3018. }
  3019. .chat-message > .message-header .flavor-text .target-dc-result .adjusted.decreased {
  3020. color: rgb(255, 0, 0);
  3021. }
  3022. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .criticalSuccess {
  3023. color: rgb(0, 128, 0);
  3024. }
  3025. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .success {
  3026. color: rgb(0, 0, 255);
  3027. }
  3028. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .failure {
  3029. color: rgb(255, 69, 0);
  3030. }
  3031. .chat-message > .message-header .flavor-text .target-dc-result .degree-of-success .criticalFailure {
  3032. color: rgb(255, 0, 0);
  3033. }
  3034. .chat-message > .message-header .flavor-text .effect {
  3035. display: flex;
  3036. align-items: center;
  3037. column-gap: 5px;
  3038. }
  3039. .chat-message > .message-header .flavor-text .effect img {
  3040. height: 32px;
  3041. width: 32px;
  3042. }
  3043. .chat-message > .message-content .message-buttons {
  3044. display: flex;
  3045. margin: 0.35em 0 2px;
  3046. }
  3047. .chat-message .message-content .damage-roll:not(:first-child) {
  3048. margin-top: 1em;
  3049. }
  3050. .chat-message .message-content .damage-roll .dice-result .dice-formula {
  3051. align-items: center;
  3052. display: flex;
  3053. flex-wrap: wrap;
  3054. gap: 0.25em;
  3055. justify-content: center;
  3056. }
  3057. .chat-message .message-content .damage-roll .dice-result .dice-formula .instance {
  3058. padding: 0 0.25em;
  3059. }
  3060. .chat-message .message-content .damage-roll .dice-result .dice-total {
  3061. flex-direction: column;
  3062. font-weight: normal;
  3063. }
  3064. .chat-message .message-content .damage-roll .dice-result .dice-total .total {
  3065. font-weight: 700;
  3066. padding: 0 2ch;
  3067. }
  3068. .chat-message .message-content .damage-roll .dice-result .dice-total .total .increased-from {
  3069. color: var(--color-text-dark-2);
  3070. font-size: var(--font-size-16);
  3071. font-weight: normal;
  3072. vertical-align: 15%;
  3073. }
  3074. .chat-message .message-content .damage-roll .dice-result .dice-total .instances {
  3075. align-items: center;
  3076. display: flex;
  3077. flex-wrap: wrap;
  3078. font-size: var(--font-size-12);
  3079. justify-content: center;
  3080. line-height: var(--font-size-12);
  3081. margin-bottom: 0.2em;
  3082. vertical-align: top;
  3083. }
  3084. .chat-message .message-content .damage-roll .dice-result .dice-total .instances .instance {
  3085. padding: 0.15em 0.25em;
  3086. }
  3087. .chat-message .message-content .damage-roll .dice-result .dice-tooltip {
  3088. display: flex;
  3089. flex-direction: column;
  3090. gap: 0.25em;
  3091. margin-bottom: 0.25em;
  3092. }
  3093. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance {
  3094. border-radius: 2px;
  3095. border-style: solid;
  3096. border-width: 1px;
  3097. }
  3098. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance > header {
  3099. align-items: center;
  3100. display: flex;
  3101. justify-content: space-between;
  3102. margin-bottom: 0.1em;
  3103. }
  3104. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance .dice .part-formula, .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance .dice .part-total {
  3105. color: var(--color-text-dark-secondary);
  3106. }
  3107. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance > header, .chat-message .message-content .damage-roll .dice-result .dice-tooltip .instance .dice {
  3108. padding: 0.2em;
  3109. }
  3110. .chat-message .message-content .damage-roll .dice-result .instance {
  3111. white-space: nowrap;
  3112. }
  3113. .chat-message .message-content .damage-roll .dice-result .instance:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.tooltip-part > header {
  3114. background: rgba(60, 60, 60, 0.125);
  3115. }
  3116. .chat-message .message-content .damage-roll .dice-result .instance.acid {
  3117. border-color: #007300;
  3118. color: #003300;
  3119. }
  3120. .chat-message .message-content .damage-roll .dice-result .instance.acid:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.acid.tooltip-part > header {
  3121. background: rgba(0, 115, 0, 0.125);
  3122. }
  3123. .chat-message .message-content .damage-roll .dice-result .instance.acid .icon {
  3124. color: #007300;
  3125. }
  3126. .chat-message .message-content .damage-roll .dice-result .instance.bleed {
  3127. border-color: #99001a;
  3128. color: #59000f;
  3129. }
  3130. .chat-message .message-content .damage-roll .dice-result .instance.bleed:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.bleed.tooltip-part > header {
  3131. background: rgba(153, 0, 26, 0.125);
  3132. }
  3133. .chat-message .message-content .damage-roll .dice-result .instance.bleed .icon {
  3134. color: #99001a;
  3135. }
  3136. .chat-message .message-content .damage-roll .dice-result .instance.bludgeoning {
  3137. border-color: #3c3c3c;
  3138. color: #1c1c1c;
  3139. }
  3140. .chat-message .message-content .damage-roll .dice-result .instance.bludgeoning:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.bludgeoning.tooltip-part > header {
  3141. background: rgba(60, 60, 60, 0.125);
  3142. }
  3143. .chat-message .message-content .damage-roll .dice-result .instance.bludgeoning .icon {
  3144. color: #3c3c3c;
  3145. }
  3146. .chat-message .message-content .damage-roll .dice-result .instance.chaotic {
  3147. border-color: #a600a6;
  3148. color: #660066;
  3149. }
  3150. .chat-message .message-content .damage-roll .dice-result .instance.chaotic:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.chaotic.tooltip-part > header {
  3151. background: rgba(166, 0, 166, 0.125);
  3152. }
  3153. .chat-message .message-content .damage-roll .dice-result .instance.chaotic .icon {
  3154. color: #a600a6;
  3155. }
  3156. .chat-message .message-content .damage-roll .dice-result .instance.cold {
  3157. border-color: #2f2fa6;
  3158. color: #212174;
  3159. }
  3160. .chat-message .message-content .damage-roll .dice-result .instance.cold:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.cold.tooltip-part > header {
  3161. background: rgba(47, 47, 166, 0.125);
  3162. }
  3163. .chat-message .message-content .damage-roll .dice-result .instance.cold .icon {
  3164. color: #2f2fa6;
  3165. }
  3166. .chat-message .message-content .damage-roll .dice-result .instance.electricity {
  3167. border-color: darkgoldenrod;
  3168. color: #7c5a07;
  3169. }
  3170. .chat-message .message-content .damage-roll .dice-result .instance.electricity:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.electricity.tooltip-part > header {
  3171. background: rgba(184, 134, 11, 0.125);
  3172. }
  3173. .chat-message .message-content .damage-roll .dice-result .instance.electricity .icon {
  3174. color: darkgoldenrod;
  3175. }
  3176. .chat-message .message-content .damage-roll .dice-result .instance.evil {
  3177. border-color: indigo;
  3178. color: #260042;
  3179. }
  3180. .chat-message .message-content .damage-roll .dice-result .instance.evil:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.evil.tooltip-part > header {
  3181. background: rgba(75, 0, 130, 0.125);
  3182. }
  3183. .chat-message .message-content .damage-roll .dice-result .instance.evil .icon {
  3184. color: indigo;
  3185. }
  3186. .chat-message .message-content .damage-roll .dice-result .instance.fire {
  3187. border-color: #a62f00;
  3188. color: #661d00;
  3189. }
  3190. .chat-message .message-content .damage-roll .dice-result .instance.fire:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.fire.tooltip-part > header {
  3191. background: rgba(166, 47, 0, 0.125);
  3192. }
  3193. .chat-message .message-content .damage-roll .dice-result .instance.fire .icon {
  3194. color: #a62f00;
  3195. }
  3196. .chat-message .message-content .damage-roll .dice-result .instance.force {
  3197. border-color: #6300aa;
  3198. color: #3e006a;
  3199. }
  3200. .chat-message .message-content .damage-roll .dice-result .instance.force:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.force.tooltip-part > header {
  3201. background: rgba(99, 0, 170, 0.125);
  3202. }
  3203. .chat-message .message-content .damage-roll .dice-result .instance.force .icon {
  3204. color: #6300aa;
  3205. }
  3206. .chat-message .message-content .damage-roll .dice-result .instance.good {
  3207. border-color: #9d730a;
  3208. color: #614706;
  3209. }
  3210. .chat-message .message-content .damage-roll .dice-result .instance.good:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.good.tooltip-part > header {
  3211. background: rgba(157, 115, 10, 0.125);
  3212. }
  3213. .chat-message .message-content .damage-roll .dice-result .instance.good .icon {
  3214. color: #9d730a;
  3215. }
  3216. .chat-message .message-content .damage-roll .dice-result .instance.lawful {
  3217. border-color: #402600;
  3218. color: black;
  3219. }
  3220. .chat-message .message-content .damage-roll .dice-result .instance.lawful:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.lawful.tooltip-part > header {
  3221. background: rgba(64, 38, 0, 0.125);
  3222. }
  3223. .chat-message .message-content .damage-roll .dice-result .instance.lawful .icon {
  3224. color: #402600;
  3225. }
  3226. .chat-message .message-content .damage-roll .dice-result .instance.mental {
  3227. border-color: midnightblue;
  3228. color: #0d0d3c;
  3229. }
  3230. .chat-message .message-content .damage-roll .dice-result .instance.mental:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.mental.tooltip-part > header {
  3231. background: rgba(25, 25, 112, 0.125);
  3232. }
  3233. .chat-message .message-content .damage-roll .dice-result .instance.mental .icon {
  3234. color: midnightblue;
  3235. }
  3236. .chat-message .message-content .damage-roll .dice-result .instance.negative {
  3237. border-color: #00001f;
  3238. color: #00001f;
  3239. }
  3240. .chat-message .message-content .damage-roll .dice-result .instance.negative:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.negative.tooltip-part > header {
  3241. background: rgba(0, 0, 31, 0.125);
  3242. }
  3243. .chat-message .message-content .damage-roll .dice-result .instance.negative .icon {
  3244. color: #00001f;
  3245. }
  3246. .chat-message .message-content .damage-roll .dice-result .instance.piercing {
  3247. border-color: #3c3c3c;
  3248. color: #1c1c1c;
  3249. }
  3250. .chat-message .message-content .damage-roll .dice-result .instance.piercing:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.piercing.tooltip-part > header {
  3251. background: rgba(60, 60, 60, 0.125);
  3252. }
  3253. .chat-message .message-content .damage-roll .dice-result .instance.piercing .icon {
  3254. color: #3c3c3c;
  3255. }
  3256. .chat-message .message-content .damage-roll .dice-result .instance.poison {
  3257. border-color: #5b7332;
  3258. color: #38471f;
  3259. }
  3260. .chat-message .message-content .damage-roll .dice-result .instance.poison:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.poison.tooltip-part > header {
  3261. background: rgba(91, 115, 50, 0.125);
  3262. }
  3263. .chat-message .message-content .damage-roll .dice-result .instance.poison .icon {
  3264. color: #5b7332;
  3265. }
  3266. .chat-message .message-content .damage-roll .dice-result .instance.positive {
  3267. border-color: #ffffe0;
  3268. color: #ffffa0;
  3269. }
  3270. .chat-message .message-content .damage-roll .dice-result .instance.positive:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.positive.tooltip-part > header {
  3271. background: rgba(255, 255, 224, 0.125);
  3272. text-shadow: 1px 1px black;
  3273. }
  3274. .chat-message .message-content .damage-roll .dice-result .instance.positive .icon {
  3275. color: #ffffe0;
  3276. }
  3277. .chat-message .message-content .damage-roll .dice-result .instance.slashing {
  3278. border-color: #3c3c3c;
  3279. color: #1c1c1c;
  3280. }
  3281. .chat-message .message-content .damage-roll .dice-result .instance.slashing:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.slashing.tooltip-part > header {
  3282. background: rgba(60, 60, 60, 0.125);
  3283. }
  3284. .chat-message .message-content .damage-roll .dice-result .instance.slashing .icon {
  3285. color: #3c3c3c;
  3286. }
  3287. .chat-message .message-content .damage-roll .dice-result .instance.sonic {
  3288. border-color: darkcyan;
  3289. color: #004b4b;
  3290. }
  3291. .chat-message .message-content .damage-roll .dice-result .instance.sonic:not(.tooltip-part), .chat-message .message-content .damage-roll .dice-result .instance.sonic.tooltip-part > header {
  3292. background: rgba(0, 139, 139, 0.125);
  3293. }
  3294. .chat-message .message-content .damage-roll .dice-result .instance.sonic .icon {
  3295. color: darkcyan;
  3296. }
  3297. .chat-message .message-content .damage-roll .dice-result .instance .precision, .chat-message .message-content .damage-roll .dice-result .instance .splash {
  3298. border-color: inherit;
  3299. border-width: 1px;
  3300. border-style: dotted;
  3301. padding: 1px 2px;
  3302. line-height: 0;
  3303. }
  3304. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type {
  3305. margin-bottom: 3px;
  3306. }
  3307. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type h3 {
  3308. text-transform: capitalize;
  3309. padding-left: 3px;
  3310. padding-right: 1px;
  3311. }
  3312. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type i.fa {
  3313. flex: none;
  3314. margin: 2px;
  3315. }
  3316. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .damage-type .dice {
  3317. margin-left: 2px;
  3318. margin-right: 2px;
  3319. }
  3320. .chat-message .message-content .damage-roll .dice-result .dice-tooltip .dice .part-header .part-flavor {
  3321. text-transform: capitalize;
  3322. }
  3323. .chat-message .message-content .damage-application {
  3324. display: flex;
  3325. justify-content: center;
  3326. margin-top: 3px;
  3327. order: 3;
  3328. }
  3329. .chat-message .message-content .damage-application button {
  3330. align-items: center;
  3331. display: flex;
  3332. flex-direction: column;
  3333. font-size: var(--font-size-18);
  3334. height: 2em;
  3335. justify-content: space-around;
  3336. line-height: unset;
  3337. padding: 0;
  3338. }
  3339. .chat-message .message-content .damage-application button.half-damage {
  3340. position: relative;
  3341. }
  3342. .chat-message .message-content .damage-application button.half-damage .transparent-half {
  3343. background: rgb(248, 247, 233);
  3344. display: block;
  3345. height: 24px;
  3346. left: 49%;
  3347. opacity: 0.6;
  3348. position: absolute;
  3349. top: 0px;
  3350. width: 10px;
  3351. }
  3352. .chat-message .message-content .damage-application button > img {
  3353. border: none;
  3354. height: var(--font-size-18);
  3355. }
  3356. .chat-message .message-content .damage-application button.heal-damage .fa-stack {
  3357. font-size: 0.5em;
  3358. }
  3359. .chat-message .message-content .damage-application button.heal-damage .fa-stack i.fa-plus {
  3360. font-size: var(--font-size-10);
  3361. }
  3362. .chat-message .message-content .damage-application button .label {
  3363. font-size: var(--font-size-9);
  3364. font-weight: 500;
  3365. text-transform: uppercase;
  3366. }
  3367. .chat-message .message-content .damage-taken .persistent {
  3368. font-style: normal;
  3369. margin-top: 1em;
  3370. }
  3371. .chat-message .message-content .damage-taken .persistent h4 {
  3372. border-bottom: 1px solid var(--color-underline-header);
  3373. max-width: fit-content;
  3374. }
  3375. .chat-message .message-content .damage-taken button.revert-damage {
  3376. align-items: center;
  3377. background: var(--bg-dark);
  3378. display: inline-flex;
  3379. justify-content: center;
  3380. width: 3ch;
  3381. margin-left: 2px;
  3382. }
  3383. .chat-message .message-content .damage-taken .reverted {
  3384. text-decoration: line-through;
  3385. }
  3386. .chat-message .flavor-text .pf2e-reroll-indicator {
  3387. float: right;
  3388. }
  3389. .chat-message .message-content .pf2e-reroll-discard .dice-total, .chat-message .message-content .pf2e-reroll-discard .dice-tooltip {
  3390. opacity: 0.3;
  3391. }
  3392. .chat-message .message-content .pf2e-reroll-second .dice-formula {
  3393. display: none;
  3394. }
  3395. .chat-message > .message-header {
  3396. align-items: center;
  3397. margin-bottom: 0.33em;
  3398. }
  3399. .chat-message > .message-content .dice-roll .statuseffect-message {
  3400. font-weight: 700;
  3401. }
  3402. .chat-message > .message-content .dice-roll .statuseffect-message ul {
  3403. padding: 0.5em;
  3404. margin: 0;
  3405. }
  3406. .chat-message > .message-content .dice-roll .statuseffect-message ul li {
  3407. cursor: help;
  3408. }
  3409. .chat-message > .message-content .dice-roll .statuseffect-rules {
  3410. font-size: var(--font-size-13);
  3411. font-weight: 500;
  3412. }
  3413. .chat-message > .message-content .dice-roll .statuseffect-rules h2 {
  3414. font-weight: 700;
  3415. }
  3416. section.compendium-sidebar .directory-header .header-search {
  3417. padding: 0 24px 0 3px;
  3418. }
  3419. section.compendium-sidebar li.compendium-type ol.document-matches {
  3420. background: rgba(0, 0, 0, 0.25);
  3421. padding: 0;
  3422. }
  3423. section.compendium-sidebar li.compendium-type ol.document-matches li.match {
  3424. align-items: center;
  3425. column-gap: 2px;
  3426. cursor: pointer;
  3427. display: grid;
  3428. font-size: var(--font-size-12);
  3429. grid-template-areas: "thumbnail name" "thumbnail details";
  3430. grid-template-columns: 38px 1fr;
  3431. grid-template-rows: 1fr 1fr;
  3432. list-style: none;
  3433. padding: 2px 0 2px 4px;
  3434. }
  3435. section.compendium-sidebar li.compendium-type ol.document-matches li.match:hover {
  3436. background: rgba(255, 255, 255, 0.1);
  3437. }
  3438. section.compendium-sidebar li.compendium-type ol.document-matches li.match > * {
  3439. align-items: inherit;
  3440. display: flex;
  3441. height: 100%;
  3442. }
  3443. section.compendium-sidebar li.compendium-type ol.document-matches li.match .thumbnail {
  3444. grid-area: thumbnail;
  3445. justify-content: start;
  3446. }
  3447. section.compendium-sidebar li.compendium-type ol.document-matches li.match .thumbnail img {
  3448. border: none;
  3449. height: 36px;
  3450. object-fit: contain;
  3451. object-position: 50% 0;
  3452. padding: 2px 0;
  3453. width: 36px;
  3454. }
  3455. section.compendium-sidebar li.compendium-type ol.document-matches li.match .name {
  3456. grid-area: name;
  3457. }
  3458. section.compendium-sidebar li.compendium-type ol.document-matches li.match .details {
  3459. color: var(--color-text-light-primary);
  3460. grid-area: details;
  3461. }
  3462. #pack-search-drag-preview {
  3463. background: url(../../../ui/parchment.jpg) repeat;
  3464. border-bottom: 1px solid var(--color-border-light-1);
  3465. border-top: 1px solid transparent;
  3466. box-shadow: none;
  3467. display: flex;
  3468. height: 50px;
  3469. line-height: 48px;
  3470. position: absolute;
  3471. text-shadow: 0 0 0.5rem var(--color-shadow-primary);
  3472. top: -1000px;
  3473. width: 328px;
  3474. }
  3475. #pack-search-drag-preview img {
  3476. border: none;
  3477. height: 48px;
  3478. }
  3479. #pack-search-drag-preview h4 {
  3480. color: var(--color-text-dark-primary);
  3481. font-size: var(--font-size-14);
  3482. }
  3483. .combat-sidebar li.combatant {
  3484. cursor: default;
  3485. padding: 3px 0 3px 3px;
  3486. }
  3487. .combat-sidebar li.combatant.gm-draggable {
  3488. cursor: grab;
  3489. }
  3490. .combat-sidebar li.combatant .token-name h4 {
  3491. flex-direction: row;
  3492. }
  3493. .combat-sidebar li.combatant .token-name h4 .users-targeting {
  3494. display: inline-block;
  3495. font-size: x-small;
  3496. line-height: inherit;
  3497. padding: 0 0.3em;
  3498. text-shadow: none;
  3499. vertical-align: bottom;
  3500. }
  3501. .combat-sidebar li.combatant.drag-preview {
  3502. background: rgba(0, 0, 0, 0.75);
  3503. box-shadow: 0 0 6px inset var(--color-shadow-highlight);
  3504. }
  3505. .combat-sidebar li.combatant.drag-gap {
  3506. visibility: hidden;
  3507. }
  3508. .combat-sidebar li.combatant .hidden-name .token-name h4 {
  3509. color: var(--color-text-light-7);
  3510. }
  3511. .hover {
  3512. cursor: pointer;
  3513. }
  3514. .hover-content {
  3515. display: none;
  3516. }
  3517. .crb-hover .tooltipster-box {
  3518. border-style: solid;
  3519. border-image-outset: 0;
  3520. border-width: 9px;
  3521. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  3522. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  3523. background-color: rgba(0, 0, 0, 0.9);
  3524. overflow: visible;
  3525. }
  3526. .crb-hover .tooltipster-box .tooltipster-content {
  3527. margin: 0;
  3528. padding: 0;
  3529. }
  3530. .crb-hover .tooltipster-box .tooltipster-content .hover-content {
  3531. display: flex;
  3532. min-width: 120px;
  3533. max-width: fit-content;
  3534. padding: 4px;
  3535. line-height: 1;
  3536. flex-direction: column;
  3537. }
  3538. .crb-hover .tooltipster-box .tooltipster-content .hover-content p {
  3539. font-size: var(--font-size-14);
  3540. font-family: var(--body-serif);
  3541. font-weight: 400;
  3542. }
  3543. .crb-hover .tooltipster-box .tooltipster-content .hover-content h1,
  3544. .crb-hover .tooltipster-box .tooltipster-content .hover-content h2,
  3545. .crb-hover .tooltipster-box .tooltipster-content .hover-content h3 {
  3546. font-size: var(--font-size-12);
  3547. font-weight: 500;
  3548. text-align: left;
  3549. }
  3550. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title {
  3551. display: flex;
  3552. justify-content: space-between;
  3553. align-items: baseline;
  3554. border-bottom: 1px solid var(--sidebar-title);
  3555. margin: 0.25em 0 0.5em;
  3556. flex: 1 auto;
  3557. }
  3558. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title h2,
  3559. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title a {
  3560. font-family: var(--sans-serif);
  3561. font-size: var(--font-size-10);
  3562. text-transform: uppercase;
  3563. letter-spacing: 0.05em;
  3564. text-rendering: optimizeLegibility;
  3565. border: none;
  3566. margin: 0;
  3567. line-height: 1.5;
  3568. color: var(--sidebar-title);
  3569. }
  3570. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title h2 + h2,
  3571. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title a + h2 {
  3572. font-size: var(--font-size-11);
  3573. }
  3574. .crb-hover .tooltipster-box .tooltipster-content .hover-content .sidebar_title a {
  3575. color: white;
  3576. text-decoration: none;
  3577. }
  3578. .crb-hover .tooltipster-box .tooltipster-content .hover-content.select-shield {
  3579. width: 160px;
  3580. }
  3581. .crb-hover .tooltipster-box .tooltipster-content .hover-content.select-shield ul li.item .data {
  3582. position: relative;
  3583. top: -2px;
  3584. }
  3585. .crb-hover .tooltipster-box .tooltipster-content .hover-content.select-shield ul li.item .tag-legacy {
  3586. width: auto;
  3587. }
  3588. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option {
  3589. color: rgba(255, 255, 255, 0.5);
  3590. }
  3591. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option i.fas {
  3592. margin: 1px 4px 1px 0;
  3593. }
  3594. .crb-hover .tooltipster-box .tooltipster-content .hover-content a.item-location-option.selected {
  3595. color: white;
  3596. }
  3597. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul {
  3598. list-style: none;
  3599. margin: 0;
  3600. padding: 0;
  3601. flex: 1 auto;
  3602. }
  3603. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input {
  3604. color: white;
  3605. border: none;
  3606. border-radius: 0;
  3607. background: transparent;
  3608. font-family: var(--body-serif);
  3609. width: 100%;
  3610. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  3611. }
  3612. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input:focus {
  3613. box-shadow: none;
  3614. border-bottom: 1px solid white;
  3615. }
  3616. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input:focus::placeholder {
  3617. color: transparent;
  3618. }
  3619. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input::placeholder {
  3620. color: rgba(255, 255, 255, 0.8);
  3621. }
  3622. .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 {
  3623. -webkit-appearance: none;
  3624. appearance: none;
  3625. margin: 0;
  3626. }
  3627. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul input[type=number] {
  3628. appearance: textfield;
  3629. -moz-appearance: textfield;
  3630. }
  3631. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul select {
  3632. border-radius: 2px;
  3633. height: 18px;
  3634. border: 1px solid white;
  3635. background: transparent;
  3636. cursor: pointer;
  3637. }
  3638. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul select option {
  3639. font-size: 0.8rem;
  3640. min-height: 1rem;
  3641. color: var(--body);
  3642. text-transform: capitalize;
  3643. }
  3644. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul label {
  3645. display: flex;
  3646. align-items: center;
  3647. text-align: left;
  3648. font-family: var(--serif);
  3649. font-weight: 500;
  3650. }
  3651. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .label,
  3652. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .data {
  3653. font-size: var(--font-size-12);
  3654. font-family: var(--serif);
  3655. font-weight: 400;
  3656. color: white;
  3657. margin: 0;
  3658. padding: 0;
  3659. }
  3660. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item {
  3661. display: grid;
  3662. grid: "data label close" min-content "data type close" min-content/30px 1fr;
  3663. margin: 8px 0;
  3664. align-items: center;
  3665. column-gap: 8px;
  3666. justify-items: start;
  3667. }
  3668. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item:first-child {
  3669. border: none;
  3670. }
  3671. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.no-effect {
  3672. filter: opacity(0.5);
  3673. position: relative;
  3674. }
  3675. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .tag-legacy {
  3676. font-family: var(--sans-serif);
  3677. font-size: var(--font-size-10);
  3678. text-transform: uppercase;
  3679. letter-spacing: 0.05em;
  3680. text-rendering: optimizeLegibility;
  3681. display: flex;
  3682. justify-content: center;
  3683. align-items: center;
  3684. color: var(--tertiary);
  3685. grid-area: type;
  3686. letter-spacing: 0.5px;
  3687. white-space: nowrap;
  3688. width: min-content;
  3689. }
  3690. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .tag-legacy .remove-modifier {
  3691. white-space: nowrap;
  3692. }
  3693. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .label {
  3694. grid-area: label;
  3695. }
  3696. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .data {
  3697. grid-area: data;
  3698. text-align: right;
  3699. font-size: var(--font-size-21);
  3700. justify-self: right;
  3701. width: min-content;
  3702. padding-top: 2px;
  3703. }
  3704. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item .remove-modifier {
  3705. grid-area: close;
  3706. font-size: 0.8rem;
  3707. cursor: pointer;
  3708. }
  3709. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.add-modifier {
  3710. border-top: 1px solid var(--sidebar-title);
  3711. padding-top: 5px;
  3712. grid: "value name name" 1fr "type type btn" 1fr/42px 1fr 1fr;
  3713. font-size: 0.8rem;
  3714. gap: 0.25rem 0.5rem;
  3715. align-items: baseline;
  3716. }
  3717. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.add-modifier .add-modifier-value {
  3718. grid-area: value;
  3719. font-size: 1rem;
  3720. text-align: right;
  3721. display: grid;
  3722. grid: "input plus" 1fr "input minus" 1fr/1fr 10px;
  3723. column-gap: 4px;
  3724. align-items: center;
  3725. }
  3726. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.add-modifier .add-modifier-value input {
  3727. grid-area: input;
  3728. }
  3729. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.add-modifier .add-modifier-value .fas {
  3730. font-size: var(--font-size-9);
  3731. cursor: pointer;
  3732. margin-top: 2px;
  3733. }
  3734. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.add-modifier .add-modifier-value .fas.fa-plus-circle {
  3735. grid-area: plus;
  3736. }
  3737. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.add-modifier .add-modifier-value .fas.fa-minus-circle {
  3738. grid-area: minus;
  3739. }
  3740. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.add-modifier .add-modifier-name {
  3741. grid-area: name;
  3742. }
  3743. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .item.add-modifier .add-modifier-submit {
  3744. font-family: var(--sans-serif);
  3745. font-size: var(--font-size-10);
  3746. text-transform: uppercase;
  3747. letter-spacing: 0.05em;
  3748. text-rendering: optimizeLegibility;
  3749. grid-area: btn;
  3750. white-space: nowrap;
  3751. line-height: 1.5;
  3752. background-color: black;
  3753. color: var(--tertiary);
  3754. }
  3755. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .label,
  3756. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .data,
  3757. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .data::placeholder {
  3758. color: rgba(255, 255, 255, 0.5);
  3759. }
  3760. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul .disabled .label {
  3761. text-decoration: line-through;
  3762. }
  3763. .crb-hover .tooltipster-box .tooltipster-content .hover-content.manage-tabs ul li {
  3764. display: flex;
  3765. }
  3766. .crb-hover .tooltipster-box .tooltipster-content .hover-content.manage-tabs ul li label {
  3767. color: var(--tertiary);
  3768. flex-basis: 100%;
  3769. }
  3770. .crb-hover .tooltipster-box .tooltipster-content .hover-content.manage-tabs ul li input {
  3771. display: flex;
  3772. min-width: 2em;
  3773. }
  3774. .crb-hover .tooltipster-box .tooltipster-content .hover-content.carry-hover-content {
  3775. white-space: nowrap;
  3776. }
  3777. .crb-hover .tooltipster-box .tooltipster-content .hover-content.carry-hover-content a.item-control i.fas {
  3778. min-width: 1.25em;
  3779. }
  3780. .damage-dialog {
  3781. background: none;
  3782. box-shadow: none;
  3783. }
  3784. .damage-dialog .window-header {
  3785. border: none;
  3786. 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);
  3787. background: linear-gradient(90deg, var(--secondary) 0%, #202b93 50%, var(--secondary) 100%);
  3788. border-radius: 0;
  3789. margin-bottom: 2px;
  3790. font-size: var(--font-size-13);
  3791. }
  3792. .damage-dialog .window-content {
  3793. border-style: solid;
  3794. border-image-outset: 0;
  3795. border-width: 9px;
  3796. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  3797. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  3798. padding-top: 0;
  3799. }
  3800. .damage-dialog .window-content button {
  3801. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  3802. background-color: var(--alt);
  3803. border-radius: 2px;
  3804. color: white;
  3805. cursor: pointer;
  3806. font-family: var(--sans-serif);
  3807. }
  3808. .damage-dialog .window-content button:hover {
  3809. text-shadow: 0 0 2px var(--tertiary);
  3810. }
  3811. .damage-dialog .window-content .dialog-row {
  3812. align-items: center;
  3813. display: grid;
  3814. grid: "mod type value exclude" 1fr/1.5fr 1fr 60px 55px;
  3815. padding: 8px 0;
  3816. }
  3817. .damage-dialog .window-content .dialog-row.header {
  3818. font-size: var(--font-size-13);
  3819. font-weight: 700;
  3820. padding-bottom: 0;
  3821. }
  3822. .damage-dialog .window-content .dialog-row.header + hr {
  3823. margin-bottom: 0;
  3824. }
  3825. .damage-dialog .window-content .dialog-row .type {
  3826. grid-area: type;
  3827. text-transform: capitalize;
  3828. }
  3829. .damage-dialog .window-content .dialog-row .dice-type {
  3830. margin-right: 10px;
  3831. }
  3832. .damage-dialog .window-content .dialog-row .dice-type, .damage-dialog .window-content .dialog-row .modifier-type {
  3833. display: flex;
  3834. }
  3835. .damage-dialog .window-content .dialog-row .dice-type .value, .damage-dialog .window-content .dialog-row .modifier-type .value {
  3836. margin-right: 8px;
  3837. }
  3838. .damage-dialog .window-content .dialog-row .dice-type .icon-container, .damage-dialog .window-content .dialog-row .modifier-type .icon-container {
  3839. display: table;
  3840. width: 35px;
  3841. }
  3842. .damage-dialog .window-content .dialog-row .dice-type .icon-container i, .damage-dialog .window-content .dialog-row .modifier-type .icon-container i {
  3843. display: table-cell;
  3844. vertical-align: middle;
  3845. text-align: start;
  3846. font-size: 1rem;
  3847. }
  3848. .damage-dialog .window-content .dialog-row .mod {
  3849. grid-area: mod;
  3850. }
  3851. .damage-dialog .window-content .dialog-row .no-mod {
  3852. filter: opacity(0.7);
  3853. }
  3854. .damage-dialog .window-content .dialog-row .value {
  3855. grid-area: value;
  3856. justify-self: center;
  3857. }
  3858. .damage-dialog .window-content .dialog-row .exclude {
  3859. grid-area: exclude;
  3860. justify-self: right;
  3861. }
  3862. .damage-dialog .window-content .dialog-row .exclude.toggle {
  3863. background: var(--secondary);
  3864. border-radius: 50px;
  3865. box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2);
  3866. cursor: pointer;
  3867. height: 19px;
  3868. margin: 4px auto;
  3869. position: relative;
  3870. width: 46px;
  3871. }
  3872. .damage-dialog .window-content .dialog-row .exclude.toggle::before {
  3873. color: white;
  3874. content: "ON";
  3875. left: 6px;
  3876. position: absolute;
  3877. z-index: 0;
  3878. }
  3879. .damage-dialog .window-content .dialog-row .exclude.toggle::after {
  3880. color: black;
  3881. content: "OFF";
  3882. position: absolute;
  3883. right: 4px;
  3884. text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15);
  3885. z-index: 0;
  3886. }
  3887. .damage-dialog .window-content .dialog-row .exclude.toggle::after, .damage-dialog .window-content .dialog-row .exclude.toggle::before {
  3888. font-family: var(--sans-serif);
  3889. font-size: var(--font-size-10);
  3890. text-transform: uppercase;
  3891. letter-spacing: 0.05em;
  3892. text-rendering: optimizeLegibility;
  3893. top: 4px;
  3894. }
  3895. .damage-dialog .window-content .dialog-row .exclude.toggle label {
  3896. background: #fcfff4;
  3897. background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  3898. border-radius: 50px;
  3899. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0px 2px 5px 0px rgba(0, 0, 0, 0.3);
  3900. cursor: pointer;
  3901. display: block;
  3902. height: 16px;
  3903. position: absolute;
  3904. right: 1px;
  3905. top: 1px;
  3906. transition: all 0.4s ease;
  3907. width: 19px;
  3908. z-index: 1;
  3909. }
  3910. .damage-dialog .window-content .dialog-row .exclude.toggle input[type=checkbox] {
  3911. visibility: hidden;
  3912. }
  3913. .damage-dialog .window-content .dialog-row .exclude.toggle input[type=checkbox]:not(:checked) + label {
  3914. right: 23px;
  3915. }
  3916. .damage-dialog .window-content .dialog-row .acid {
  3917. color: #007300;
  3918. }
  3919. .damage-dialog .window-content .dialog-row .bleed {
  3920. color: #99001a;
  3921. }
  3922. .damage-dialog .window-content .dialog-row .bludgeoning {
  3923. color: #3c3c3c;
  3924. }
  3925. .damage-dialog .window-content .dialog-row .chaotic {
  3926. color: #a600a6;
  3927. }
  3928. .damage-dialog .window-content .dialog-row .cold {
  3929. color: #2f2fa6;
  3930. }
  3931. .damage-dialog .window-content .dialog-row .electricity {
  3932. color: darkgoldenrod;
  3933. }
  3934. .damage-dialog .window-content .dialog-row .evil {
  3935. color: indigo;
  3936. }
  3937. .damage-dialog .window-content .dialog-row .fire {
  3938. color: #a62f00;
  3939. }
  3940. .damage-dialog .window-content .dialog-row .force {
  3941. color: #6300aa;
  3942. }
  3943. .damage-dialog .window-content .dialog-row .good {
  3944. color: #9d730a;
  3945. }
  3946. .damage-dialog .window-content .dialog-row .lawful {
  3947. color: #402600;
  3948. }
  3949. .damage-dialog .window-content .dialog-row .mental {
  3950. color: midnightblue;
  3951. }
  3952. .damage-dialog .window-content .dialog-row .negative {
  3953. color: #00001f;
  3954. }
  3955. .damage-dialog .window-content .dialog-row .piercing {
  3956. color: #3c3c3c;
  3957. }
  3958. .damage-dialog .window-content .dialog-row .poision {
  3959. color: #5b7332;
  3960. }
  3961. .damage-dialog .window-content .dialog-row .positive {
  3962. color: #ffffe0;
  3963. }
  3964. .damage-dialog .window-content .dialog-row .slashing {
  3965. color: #3c3c3c;
  3966. }
  3967. .damage-dialog .window-content .dialog-row .sonic {
  3968. color: darkcyan;
  3969. }
  3970. .damage-dialog .window-content .modifier-container {
  3971. display: flex;
  3972. flex-direction: column;
  3973. }
  3974. .damage-dialog .window-content .modifier-container .dialog-row {
  3975. border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  3976. }
  3977. .damage-dialog .window-content .modifier-container .dialog-row:last-child {
  3978. border-bottom: none;
  3979. }
  3980. .damage-dialog .window-content .modifier-container .dialog-row .tag {
  3981. background-color: var(--sub);
  3982. border-radius: 2px;
  3983. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25);
  3984. color: white;
  3985. font-family: var(--sans-serif);
  3986. font-size: var(--font-size-10);
  3987. letter-spacing: 0.5px;
  3988. padding: 4px 8px;
  3989. text-transform: uppercase;
  3990. width: fit-content;
  3991. }
  3992. .damage-dialog .window-content .modifier-container .dialog-row.disabled {
  3993. text-decoration: line-through;
  3994. }
  3995. .damage-dialog .window-content .modifier-container .dialog-row.disabled span, .damage-dialog .window-content .modifier-container .dialog-row.disabled div {
  3996. filter: opacity(0.5);
  3997. }
  3998. .damage-dialog .window-content .modifier-container .dialog-row.disabled span i, .damage-dialog .window-content .modifier-container .dialog-row.disabled div i {
  3999. color: black;
  4000. }
  4001. .damage-dialog .window-content .modifier-container .dialog-row.disabled .toggle {
  4002. background: rgba(0, 0, 0, 0.4);
  4003. }
  4004. .damage-dialog .window-content .modifier-container .dialog-row.disabled .toggle input[type=checkbox] + label {
  4005. right: 26px;
  4006. }
  4007. .damage-dialog .window-content .modifier-container .dialog-row.disabled.hidden {
  4008. display: none;
  4009. }
  4010. .damage-dialog .window-content .modifier-container + hr {
  4011. margin-top: 0;
  4012. }
  4013. .damage-dialog .window-content .total-mod {
  4014. font-weight: 700;
  4015. padding: 0;
  4016. }
  4017. .damage-dialog .window-content .add-modifier-panel {
  4018. display: grid;
  4019. grid-template-columns: 100px 4.5fr 4.5fr 3.5fr 32px 50px;
  4020. column-gap: 4px;
  4021. justify-items: center;
  4022. }
  4023. .damage-dialog .window-content .add-modifier-panel select,
  4024. .damage-dialog .window-content .add-modifier-panel input {
  4025. height: auto;
  4026. }
  4027. .damage-dialog .window-content .add-modifier-panel .add-modifier-type {
  4028. cursor: pointer;
  4029. width: 100%;
  4030. }
  4031. .damage-dialog .window-content .add-modifier-panel .add-modifier-category {
  4032. cursor: pointer;
  4033. width: 100%;
  4034. }
  4035. .damage-dialog .window-content .add-modifier-panel .add-modifier-damage-type {
  4036. cursor: pointer;
  4037. width: 100%;
  4038. }
  4039. .damage-dialog .window-content .add-modifier-panel .add-modifier {
  4040. line-height: 1;
  4041. margin: 0;
  4042. padding: 4px 0;
  4043. text-transform: uppercase;
  4044. font-weight: 700;
  4045. font-size: 0.75rem;
  4046. }
  4047. .damage-dialog .window-content .add-dice-panel {
  4048. display: grid;
  4049. grid-template-columns: 100px 32px 1.5fr 3.5fr 3fr 50px;
  4050. column-gap: 4px;
  4051. justify-items: center;
  4052. }
  4053. .damage-dialog .window-content .add-dice-panel select,
  4054. .damage-dialog .window-content .add-dice-panel input {
  4055. height: auto;
  4056. }
  4057. .damage-dialog .window-content .add-dice-panel select:disabled {
  4058. cursor: default;
  4059. }
  4060. .damage-dialog .window-content .add-dice-panel .add-dice-faces {
  4061. cursor: pointer;
  4062. }
  4063. .damage-dialog .window-content .add-dice-panel .add-dice-type {
  4064. cursor: pointer;
  4065. width: 100%;
  4066. }
  4067. .damage-dialog .window-content .add-dice-panel .add-dice-category {
  4068. cursor: pointer;
  4069. width: 100%;
  4070. }
  4071. .damage-dialog .window-content .add-dice-panel .add-dice {
  4072. line-height: 1;
  4073. margin: 0;
  4074. padding: 4px 0;
  4075. text-transform: uppercase;
  4076. font-weight: 700;
  4077. font-size: 0.75rem;
  4078. }
  4079. .damage-dialog .window-content .roll-mode-panel {
  4080. display: flex;
  4081. flex-wrap: nowrap;
  4082. align-items: stretch;
  4083. }
  4084. .damage-dialog .window-content .roll-mode-panel .label {
  4085. flex: 1 40%;
  4086. }
  4087. .damage-dialog .window-content .roll-mode-panel select {
  4088. flex: 2 60%;
  4089. height: auto;
  4090. width: 100%;
  4091. margin-right: 4px;
  4092. border-radius: 2px;
  4093. cursor: pointer;
  4094. }
  4095. .damage-dialog .window-content .roll {
  4096. color: white;
  4097. background-color: var(--secondary);
  4098. }
  4099. .dice-checks {
  4100. background: none;
  4101. box-shadow: none;
  4102. }
  4103. .dice-checks .window-header {
  4104. border: none;
  4105. 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);
  4106. background: linear-gradient(90deg, var(--secondary) 0%, #202b93 50%, var(--secondary) 100%);
  4107. border-radius: 0;
  4108. margin-bottom: 2px;
  4109. font-size: var(--font-size-13);
  4110. }
  4111. .dice-checks .window-content {
  4112. border-style: solid;
  4113. border-image-outset: 0;
  4114. border-width: 9px;
  4115. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  4116. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  4117. padding-top: 0;
  4118. }
  4119. .dice-checks .window-content button {
  4120. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  4121. background-color: var(--alt);
  4122. border-radius: 2px;
  4123. color: white;
  4124. cursor: pointer;
  4125. font-family: var(--sans-serif);
  4126. }
  4127. .dice-checks .window-content button:hover {
  4128. text-shadow: 0 0 2px var(--tertiary);
  4129. }
  4130. .dice-checks .window-content .dialog-row {
  4131. align-items: center;
  4132. display: grid;
  4133. grid: "mod type value exclude" 1fr/1.5fr 1fr 36px 50px;
  4134. padding: 8px 0;
  4135. }
  4136. .dice-checks .window-content .dialog-row.header {
  4137. font-size: var(--font-size-13);
  4138. font-weight: 700;
  4139. padding-bottom: 0;
  4140. }
  4141. .dice-checks .window-content .dialog-row.header + hr {
  4142. margin-bottom: 0;
  4143. }
  4144. .dice-checks .window-content .dialog-row .type {
  4145. grid-area: type;
  4146. text-transform: capitalize;
  4147. }
  4148. .dice-checks .window-content .dialog-row .mod {
  4149. grid-area: mod;
  4150. }
  4151. .dice-checks .window-content .dialog-row .value {
  4152. grid-area: value;
  4153. justify-self: center;
  4154. }
  4155. .dice-checks .window-content .dialog-row .exclude {
  4156. grid-area: exclude;
  4157. justify-self: right;
  4158. }
  4159. .dice-checks .window-content .dialog-row .exclude.toggle {
  4160. background: var(--secondary);
  4161. border-radius: 50px;
  4162. box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2);
  4163. cursor: pointer;
  4164. height: 19px;
  4165. margin: 4px auto;
  4166. position: relative;
  4167. width: 46px;
  4168. }
  4169. .dice-checks .window-content .dialog-row .exclude.toggle::before {
  4170. color: white;
  4171. content: "ON";
  4172. left: 6px;
  4173. position: absolute;
  4174. z-index: 0;
  4175. }
  4176. .dice-checks .window-content .dialog-row .exclude.toggle::after {
  4177. color: black;
  4178. content: "OFF";
  4179. position: absolute;
  4180. right: 4px;
  4181. text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15);
  4182. z-index: 0;
  4183. }
  4184. .dice-checks .window-content .dialog-row .exclude.toggle::after, .dice-checks .window-content .dialog-row .exclude.toggle::before {
  4185. font-family: var(--sans-serif);
  4186. font-size: var(--font-size-10);
  4187. text-transform: uppercase;
  4188. letter-spacing: 0.05em;
  4189. text-rendering: optimizeLegibility;
  4190. top: 4px;
  4191. }
  4192. .dice-checks .window-content .dialog-row .exclude.toggle label {
  4193. background: #fcfff4;
  4194. background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  4195. border-radius: 50px;
  4196. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0px 2px 5px 0px rgba(0, 0, 0, 0.3);
  4197. cursor: pointer;
  4198. display: block;
  4199. height: 16px;
  4200. position: absolute;
  4201. right: 1px;
  4202. top: 1px;
  4203. transition: all 0.4s ease;
  4204. width: 19px;
  4205. z-index: 1;
  4206. }
  4207. .dice-checks .window-content .dialog-row .exclude.toggle input[type=checkbox] {
  4208. visibility: hidden;
  4209. }
  4210. .dice-checks .window-content .dialog-row .exclude.toggle input[type=checkbox]:not(:checked) + label {
  4211. right: 23px;
  4212. }
  4213. .dice-checks .window-content .substitutions, .dice-checks .window-content .modifier-container {
  4214. display: flex;
  4215. flex-direction: column;
  4216. }
  4217. .dice-checks .window-content .substitutions .dialog-row, .dice-checks .window-content .modifier-container .dialog-row {
  4218. border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  4219. }
  4220. .dice-checks .window-content .substitutions .dialog-row:last-child, .dice-checks .window-content .modifier-container .dialog-row:last-child {
  4221. border-bottom: none;
  4222. }
  4223. .dice-checks .window-content .substitutions .dialog-row .tag, .dice-checks .window-content .modifier-container .dialog-row .tag {
  4224. background-color: var(--sub);
  4225. border-radius: 2px;
  4226. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25);
  4227. color: white;
  4228. font-family: var(--sans-serif);
  4229. font-size: var(--font-size-10);
  4230. letter-spacing: 0.5px;
  4231. padding: 4px 8px;
  4232. text-transform: uppercase;
  4233. width: fit-content;
  4234. }
  4235. .dice-checks .window-content .substitutions .dialog-row.disabled, .dice-checks .window-content .modifier-container .dialog-row.disabled {
  4236. text-decoration: line-through;
  4237. }
  4238. .dice-checks .window-content .substitutions .dialog-row.disabled span, .dice-checks .window-content .modifier-container .dialog-row.disabled span {
  4239. filter: opacity(0.5);
  4240. }
  4241. .dice-checks .window-content .substitutions .dialog-row.disabled .toggle, .dice-checks .window-content .modifier-container .dialog-row.disabled .toggle {
  4242. background: rgba(0, 0, 0, 0.4);
  4243. }
  4244. .dice-checks .window-content .substitutions .dialog-row.disabled .toggle input[type=checkbox] + label, .dice-checks .window-content .modifier-container .dialog-row.disabled .toggle input[type=checkbox] + label {
  4245. right: 26px;
  4246. }
  4247. .dice-checks .window-content .substitutions .dialog-row.disabled.hidden, .dice-checks .window-content .modifier-container .dialog-row.disabled.hidden {
  4248. display: none;
  4249. }
  4250. .dice-checks .window-content .substitutions + hr, .dice-checks .window-content .modifier-container + hr {
  4251. margin-top: 0;
  4252. }
  4253. .dice-checks .window-content .total-mod {
  4254. font-weight: 700;
  4255. padding: 0;
  4256. }
  4257. .dice-checks .window-content .fate {
  4258. display: flex;
  4259. justify-content: space-evenly;
  4260. align-items: center;
  4261. }
  4262. .dice-checks .window-content .fate label {
  4263. cursor: pointer;
  4264. }
  4265. .dice-checks .window-content .add-modifier-panel {
  4266. display: flex;
  4267. flex-wrap: nowrap;
  4268. align-items: stretch;
  4269. }
  4270. .dice-checks .window-content .add-modifier-panel select,
  4271. .dice-checks .window-content .add-modifier-panel input {
  4272. margin-right: 4px;
  4273. height: auto;
  4274. border-radius: 2px;
  4275. }
  4276. .dice-checks .window-content .add-modifier-panel .add-modifier-type {
  4277. flex: 0 30%;
  4278. width: 100%;
  4279. cursor: pointer;
  4280. }
  4281. .dice-checks .window-content .add-modifier-panel .add-modifier-name {
  4282. flex: 1 40%;
  4283. }
  4284. .dice-checks .window-content .add-modifier-panel .add-modifier-value {
  4285. flex: 1 10%;
  4286. }
  4287. .dice-checks .window-content .add-modifier-panel .add-modifier {
  4288. flex: 1 20%;
  4289. line-height: 1;
  4290. margin: 0;
  4291. padding: 4px 0;
  4292. text-transform: uppercase;
  4293. font-weight: 700;
  4294. font-size: 0.75rem;
  4295. }
  4296. .dice-checks .window-content .roll-mode-panel {
  4297. display: flex;
  4298. flex-wrap: nowrap;
  4299. align-items: stretch;
  4300. }
  4301. .dice-checks .window-content .roll-mode-panel .label {
  4302. flex: 1 40%;
  4303. }
  4304. .dice-checks .window-content .roll-mode-panel select {
  4305. flex: 2 60%;
  4306. height: auto;
  4307. width: 100%;
  4308. margin-right: 4px;
  4309. border-radius: 2px;
  4310. cursor: pointer;
  4311. }
  4312. .dice-checks .window-content .roll {
  4313. color: white;
  4314. background-color: var(--secondary);
  4315. }
  4316. .dialog.trick-magic-item .dialog-content p {
  4317. font-weight: normal;
  4318. }
  4319. .dialog.trick-magic-item .dialog-buttons {
  4320. flex-direction: column;
  4321. }
  4322. .icon {
  4323. font-style: normal;
  4324. }
  4325. .icon.anger::before {
  4326. content: "💢︎";
  4327. }
  4328. .icon.bang::before {
  4329. content: "💥︎";
  4330. }
  4331. .icon.collision::before {
  4332. content: "💥︎";
  4333. }
  4334. .icon.crystal-ball::before {
  4335. content: "🔮︎";
  4336. }
  4337. .icon.dizzy::before {
  4338. content: "💫︎";
  4339. }
  4340. .icon.diamond-with-dot::before {
  4341. content: "💠︎";
  4342. }
  4343. .icon.gemstone::before {
  4344. content: "💎︎";
  4345. }
  4346. .icon.gem-stone::before {
  4347. content: "💎︎";
  4348. }
  4349. .icon.glowing-star::before {
  4350. content: "🌟︎";
  4351. }
  4352. .icon.prayer-beads::before {
  4353. content: "📿︎";
  4354. }
  4355. .icon.ring::before {
  4356. content: "💍︎";
  4357. }
  4358. .icon.sparkle::before {
  4359. content: "❇︎";
  4360. }
  4361. .icon.sparkler::before {
  4362. content: "🎇︎";
  4363. }
  4364. .icon.sparkles::before {
  4365. content: "✨︎";
  4366. }
  4367. #token-hud .status-effects {
  4368. grid-template-columns: repeat(5, 1fr);
  4369. width: auto;
  4370. }
  4371. #token-hud .status-effects .effect-control {
  4372. border-radius: 1px;
  4373. color: var(--color-text-dark-1);
  4374. cursor: pointer;
  4375. height: 36px;
  4376. opacity: 0.75;
  4377. position: relative;
  4378. width: 36px;
  4379. }
  4380. #token-hud .status-effects .effect-control.active img {
  4381. border: 1px solid var(--color-border-highlight);
  4382. opacity: 1;
  4383. }
  4384. #token-hud .status-effects .effect-control img {
  4385. border: 1px solid rgba(0, 0, 0, 0);
  4386. height: 35px;
  4387. margin: 0;
  4388. width: 35px;
  4389. }
  4390. #token-hud .status-effects .effect-control:not(.active):hover img {
  4391. border: 1px solid rgba(255, 100, 0, 0.5);
  4392. }
  4393. #token-hud .status-effects .effect-control .badge {
  4394. background: rgba(255, 255, 255, 0.9);
  4395. border-radius: 50%;
  4396. border: 0.1em solid darkred;
  4397. font-size: var(--font-size-8);
  4398. height: 0.8rem;
  4399. line-height: var(--font-size-10);
  4400. pointer-events: none;
  4401. position: absolute;
  4402. right: -3px;
  4403. text-align: center;
  4404. top: -3px;
  4405. width: 0.8rem;
  4406. z-index: 1;
  4407. }
  4408. #token-hud .status-effects .effect-control.overridden > * {
  4409. filter: saturate(0);
  4410. }
  4411. #token-hud .status-effects .effect-control.valued .badge {
  4412. font-size: var(--font-size-12);
  4413. font-style: unset;
  4414. font-weight: 500;
  4415. line-height: var(--font-size-12);
  4416. }
  4417. #token-hud .status-effects .title-bar {
  4418. background: rgba(0, 0, 0, 0.6);
  4419. border-radius: inherit;
  4420. border: inherit;
  4421. box-shadow: inherit;
  4422. box-sizing: content-box;
  4423. font-size: var(--font-size-14);
  4424. font-weight: normal;
  4425. left: 0;
  4426. line-height: normal;
  4427. padding: 3px 0;
  4428. position: absolute;
  4429. text-align: center;
  4430. top: -30px;
  4431. visibility: hidden;
  4432. width: 100%;
  4433. z-index: 1;
  4434. }
  4435. #token-hud .status-effects .title-bar.active {
  4436. visibility: visible;
  4437. }
  4438. /* ----------------------------------------- */
  4439. /* Tag Selector */
  4440. /* ----------------------------------------- */
  4441. #tag-selector .trait-list {
  4442. flex: 1;
  4443. list-style: none;
  4444. margin: 0 0 0.5em;
  4445. padding: 0;
  4446. overflow-y: auto;
  4447. scrollbar-width: thin;
  4448. }
  4449. #tag-selector .trait-list td.list {
  4450. text-align: left;
  4451. }
  4452. #tag-selector .trait-list td.list input[type=checkbox],
  4453. #tag-selector .trait-list td.list label {
  4454. float: left;
  4455. line-height: 1.6em;
  4456. height: 1.6em;
  4457. margin: 0px 2px;
  4458. padding: 0px;
  4459. font-size: inherit;
  4460. }
  4461. #tag-selector .trait-list td.list input[type=checkbox] {
  4462. clear: left;
  4463. }
  4464. #tag-selector .trait-header {
  4465. flex: 0 0 32px;
  4466. line-height: 32px;
  4467. text-align: center;
  4468. margin: 0;
  4469. }
  4470. #tag-selector .trait-header .header-search {
  4471. flex: 1;
  4472. }
  4473. #tag-selector .trait-header .header-search input {
  4474. background: rgba(255, 255, 245, 0.8);
  4475. width: calc(100% - 26px);
  4476. margin: 0 2px;
  4477. }
  4478. #tag-selector .trait-footer {
  4479. flex: 0 0 32px;
  4480. line-height: 32px;
  4481. margin: 0;
  4482. margin-bottom: 5px;
  4483. border-top: 1px solid grey;
  4484. }
  4485. #tag-selector .window {
  4486. overflow-y: hidden;
  4487. }
  4488. #tag-selector .window .trait-label {
  4489. line-height: normal;
  4490. }
  4491. #tag-selector .window .trait-selection-label {
  4492. display: flex;
  4493. align-items: center;
  4494. }
  4495. #tag-selector .window .trait-selection-label .trait-label {
  4496. margin-left: 5px;
  4497. }
  4498. #tag-selector .window input:not([type=checkbox]) {
  4499. flex: 1.8;
  4500. }
  4501. .default section.window-content {
  4502. padding: 0;
  4503. overflow: hidden;
  4504. }
  4505. /* Adjust height of the header */
  4506. .ability-builder-popup .window-content {
  4507. background: url("../assets/sheet/background.webp");
  4508. background-repeat: repeat-x, no-repeat;
  4509. background-size: cover;
  4510. background-attachment: local;
  4511. height: 100%;
  4512. padding: 10px 20px 10px 20px;
  4513. position: relative;
  4514. }
  4515. .ability-builder-popup .window-content h3 {
  4516. font: 400 var(--font-size-24) var(--serif-condensed);
  4517. line-height: var(--font-size-24);
  4518. }
  4519. .ability-builder-popup .window-content h4 {
  4520. font: 400 var(--font-size-10) var(--sans-serif);
  4521. text-transform: uppercase;
  4522. color: #605856;
  4523. }
  4524. .ability-builder-popup .window-content button:focus:not(:focus-visible) {
  4525. box-shadow: none;
  4526. }
  4527. .ability-builder-popup .window-content .row {
  4528. display: flex;
  4529. align-items: center;
  4530. }
  4531. .ability-builder-popup .window-content .row .row-heading {
  4532. width: 220px;
  4533. }
  4534. .ability-builder-popup .window-content .row.not-eligible {
  4535. pointer-events: none;
  4536. filter: blur(1px);
  4537. opacity: 0.6;
  4538. }
  4539. .ability-builder-popup .window-content .row.not-eligible .remaining {
  4540. visibility: hidden;
  4541. }
  4542. .ability-builder-popup .window-content .row .abilities {
  4543. display: grid;
  4544. grid-template-columns: repeat(6, 84px);
  4545. grid-template-rows: auto;
  4546. flex: 0 0 auto;
  4547. }
  4548. .ability-builder-popup .window-content .row .full-row {
  4549. display: flex;
  4550. flex: 1;
  4551. justify-content: center;
  4552. }
  4553. .ability-builder-popup .window-content header.row {
  4554. align-items: normal;
  4555. padding-top: 10px;
  4556. height: 60px;
  4557. }
  4558. .ability-builder-popup .window-content header.row .row-column {
  4559. display: block;
  4560. }
  4561. .ability-builder-popup .window-content header.row .abilities {
  4562. align-items: normal;
  4563. }
  4564. .ability-builder-popup .window-content .background-stripes {
  4565. position: absolute;
  4566. left: 0;
  4567. top: 0;
  4568. bottom: 50px;
  4569. right: 0;
  4570. padding: 10px 20px 10px 20px;
  4571. pointer-events: none;
  4572. align-items: normal;
  4573. }
  4574. .ability-builder-popup .window-content .background-stripes .abilities div:nth-child(odd) {
  4575. background-color: rgba(68, 55, 48, 0.1);
  4576. }
  4577. .ability-builder-popup .window-content .voluntary-flaw-row {
  4578. margin: 0.5rem 0;
  4579. }
  4580. .ability-builder-popup .window-content .voluntary-flaw-row .flaw-buttons {
  4581. display: flex;
  4582. flex-direction: row;
  4583. }
  4584. .ability-builder-popup .window-content .voluntary-flaw-row .flaw-buttons button {
  4585. flex: 1 1 0;
  4586. }
  4587. .ability-builder-popup .window-content .voluntary-flaw-row .flaw-buttons button.first {
  4588. border-bottom-right-radius: 0;
  4589. border-right: none;
  4590. border-top-right-radius: 0;
  4591. width: 4em;
  4592. }
  4593. .ability-builder-popup .window-content .voluntary-flaw-row .flaw-buttons button.second {
  4594. border-bottom-left-radius: 0;
  4595. border-top-left-radius: 0;
  4596. max-width: 2em;
  4597. text-transform: none;
  4598. }
  4599. .ability-builder-popup .window-content .voluntary-flaw-row .flaw-buttons button.second.selected {
  4600. border-left-color: rgba(255, 255, 255, 0.5);
  4601. }
  4602. .ability-builder-popup .window-content .row-heading {
  4603. display: grid;
  4604. grid-template-columns: 42px 1fr auto;
  4605. grid-template-areas: "img description remaining";
  4606. align-items: center;
  4607. }
  4608. .ability-builder-popup .window-content .row-heading h3 {
  4609. grid-column: 1/4;
  4610. align-self: start;
  4611. font-size: var(--font-size-24);
  4612. }
  4613. .ability-builder-popup .window-content .row-heading .hint-container {
  4614. grid-column: 1/4;
  4615. }
  4616. .ability-builder-popup .window-content .row-heading img {
  4617. grid-area: img;
  4618. border: 0;
  4619. }
  4620. .ability-builder-popup .window-content .row-heading div.label {
  4621. grid-area: description;
  4622. display: flex;
  4623. flex-direction: column;
  4624. overflow: hidden;
  4625. white-space: nowrap;
  4626. text-overflow: ellipsis;
  4627. margin-right: 10px;
  4628. }
  4629. .ability-builder-popup .window-content .row-heading div.remaining {
  4630. grid-area: remaining;
  4631. display: flex;
  4632. margin-right: 10px;
  4633. width: 1.6rem;
  4634. height: 1.6rem;
  4635. border-radius: 50%;
  4636. background: rgba(68, 55, 48, 0.1);
  4637. align-self: center;
  4638. align-items: center;
  4639. justify-content: center;
  4640. text-align: center;
  4641. }
  4642. .ability-builder-popup .window-content .row-heading div.remaining.extra {
  4643. animation: glow 0.5s infinite alternate;
  4644. }
  4645. @keyframes glow {
  4646. from {
  4647. box-shadow: 0 0 1px 1px #ffb351;
  4648. }
  4649. to {
  4650. box-shadow: 0 0 3px 3px #ffb351;
  4651. }
  4652. }
  4653. .ability-builder-popup .window-content .row-column {
  4654. align-items: center;
  4655. display: flex;
  4656. flex-direction: column;
  4657. justify-content: center;
  4658. text-align: center;
  4659. }
  4660. .ability-builder-popup .window-content .row-column button {
  4661. align-items: center;
  4662. border: 1px solid var(--button-color);
  4663. color: var(--button-color);
  4664. display: flex;
  4665. font-size: var(--font-size-12);
  4666. justify-content: space-around;
  4667. outline: none;
  4668. margin: 0;
  4669. padding: 0.1em 0 0;
  4670. position: relative;
  4671. text-transform: uppercase;
  4672. width: 6em;
  4673. height: 1.5em;
  4674. }
  4675. .ability-builder-popup .window-content .row-column button.boost {
  4676. margin-top: auto;
  4677. --button-color: #316549;
  4678. --button-locked-color: #1b3c2a;
  4679. }
  4680. .ability-builder-popup .window-content .row-column button.flaw {
  4681. margin-bottom: auto;
  4682. --button-color: #5e0000;
  4683. --button-locked-color: #5e0000;
  4684. }
  4685. .ability-builder-popup .window-content .row-column button.selected {
  4686. background: var(--button-color);
  4687. }
  4688. .ability-builder-popup .window-content .row-column button:hover {
  4689. box-shadow: 0 0 5px var(--button-color);
  4690. cursor: pointer;
  4691. }
  4692. .ability-builder-popup .window-content .row-column button:hover.key-ability.selected {
  4693. box-shadow: none;
  4694. cursor: default;
  4695. }
  4696. .ability-builder-popup .window-content .row-column button:hover:disabled {
  4697. background: rgba(0, 0, 0, 0.04);
  4698. box-shadow: none;
  4699. cursor: not-allowed;
  4700. }
  4701. .ability-builder-popup .window-content .row-column button i.fas {
  4702. font-size: var(--font-size-10);
  4703. left: 0.5em;
  4704. position: absolute;
  4705. text-align: left;
  4706. }
  4707. .ability-builder-popup .window-content .row-column button.hidden {
  4708. pointer-events: none;
  4709. visibility: hidden;
  4710. }
  4711. .ability-builder-popup .window-content .row-column button:disabled {
  4712. background: rgba(0, 0, 0, 0.04);
  4713. opacity: 0.4;
  4714. }
  4715. .ability-builder-popup .window-content .row-column button:disabled:active {
  4716. pointer-events: none;
  4717. }
  4718. .ability-builder-popup .window-content .row-column button.locked {
  4719. background: var(--button-locked-color);
  4720. border-color: var(--button-locked-color);
  4721. pointer-events: none;
  4722. }
  4723. .ability-builder-popup .window-content .row-column button.locked, .ability-builder-popup .window-content .row-column button.selected {
  4724. color: white;
  4725. }
  4726. .ability-builder-popup .window-content .row-column div + .boost, .ability-builder-popup .window-content .row-column button + .boost {
  4727. margin-top: 4px;
  4728. }
  4729. .ability-builder-popup .window-content .summary-row .row-heading {
  4730. display: block;
  4731. }
  4732. .ability-builder-popup .window-content .summary-row .hint-container {
  4733. background: rgba(211, 204, 188, 0.4);
  4734. padding: 12px;
  4735. margin-right: 10px;
  4736. border: 1px solid rgb(211, 204, 188);
  4737. border-radius: 3px;
  4738. align-self: end;
  4739. }
  4740. .ability-builder-popup .window-content .summary-row .hint-container h3 {
  4741. color: var(--primary);
  4742. font-variant: small-caps;
  4743. font-size: var(--font-size-20);
  4744. line-height: var(--font-size-16);
  4745. font-family: var(--sans-serif-condensed);
  4746. font-weight: 500;
  4747. }
  4748. .ability-builder-popup .window-content .summary-row .hint-container p {
  4749. font-style: italic;
  4750. font-size: var(--font-size-12);
  4751. line-height: var(--font-size-14);
  4752. font-family: var(--sans-serif);
  4753. font-weight: 500;
  4754. margin-bottom: 3px;
  4755. }
  4756. .ability-builder-popup .window-content .summary-row .hint-container label {
  4757. display: flex;
  4758. align-items: center;
  4759. margin-top: 10px;
  4760. }
  4761. .ability-builder-popup .window-content .summary-row .abilities {
  4762. grid-template-rows: auto auto;
  4763. }
  4764. .ability-builder-popup .window-content .summary-row .row-column {
  4765. display: flex;
  4766. flex-direction: column;
  4767. padding-top: 10px;
  4768. }
  4769. .ability-builder-popup .window-content .summary-row .row-column .value {
  4770. height: 40px;
  4771. font: 700 var(--font-size-24) var(--serif);
  4772. line-height: var(--font-size-30);
  4773. }
  4774. .ability-builder-popup .window-content .summary-row .row-column input {
  4775. width: calc(100% - 20px);
  4776. flex-grow: 0;
  4777. height: 30px;
  4778. color: var(--text-dark);
  4779. font: 500 var(--font-size-24) var(--serif);
  4780. border: 0;
  4781. border-bottom: 1px solid #D3CCBC;
  4782. border-radius: 0;
  4783. background-color: transparent;
  4784. margin: 0 10px 10px 10px;
  4785. }
  4786. .ability-builder-popup .window-content .summary-row .row-column input::placeholder {
  4787. filter: opacity(0.5);
  4788. }
  4789. .ability-builder-popup .window-content .summary-row .row-column input:focus {
  4790. border-bottom: 1px solid var(--alt);
  4791. }
  4792. .ability-builder-popup .window-content .summary-row .row-column input[type=number] {
  4793. padding-bottom: 0;
  4794. padding-left: 4px;
  4795. }
  4796. .ability-builder-popup .window-content .summary-row .complete {
  4797. grid-row: 2;
  4798. grid-column: 1/7;
  4799. margin-top: 10px;
  4800. margin-left: auto;
  4801. }
  4802. .ability-builder-popup .window-content .summary-row button.complete {
  4803. color: white;
  4804. background: var(--secondary);
  4805. height: 35px;
  4806. width: 131px;
  4807. border: 1px solid var(--tertiary);
  4808. }
  4809. .ability-builder-popup .window-content .title {
  4810. color: var(--primary);
  4811. font: 500 var(--font-size-10) var(--sans-serif-condensed);
  4812. line-height: var(--font-size-10);
  4813. text-transform: uppercase;
  4814. }
  4815. .ability-builder-popup .window-content div[data-tooltip-content].description, .ability-builder-popup .window-content div[data-tooltip-content] .description {
  4816. text-decoration: underline dotted;
  4817. text-underline-offset: 2px;
  4818. }
  4819. .ability-builder-popup .window-content .description {
  4820. font: 600 var(--font-size-16) var(--serif);
  4821. }
  4822. .ability-builder-popup .window-content .extra {
  4823. display: flex;
  4824. align-items: center;
  4825. font-size: var(--font-size-12);
  4826. margin-top: -0.25rem;
  4827. }
  4828. .ability-builder-popup .window-content .extra .fas {
  4829. margin-left: 0.125rem;
  4830. }
  4831. .ability-builder-popup .window-content .extra input[type=checkbox] {
  4832. height: var(--font-size-12);
  4833. margin: 0;
  4834. }
  4835. .crb-hover .tooltipster-box .tooltipster-content .hover-content h2:not(:first-child) {
  4836. margin-top: 10px;
  4837. }
  4838. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul.boost-details li {
  4839. white-space: nowrap;
  4840. display: flex;
  4841. flex-direction: row;
  4842. align-items: center;
  4843. }
  4844. .crb-hover .tooltipster-box .tooltipster-content .hover-content ul.boost-details li i {
  4845. font-size: var(--font-size-5);
  4846. margin-right: 5px;
  4847. }
  4848. .iwr-editor {
  4849. max-height: 500px;
  4850. }
  4851. .iwr-editor a.document-id-link {
  4852. display: none;
  4853. }
  4854. .iwr-editor .entries {
  4855. display: flex;
  4856. flex-direction: column;
  4857. gap: 0.5em;
  4858. }
  4859. .iwr-editor .entries .entry {
  4860. padding: 0.25em 0.5em;
  4861. }
  4862. .iwr-editor .entries .entry label {
  4863. flex: unset;
  4864. margin-right: 0.5em;
  4865. white-space: nowrap;
  4866. width: 6em;
  4867. }
  4868. .iwr-editor .entries .entry a.form-action, .iwr-editor .entries .entry i.synthetic-source {
  4869. flex: 0;
  4870. margin-left: auto;
  4871. }
  4872. .iwr-editor .entries .entry:not(.new):nth-child(odd) {
  4873. background-color: rgba(0, 0, 0, 0.075);
  4874. }
  4875. .iwr-editor select {
  4876. max-width: fit-content;
  4877. }
  4878. .iwr-editor select:disabled {
  4879. color: var(--color-text-dark-7);
  4880. }
  4881. .iwr-editor tags.tagify.pf2e-tagify {
  4882. background: rgba(0, 0, 0, 0.05);
  4883. border: 1px solid var(--color-border-light-tertiary);
  4884. }
  4885. .iwr-editor input[type=number] {
  4886. max-width: 5ch;
  4887. margin-left: 0.5em;
  4888. }
  4889. body > .choices__list--dropdown {
  4890. background-color: white;
  4891. position: fixed;
  4892. }
  4893. .actor.sheet .image-container {
  4894. position: relative;
  4895. }
  4896. .actor.sheet .image-container .actor-image {
  4897. cursor: pointer;
  4898. }
  4899. .actor.sheet .image-container .hover-icon {
  4900. display: none;
  4901. font-size: var(--font-size-16);
  4902. }
  4903. .actor.sheet .image-container:hover .hover-icon {
  4904. display: block;
  4905. }
  4906. .actor.sheet .image-container [data-action=show-image] {
  4907. position: absolute;
  4908. bottom: 0;
  4909. right: 0;
  4910. }
  4911. .actor.sheet h3 {
  4912. border-bottom: none;
  4913. }
  4914. .actor.sheet button > i {
  4915. margin-right: 0;
  4916. }
  4917. .actor.sheet .item-summary {
  4918. overflow: hidden;
  4919. }
  4920. .actor.sheet .item-summary .item-buttons button {
  4921. background-color: var(--primary);
  4922. border: none;
  4923. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  4924. border-top: 1px solid #ff5e5e;
  4925. border-bottom: 1px solid black;
  4926. color: white;
  4927. cursor: pointer;
  4928. font-family: var(--serif);
  4929. font-size: var(--font-size-14);
  4930. font-weight: 500;
  4931. line-height: 1.8em;
  4932. margin: 8px 0 0 0;
  4933. padding: 0 8px;
  4934. }
  4935. .actor.sheet .item-summary .item-buttons button:hover {
  4936. box-shadow: none;
  4937. text-shadow: 0 0 2px white;
  4938. }
  4939. .actor.sheet .expandable:not(.expanded) .item-summary {
  4940. display: none;
  4941. }
  4942. .actor.sheet .inventory ol:not(.currency) {
  4943. margin: 0;
  4944. padding: 0;
  4945. list-style: none;
  4946. display: flex;
  4947. flex-direction: column;
  4948. }
  4949. .actor.sheet .inventory .item-name {
  4950. display: flex;
  4951. align-items: center;
  4952. font-weight: 500;
  4953. flex: 2;
  4954. }
  4955. .actor.sheet .inventory .item-name h3,
  4956. .actor.sheet .inventory .item-name h4 {
  4957. margin: auto auto auto 0;
  4958. line-height: var(--font-size-12);
  4959. padding: 2px;
  4960. word-break: break-word;
  4961. cursor: pointer;
  4962. }
  4963. .actor.sheet .inventory .item-name h3:hover,
  4964. .actor.sheet .inventory .item-name h4:hover {
  4965. color: var(--primary);
  4966. }
  4967. .actor.sheet .inventory .item-name span {
  4968. margin: 0 4px;
  4969. }
  4970. .actor.sheet .inventory .item-name .item-image {
  4971. box-shadow: inset 0 0 0 1px var(--tertiary);
  4972. margin-right: 4px;
  4973. }
  4974. .actor.sheet .inventory .item-name .item-image img {
  4975. border-radius: 0;
  4976. }
  4977. .actor.sheet .inventory .item-name .size {
  4978. font-size: 0.8em;
  4979. color: var(--alt);
  4980. margin: 0;
  4981. }
  4982. .actor.sheet .inventory .item-name .item-charges {
  4983. color: var(--sub);
  4984. }
  4985. .actor.sheet .inventory .inventory-list, .actor.sheet .inventory .inventory-items {
  4986. list-style-type: none;
  4987. flex-direction: column;
  4988. width: 100%;
  4989. position: relative;
  4990. margin: 0;
  4991. padding: 0;
  4992. }
  4993. .actor.sheet .inventory .inventory-list > li:nth-of-type(even), .actor.sheet .inventory .inventory-items > li:nth-of-type(even) {
  4994. background-color: rgba(120, 100, 82, 0.1);
  4995. }
  4996. .actor.sheet .inventory .inventory-list .item, .actor.sheet .inventory .inventory-items .item {
  4997. display: flex;
  4998. flex-wrap: wrap;
  4999. font-size: var(--font-size-12);
  5000. justify-content: flex-start;
  5001. width: 100%;
  5002. }
  5003. .actor.sheet .inventory .inventory-list .list-row:last-child .item-summary, .actor.sheet .inventory .inventory-items .list-row:last-child .item-summary {
  5004. border-bottom: none;
  5005. }
  5006. .actor.sheet .inventory .inventory-list .temporary-item, .actor.sheet .inventory .inventory-items .temporary-item {
  5007. background-color: rgba(0, 5, 255, 0.1137254902);
  5008. }
  5009. .actor.sheet .inventory .inventory-list {
  5010. overflow: hidden scroll;
  5011. scrollbar-width: thin;
  5012. scrollbar-color: var(--primary) transparent;
  5013. height: calc(100% - 60px);
  5014. padding-right: 0.15rem;
  5015. }
  5016. .actor.sheet .inventory .item-quantity,
  5017. .actor.sheet .inventory .item-weight,
  5018. .actor.sheet .inventory .item-controls,
  5019. .actor.sheet .inventory .item-sell-value {
  5020. display: flex;
  5021. justify-content: center;
  5022. align-items: center;
  5023. flex: 0 0 68px;
  5024. }
  5025. .actor.sheet .inventory .item-sell-value {
  5026. justify-content: flex-end;
  5027. padding-right: 3px;
  5028. }
  5029. .actor.sheet .inventory .item-quantity {
  5030. justify-content: space-around;
  5031. }
  5032. .actor.sheet .inventory .item-quantity .item-decrease-quantity,
  5033. .actor.sheet .inventory .item-quantity .item-increase-quantity {
  5034. display: flex;
  5035. justify-content: center;
  5036. align-items: center;
  5037. font-family: var(--sans-serif-monospace);
  5038. height: 100%;
  5039. text-align: center;
  5040. width: 18px;
  5041. }
  5042. .actor.sheet .inventory .item-weight {
  5043. flex: 0 0 36px;
  5044. font-weight: 500;
  5045. }
  5046. .actor.sheet .inventory .item-controls {
  5047. flex: 0 0 90px;
  5048. font-size: var(--font-size-12);
  5049. gap: 1px;
  5050. justify-content: flex-end;
  5051. }
  5052. .actor.sheet .inventory .inventory-header {
  5053. align-items: center;
  5054. background-color: var(--alt);
  5055. color: white;
  5056. display: flex;
  5057. font-family: var(--sans-serif);
  5058. font-size: var(--font-size-10);
  5059. justify-content: flex-end;
  5060. letter-spacing: 0.05em;
  5061. line-height: 1;
  5062. padding: 4px 0;
  5063. text-rendering: optimizeLegibility;
  5064. text-transform: uppercase;
  5065. width: 100%;
  5066. }
  5067. .actor.sheet .inventory .inventory-header h3 {
  5068. font-size: var(--font-size-14);
  5069. text-transform: capitalize;
  5070. text-shadow: 0 0 2px rgba(0, 0, 0, 0.75);
  5071. margin: 2px;
  5072. margin-left: 4px;
  5073. cursor: default;
  5074. }
  5075. .actor.sheet .inventory .inventory-header h3:hover {
  5076. color: white;
  5077. }
  5078. .actor.sheet .inventory .inventory-header .item-name {
  5079. padding-left: 4px;
  5080. }
  5081. .actor.sheet .inventory .inventory-header .item-sell-value,
  5082. .actor.sheet .inventory .inventory-header .item-quantity,
  5083. .actor.sheet .inventory .inventory-header .item-weight {
  5084. display: flex;
  5085. justify-content: center;
  5086. align-items: center;
  5087. }
  5088. .actor.sheet .inventory .inventory-header .item-invested-total {
  5089. flex: none;
  5090. margin-right: 1em;
  5091. }
  5092. .actor.sheet .inventory .inventory-header .item-controls {
  5093. padding-right: 0.4em;
  5094. }
  5095. .actor.sheet .inventory .inventory-header .overinvested {
  5096. color: orange;
  5097. text-shadow: 1px 1px 0px black;
  5098. }
  5099. .actor.sheet .inventory .item {
  5100. width: 100%;
  5101. }
  5102. .actor.sheet .inventory .item .item-quantity,
  5103. .actor.sheet .inventory .item .item-weight,
  5104. .actor.sheet .inventory .item .item-controls,
  5105. .actor.sheet .inventory .item .item-sell-value {
  5106. border-left: 1px solid var(--alt);
  5107. }
  5108. .actor.sheet .inventory .list-row {
  5109. width: 100%;
  5110. }
  5111. .actor.sheet .inventory .list-row .item-controls {
  5112. color: var(--body);
  5113. font-size: var(--font-size-13);
  5114. }
  5115. .actor.sheet .inventory .list-row .item-controls .item-control.item-toggle-invest.active, .actor.sheet .inventory .list-row .item-controls .item-control.item-carry-type.active {
  5116. color: var(--secondary);
  5117. }
  5118. .actor.sheet .inventory .list-row .item-controls .item-control.item-carry-type {
  5119. color: rgba(0, 0, 0, 0.5);
  5120. text-align: right;
  5121. }
  5122. .actor.sheet .inventory .list-row .item-controls .item-control.item-toggle-invest {
  5123. color: rgba(0, 0, 0, 0.5);
  5124. }
  5125. .actor.sheet .inventory .list-row .item-controls .item-control .fa-stack {
  5126. margin: -3px -2px 0;
  5127. }
  5128. .actor.sheet .inventory .list-row .item-controls .item-control .fa-stack .fa-1, .actor.sheet .inventory .list-row .item-controls .item-control .fa-stack .fa-2 {
  5129. left: 1px;
  5130. position: relative;
  5131. }
  5132. .actor.sheet .inventory .list-row.drag-preview {
  5133. box-shadow: 0 0 6px inset var(--color-shadow-highlight);
  5134. }
  5135. .actor.sheet .inventory .list-row.drag-gap {
  5136. visibility: hidden;
  5137. }
  5138. .actor.sheet .inventory .container-metadata .container-capacity {
  5139. font-family: var(--sans-serif);
  5140. font-size: var(--font-size-10);
  5141. text-transform: uppercase;
  5142. letter-spacing: 0.05em;
  5143. text-rendering: optimizeLegibility;
  5144. position: relative;
  5145. background-color: rgba(0, 0, 0, 0.75);
  5146. box-shadow: inset 0 0 4px black;
  5147. color: white;
  5148. display: flex;
  5149. width: 100%;
  5150. }
  5151. .actor.sheet .inventory .container-metadata .container-capacity .container-capacity-bar {
  5152. background-color: var(--secondary);
  5153. border-radius: 0 2px 2px 0;
  5154. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 0 2px rgba(255, 255, 255, 0.1);
  5155. padding: 8px 0;
  5156. }
  5157. .actor.sheet .inventory .container-metadata .container-capacity .container-capacity-label {
  5158. position: absolute;
  5159. height: 100%;
  5160. top: 0;
  5161. left: 0;
  5162. padding: 2px;
  5163. }
  5164. .actor.sheet .inventory .container-metadata .container-capacity.over-limit .container-capacity-bar {
  5165. background-color: var(--primary);
  5166. }
  5167. .actor.sheet .inventory .container-metadata .container-held-items {
  5168. padding-left: 10px;
  5169. }
  5170. .actor.sheet .inventory .container-metadata .container-held-items li:nth-of-type(even) {
  5171. background-color: rgba(120, 100, 82, 0.1);
  5172. }
  5173. .actor.sheet .inventory .container-metadata .container-held-items li:first-of-type .item::before {
  5174. height: 50%;
  5175. top: 0;
  5176. }
  5177. .actor.sheet .inventory .container-metadata .container-held-items li:last-of-type .item::after {
  5178. border: none;
  5179. }
  5180. .actor.sheet .inventory .container-metadata .container-held-items .item {
  5181. position: relative;
  5182. }
  5183. .actor.sheet .inventory .container-metadata .container-held-items .item::before, .actor.sheet .inventory .container-metadata .container-held-items .item::after {
  5184. position: absolute;
  5185. border-left: 1px solid var(--alt);
  5186. top: 0;
  5187. height: 50%;
  5188. left: -5px;
  5189. width: 5px;
  5190. content: "";
  5191. }
  5192. .actor.sheet .inventory .container-metadata .container-held-items .item::before {
  5193. border-bottom: 1px solid var(--alt);
  5194. top: 0;
  5195. }
  5196. .actor.sheet .inventory .container-metadata .container-held-items .item::after {
  5197. top: 50%;
  5198. }
  5199. .actor.sheet .inventory .container-metadata .container-held-items .item .item-summary {
  5200. border-left: 1px solid var(--alt);
  5201. }
  5202. .actor.sheet .inventory .item-summary {
  5203. flex: 100%;
  5204. padding: 4px 8px 8px;
  5205. border-top: 1px solid var(--alt);
  5206. border-bottom: 1px solid var(--alt);
  5207. background: var(--bg);
  5208. }
  5209. .actor.sheet .inventory .item-summary span[data-visibility=all] {
  5210. display: inline-block;
  5211. line-height: 1em;
  5212. padding: 2px 1px 1px;
  5213. }
  5214. .actor.sheet .inventory .item-summary .item-buttons .weapon_attack {
  5215. background: var(--primary);
  5216. }
  5217. .actor.sheet .inventory .item-summary .item-buttons .weapon_attack2, .actor.sheet .inventory .item-summary .item-buttons .weapon_attack3 {
  5218. color: rgba(0, 0, 0, 0.75);
  5219. background: var(--tertiary);
  5220. flex: 0 50%;
  5221. margin-top: 0;
  5222. }
  5223. .actor.sheet .inventory .item-summary .item-buttons .weapon_attack2 {
  5224. border-radius: 0 0 0 2px;
  5225. }
  5226. .actor.sheet .inventory .item-summary .item-buttons .weapon_attack3 {
  5227. border-radius: 0 0 2px 0;
  5228. }
  5229. .actor.sheet .item-image {
  5230. display: flex;
  5231. cursor: pointer;
  5232. position: relative;
  5233. font-size: var(--font-size-16);
  5234. height: 24px;
  5235. width: 24px;
  5236. }
  5237. .actor.sheet .item-image.framed {
  5238. background-color: var(--tertiary);
  5239. }
  5240. .actor.sheet .item-image.framed img {
  5241. border-radius: 2px;
  5242. }
  5243. .actor.sheet .item-image.framed, .actor.sheet .item-image.framed i {
  5244. border: none;
  5245. border-radius: 2px;
  5246. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  5247. }
  5248. .actor.sheet .item-image img {
  5249. border: none;
  5250. }
  5251. .actor.sheet .item-image i {
  5252. display: none;
  5253. position: absolute;
  5254. width: 100%;
  5255. height: 100%;
  5256. color: black;
  5257. box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.5);
  5258. }
  5259. .actor.sheet .item-image:hover i {
  5260. background: #f1eee9;
  5261. display: flex;
  5262. justify-content: center;
  5263. align-items: center;
  5264. }
  5265. .actor.sheet .alignment-select {
  5266. background-color: #566193;
  5267. border: 2px solid #d8c384;
  5268. color: white;
  5269. }
  5270. .actor.sheet .size-select {
  5271. background-color: #3a7a58;
  5272. border: 2px solid #d8c384;
  5273. color: white;
  5274. }
  5275. .actor.sheet .rarity-select {
  5276. border: 2px solid #d8c384;
  5277. color: white;
  5278. }
  5279. .actor.sheet .rarity-select.common {
  5280. background-color: #323232;
  5281. }
  5282. .actor.sheet .rarity-select.uncommon {
  5283. background-color: #98513d;
  5284. }
  5285. .actor.sheet .rarity-select.rare {
  5286. background-color: #002664;
  5287. }
  5288. .actor.sheet .rarity-select.unique {
  5289. background-color: #54166e;
  5290. }
  5291. .actor.sheet.character .crb-style .skill-prof .pf-rank, .actor.sheet.character .crb-style .save-prof .pf-rank, .actor.sheet.character .crb-style .perception-prof .pf-rank, .actor.sheet.character .crb-style .spellcasting-prof .pf-rank, .actor.sheet.character .crb-style .classdc-rank .pf-rank {
  5292. font-family: var(--sans-serif);
  5293. font-size: var(--font-size-10);
  5294. text-transform: uppercase;
  5295. letter-spacing: 0.05em;
  5296. text-rendering: optimizeLegibility;
  5297. align-items: center;
  5298. background: #424242;
  5299. border-radius: 2px;
  5300. border: 1px solid rgba(0, 0, 0, 0.5);
  5301. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  5302. color: var(--text-light);
  5303. cursor: pointer;
  5304. display: flex;
  5305. font-weight: 500;
  5306. justify-content: center;
  5307. padding: 2px 1px 1px 1px;
  5308. text-align-last: center;
  5309. }
  5310. .actor.sheet.character .crb-style .skill-prof .pf-rank.readonly, .actor.sheet.character .crb-style .save-prof .pf-rank.readonly, .actor.sheet.character .crb-style .perception-prof .pf-rank.readonly, .actor.sheet.character .crb-style .spellcasting-prof .pf-rank.readonly, .actor.sheet.character .crb-style .classdc-rank .pf-rank.readonly {
  5311. pointer-events: none;
  5312. }
  5313. .actor.sheet.character .crb-style .skill-prof span, .actor.sheet.character .crb-style .save-prof span, .actor.sheet.character .crb-style .perception-prof span, .actor.sheet.character .crb-style .spellcasting-prof span, .actor.sheet.character .crb-style .classdc-rank span {
  5314. min-width: 61px;
  5315. pointer-events: none;
  5316. }
  5317. .actor.sheet.character .crb-style .skill-prof option[value="0"], .actor.sheet.character .crb-style .save-prof option[value="0"], .actor.sheet.character .crb-style .perception-prof option[value="0"], .actor.sheet.character .crb-style .spellcasting-prof option[value="0"], .actor.sheet.character .crb-style .classdc-rank option[value="0"] {
  5318. background: #424242;
  5319. }
  5320. .actor.sheet.character .crb-style .skill-prof span.trained, .actor.sheet.character .crb-style .skill-prof select[data-rank="1"], .actor.sheet.character .crb-style .skill-prof option[value="1"], .actor.sheet.character .crb-style .save-prof span.trained, .actor.sheet.character .crb-style .save-prof select[data-rank="1"], .actor.sheet.character .crb-style .save-prof option[value="1"], .actor.sheet.character .crb-style .perception-prof span.trained, .actor.sheet.character .crb-style .perception-prof select[data-rank="1"], .actor.sheet.character .crb-style .perception-prof option[value="1"], .actor.sheet.character .crb-style .spellcasting-prof span.trained, .actor.sheet.character .crb-style .spellcasting-prof select[data-rank="1"], .actor.sheet.character .crb-style .spellcasting-prof option[value="1"], .actor.sheet.character .crb-style .classdc-rank span.trained, .actor.sheet.character .crb-style .classdc-rank select[data-rank="1"], .actor.sheet.character .crb-style .classdc-rank option[value="1"] {
  5321. background: #171f69;
  5322. }
  5323. .actor.sheet.character .crb-style .skill-prof span.expert, .actor.sheet.character .crb-style .skill-prof select[data-rank="2"], .actor.sheet.character .crb-style .skill-prof option[value="2"], .actor.sheet.character .crb-style .save-prof span.expert, .actor.sheet.character .crb-style .save-prof select[data-rank="2"], .actor.sheet.character .crb-style .save-prof option[value="2"], .actor.sheet.character .crb-style .perception-prof span.expert, .actor.sheet.character .crb-style .perception-prof select[data-rank="2"], .actor.sheet.character .crb-style .perception-prof option[value="2"], .actor.sheet.character .crb-style .spellcasting-prof span.expert, .actor.sheet.character .crb-style .spellcasting-prof select[data-rank="2"], .actor.sheet.character .crb-style .spellcasting-prof option[value="2"], .actor.sheet.character .crb-style .classdc-rank span.expert, .actor.sheet.character .crb-style .classdc-rank select[data-rank="2"], .actor.sheet.character .crb-style .classdc-rank option[value="2"] {
  5324. background: #3c005e;
  5325. }
  5326. .actor.sheet.character .crb-style .skill-prof span.master, .actor.sheet.character .crb-style .skill-prof select[data-rank="3"], .actor.sheet.character .crb-style .skill-prof option[value="3"], .actor.sheet.character .crb-style .save-prof span.master, .actor.sheet.character .crb-style .save-prof select[data-rank="3"], .actor.sheet.character .crb-style .save-prof option[value="3"], .actor.sheet.character .crb-style .perception-prof span.master, .actor.sheet.character .crb-style .perception-prof select[data-rank="3"], .actor.sheet.character .crb-style .perception-prof option[value="3"], .actor.sheet.character .crb-style .spellcasting-prof span.master, .actor.sheet.character .crb-style .spellcasting-prof select[data-rank="3"], .actor.sheet.character .crb-style .spellcasting-prof option[value="3"], .actor.sheet.character .crb-style .classdc-rank span.master, .actor.sheet.character .crb-style .classdc-rank select[data-rank="3"], .actor.sheet.character .crb-style .classdc-rank option[value="3"] {
  5327. background: #664400;
  5328. }
  5329. .actor.sheet.character .crb-style .skill-prof span.legendary, .actor.sheet.character .crb-style .skill-prof select[data-rank="4"], .actor.sheet.character .crb-style .skill-prof option[value="4"], .actor.sheet.character .crb-style .save-prof span.legendary, .actor.sheet.character .crb-style .save-prof select[data-rank="4"], .actor.sheet.character .crb-style .save-prof option[value="4"], .actor.sheet.character .crb-style .perception-prof span.legendary, .actor.sheet.character .crb-style .perception-prof select[data-rank="4"], .actor.sheet.character .crb-style .perception-prof option[value="4"], .actor.sheet.character .crb-style .spellcasting-prof span.legendary, .actor.sheet.character .crb-style .spellcasting-prof select[data-rank="4"], .actor.sheet.character .crb-style .spellcasting-prof option[value="4"], .actor.sheet.character .crb-style .classdc-rank span.legendary, .actor.sheet.character .crb-style .classdc-rank select[data-rank="4"], .actor.sheet.character .crb-style .classdc-rank option[value="4"] {
  5330. background: #5e0000;
  5331. }
  5332. .actor.sheet.character .crb-style aside .sidebar a.roll-icon.rest {
  5333. padding-bottom: 0;
  5334. }
  5335. .actor.sheet.character .crb-style aside .sidebar .class-dc.secondary {
  5336. margin-top: 0.2em;
  5337. }
  5338. .actor.sheet.character .crb-style aside .sidebar .class-dc .classdc-rank {
  5339. align-items: center;
  5340. display: flex;
  5341. gap: 0.5em;
  5342. }
  5343. .actor.sheet.character .crb-style header.char-header .char-details .dots {
  5344. display: flex;
  5345. font-size: var(--font-size-10);
  5346. }
  5347. .actor.sheet.character .crb-style header.char-header .char-details .dots .label {
  5348. color: var(--sidebar-label);
  5349. padding-left: 3px;
  5350. margin-right: 8px;
  5351. font-weight: 700;
  5352. }
  5353. .actor.sheet.character .crb-style header.char-header .char-level .exp-data {
  5354. display: flex;
  5355. flex-direction: column;
  5356. justify-content: space-between;
  5357. padding: 0.5em 0;
  5358. position: relative;
  5359. }
  5360. .actor.sheet.character .crb-style header.char-header .char-level .exp-data .exp-input {
  5361. font-size: var(--font-size-13);
  5362. height: 1.5em;
  5363. }
  5364. .actor.sheet.character .crb-style header.char-header .char-level .exp-data .exp-input input {
  5365. color: var(--text-light);
  5366. font-family: var(--sans-serif);
  5367. text-align: right;
  5368. width: 3em;
  5369. }
  5370. .actor.sheet.character .crb-style header.char-header .char-level .exp-data .exp-input .slash {
  5371. color: var(--sidebar-label);
  5372. }
  5373. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress {
  5374. background-color: unset;
  5375. border: 1px solid rgba(255, 255, 255, 0.1);
  5376. border-left: none;
  5377. bottom: 7px;
  5378. box-shadow: 0 0 2px var(--sidebar-label);
  5379. height: 5px;
  5380. left: -9px;
  5381. position: absolute;
  5382. width: 7em;
  5383. }
  5384. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress::-moz-progress-bar {
  5385. background: var(--sidebar-title);
  5386. }
  5387. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress::-webkit-progress-bar {
  5388. background: rgba(0, 0, 0, 0.2);
  5389. }
  5390. .actor.sheet.character .crb-style header.char-header .char-level .exp-data progress::-webkit-progress-value {
  5391. background: var(--sidebar-title);
  5392. }
  5393. .actor.sheet.character .crb-style nav.sheet-navigation .item.to-hide {
  5394. opacity: 45%;
  5395. }
  5396. .actor.sheet.character .crb-style nav.sheet-navigation .item.hidden {
  5397. display: none;
  5398. }
  5399. .actor.sheet.character .crb-style nav.sheet-navigation .item .pfs-icon {
  5400. clip-rule: evenodd;
  5401. fill-rule: evenodd;
  5402. padding: 4px;
  5403. position: relative;
  5404. stroke-linejoin: round;
  5405. stroke-miterlimit: 2;
  5406. top: -1px;
  5407. }
  5408. .actor.sheet.character .crb-style nav.sheet-navigation .item .pfs-icon path {
  5409. fill-rule: nonzero;
  5410. }
  5411. .actor.sheet.character .crb-style nav.sheet-navigation .manage-tabs {
  5412. color: white;
  5413. margin: 0;
  5414. padding: 0 6px;
  5415. }
  5416. .actor.sheet.character .crb-style .sheet-body .sheet-content > .tab.active {
  5417. display: flex;
  5418. height: 100%;
  5419. }
  5420. .actor.sheet.character .crb-style .sheet-body .sheet-content > .tab:not(.inventory, .actions),
  5421. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab-content {
  5422. overflow: hidden scroll;
  5423. scrollbar-width: thin;
  5424. scrollbar-color: var(--primary) transparent;
  5425. flex-grow: 1;
  5426. min-height: 0;
  5427. overflow: hidden scroll;
  5428. margin-left: 8px;
  5429. }
  5430. .actor.sheet.character .crb-style .sheet-body .sheet-content nav + .tab-content {
  5431. padding-top: 12px;
  5432. }
  5433. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header {
  5434. position: relative;
  5435. margin-top: 0.75em;
  5436. font-size: var(--font-size-16);
  5437. font-family: var(--serif);
  5438. font-weight: 600;
  5439. color: var(--primary);
  5440. line-height: 1;
  5441. border-bottom: 1px solid var(--color-border-divider);
  5442. }
  5443. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header > button, .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header > .controls {
  5444. position: absolute;
  5445. bottom: -1px;
  5446. right: 0;
  5447. }
  5448. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header .controls {
  5449. display: flex;
  5450. }
  5451. .actor.sheet.character .crb-style .sheet-body .sheet-content h3.header button {
  5452. background: transparent;
  5453. border-radius: 2px 2px 0 0;
  5454. border: 1px solid var(--color-border-divider);
  5455. color: var(--primary);
  5456. cursor: pointer;
  5457. font-family: var(--sans-serif);
  5458. font-size: var(--font-size-12);
  5459. font-weight: 500;
  5460. height: 20px;
  5461. line-height: var(--font-size-12);
  5462. margin: 0;
  5463. outline: none;
  5464. text-transform: uppercase;
  5465. width: auto;
  5466. }
  5467. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image {
  5468. cursor: pointer;
  5469. display: flex;
  5470. font-size: var(--font-size-16);
  5471. height: 24px;
  5472. min-width: 24px;
  5473. position: relative;
  5474. width: 24px;
  5475. }
  5476. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image img {
  5477. border: none;
  5478. }
  5479. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image i {
  5480. display: none;
  5481. position: absolute;
  5482. width: 100%;
  5483. height: 100%;
  5484. color: black;
  5485. }
  5486. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image:hover i {
  5487. background: #f1eee9;
  5488. display: flex;
  5489. justify-content: center;
  5490. align-items: center;
  5491. }
  5492. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed {
  5493. background-color: var(--tertiary);
  5494. }
  5495. .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed, .actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed i {
  5496. border: none;
  5497. border-radius: 2px;
  5498. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  5499. }
  5500. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab {
  5501. flex-direction: column;
  5502. }
  5503. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character select {
  5504. width: calc(100% - 6px);
  5505. background-color: var(--alt);
  5506. border: 1px solid #605041;
  5507. }
  5508. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character select:disabled {
  5509. cursor: initial;
  5510. }
  5511. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character hr {
  5512. margin: 10px 6px 10px 0;
  5513. }
  5514. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 {
  5515. background-color: rgba(28, 28, 28, 0.1);
  5516. border: none;
  5517. color: var(--body);
  5518. display: flex;
  5519. font: 700 var(--font-size-14) var(--body-serif);
  5520. grid-area: mod;
  5521. line-height: 1;
  5522. margin: 0;
  5523. padding: 8px 4px 6px;
  5524. width: calc(100% - 6px);
  5525. }
  5526. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 a {
  5527. margin-left: auto;
  5528. }
  5529. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 a i {
  5530. position: relative;
  5531. right: -2px;
  5532. top: -2px;
  5533. float: right;
  5534. }
  5535. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 span.value {
  5536. display: inline-block;
  5537. max-width: 87%;
  5538. overflow: hidden;
  5539. text-overflow: ellipsis;
  5540. white-space: nowrap;
  5541. }
  5542. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details {
  5543. display: grid;
  5544. grid: "img alignment deity" 46px "img details details" auto/120px 130px 1fr;
  5545. margin-top: 4px;
  5546. }
  5547. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .frame-container {
  5548. grid-area: img;
  5549. margin-left: 5px;
  5550. }
  5551. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .frame {
  5552. z-index: 3;
  5553. }
  5554. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .frame .actor-image {
  5555. object-fit: cover;
  5556. object-position: top;
  5557. border: none;
  5558. border-radius: 0;
  5559. max-height: 178px;
  5560. width: 100%;
  5561. border: none;
  5562. 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;
  5563. }
  5564. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .frame [data-action=show-image] {
  5565. bottom: 5px;
  5566. }
  5567. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment {
  5568. grid-area: alignment;
  5569. position: relative;
  5570. display: flex;
  5571. align-items: center;
  5572. justify-content: center;
  5573. background: url("../assets/sheet/banner-bg.webp") repeat-x center;
  5574. z-index: 1;
  5575. }
  5576. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment .bio-alignment {
  5577. position: absolute;
  5578. left: 0;
  5579. }
  5580. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment select {
  5581. background: none;
  5582. border: none;
  5583. box-shadow: none;
  5584. color: var(--text-dark);
  5585. cursor: pointer;
  5586. display: block;
  5587. font-family: var(--body-serif);
  5588. font-size: var(--font-size-14);
  5589. font-weight: 700;
  5590. outline: none;
  5591. overflow-x: visible;
  5592. padding-left: 8px;
  5593. width: auto;
  5594. line-height: 1;
  5595. text-transform: capitalize;
  5596. margin-top: 2px;
  5597. }
  5598. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment select option {
  5599. color: var(--text-light);
  5600. font: initial;
  5601. }
  5602. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment input[type=text] {
  5603. font: 700 var(--font-size-14) var(--body-serif);
  5604. text-align: center;
  5605. max-width: 138px;
  5606. }
  5607. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment::after {
  5608. position: absolute;
  5609. content: "";
  5610. height: 46px;
  5611. width: 15px;
  5612. top: 0;
  5613. right: -11px;
  5614. background: url("../assets/sheet/banner-bg2.webp") no-repeat right;
  5615. }
  5616. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity {
  5617. align-items: center;
  5618. display: flex;
  5619. grid-area: deity;
  5620. margin-left: auto;
  5621. min-width: 10em;
  5622. padding-bottom: 0.7em;
  5623. }
  5624. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input {
  5625. display: flex;
  5626. flex-flow: column wrap;
  5627. justify-content: end;
  5628. }
  5629. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input span {
  5630. text-align: right;
  5631. }
  5632. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input h3 {
  5633. min-width: 9em;
  5634. }
  5635. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity .input h3 span {
  5636. max-width: 10em;
  5637. }
  5638. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity img.symbol {
  5639. border: none;
  5640. 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;
  5641. border-radius: 50%;
  5642. height: 32px;
  5643. margin: 0.5rem 0 0 0.5rem;
  5644. width: 32px;
  5645. }
  5646. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-sheet {
  5647. grid-area: details;
  5648. display: grid;
  5649. grid-template-columns: 44% 55%;
  5650. grid-template-rows: repeat(2, 42px);
  5651. grid-row-gap: 8px;
  5652. padding-left: 12px;
  5653. margin-top: 8px;
  5654. }
  5655. .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 {
  5656. margin: 0;
  5657. }
  5658. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-sheet .detail-small {
  5659. display: flex;
  5660. }
  5661. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control {
  5662. cursor: pointer;
  5663. margin-left: auto;
  5664. }
  5665. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control i.fa-ellipsis-v:hover {
  5666. text-shadow: 0 0 8px var(--color-shadow-primary);
  5667. }
  5668. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control #context-menu {
  5669. left: -85px;
  5670. min-width: 105px;
  5671. padding: 0;
  5672. text-align: left;
  5673. }
  5674. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control #context-menu .context-item {
  5675. font-family: var(--font-primary);
  5676. font-weight: normal;
  5677. min-width: 105px;
  5678. }
  5679. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .detail-item-control #context-menu .context-item i {
  5680. position: static;
  5681. float: none;
  5682. }
  5683. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background {
  5684. display: flex;
  5685. flex-wrap: wrap;
  5686. }
  5687. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background .pc {
  5688. display: flex;
  5689. flex-direction: column;
  5690. justify-content: start;
  5691. align-items: start;
  5692. flex: 20%;
  5693. margin-bottom: 8px;
  5694. }
  5695. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background .pc span {
  5696. width: 100%;
  5697. }
  5698. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background .pc_ethnicity, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-background .pc_nationality {
  5699. flex: 50%;
  5700. margin-bottom: 0;
  5701. }
  5702. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits {
  5703. display: flex;
  5704. flex-wrap: wrap;
  5705. }
  5706. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .tags {
  5707. width: 100%;
  5708. }
  5709. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc {
  5710. display: flex;
  5711. flex-direction: column;
  5712. justify-content: start;
  5713. align-items: start;
  5714. flex: 20%;
  5715. margin-bottom: 8px;
  5716. }
  5717. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc span {
  5718. width: 100%;
  5719. }
  5720. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc span.speed * {
  5721. width: 50%;
  5722. }
  5723. .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 {
  5724. flex: 50%;
  5725. }
  5726. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_speed-types {
  5727. flex: 50%;
  5728. }
  5729. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_senses {
  5730. flex: 50%;
  5731. }
  5732. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_languages {
  5733. flex: 50%;
  5734. margin-bottom: 0;
  5735. }
  5736. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_traits {
  5737. flex: 50%;
  5738. margin-bottom: 0;
  5739. }
  5740. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_bonus-bulk {
  5741. flex: 1 20%;
  5742. }
  5743. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc_bonus-bulk.encumbered {
  5744. margin-right: 7px;
  5745. }
  5746. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc label,
  5747. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc h4 {
  5748. margin: 0;
  5749. white-space: nowrap;
  5750. }
  5751. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc .tags {
  5752. margin: 0;
  5753. padding: 0;
  5754. }
  5755. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc .tags,
  5756. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc select,
  5757. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc input,
  5758. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-traits .pc h3 {
  5759. margin-top: 4px;
  5760. }
  5761. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores {
  5762. margin: 0;
  5763. padding: 0;
  5764. display: grid;
  5765. grid: 1fr/repeat(6, 1fr);
  5766. justify-content: center;
  5767. list-style: none;
  5768. gap: 12px;
  5769. }
  5770. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability {
  5771. display: grid;
  5772. grid: "prefix" auto "mod" 1fr "score" auto "label" auto/1fr;
  5773. column-gap: 10px;
  5774. align-items: center;
  5775. }
  5776. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability:focus-within .ability-id {
  5777. filter: opacity(1);
  5778. }
  5779. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability.key .ability-id, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability.key .ability-mod {
  5780. color: var(--secondary);
  5781. }
  5782. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability .ability-name {
  5783. grid-area: label;
  5784. margin: 0;
  5785. text-align: center;
  5786. padding: 2px;
  5787. color: rgb(68, 55, 48);
  5788. opacity: 0.4;
  5789. }
  5790. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability .ability-id {
  5791. text-transform: capitalize;
  5792. grid-area: prefix;
  5793. font: 400 22px var(--serif-condensed);
  5794. color: var(--primary);
  5795. text-align: center;
  5796. margin: 0;
  5797. padding: 0;
  5798. border: none;
  5799. position: relative;
  5800. }
  5801. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability .ability-id i.fas {
  5802. position: absolute;
  5803. font-size: var(--font-size-12);
  5804. bottom: 4px;
  5805. left: 2px;
  5806. }
  5807. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability .ability-score {
  5808. grid-area: score;
  5809. display: flex;
  5810. border-radius: 0;
  5811. font-size: 0;
  5812. border: 1px solid #D3CCBC;
  5813. background: rgba(211, 204, 188, 0.2);
  5814. margin-top: 4px;
  5815. height: 30px;
  5816. align-items: center;
  5817. justify-content: center;
  5818. }
  5819. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability .ability-score input {
  5820. width: 100%;
  5821. font-size: var(--font-size-16);
  5822. line-height: 16px;
  5823. border: none;
  5824. text-align: center;
  5825. padding: 0;
  5826. background: transparent;
  5827. }
  5828. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability .ability-score div {
  5829. text-align: center;
  5830. font-size: var(--font-size-16);
  5831. line-height: 16px;
  5832. height: 16px;
  5833. }
  5834. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability h3.ability-mod {
  5835. display: flex;
  5836. justify-content: center;
  5837. align-items: center;
  5838. border-image-repeat: repeat;
  5839. border-image-slice: 11;
  5840. border-image-source: url("../assets/sheet/frame-elegant.svg");
  5841. border-image-width: 14px;
  5842. border-style: double;
  5843. grid-area: mod;
  5844. font-size: var(--font-size-24);
  5845. font-family: var(--serif);
  5846. font-weight: 700;
  5847. height: 46px;
  5848. margin: 0;
  5849. padding-right: 4px;
  5850. }
  5851. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions {
  5852. gap: 0.5rem;
  5853. padding: 0;
  5854. }
  5855. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list + .actions-list {
  5856. margin-top: 8px;
  5857. }
  5858. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike {
  5859. gap: 3px;
  5860. }
  5861. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .item-name {
  5862. align-items: start;
  5863. }
  5864. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .item-name .actions-title {
  5865. display: flex;
  5866. flex-direction: column;
  5867. }
  5868. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .item-name .item-image {
  5869. height: 32px;
  5870. width: 32px;
  5871. }
  5872. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .ammo {
  5873. align-items: center;
  5874. display: flex;
  5875. gap: 3px;
  5876. }
  5877. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .ammo select.linked {
  5878. font: normal var(--font-size-12) var(--sans-serif);
  5879. line-height: var(--font-size-12);
  5880. padding-top: 3px;
  5881. width: fit-content;
  5882. }
  5883. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .ammo select.linked[data-compatible=false] {
  5884. color: rgba(255, 255, 255, 0.6);
  5885. }
  5886. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .ammo select.linked option,
  5887. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .ammo select.linked optgroup {
  5888. color: white;
  5889. }
  5890. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .ammo .magazine {
  5891. margin-right: 0.5rem;
  5892. font-family: var(--sans-serif);
  5893. font-weight: 600;
  5894. }
  5895. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .ammo .magazine .icon {
  5896. display: inline-block;
  5897. width: 0.9rem;
  5898. height: 0.9rem;
  5899. background-image: url("../assets/icons/heavy-bullets.svg");
  5900. background-size: cover;
  5901. }
  5902. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group {
  5903. align-items: center;
  5904. display: flex;
  5905. flex-direction: row;
  5906. flex-wrap: nowrap;
  5907. font-size: var(--font-size-14);
  5908. margin-bottom: 0;
  5909. }
  5910. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group button {
  5911. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  5912. border: none;
  5913. flex: 0;
  5914. height: 1.25rem;
  5915. margin: 0;
  5916. padding: 0 0.5em;
  5917. white-space: nowrap;
  5918. }
  5919. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group button span.activity-icon {
  5920. font-size: var(--font-size-16);
  5921. line-height: initial;
  5922. padding-right: 2px;
  5923. }
  5924. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group button:not(:disabled) {
  5925. background: var(--secondary);
  5926. cursor: pointer;
  5927. }
  5928. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group button:not(:disabled).damage {
  5929. background: var(--primary);
  5930. }
  5931. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group button:not(:disabled):hover {
  5932. box-shadow: none;
  5933. text-shadow: 0 0 2px white;
  5934. }
  5935. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group .versatile-options {
  5936. align-items: center;
  5937. display: flex;
  5938. font-size: var(--font-size-14);
  5939. gap: 2px;
  5940. padding: 0 3px;
  5941. }
  5942. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group .versatile-options .title {
  5943. text-transform: uppercase;
  5944. }
  5945. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group .versatile-options button {
  5946. align-items: center;
  5947. background: var(--bg-dark);
  5948. display: flex;
  5949. justify-content: center;
  5950. width: 3ch;
  5951. }
  5952. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group .versatile-options button.selected {
  5953. background: var(--body);
  5954. color: var(--bg-dark);
  5955. }
  5956. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group .versatile-options button:hover {
  5957. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), inset 0 0 0 2px rgba(0, 0, 0, 0.4);
  5958. }
  5959. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .button-group .versatile-options button:active {
  5960. text-shadow: 0 0 1px #5e0000;
  5961. }
  5962. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .alt-usage {
  5963. flex-basis: 100%;
  5964. margin-left: calc(3em - 2px);
  5965. position: relative;
  5966. }
  5967. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .alt-usage img.alt-usage-icon {
  5968. border: none;
  5969. position: absolute;
  5970. left: -1.5em;
  5971. top: 0.15em;
  5972. }
  5973. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions {
  5974. display: flex;
  5975. gap: 3px;
  5976. margin-left: 2.5rem;
  5977. }
  5978. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions.weapon-drawn {
  5979. flex-basis: 100%;
  5980. }
  5981. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions button {
  5982. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  5983. font-family: var(--sans-serif);
  5984. font-size: var(--font-size-10);
  5985. text-transform: uppercase;
  5986. letter-spacing: 0.05em;
  5987. text-rendering: optimizeLegibility;
  5988. border-radius: 2px;
  5989. border: none;
  5990. color: var(--text-dark);
  5991. flex: 0;
  5992. font-weight: 500;
  5993. line-height: 14px;
  5994. margin: 0;
  5995. padding: 3px;
  5996. white-space: nowrap;
  5997. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3), inset 0 0 0 2px rgba(0, 0, 0, 0.2);
  5998. }
  5999. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions button span.activity-icon {
  6000. line-height: 14px;
  6001. font-size: var(--font-size-14);
  6002. margin: 0 0 0 2px;
  6003. }
  6004. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions button p {
  6005. margin: 2px;
  6006. }
  6007. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions button:not(:disabled) {
  6008. background: var(--bg-dark);
  6009. cursor: pointer;
  6010. }
  6011. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions button:not(:disabled):hover {
  6012. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), inset 0 0 0 2px rgba(0, 0, 0, 0.4);
  6013. }
  6014. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions button:not(:disabled):active {
  6015. color: #5e0000;
  6016. }
  6017. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions button select.modular {
  6018. appearance: auto;
  6019. background: none;
  6020. color: var(--text-dark);
  6021. cursor: default;
  6022. font: inherit;
  6023. margin-left: 0.5em;
  6024. padding: 0.15em 0.2em;
  6025. text-transform: uppercase;
  6026. }
  6027. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions button select.modular option {
  6028. background: var(--bg-dark);
  6029. }
  6030. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .auxiliary-actions button:has(select.modular:hover) {
  6031. text-shadow: none;
  6032. }
  6033. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .action-name .item-carry-type {
  6034. color: rgba(0, 0, 0, 0.4);
  6035. }
  6036. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list.strikes-list li.strike .action-name .item-carry-type.active {
  6037. color: var(--primary);
  6038. }
  6039. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .action-tracking {
  6040. align-items: center;
  6041. display: flex;
  6042. flex-direction: row;
  6043. flex-wrap: nowrap;
  6044. margin-left: auto;
  6045. margin-right: 16px;
  6046. }
  6047. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .action-tracking input {
  6048. width: 0;
  6049. flex: 0 1 48px;
  6050. background: none;
  6051. text-align: center;
  6052. }
  6053. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .action-tracking span {
  6054. white-space: nowrap;
  6055. }
  6056. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions .item-controls {
  6057. min-width: 28px;
  6058. text-align: right;
  6059. }
  6060. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list {
  6061. gap: 0.2em;
  6062. padding-bottom: 1em;
  6063. }
  6064. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item {
  6065. display: flex;
  6066. flex-wrap: wrap;
  6067. align-items: center;
  6068. justify-content: space-between;
  6069. padding: 2px 4px 2px 12px;
  6070. width: 100%;
  6071. }
  6072. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item p:empty {
  6073. display: none;
  6074. }
  6075. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-name {
  6076. display: flex;
  6077. align-items: center;
  6078. flex: 1;
  6079. }
  6080. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-name h4 {
  6081. cursor: pointer;
  6082. margin: 0;
  6083. }
  6084. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-name .item-image {
  6085. margin-right: 8px;
  6086. }
  6087. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-controls {
  6088. white-space: nowrap;
  6089. font-size: var(--font-size-12);
  6090. }
  6091. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-controls a.info-only:hover {
  6092. cursor: default;
  6093. text-shadow: none;
  6094. }
  6095. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-controls a + a {
  6096. margin-left: 4px;
  6097. }
  6098. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary {
  6099. flex-basis: 100%;
  6100. }
  6101. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .title,
  6102. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .framing {
  6103. color: var(--primary);
  6104. margin: 0;
  6105. padding: 0;
  6106. margin-top: 1em;
  6107. }
  6108. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .framing {
  6109. color: var(--secondary);
  6110. margin: 1em 0 0.25em;
  6111. }
  6112. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .framing strong {
  6113. font-weight: 500;
  6114. }
  6115. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .framing + p {
  6116. margin-top: 0;
  6117. }
  6118. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary img {
  6119. border: none;
  6120. vertical-align: middle;
  6121. }
  6122. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary img.actionlight {
  6123. background: var(--alt);
  6124. vertical-align: middle;
  6125. border: 1px solid var(--body);
  6126. }
  6127. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .item-properties .tag.toggled-on:hover, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .item-properties .tag.toggled-off:hover {
  6128. box-shadow: none;
  6129. text-shadow: 0 0 2px white;
  6130. }
  6131. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .item-properties .tag.toggled-on, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .item-properties .tag.toggled-off {
  6132. cursor: pointer;
  6133. }
  6134. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .item-summary .item-properties .tag.toggled-on {
  6135. background-color: rgba(23, 31, 105, 0.5);
  6136. color: black;
  6137. text-shadow: 0 0 2px white;
  6138. }
  6139. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item.unidentified {
  6140. border-radius: 1px;
  6141. outline: 1px dotted rgba(75, 74, 68, 0.5);
  6142. background: var(--visibility-gm-bg);
  6143. }
  6144. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .button-group {
  6145. display: flex;
  6146. justify-content: flex-end;
  6147. align-items: center;
  6148. flex-wrap: nowrap;
  6149. width: 50%;
  6150. flex: 0;
  6151. }
  6152. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .button-group button {
  6153. margin: 0;
  6154. border: none;
  6155. cursor: pointer;
  6156. font-family: var(--sans-serif);
  6157. font-size: var(--font-size-10);
  6158. text-transform: uppercase;
  6159. letter-spacing: 0.05em;
  6160. text-rendering: optimizeLegibility;
  6161. padding: 5px;
  6162. color: white;
  6163. width: 70px;
  6164. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  6165. background: var(--secondary);
  6166. border-radius: 2px;
  6167. flex: 0;
  6168. white-space: nowrap;
  6169. margin-left: 4px;
  6170. flex: 0;
  6171. }
  6172. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item .button-group button:hover {
  6173. box-shadow: none;
  6174. text-shadow: 0 0 2px white;
  6175. }
  6176. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item {
  6177. border-top: 1px solid #d5cac1;
  6178. border: solid transparent;
  6179. border-width: 0 0 1px;
  6180. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  6181. }
  6182. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item:last-child {
  6183. border-bottom: none;
  6184. }
  6185. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item-name h4 {
  6186. font-family: var(--serif);
  6187. }
  6188. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry {
  6189. align-items: center;
  6190. display: flex;
  6191. flex-wrap: wrap;
  6192. margin-bottom: 0.25em;
  6193. padding-bottom: 1em;
  6194. }
  6195. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry:first-child .action-header {
  6196. justify-content: start;
  6197. }
  6198. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable .d20-svg {
  6199. width: var(--font-size-14);
  6200. height: var(--font-size-14);
  6201. }
  6202. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable .d20-svg path {
  6203. fill: black;
  6204. }
  6205. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable:hover svg {
  6206. animation: rotation 2s infinite linear;
  6207. }
  6208. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data {
  6209. align-items: center;
  6210. display: flex;
  6211. flex: 1;
  6212. gap: 1rem;
  6213. margin: 0.5em 0.25rem;
  6214. }
  6215. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data section {
  6216. display: flex;
  6217. align-items: center;
  6218. }
  6219. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .rollable {
  6220. cursor: pointer;
  6221. }
  6222. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data button {
  6223. width: auto;
  6224. line-height: 1.5em;
  6225. padding-top: 1px;
  6226. margin-bottom: 1px;
  6227. }
  6228. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data button i {
  6229. font-size: 0.9em;
  6230. }
  6231. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .skill-score {
  6232. font-family: var(--serif);
  6233. font-weight: bold;
  6234. font-size: 1rem;
  6235. letter-spacing: -1px;
  6236. line-height: 1;
  6237. color: var(--secondary);
  6238. }
  6239. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values {
  6240. display: flex;
  6241. gap: 0.5rem;
  6242. }
  6243. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values .skill-data {
  6244. display: flex;
  6245. gap: 0.25rem;
  6246. white-space: nowrap;
  6247. }
  6248. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values h4 {
  6249. white-space: nowrap;
  6250. }
  6251. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .statistic-values .spell-attack {
  6252. cursor: pointer;
  6253. gap: 0.1rem;
  6254. }
  6255. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool {
  6256. cursor: pointer;
  6257. gap: 0.25em;
  6258. position: relative;
  6259. }
  6260. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool img.pool-size {
  6261. border: none;
  6262. width: 34px;
  6263. height: 32px;
  6264. }
  6265. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool .pips {
  6266. display: flex;
  6267. font-size: var(--font-size-10);
  6268. gap: 1px;
  6269. }
  6270. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool .pips i {
  6271. padding-bottom: 0.08rem;
  6272. }
  6273. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .focus-pool h4 {
  6274. white-space: nowrap;
  6275. }
  6276. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .spell-ability {
  6277. gap: 0.5em;
  6278. margin-left: auto;
  6279. }
  6280. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .spell-ability .spell-tradition {
  6281. font-family: var(--body-serif);
  6282. font-weight: 600;
  6283. }
  6284. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .pf-rank {
  6285. margin-bottom: 0.13rem;
  6286. }
  6287. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellbook-empty {
  6288. margin: 8px 0;
  6289. background: none;
  6290. border: none;
  6291. }
  6292. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .pf-add-item-row {
  6293. grid-column: span 4;
  6294. text-align: center;
  6295. width: 100%;
  6296. display: flex;
  6297. justify-content: space-evenly;
  6298. }
  6299. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .pf-add-item-row a {
  6300. width: 100%;
  6301. margin-bottom: 12px;
  6302. }
  6303. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane {
  6304. margin: 0;
  6305. padding: 0;
  6306. }
  6307. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane h1,
  6308. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane h4,
  6309. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane h6 {
  6310. margin: 0;
  6311. padding: 0;
  6312. line-height: 1;
  6313. display: flex;
  6314. align-items: center;
  6315. }
  6316. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane h1 {
  6317. font-family: var(--serif);
  6318. border: none;
  6319. color: var(--primary);
  6320. text-align: center;
  6321. justify-content: center;
  6322. }
  6323. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane h6 {
  6324. padding: 2px 4px;
  6325. border-radius: 2px;
  6326. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  6327. font-family: var(--sans-serif);
  6328. font-size: var(--font-size-10);
  6329. text-transform: uppercase;
  6330. letter-spacing: 0.05em;
  6331. text-rendering: optimizeLegibility;
  6332. color: white;
  6333. display: flex;
  6334. justify-content: center;
  6335. align-items: center;
  6336. cursor: pointer;
  6337. }
  6338. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .core-title {
  6339. width: 100%;
  6340. text-align: left;
  6341. margin: 0;
  6342. padding: 0;
  6343. margin-left: 0;
  6344. padding-top: 10px;
  6345. padding-left: 12px;
  6346. height: 43px;
  6347. border: none;
  6348. color: white;
  6349. font-family: var(--serif);
  6350. }
  6351. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list,
  6352. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list,
  6353. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list {
  6354. list-style: none;
  6355. margin: 0;
  6356. padding: 0;
  6357. display: grid;
  6358. grid-template-columns: repeat(2, 1fr);
  6359. gap: 12px;
  6360. align-items: center;
  6361. margin-bottom: 2em;
  6362. }
  6363. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill,
  6364. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill,
  6365. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill {
  6366. border-image-repeat: repeat;
  6367. border-image-slice: 11;
  6368. border-image-source: url("../assets/sheet/frame-elegant.svg");
  6369. border-image-width: 14px;
  6370. border-style: double;
  6371. padding: 2px 15px 2px 6px;
  6372. display: grid;
  6373. grid: "score name btn" min-content/42px 2fr 1fr;
  6374. align-items: center;
  6375. }
  6376. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill .rollable,
  6377. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .rollable,
  6378. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .rollable {
  6379. cursor: pointer;
  6380. }
  6381. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill .rollable:hover,
  6382. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .rollable:hover,
  6383. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .rollable:hover {
  6384. color: var(--primary);
  6385. text-shadow: 0 0 2px white;
  6386. text-decoration: underline;
  6387. }
  6388. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill .skill-score,
  6389. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .skill-score,
  6390. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .skill-score {
  6391. grid-area: score;
  6392. margin-right: 4px;
  6393. margin-top: 2px;
  6394. }
  6395. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill .skill-name,
  6396. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .skill-name,
  6397. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .skill-name {
  6398. grid-area: name;
  6399. }
  6400. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill .button-group,
  6401. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .button-group,
  6402. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .button-group {
  6403. grid-area: btn;
  6404. display: flex;
  6405. align-items: center;
  6406. justify-content: center;
  6407. flex-wrap: wrap;
  6408. }
  6409. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill .button-group h6,
  6410. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .button-group h6,
  6411. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .button-group h6 {
  6412. margin: 1px 0;
  6413. background: var(--sub);
  6414. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
  6415. }
  6416. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill .button-group h6:hover,
  6417. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .button-group h6:hover,
  6418. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .button-group h6:hover {
  6419. background: var(--primary);
  6420. }
  6421. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill.custom,
  6422. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill.custom,
  6423. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill.custom {
  6424. position: relative;
  6425. }
  6426. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill.custom a.delete,
  6427. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill.custom a.delete,
  6428. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill.custom a.delete {
  6429. position: absolute;
  6430. top: -8px;
  6431. right: -8px;
  6432. z-index: -1;
  6433. opacity: 0.75;
  6434. }
  6435. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill.custom a.delete:hover,
  6436. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill.custom a.delete:hover,
  6437. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill.custom a.delete:hover {
  6438. z-index: 1;
  6439. opacity: 1;
  6440. }
  6441. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill.custom:hover a.delete,
  6442. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill.custom:hover a.delete,
  6443. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill.custom:hover a.delete {
  6444. z-index: 1;
  6445. }
  6446. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill,
  6447. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill {
  6448. grid: "score name btn" min-content/42px 2fr 1fr;
  6449. padding: 2px 15px 2px 6px;
  6450. }
  6451. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .skill-score,
  6452. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .skill-score {
  6453. margin-right: 0;
  6454. }
  6455. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .skill-name input,
  6456. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .skill-name input {
  6457. color: var(--body) !important;
  6458. border-bottom: 1px solid var(--sub);
  6459. margin-right: 4px;
  6460. font-weight: 600;
  6461. }
  6462. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .skill-name input:hover,
  6463. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .skill-name input:hover {
  6464. border: 1px solid var(--sub);
  6465. }
  6466. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .button-group,
  6467. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .button-group {
  6468. grid-area: btn;
  6469. flex-wrap: nowrap;
  6470. margin-left: auto;
  6471. }
  6472. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill .button-group .item-controls,
  6473. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill .button-group .item-controls {
  6474. font-size: var(--font-size-12);
  6475. margin-top: 1px;
  6476. margin-left: 0.5rem;
  6477. }
  6478. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list {
  6479. grid-template-columns: 1fr;
  6480. }
  6481. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list {
  6482. grid-template: repeat(2, 1fr);
  6483. }
  6484. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .item {
  6485. grid-column: 1/3;
  6486. }
  6487. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lore-header .item-controls {
  6488. white-space: nowrap;
  6489. color: white;
  6490. font-family: var(--sans-serif);
  6491. font-size: var(--font-size-10);
  6492. text-transform: uppercase;
  6493. letter-spacing: 0.05em;
  6494. text-rendering: optimizeLegibility;
  6495. }
  6496. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lore-header .item-controls .item-control {
  6497. padding: 4px;
  6498. background: var(--secondary);
  6499. font-size: var(--font-size-10);
  6500. border-radius: 2px;
  6501. }
  6502. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats {
  6503. padding-bottom: 1em;
  6504. }
  6505. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-section {
  6506. padding-bottom: 1em;
  6507. }
  6508. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item {
  6509. display: grid;
  6510. grid: "name ctrl" min-content "content content" min-content/1fr min-content;
  6511. align-items: center;
  6512. padding: 2px 0;
  6513. }
  6514. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item:nth-child(odd) {
  6515. background-color: rgba(120, 100, 82, 0.1);
  6516. }
  6517. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-controls {
  6518. margin: 0;
  6519. }
  6520. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name {
  6521. grid-area: name;
  6522. display: flex;
  6523. flex: 1;
  6524. align-items: center;
  6525. width: 100%;
  6526. }
  6527. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .feat-slot-title {
  6528. display: flex;
  6529. font-family: var(--serif);
  6530. font-size: 1.1em;
  6531. font-weight: 600;
  6532. color: var(--secondary);
  6533. justify-content: center;
  6534. width: 20px;
  6535. margin-left: 6px;
  6536. }
  6537. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .item-placeholder {
  6538. margin-left: 40px;
  6539. margin-right: 4px;
  6540. }
  6541. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name h4 {
  6542. cursor: pointer;
  6543. display: flex;
  6544. align-items: center;
  6545. font-family: var(--serif);
  6546. }
  6547. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name h4:hover {
  6548. color: var(--primary);
  6549. text-shadow: 0 0 3px var(--tertiary);
  6550. }
  6551. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .item-image {
  6552. margin-left: 8px;
  6553. margin-right: 8px;
  6554. }
  6555. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-controls {
  6556. align-items: center;
  6557. display: flex;
  6558. font-size: var(--font-size-12);
  6559. grid-area: ctrl;
  6560. height: 100%;
  6561. white-space: nowrap;
  6562. width: 100%;
  6563. }
  6564. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-controls a:last-child {
  6565. margin-right: 6px;
  6566. }
  6567. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-summary {
  6568. flex: 100%;
  6569. grid-area: content;
  6570. padding: 0 8px 8px;
  6571. margin: 4px 0 0 4px;
  6572. }
  6573. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items {
  6574. grid-column: span 2;
  6575. border-left: 3px dotted #786452;
  6576. display: flex;
  6577. margin: 1px 0 0 45px;
  6578. padding: 0;
  6579. flex-basis: 100%;
  6580. flex-direction: column;
  6581. }
  6582. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li {
  6583. align-items: center;
  6584. display: flex;
  6585. flex-wrap: wrap;
  6586. gap: 2px;
  6587. margin: 2px 0;
  6588. padding-bottom: 1px;
  6589. }
  6590. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li:last-child {
  6591. padding-bottom: 0;
  6592. }
  6593. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li .item-name .feat-slot-title {
  6594. width: 0;
  6595. }
  6596. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li .item-name img {
  6597. margin-left: 0;
  6598. }
  6599. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li .item-controls {
  6600. flex: 0;
  6601. }
  6602. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item ol.nested-items li ol.nested-items {
  6603. margin-left: 25px;
  6604. }
  6605. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography {
  6606. padding-right: 20px !important;
  6607. }
  6608. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .biography-personality {
  6609. display: flex;
  6610. flex-wrap: wrap;
  6611. }
  6612. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .biography-personality .h3 {
  6613. display: block;
  6614. }
  6615. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .biography-personality .bio {
  6616. display: flex;
  6617. flex-direction: column;
  6618. justify-content: flex-start;
  6619. align-items: flex-start;
  6620. flex: 50%;
  6621. margin-bottom: 8px;
  6622. }
  6623. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .biography-personality .bio span {
  6624. width: 100%;
  6625. }
  6626. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .biography-campaign-notes {
  6627. display: flex;
  6628. flex-direction: column;
  6629. }
  6630. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .biography-campaign-notes span {
  6631. width: 100%;
  6632. }
  6633. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory {
  6634. height: calc(100% - 40px);
  6635. }
  6636. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-list {
  6637. padding-right: 0.1rem;
  6638. }
  6639. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-list .item .item-name h4.rarity-common {
  6640. border-color: #323232;
  6641. color: #323232;
  6642. }
  6643. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-list .item .item-name h4.rarity-uncommon {
  6644. border-color: #98513d;
  6645. color: #98513d;
  6646. }
  6647. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-list .item .item-name h4.rarity-rare {
  6648. border-color: #002664;
  6649. color: #002664;
  6650. }
  6651. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-list .item .item-name h4.rarity-unique {
  6652. border-color: #54166e;
  6653. color: #54166e;
  6654. }
  6655. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .item-controls {
  6656. flex: 0 0 100px;
  6657. }
  6658. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-items {
  6659. border: 1px solid var(--alt);
  6660. border-top: none;
  6661. }
  6662. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .wealth {
  6663. margin-bottom: 0.5rem;
  6664. }
  6665. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-header {
  6666. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  6667. margin-top: 8px;
  6668. }
  6669. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .inventory-header:first-child {
  6670. margin-top: 0;
  6671. }
  6672. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .encumbrance {
  6673. align-items: center;
  6674. display: grid;
  6675. grid: "img bar overflow" min-content/24px 1fr;
  6676. margin: auto;
  6677. }
  6678. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .encumbrance img {
  6679. grid-area: img;
  6680. border: none;
  6681. border-radius: 2px;
  6682. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.5);
  6683. border-radius: 0;
  6684. position: relative;
  6685. z-index: 4;
  6686. }
  6687. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .encumbrance .encumbrance-bar {
  6688. position: relative;
  6689. z-index: 2;
  6690. grid-area: bar;
  6691. height: 16px;
  6692. width: 100%;
  6693. background-color: var(--secondary);
  6694. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  6695. }
  6696. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .encumbrance .encumbrance-label {
  6697. position: relative;
  6698. z-index: 3;
  6699. grid-area: bar;
  6700. color: white;
  6701. font-family: var(--serif);
  6702. font-size: var(--font-size-12);
  6703. font-weight: 500;
  6704. padding: 0 8px;
  6705. padding-top: 2px;
  6706. display: flex;
  6707. align-items: center;
  6708. justify-content: space-between;
  6709. width: 100%;
  6710. text-shadow: 0 0 2px black;
  6711. }
  6712. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .encumbrance .encumbrance-light-bulk-overflow {
  6713. position: relative;
  6714. z-index: 3;
  6715. grid-area: overflow;
  6716. color: black;
  6717. font-family: var(--serif);
  6718. font-size: var(--font-size-12);
  6719. font-weight: 500;
  6720. padding: 0 8px;
  6721. padding-top: 2px;
  6722. display: flex;
  6723. align-items: center;
  6724. justify-content: space-between;
  6725. width: 100%;
  6726. text-shadow: 0 0 2px white;
  6727. }
  6728. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .encumbrance .bar-bg {
  6729. position: relative;
  6730. z-index: 1;
  6731. grid-area: bar;
  6732. width: 100%;
  6733. height: 16px;
  6734. background-color: rgba(0, 0, 0, 0.5);
  6735. border-radius: 0 2px 2px 0;
  6736. box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.75);
  6737. }
  6738. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.inventory .encumbrance.over-limit .encumbrance-bar {
  6739. background-color: var(--primary) !important;
  6740. }
  6741. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs {
  6742. gap: 0.2em;
  6743. }
  6744. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item {
  6745. display: flex;
  6746. flex-wrap: wrap;
  6747. align-items: center;
  6748. justify-content: space-between;
  6749. padding: 2px 4px 2px 12px;
  6750. width: 100%;
  6751. }
  6752. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item p:empty {
  6753. display: none;
  6754. }
  6755. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-name {
  6756. display: flex;
  6757. align-items: center;
  6758. flex: 1;
  6759. }
  6760. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-name h4 {
  6761. cursor: pointer;
  6762. margin: 0;
  6763. }
  6764. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-name .item-image {
  6765. margin-right: 8px;
  6766. }
  6767. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-controls {
  6768. white-space: nowrap;
  6769. font-size: var(--font-size-12);
  6770. }
  6771. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-controls a.info-only:hover {
  6772. cursor: default;
  6773. text-shadow: none;
  6774. }
  6775. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-controls a + a {
  6776. margin-left: 4px;
  6777. }
  6778. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary {
  6779. flex-basis: 100%;
  6780. }
  6781. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .title,
  6782. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .framing {
  6783. color: var(--primary);
  6784. margin: 0;
  6785. padding: 0;
  6786. margin-top: 1em;
  6787. }
  6788. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .framing {
  6789. color: var(--secondary);
  6790. margin: 1em 0 0.25em;
  6791. }
  6792. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .framing strong {
  6793. font-weight: 500;
  6794. }
  6795. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .framing + p {
  6796. margin-top: 0;
  6797. }
  6798. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary img {
  6799. border: none;
  6800. vertical-align: middle;
  6801. }
  6802. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary img.actionlight {
  6803. background: var(--alt);
  6804. vertical-align: middle;
  6805. border: 1px solid var(--body);
  6806. }
  6807. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .item-properties .tag.toggled-on:hover, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .item-properties .tag.toggled-off:hover {
  6808. box-shadow: none;
  6809. text-shadow: 0 0 2px white;
  6810. }
  6811. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .item-properties .tag.toggled-on, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .item-properties .tag.toggled-off {
  6812. cursor: pointer;
  6813. }
  6814. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .item-summary .item-properties .tag.toggled-on {
  6815. background-color: rgba(23, 31, 105, 0.5);
  6816. color: black;
  6817. text-shadow: 0 0 2px white;
  6818. }
  6819. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item.unidentified {
  6820. border-radius: 1px;
  6821. outline: 1px dotted rgba(75, 74, 68, 0.5);
  6822. background: var(--visibility-gm-bg);
  6823. }
  6824. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .button-group {
  6825. display: flex;
  6826. justify-content: flex-end;
  6827. align-items: center;
  6828. flex-wrap: nowrap;
  6829. width: 50%;
  6830. flex: 0;
  6831. }
  6832. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .button-group button {
  6833. margin: 0;
  6834. border: none;
  6835. cursor: pointer;
  6836. font-family: var(--sans-serif);
  6837. font-size: var(--font-size-10);
  6838. text-transform: uppercase;
  6839. letter-spacing: 0.05em;
  6840. text-rendering: optimizeLegibility;
  6841. padding: 5px;
  6842. color: white;
  6843. width: 70px;
  6844. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  6845. background: var(--secondary);
  6846. border-radius: 2px;
  6847. flex: 0;
  6848. white-space: nowrap;
  6849. margin-left: 4px;
  6850. flex: 0;
  6851. }
  6852. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs .item .button-group button:hover {
  6853. box-shadow: none;
  6854. text-shadow: 0 0 2px white;
  6855. }
  6856. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section {
  6857. display: flex;
  6858. flex-direction: column;
  6859. gap: 0.25em;
  6860. margin: 0.75rem 0;
  6861. }
  6862. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section:first-child {
  6863. margin-top: 0.25rem;
  6864. }
  6865. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play {
  6866. align-items: center;
  6867. display: grid;
  6868. grid-template-columns: 6em 1em 4em;
  6869. }
  6870. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play > * {
  6871. width: 100%;
  6872. }
  6873. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play input {
  6874. text-align: center;
  6875. }
  6876. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play .dash {
  6877. font-weight: bold;
  6878. text-align: center;
  6879. }
  6880. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.organized-play label.player-number {
  6881. grid-column: span 2;
  6882. }
  6883. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump {
  6884. align-items: center;
  6885. flex-direction: row;
  6886. }
  6887. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle {
  6888. width: 42px;
  6889. height: 1rem;
  6890. background: rgba(0, 0, 0, 0.5);
  6891. position: relative;
  6892. border-radius: 50px;
  6893. box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2);
  6894. }
  6895. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle.enabled {
  6896. background: var(--secondary);
  6897. }
  6898. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle::after {
  6899. content: "OFF";
  6900. color: black;
  6901. position: absolute;
  6902. right: 5px;
  6903. z-index: 0;
  6904. text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15);
  6905. }
  6906. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle::before {
  6907. content: "ON";
  6908. color: white;
  6909. position: absolute;
  6910. left: 6px;
  6911. z-index: 0;
  6912. }
  6913. .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 {
  6914. font-family: var(--sans-serif);
  6915. font-size: var(--font-size-10);
  6916. text-transform: uppercase;
  6917. letter-spacing: 0.05em;
  6918. text-rendering: optimizeLegibility;
  6919. top: 4px;
  6920. }
  6921. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle label {
  6922. display: block;
  6923. width: 18px;
  6924. height: 14px;
  6925. position: absolute;
  6926. top: 1px;
  6927. right: 20px;
  6928. cursor: pointer;
  6929. background: #fcfff4;
  6930. z-index: 1;
  6931. background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  6932. border-radius: 50%;
  6933. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0px 2px 5px 0px rgba(0, 0, 0, 0.3);
  6934. transition: all 0.4s ease;
  6935. }
  6936. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle input[type=checkbox] {
  6937. visibility: hidden;
  6938. }
  6939. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.level-bump .toggle input[type=checkbox]:checked + label {
  6940. right: 1px;
  6941. }
  6942. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.faction {
  6943. max-width: fit-content;
  6944. }
  6945. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.reputations {
  6946. font-family: var(--serif);
  6947. gap: 0.2em;
  6948. }
  6949. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.reputations .reputation {
  6950. align-items: center;
  6951. display: flex;
  6952. gap: 0.2em;
  6953. justify-content: space-between;
  6954. width: 12em;
  6955. }
  6956. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.pfs > section.reputations .reputation input {
  6957. padding: 0 0.3em;
  6958. text-align: right;
  6959. width: 3em;
  6960. }
  6961. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options {
  6962. display: flex;
  6963. flex-wrap: wrap;
  6964. margin: 0 1rem 1rem;
  6965. padding: 0.5rem 1rem;
  6966. border-image-repeat: repeat;
  6967. border-image-slice: 11;
  6968. border-image-source: url("../assets/sheet/frame-elegant.svg");
  6969. border-image-width: 14px;
  6970. border-style: double;
  6971. }
  6972. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options .crafting-option {
  6973. display: flex;
  6974. align-items: center;
  6975. width: 100%;
  6976. }
  6977. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options .crafting-option label * {
  6978. vertical-align: middle;
  6979. }
  6980. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options .crafting-option label input {
  6981. margin: 0;
  6982. padding: 0;
  6983. }
  6984. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry {
  6985. display: flex;
  6986. flex-wrap: wrap;
  6987. justify-content: space-evenly;
  6988. align-items: center;
  6989. background: none;
  6990. border: none;
  6991. }
  6992. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas.item-container, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry.item-container {
  6993. margin-bottom: 0.5em;
  6994. }
  6995. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas.alchemical-entry, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry.alchemical-entry {
  6996. margin-bottom: 0;
  6997. }
  6998. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas.alchemical-entry:last-child, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry.alchemical-entry:last-child {
  6999. margin-bottom: 0.5em;
  7000. }
  7001. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas:first-child .action-header, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry:first-child .action-header {
  7002. margin-top: 0;
  7003. }
  7004. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header .item-controls .toggle-free-crafting, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header .item-controls .toggle-free-crafting {
  7005. display: flex;
  7006. align-items: center;
  7007. justify-content: flex-end;
  7008. }
  7009. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header .item-controls .toggle-free-crafting *, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header .item-controls .toggle-free-crafting * {
  7010. flex: 1 0 auto;
  7011. }
  7012. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header .item-controls .toggle-free-crafting input[type=checkbox], .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header .item-controls .toggle-free-crafting input[type=checkbox] {
  7013. height: 1em;
  7014. width: 1em;
  7015. }
  7016. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .action-header.alchemical-title, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .action-header.alchemical-title {
  7017. background: var(--secondary);
  7018. }
  7019. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list {
  7020. margin: 0;
  7021. padding: 0;
  7022. width: 100%;
  7023. flex-basis: 100%;
  7024. position: relative;
  7025. z-index: 1;
  7026. }
  7027. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item[data-expended-state=true] h4, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item[data-expended-state=true] h4 {
  7028. color: var(--color-disabled);
  7029. text-decoration: line-through;
  7030. }
  7031. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item[data-expended-state=true] .toggle-formula-expended, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item[data-expended-state=true] .toggle-formula-expended {
  7032. color: var(--primary);
  7033. }
  7034. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item {
  7035. display: grid;
  7036. grid: "name dc price quantity controls" 1fr/4fr 0.7fr 1fr 1fr 1fr;
  7037. align-items: center;
  7038. justify-items: center;
  7039. margin: 0;
  7040. padding: 0;
  7041. background: none;
  7042. border: none;
  7043. border-left: 1px solid var(--sub);
  7044. border-right: 1px solid var(--sub);
  7045. cursor: default;
  7046. }
  7047. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header:nth-child(odd), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item:nth-child(odd), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header:nth-child(odd), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item:nth-child(odd) {
  7048. background-color: rgba(120, 100, 82, 0.1);
  7049. }
  7050. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header:last-child, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item:last-child, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header:last-child, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item:last-child {
  7051. border-bottom: 1px solid var(--sub);
  7052. }
  7053. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header:last-child .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item:last-child .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header:last-child .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item:last-child .item-image {
  7054. margin-bottom: 0;
  7055. margin-top: 2px;
  7056. }
  7057. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header {
  7058. background: rgba(96, 88, 86, 0.25);
  7059. border: 1px solid var(--sub);
  7060. padding: 4px;
  7061. color: var(--body);
  7062. font: 600 var(--font-size-12) var(--sans-serif);
  7063. line-height: 1;
  7064. letter-spacing: 0.25px;
  7065. margin: 0;
  7066. }
  7067. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header h3 {
  7068. text-transform: capitalize;
  7069. font-size: var(--font-size-12);
  7070. margin-left: 0;
  7071. padding: 4px 0;
  7072. }
  7073. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header .level-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header .level-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header .level-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header .level-name {
  7074. line-height: 1;
  7075. gap: 0.5em;
  7076. }
  7077. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header .level-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header .level-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header .level-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header .level-name h3 {
  7078. margin: 0;
  7079. padding: 0;
  7080. }
  7081. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header .formula-number, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header .formula-number, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header .formula-number, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header .formula-number {
  7082. background: var(--alt);
  7083. border: 1px solid var(--sub);
  7084. border-radius: 3px;
  7085. color: white;
  7086. font-size: var(--font-size-11);
  7087. height: 14px;
  7088. max-width: 22px;
  7089. padding-top: 2px;
  7090. text-align: center;
  7091. width: 22px;
  7092. }
  7093. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header.formula-level-header input.formula-number, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item.formula-level-header input.formula-number, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header.formula-level-header input.formula-number, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item.formula-level-header input.formula-number {
  7094. background: var(--alt-dark);
  7095. }
  7096. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name {
  7097. cursor: pointer;
  7098. min-height: 28px;
  7099. }
  7100. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name {
  7101. justify-self: start;
  7102. display: flex;
  7103. align-items: center;
  7104. justify-content: flex-start;
  7105. flex-wrap: nowrap;
  7106. line-height: 1.5;
  7107. flex-basis: 50%;
  7108. }
  7109. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name h3, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name h3 {
  7110. white-space: nowrap;
  7111. }
  7112. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name + span:not(.flex0), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name + span:not(.flex0), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name + span:not(.flex0), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name + span:not(.flex0), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name + span:not(.flex0), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name + span:not(.flex0), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name + span:not(.flex0), .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name + span:not(.flex0) {
  7113. font-size: var(--font-size-12);
  7114. }
  7115. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name .item-image, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name .item-image {
  7116. margin: 2px 0;
  7117. margin-left: 4px;
  7118. }
  7119. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name h4, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name h4, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name h4, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name h4, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name h4, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name h4, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name h4, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name h4 {
  7120. margin: 0;
  7121. padding: 0;
  7122. margin-left: 8px;
  7123. line-height: 1;
  7124. letter-spacing: -0.075em;
  7125. }
  7126. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .level-name h4:hover, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name h4:hover, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name h4:hover, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name h4:hover, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name h4:hover, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name h4:hover, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name h4:hover, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name h4:hover {
  7127. color: var(--secondary);
  7128. }
  7129. .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, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name.aa-level, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-name.reagent-resource, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name.aa-level, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .level-name.reagent-resource, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name.aa-level, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-name.reagent-resource, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name.aa-level, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .level-name.reagent-resource, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name.aa-level, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-name.reagent-resource, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name.aa-level, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .level-name.reagent-resource, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name.aa-level, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-name.reagent-resource {
  7130. justify-content: flex-end;
  7131. }
  7132. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-controls, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-controls, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-controls, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-controls {
  7133. justify-self: end;
  7134. font-size: var(--font-size-12);
  7135. margin-right: 4px;
  7136. }
  7137. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-controls .item-control.disabled, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-controls .item-control.disabled, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-controls .item-control.disabled, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-controls .item-control.disabled {
  7138. opacity: 0.3;
  7139. }
  7140. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-summary, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-summary, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-summary, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-summary {
  7141. grid-column: 1/6;
  7142. padding: 8px;
  7143. border-bottom: 1px solid var(--sub);
  7144. border-top: 1px solid #aca5a3;
  7145. background-color: var(--bg);
  7146. }
  7147. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-summary p, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-summary p, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-summary p, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-summary p {
  7148. margin-top: 0;
  7149. }
  7150. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .item-summary .item-buttons button, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .item-summary .item-buttons button, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .item-summary .item-buttons button, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .item-summary .item-buttons button {
  7151. display: none;
  7152. }
  7153. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity {
  7154. align-items: center;
  7155. display: flex;
  7156. justify-content: center;
  7157. }
  7158. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity .adjust, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity .adjust, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity .adjust, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity .adjust {
  7159. align-items: center;
  7160. display: flex;
  7161. font-family: var(--sans-serif-monospace);
  7162. justify-content: center;
  7163. width: 1em;
  7164. }
  7165. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity .adjust.decrease, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity .adjust.decrease, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity .adjust.decrease, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity .adjust.decrease {
  7166. padding-right: 3px;
  7167. }
  7168. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity .adjust.increase, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity .adjust.increase, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity .adjust.increase, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-item .quantity .adjust.increase {
  7169. padding-left: 3px;
  7170. }
  7171. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-level-header .quantity input, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .formula-item .quantity input, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .formula-level-header .quantity input, .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, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .empty {
  7176. align-items: center;
  7177. display: flex;
  7178. justify-content: space-between;
  7179. min-height: 28px;
  7180. }
  7181. .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .known-formulas .formula-list .empty > *, .actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-entry .formula-list .empty > * {
  7182. white-space: nowrap;
  7183. }
  7184. .actor.sheet.character .crb-style .sheet-body .sheet-content .directory-list {
  7185. margin: 0;
  7186. padding: 0;
  7187. display: flex;
  7188. flex-direction: column;
  7189. list-style: none;
  7190. width: 100%;
  7191. }
  7192. .actor.sheet.character .crb-style .sheet-body .sheet-content .directory-list h4 {
  7193. margin: 0;
  7194. padding: 0;
  7195. }
  7196. .actor.sheet.character .crb-style .sheet-body .sheet-content .directory-list .item ol {
  7197. list-style: none;
  7198. }
  7199. .actor.sheet.character .crb-style .sheet-body .sheet-content .blue-button {
  7200. align-items: center;
  7201. background: var(--secondary);
  7202. border: black;
  7203. border-radius: 2px;
  7204. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  7205. color: white;
  7206. display: flex;
  7207. font-family: var(--serif);
  7208. font-weight: 500;
  7209. gap: 0.25em;
  7210. line-height: 1.8em;
  7211. justify-content: center;
  7212. margin: 0;
  7213. padding: 0 0.5em;
  7214. }
  7215. .actor.sheet.character .crb-style .sheet-body .sheet-content .blue-button:hover {
  7216. text-shadow: 0 0 4px white;
  7217. }
  7218. .actor.sheet.vehicle .crb-style .sheet-navigation {
  7219. min-width: 375px;
  7220. }
  7221. .actor.sheet.vehicle .crb-style aside .sidebar .save-roll input[type=number] {
  7222. width: 3ch;
  7223. font-size: var(--font-size-20);
  7224. height: 24px;
  7225. }
  7226. .actor.sheet.vehicle .crb-style aside .sidebar .hitpoints .container {
  7227. display: grid;
  7228. }
  7229. .actor.sheet.vehicle .crb-style aside .sidebar .armor-class {
  7230. grid: "ac hardness" 1fr;
  7231. }
  7232. .actor.sheet.vehicle .crb-style aside .sidebar .armor-class .shield {
  7233. padding: 18px 20px 0 20px;
  7234. }
  7235. .actor.sheet.vehicle .crb-style aside .sidebar .armor-class .hardness {
  7236. background: url("../assets/sheet/shield-red.webp") no-repeat top center;
  7237. }
  7238. .actor.sheet.vehicle .crb-style aside .sidebar li.tag {
  7239. font-size: var(--font-size-10);
  7240. }
  7241. .actor.sheet.vehicle .crb-style header.char-header .tags select {
  7242. font-family: var(--sans-serif);
  7243. font-size: var(--font-size-12);
  7244. text-transform: uppercase;
  7245. }
  7246. .actor.sheet.vehicle .crb-style header.char-header .char-details {
  7247. font-size: var(--font-size-13);
  7248. font-weight: normal;
  7249. }
  7250. .actor.sheet.vehicle .crb-style .sheet-content > .tab:not(.inventory), .actor.sheet.vehicle .crb-style .sheet-content > .tab .inventory .inventory-list {
  7251. overflow: hidden scroll;
  7252. scrollbar-width: thin;
  7253. scrollbar-color: var(--primary) transparent;
  7254. flex-grow: 1;
  7255. overflow: hidden scroll;
  7256. }
  7257. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .vehicle-details {
  7258. display: grid;
  7259. grid: "img details" 1fr/120px 1fr;
  7260. min-width: 330px;
  7261. }
  7262. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .vehicle-details .frame {
  7263. margin-left: 5px;
  7264. }
  7265. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .vehicle-details .frame .actor-image {
  7266. margin-top: 8px;
  7267. max-height: 90%;
  7268. object-fit: contain;
  7269. border-radius: 0;
  7270. border: none;
  7271. 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;
  7272. }
  7273. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .vehicle-details .image-container [data-action=show-image] {
  7274. bottom: 3px;
  7275. right: 1px;
  7276. }
  7277. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .vehicle-details .detail-sheet {
  7278. display: grid;
  7279. grid: repeat(2, 42px)/3fr 2fr;
  7280. grid-row-gap: 8px;
  7281. padding-left: 12px;
  7282. }
  7283. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .vehicle-details .detail-small {
  7284. display: flex;
  7285. }
  7286. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .vehicle-properties {
  7287. display: flex;
  7288. flex-wrap: wrap;
  7289. padding-top: 8px;
  7290. }
  7291. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .vehicle-properties > div {
  7292. display: flex;
  7293. flex-direction: column;
  7294. justify-content: flex-start;
  7295. align-items: flex-start;
  7296. margin-bottom: 8px;
  7297. }
  7298. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .vehicle-properties > div > span {
  7299. width: 100%;
  7300. }
  7301. .actor.sheet.vehicle .crb-style .sheet-content > .tab.details .detailsInput {
  7302. margin-bottom: 8px;
  7303. }
  7304. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list {
  7305. gap: 0.2em;
  7306. padding-bottom: 1em;
  7307. }
  7308. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item {
  7309. display: flex;
  7310. flex-wrap: wrap;
  7311. align-items: center;
  7312. justify-content: space-between;
  7313. padding: 2px 4px 2px 12px;
  7314. width: 100%;
  7315. }
  7316. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item p:empty {
  7317. display: none;
  7318. }
  7319. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-name {
  7320. display: flex;
  7321. align-items: center;
  7322. flex: 1;
  7323. }
  7324. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-name h4 {
  7325. cursor: pointer;
  7326. margin: 0;
  7327. }
  7328. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-name .item-image {
  7329. margin-right: 8px;
  7330. }
  7331. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-controls {
  7332. white-space: nowrap;
  7333. font-size: var(--font-size-12);
  7334. }
  7335. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-controls a.info-only:hover {
  7336. cursor: default;
  7337. text-shadow: none;
  7338. }
  7339. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-controls a + a {
  7340. margin-left: 4px;
  7341. }
  7342. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary {
  7343. flex-basis: 100%;
  7344. }
  7345. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .title,
  7346. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .framing {
  7347. color: var(--primary);
  7348. margin: 0;
  7349. padding: 0;
  7350. margin-top: 1em;
  7351. }
  7352. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .framing {
  7353. color: var(--secondary);
  7354. margin: 1em 0 0.25em;
  7355. }
  7356. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .framing strong {
  7357. font-weight: 500;
  7358. }
  7359. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .framing + p {
  7360. margin-top: 0;
  7361. }
  7362. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary img {
  7363. border: none;
  7364. vertical-align: middle;
  7365. }
  7366. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary img.actionlight {
  7367. background: var(--alt);
  7368. vertical-align: middle;
  7369. border: 1px solid var(--body);
  7370. }
  7371. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .item-properties .tag.toggled-on:hover, .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .item-properties .tag.toggled-off:hover {
  7372. box-shadow: none;
  7373. text-shadow: 0 0 2px white;
  7374. }
  7375. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .item-properties .tag.toggled-on, .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .item-properties .tag.toggled-off {
  7376. cursor: pointer;
  7377. }
  7378. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .item-summary .item-properties .tag.toggled-on {
  7379. background-color: rgba(23, 31, 105, 0.5);
  7380. color: black;
  7381. text-shadow: 0 0 2px white;
  7382. }
  7383. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item.unidentified {
  7384. border-radius: 1px;
  7385. outline: 1px dotted rgba(75, 74, 68, 0.5);
  7386. background: var(--visibility-gm-bg);
  7387. }
  7388. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .button-group {
  7389. display: flex;
  7390. justify-content: flex-end;
  7391. align-items: center;
  7392. flex-wrap: nowrap;
  7393. width: 50%;
  7394. flex: 0;
  7395. }
  7396. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .button-group button {
  7397. margin: 0;
  7398. border: none;
  7399. cursor: pointer;
  7400. font-family: var(--sans-serif);
  7401. font-size: var(--font-size-10);
  7402. text-transform: uppercase;
  7403. letter-spacing: 0.05em;
  7404. text-rendering: optimizeLegibility;
  7405. padding: 5px;
  7406. color: white;
  7407. width: 70px;
  7408. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  7409. background: var(--secondary);
  7410. border-radius: 2px;
  7411. flex: 0;
  7412. white-space: nowrap;
  7413. margin-left: 4px;
  7414. flex: 0;
  7415. }
  7416. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item .button-group button:hover {
  7417. box-shadow: none;
  7418. text-shadow: 0 0 2px white;
  7419. }
  7420. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item {
  7421. border-top: 1px solid #d5cac1;
  7422. border: solid transparent;
  7423. border-width: 0 0 1px;
  7424. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  7425. }
  7426. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item-image {
  7427. border-radius: 2px;
  7428. }
  7429. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item:last-child {
  7430. border-bottom: none;
  7431. }
  7432. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects.effects .effects-list .item-name h4 {
  7433. font-family: var(--serif);
  7434. }
  7435. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects h3.header {
  7436. position: relative;
  7437. margin-top: 0.75em;
  7438. font-size: var(--font-size-16);
  7439. font-family: var(--serif);
  7440. font-weight: 600;
  7441. color: var(--primary);
  7442. line-height: 1;
  7443. border-bottom: 1px solid var(--color-border-divider);
  7444. }
  7445. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects h3.header > button, .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects h3.header > .controls {
  7446. position: absolute;
  7447. bottom: -1px;
  7448. right: 0;
  7449. }
  7450. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects h3.header .controls {
  7451. display: flex;
  7452. }
  7453. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects h3.header button {
  7454. background: transparent;
  7455. border-radius: 2px 2px 0 0;
  7456. border: 1px solid var(--color-border-divider);
  7457. color: var(--primary);
  7458. cursor: pointer;
  7459. font-family: var(--sans-serif);
  7460. font-size: var(--font-size-12);
  7461. font-weight: 500;
  7462. height: 20px;
  7463. line-height: var(--font-size-12);
  7464. margin: 0;
  7465. outline: none;
  7466. text-transform: uppercase;
  7467. width: auto;
  7468. }
  7469. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects ol.directory-list {
  7470. margin: 0;
  7471. padding: 0;
  7472. display: flex;
  7473. flex-direction: column;
  7474. list-style: none;
  7475. width: 100%;
  7476. }
  7477. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects ol.directory-list h4 {
  7478. margin: 0;
  7479. padding: 0;
  7480. }
  7481. .actor.sheet.vehicle .crb-style .sheet-content > .tab.effects ol.directory-list .item ol {
  7482. list-style: none;
  7483. }
  7484. .actor.sheet.vehicle .crb-style input.adjustable:not(:focus).adjusted-higher,
  7485. .actor.sheet.vehicle .crb-style span.adjustable.adjusted-higher {
  7486. color: #009988;
  7487. }
  7488. .actor.sheet.vehicle .crb-style input.adjustable:not(:focus).adjusted-lower,
  7489. .actor.sheet.vehicle .crb-style span.adjustable.adjusted-lower {
  7490. color: #cc3311;
  7491. }
  7492. .actor.sheet.vehicle .crb-style .row-nr-1 {
  7493. grid-row: 1/2;
  7494. }
  7495. .actor.sheet.vehicle .crb-style .row-nr-2 {
  7496. grid-row: 2/3;
  7497. }
  7498. .actor.sheet.vehicle .crb-style .row-nr-3 {
  7499. grid-row: 3/4;
  7500. }
  7501. .actor.sheet.vehicle .crb-style .span-2-columns {
  7502. grid-column-end: span 2;
  7503. }
  7504. .actor.sheet.vehicle .crb-style .flexitem-1 {
  7505. flex: 1 1 10%;
  7506. }
  7507. .actor.sheet.vehicle .crb-style .flexitem-5 {
  7508. flex: 5 1 50%;
  7509. }
  7510. .actor.sheet.vehicle .crb-style .flexitem-full {
  7511. flex: 100%;
  7512. }
  7513. .actor.sheet .crb-style {
  7514. display: grid;
  7515. grid: "sidebar header" 75px "sidebar nav" minmax(min-content, max-content) "sidebar content" 1fr/230px 1fr;
  7516. font-family: var(--body-serif);
  7517. background: url("../assets/sheet/header.webp"), url("../assets/sheet/background.webp");
  7518. background-repeat: repeat-x, no-repeat;
  7519. background-size: auto 89px, cover;
  7520. background-attachment: local;
  7521. height: 100%;
  7522. /* Navigation */
  7523. /** White background navigation with little decorations on the left and right */
  7524. /* Page structure elements */
  7525. /* Read-Only Sheet */
  7526. }
  7527. .actor.sheet .crb-style .d20-svg {
  7528. width: 19px;
  7529. height: 19px;
  7530. }
  7531. .actor.sheet .crb-style aside {
  7532. grid-area: sidebar;
  7533. color: var(--sidebar-label);
  7534. font-family: var(--serif);
  7535. font-size: var(--font-size-10);
  7536. font-weight: 600;
  7537. margin-left: 8px;
  7538. background-image: url("../assets/sheet/red_sidebar_top.webp"), url("../assets/sheet/red_sidebar_bottom.webp");
  7539. background-repeat: no-repeat;
  7540. background-position: center calc(100% - 52px), center bottom;
  7541. background-size: 224px 100%, 224px 52px;
  7542. display: flex;
  7543. flex-direction: column;
  7544. }
  7545. .actor.sheet .crb-style aside input[type=number] {
  7546. -moz-appearance: textfield;
  7547. color: var(--text-light);
  7548. text-align: center;
  7549. font-size: var(--font-size-26);
  7550. line-height: 1;
  7551. font-weight: initial;
  7552. font-family: var(--serif);
  7553. border: none;
  7554. }
  7555. .actor.sheet .crb-style aside input[type=number]:focus {
  7556. box-shadow: none;
  7557. }
  7558. .actor.sheet .crb-style aside input[type=number]::-webkit-outer-spin-button, .actor.sheet .crb-style aside input[type=number]::-webkit-inner-spin-button {
  7559. -webkit-appearance: none;
  7560. margin: 0;
  7561. }
  7562. .actor.sheet .crb-style aside input[type=number]:read-only {
  7563. pointer-events: none;
  7564. color: var(--tertiary-light);
  7565. }
  7566. .actor.sheet .crb-style aside input[type=number]:hover {
  7567. text-shadow: 0 0 4px var(--tertiary);
  7568. }
  7569. .actor.sheet .crb-style aside .modifiers_button {
  7570. background: rgba(255, 255, 255, 0.75);
  7571. border-radius: 2px 2px 0 0;
  7572. border: none;
  7573. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
  7574. color: var(--primary);
  7575. flex: 0;
  7576. font: 600 var(--font-size-9) var(--sans-serif);
  7577. letter-spacing: 0.05em;
  7578. line-height: 1;
  7579. margin: 0;
  7580. padding: 2px 3px;
  7581. text-rendering: optimizeLegibility;
  7582. text-transform: uppercase;
  7583. white-space: nowrap;
  7584. }
  7585. .actor.sheet .crb-style aside .modifiers_button:hover:not(:disabled) {
  7586. background: white;
  7587. box-shadow: inset 0 0 0 1px white;
  7588. }
  7589. .actor.sheet .crb-style aside .logo {
  7590. margin: 5px -6px 0 -6px;
  7591. border: none;
  7592. z-index: 10;
  7593. max-width: unset;
  7594. flex-shrink: 0;
  7595. }
  7596. .actor.sheet .crb-style aside .sidebar {
  7597. padding: 0 2px 2px 8px;
  7598. margin-bottom: 42px;
  7599. overflow: hidden scroll;
  7600. scrollbar-width: thin;
  7601. scrollbar-color: var(--primary) transparent;
  7602. }
  7603. .actor.sheet .crb-style aside .sidebar::-webkit-scrollbar-track {
  7604. box-shadow: none;
  7605. }
  7606. .actor.sheet .crb-style aside .sidebar h2,
  7607. .actor.sheet .crb-style aside .sidebar h3,
  7608. .actor.sheet .crb-style aside .sidebar h4 {
  7609. margin: 0;
  7610. line-height: 1;
  7611. }
  7612. .actor.sheet .crb-style aside .sidebar_label {
  7613. color: var(--sidebar-label);
  7614. font-family: var(--sans-serif);
  7615. font-size: var(--font-size-10);
  7616. text-transform: uppercase;
  7617. letter-spacing: 0.05em;
  7618. text-rendering: optimizeLegibility;
  7619. white-space: nowrap;
  7620. }
  7621. .actor.sheet .crb-style aside .sidebar_title {
  7622. display: flex;
  7623. flex-wrap: nowrap;
  7624. justify-content: space-between;
  7625. align-items: flex-end;
  7626. margin: 0.8em 0 0.5em;
  7627. }
  7628. .actor.sheet .crb-style aside .sidebar_title:first-of-type {
  7629. margin-top: 0.5em;
  7630. margin-bottom: -1px;
  7631. }
  7632. .actor.sheet .crb-style aside .sidebar_title h2 {
  7633. font-family: var(--sans-serif);
  7634. font-size: var(--font-size-13);
  7635. font-variant: small-caps;
  7636. letter-spacing: 0.05em;
  7637. line-height: 1;
  7638. color: var(--sidebar-title);
  7639. flex: 1;
  7640. }
  7641. .actor.sheet .crb-style aside .sidebar_title .modifiers_button, .actor.sheet .crb-style aside .sidebar_title h2 {
  7642. border-bottom: 1px solid var(--sidebar-title);
  7643. }
  7644. .actor.sheet .crb-style aside .sidebar a.dots {
  7645. display: flex;
  7646. flex-direction: column;
  7647. gap: 2px;
  7648. }
  7649. .actor.sheet .crb-style aside .sidebar a.dots > * {
  7650. cursor: pointer;
  7651. }
  7652. .actor.sheet .crb-style aside .sidebar a.dots .pips {
  7653. display: flex;
  7654. justify-content: center;
  7655. }
  7656. .actor.sheet .crb-style aside .sidebar .data-value {
  7657. display: flex;
  7658. justify-content: center;
  7659. align-items: center;
  7660. font-size: 0; /* Removes whitespace for inputs */
  7661. }
  7662. .actor.sheet .crb-style aside .sidebar .data-value h2 {
  7663. color: var(--tertiary-light);
  7664. text-align: center;
  7665. font-size: var(--font-size-26);
  7666. line-height: 1;
  7667. font-weight: initial;
  7668. font-family: var(--serif);
  7669. border: none;
  7670. }
  7671. .actor.sheet .crb-style aside .sidebar a.roll-icon {
  7672. display: inline-flex;
  7673. align-items: center;
  7674. padding-bottom: 2px;
  7675. }
  7676. .actor.sheet .crb-style aside .sidebar a.roll-icon i {
  7677. font-size: var(--font-size-19);
  7678. color: var(--text-light);
  7679. transition: all 0.2s ease-in-out;
  7680. }
  7681. .actor.sheet .crb-style aside .sidebar a.roll-icon i:hover {
  7682. transform: scale(1.25);
  7683. }
  7684. .actor.sheet .crb-style aside .sidebar a.roll-icon svg {
  7685. animation-play-state: paused;
  7686. }
  7687. .actor.sheet .crb-style aside .sidebar a.roll-icon svg path {
  7688. fill: var(--text-light);
  7689. }
  7690. .actor.sheet .crb-style aside .sidebar a.roll-icon:hover svg {
  7691. animation-play-state: running;
  7692. animation: rotation 2s infinite linear;
  7693. }
  7694. .actor.sheet .crb-style aside .sidebar a.roll-icon.disabled {
  7695. cursor: default;
  7696. filter: brightness(0.75);
  7697. opacity: 0.75;
  7698. text-shadow: none;
  7699. }
  7700. .actor.sheet .crb-style aside .sidebar a.roll-icon.disabled:hover svg {
  7701. animation-play-state: paused;
  7702. }
  7703. .actor.sheet .crb-style aside .sidebar select {
  7704. font-size: var(--font-size-15);
  7705. background-color: var(--primary);
  7706. padding: 2px 6px;
  7707. width: 100%;
  7708. max-width: 100%;
  7709. border: 1px solid #956d58;
  7710. /* prettier-ignore */
  7711. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 0 4px rgba(0, 0, 0, 0.5);
  7712. }
  7713. .actor.sheet .crb-style aside .sidebar ol {
  7714. display: flex;
  7715. flex-direction: column;
  7716. list-style: none;
  7717. margin: 0;
  7718. padding: 0;
  7719. }
  7720. .actor.sheet .crb-style aside .sidebar ol li {
  7721. display: flex;
  7722. flex-direction: row;
  7723. align-items: center;
  7724. justify-content: space-between;
  7725. }
  7726. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big {
  7727. display: grid;
  7728. justify-content: space-evenly;
  7729. grid-template-columns: repeat(3, 1fr);
  7730. }
  7731. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container {
  7732. text-align: center;
  7733. }
  7734. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.temp-hp {
  7735. text-align: center;
  7736. margin-right: 8px;
  7737. }
  7738. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.max-hp {
  7739. text-align: center;
  7740. margin-left: 8px;
  7741. }
  7742. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.max-hp, .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.temp-hp {
  7743. margin-top: 12px;
  7744. }
  7745. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.current-hp {
  7746. display: flex;
  7747. flex-direction: column;
  7748. padding: 10px 4px 0;
  7749. position: relative;
  7750. z-index: 0;
  7751. border-radius: 0 0 4px 4px;
  7752. width: min-content;
  7753. background-color: var(--primary);
  7754. background-image: linear-gradient(90deg, #450000 0%, #870000 50%, #450000 100%);
  7755. border: 1px solid var(--sidebar-title);
  7756. }
  7757. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.current-hp .data-value {
  7758. margin-top: 3px;
  7759. }
  7760. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-big .container.current-hp .data-value input[type=number] {
  7761. font-size: var(--font-size-32);
  7762. letter-spacing: -1px;
  7763. height: 32px;
  7764. }
  7765. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small {
  7766. display: flex;
  7767. justify-content: space-evenly;
  7768. margin: 8px 2px 0 2px;
  7769. text-align: center;
  7770. gap: 2px;
  7771. }
  7772. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small h4,
  7773. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small label {
  7774. font-family: var(--sans-serif);
  7775. font-size: var(--font-size-10);
  7776. text-transform: uppercase;
  7777. letter-spacing: 0.05em;
  7778. text-rendering: optimizeLegibility;
  7779. }
  7780. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small .far,
  7781. .actor.sheet .crb-style aside .sidebar .hitpoints .hp-small .fas {
  7782. color: var(--text-light);
  7783. }
  7784. .actor.sheet .crb-style aside .sidebar .armor-class {
  7785. display: grid;
  7786. grid: "ac shield-hp shield-footer" 74px "shield-data shield-data shield-data" auto/66px 59px auto;
  7787. grid-column-gap: 4px;
  7788. }
  7789. .actor.sheet .crb-style aside .sidebar .armor-class .shield {
  7790. display: flex;
  7791. justify-content: flex-start;
  7792. align-items: center;
  7793. flex-direction: column;
  7794. height: 74px;
  7795. text-align: center;
  7796. padding: 14px 10px 0 10px;
  7797. }
  7798. .actor.sheet .crb-style aside .sidebar .armor-class .shield .data-value h2,
  7799. .actor.sheet .crb-style aside .sidebar .armor-class .shield .data-value input[type=number] {
  7800. font-size: var(--font-size-32);
  7801. width: 55px;
  7802. }
  7803. .actor.sheet .crb-style aside .sidebar .armor-class .shield label {
  7804. white-space: normal;
  7805. }
  7806. .actor.sheet .crb-style aside .sidebar .armor-class .shield.ac {
  7807. grid-area: ac;
  7808. background: url("../assets/sheet/shield-blue.webp") no-repeat center center;
  7809. }
  7810. .actor.sheet .crb-style aside .sidebar .armor-class .shield.hp {
  7811. grid-area: shield-hp;
  7812. background: url("../assets/sheet/shield-red.webp") no-repeat top center;
  7813. }
  7814. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats {
  7815. grid-area: shield-data;
  7816. }
  7817. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol {
  7818. margin-top: 4px;
  7819. flex-direction: row;
  7820. height: 100%;
  7821. padding: 0 4px;
  7822. justify-content: space-evenly;
  7823. }
  7824. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li {
  7825. justify-content: center;
  7826. font-size: 0;
  7827. }
  7828. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li + li {
  7829. margin-left: 8px;
  7830. }
  7831. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label {
  7832. position: relative;
  7833. }
  7834. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label svg {
  7835. border: none;
  7836. width: auto;
  7837. height: 20px;
  7838. }
  7839. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label svg path {
  7840. fill: var(--tertiary-light);
  7841. }
  7842. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label svg text {
  7843. fill: var(--dark);
  7844. }
  7845. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label:after {
  7846. display: inline-block;
  7847. position: absolute;
  7848. font-family: var(--sans-serif);
  7849. font-size: var(--font-size-10);
  7850. text-transform: uppercase;
  7851. letter-spacing: 0.05em;
  7852. text-rendering: optimizeLegibility;
  7853. color: var(--primary);
  7854. top: 0;
  7855. left: 1px;
  7856. line-height: 1.5;
  7857. }
  7858. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label.ac:after {
  7859. content: "AC";
  7860. top: 3px;
  7861. left: 3px;
  7862. }
  7863. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label.hardness:after {
  7864. left: 5px;
  7865. top: 3px;
  7866. content: "H";
  7867. }
  7868. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .shield-label.bt:after {
  7869. top: 3px;
  7870. left: 3.5px;
  7871. content: "BT";
  7872. }
  7873. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .data-value {
  7874. flex: 1;
  7875. border: 1px solid #956d58;
  7876. /* prettier-ignore */
  7877. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 0 4px rgba(0, 0, 0, 0.5);
  7878. padding-left: 4px;
  7879. margin-left: -8px;
  7880. height: 20px;
  7881. }
  7882. .actor.sheet .crb-style aside .sidebar .armor-class .shield-stats ol li .data-value input[type=number] {
  7883. font-size: var(--font-size-14);
  7884. font-weight: 400;
  7885. padding-top: 2px;
  7886. height: 14px;
  7887. }
  7888. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer {
  7889. grid-area: shield-footer;
  7890. display: inline-flex;
  7891. flex-direction: column;
  7892. justify-content: center;
  7893. justify-self: center;
  7894. width: calc(100% - 6px);
  7895. }
  7896. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer .shield-max {
  7897. display: flex;
  7898. flex-direction: column;
  7899. }
  7900. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer .shield-max label {
  7901. white-space: normal;
  7902. text-align: center;
  7903. margin-bottom: 4px;
  7904. }
  7905. .actor.sheet .crb-style aside .sidebar .armor-class .armor_footer .shield-status {
  7906. display: flex;
  7907. align-items: end;
  7908. justify-content: center;
  7909. gap: 5px;
  7910. color: var(--tertiary-light);
  7911. margin-top: 4px;
  7912. }
  7913. .actor.sheet .crb-style aside .sidebar .stamina {
  7914. flex-direction: row;
  7915. }
  7916. .actor.sheet .crb-style aside .sidebar .stamina li {
  7917. flex-direction: column;
  7918. }
  7919. .actor.sheet .crb-style aside .sidebar .stamina li input {
  7920. padding: 0;
  7921. font-size: var(--font-size-24);
  7922. }
  7923. .actor.sheet .crb-style aside .sidebar .stamina li input.left {
  7924. color: var(--text-light);
  7925. text-align: right;
  7926. margin-right: 4px;
  7927. }
  7928. .actor.sheet .crb-style aside .sidebar .stamina li input.right {
  7929. color: var(--tertiary-light);
  7930. text-align: left;
  7931. margin-left: 4px;
  7932. }
  7933. .actor.sheet .crb-style aside .sidebar .stamina li .divider {
  7934. font-size: var(--font-size-16);
  7935. line-height: 1;
  7936. }
  7937. .actor.sheet .crb-style aside .sidebar .stamina li .stamina-group {
  7938. display: flex;
  7939. align-items: center;
  7940. }
  7941. .actor.sheet .crb-style aside .sidebar .roll-data {
  7942. display: flex;
  7943. align-items: center;
  7944. justify-content: space-between;
  7945. }
  7946. .actor.sheet .crb-style aside .sidebar .roll-data h3 {
  7947. font-size: var(--font-size-18);
  7948. font-weight: initial;
  7949. color: var(--tertiary-light);
  7950. white-space: nowrap;
  7951. }
  7952. .actor.sheet .crb-style aside .sidebar .roll-data .initiative-select {
  7953. width: 129px;
  7954. }
  7955. .actor.sheet .crb-style aside .sidebar .perception-sidebar, .actor.sheet .crb-style aside .sidebar .initiative-sidebar {
  7956. gap: 5px;
  7957. }
  7958. .actor.sheet .crb-style aside .sidebar .perception-sidebar h3, .actor.sheet .crb-style aside .sidebar .initiative-sidebar h3 {
  7959. flex-grow: 1;
  7960. }
  7961. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves {
  7962. margin: 0;
  7963. padding: 0;
  7964. display: flex;
  7965. }
  7966. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data {
  7967. flex: 1 1 auto;
  7968. display: flex;
  7969. flex-direction: column;
  7970. justify-content: center;
  7971. align-items: center;
  7972. border-left: 1px solid rgba(255, 239, 189, 0.1882352941);
  7973. }
  7974. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data:first-child {
  7975. border-left: none;
  7976. }
  7977. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .sidebar_label {
  7978. font-weight: initial;
  7979. text-transform: capitalize;
  7980. font-size: var(--font-size-12);
  7981. border: none;
  7982. margin-bottom: 2px;
  7983. }
  7984. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .save-roll {
  7985. display: flex;
  7986. justify-content: center;
  7987. align-items: center;
  7988. margin: 4px 0;
  7989. }
  7990. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .save-roll h3 {
  7991. margin: 0;
  7992. margin-left: 2px;
  7993. }
  7994. .actor.sheet .crb-style aside .sidebar ul.sidebar-saves .roll-data .modifiers_button {
  7995. padding: 2px;
  7996. border-radius: 2px;
  7997. width: initial;
  7998. }
  7999. .actor.sheet .crb-style aside .sidebar ol.tags {
  8000. flex-direction: row;
  8001. }
  8002. .actor.sheet .crb-style aside .sidebar ol.tags li {
  8003. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  8004. }
  8005. .actor.sheet .crb-style header.char-header {
  8006. display: flex;
  8007. justify-content: space-between;
  8008. align-items: center;
  8009. color: var(--text-light);
  8010. }
  8011. .actor.sheet .crb-style header.char-header .char-details {
  8012. font-family: var(--sans-serif);
  8013. font-size: var(--font-size-10);
  8014. text-transform: uppercase;
  8015. letter-spacing: 0.05em;
  8016. text-rendering: optimizeLegibility;
  8017. margin-left: 8px;
  8018. }
  8019. .actor.sheet .crb-style header.char-header .char-details h1.char-name {
  8020. margin: 0;
  8021. border: none;
  8022. }
  8023. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable {
  8024. letter-spacing: normal;
  8025. word-spacing: normal;
  8026. text-transform: none;
  8027. text-indent: 0;
  8028. text-shadow: none;
  8029. text-rendering: auto;
  8030. }
  8031. .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable.gender {
  8032. font-size: var(--font-size-14);
  8033. }
  8034. .actor.sheet .crb-style header.char-header .char-details h1.char-name input[type=text], .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable {
  8035. font-family: var(--serif);
  8036. font-weight: 500;
  8037. font-size: var(--font-size-24);
  8038. color: var(--text-light);
  8039. line-height: calc(1em + 1px);
  8040. border-bottom: 1px solid transparent;
  8041. height: 26px;
  8042. }
  8043. .actor.sheet .crb-style header.char-header .char-details h1.char-name input[type=text]:focus, .actor.sheet .crb-style header.char-header .char-details h1.char-name span.non-editable:focus {
  8044. box-shadow: none;
  8045. border-bottom: 1px solid var(--text-light);
  8046. }
  8047. .actor.sheet .crb-style header.char-header .char-details h2.non-editable.ancestry-class {
  8048. font-family: var(--serif);
  8049. border-bottom: none;
  8050. margin-bottom: 0;
  8051. font-weight: 400;
  8052. }
  8053. .actor.sheet .crb-style header.char-header .char-level {
  8054. display: flex;
  8055. justify-content: flex-start;
  8056. padding-bottom: 4px;
  8057. }
  8058. .actor.sheet .crb-style header.char-header .char-level .level {
  8059. position: relative;
  8060. display: flex;
  8061. justify-content: center;
  8062. align-items: center;
  8063. flex-direction: column;
  8064. height: 43px;
  8065. width: 40px;
  8066. background: url("../assets/sheet/level-badge.webp") no-repeat;
  8067. background-size: 40px 43px;
  8068. z-index: 2;
  8069. font-size: 0;
  8070. padding-top: 2px;
  8071. }
  8072. .actor.sheet .crb-style header.char-header .char-level .level label {
  8073. color: var(--sidebar-label);
  8074. font-family: var(--sans-serif);
  8075. font-size: var(--font-size-10);
  8076. text-transform: uppercase;
  8077. letter-spacing: 0.05em;
  8078. text-rendering: optimizeLegibility;
  8079. line-height: 1.5;
  8080. }
  8081. .actor.sheet .crb-style header.char-header .char-level .level input {
  8082. font-family: var(--serif);
  8083. font-size: var(--font-size-22);
  8084. font-weight: 400;
  8085. color: var(--text-light);
  8086. line-height: calc(1em + 1px);
  8087. height: 24px;
  8088. }
  8089. .actor.sheet .crb-style header.char-header .char-level .level label,
  8090. .actor.sheet .crb-style header.char-header .char-level .level input {
  8091. margin-left: 1px;
  8092. text-align: center;
  8093. }
  8094. .actor.sheet .crb-style .char-header {
  8095. grid-area: header;
  8096. padding-right: 1rem;
  8097. }
  8098. .actor.sheet .crb-style .sheet-navigation {
  8099. grid-area: nav;
  8100. margin-left: -2px;
  8101. }
  8102. .actor.sheet .crb-style .sheet-body {
  8103. grid-area: content;
  8104. position: relative;
  8105. }
  8106. .actor.sheet .crb-style .sheet-body ol {
  8107. list-style: none;
  8108. }
  8109. .actor.sheet .crb-style .sheet-body .sheet-content,
  8110. .actor.sheet .crb-style .sheet-body .sheet-content .inventory {
  8111. bottom: 0;
  8112. display: flex;
  8113. flex-direction: column;
  8114. left: 0;
  8115. position: absolute;
  8116. top: 0;
  8117. width: 100%;
  8118. }
  8119. .actor.sheet .crb-style .sheet-body .sheet-content.tab[data-tab],
  8120. .actor.sheet .crb-style .sheet-body .sheet-content .inventory.tab[data-tab] {
  8121. display: none;
  8122. }
  8123. .actor.sheet .crb-style .sheet-body .sheet-content.tab[data-tab].active,
  8124. .actor.sheet .crb-style .sheet-body .sheet-content .inventory.tab[data-tab].active {
  8125. display: initial;
  8126. }
  8127. .actor.sheet .crb-style .sheet-body .sheet-content {
  8128. color: var(--body);
  8129. }
  8130. .actor.sheet .crb-style .sheet-body .sheet-content > .tab {
  8131. padding: 0.6rem 0.6rem 0;
  8132. }
  8133. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list {
  8134. margin: 0;
  8135. padding: 0;
  8136. border-bottom: 1px solid var(--color-border-light-2);
  8137. flex-basis: 100%;
  8138. gap: 1px;
  8139. position: relative;
  8140. width: 100%;
  8141. z-index: 1;
  8142. }
  8143. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li {
  8144. margin: 0;
  8145. padding: 0;
  8146. align-items: center;
  8147. background: none;
  8148. cursor: default;
  8149. display: grid;
  8150. grid: "name range components cast-spell controls" auto "content content content content content" auto/9fr 4fr 4fr 2fr 2.5fr;
  8151. justify-content: center;
  8152. padding: 0 0.3em 1px 0.35em;
  8153. }
  8154. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li[data-expended-state=true] h4 {
  8155. color: var(--color-disabled);
  8156. text-decoration: line-through;
  8157. }
  8158. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li[data-expended-state=true] .cast-spell {
  8159. background: var(--color-disabled);
  8160. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  8161. cursor: not-allowed;
  8162. }
  8163. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li:nth-child(odd) {
  8164. background-color: rgba(120, 100, 82, 0.1);
  8165. }
  8166. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li:last-child {
  8167. border-bottom: 1px solid var(--sub);
  8168. }
  8169. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li:last-child .item-image {
  8170. margin-bottom: 0;
  8171. margin-top: 2px;
  8172. }
  8173. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header {
  8174. margin: 0;
  8175. padding: 0;
  8176. background: rgba(96, 88, 86, 0.25);
  8177. border: 1px solid var(--color-border-light-2);
  8178. border-radius: 2px;
  8179. color: var(--body);
  8180. font: 500 var(--font-size-12) var(--sans-serif);
  8181. letter-spacing: 0.25px;
  8182. line-height: 1;
  8183. padding: 0 0.5em;
  8184. text-transform: uppercase;
  8185. }
  8186. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header h3 {
  8187. text-transform: capitalize;
  8188. font-size: var(--font-size-13);
  8189. margin-left: 0;
  8190. padding: 4px 0;
  8191. }
  8192. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .item-name {
  8193. line-height: 1;
  8194. gap: 0.25em;
  8195. }
  8196. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .item-name h3 {
  8197. margin: 0;
  8198. padding: 0;
  8199. font-weight: 700;
  8200. }
  8201. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .item-controls {
  8202. grid-column: span 2;
  8203. }
  8204. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses {
  8205. align-items: center;
  8206. display: flex;
  8207. gap: 0.25em;
  8208. line-height: 1;
  8209. }
  8210. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input, .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input {
  8211. background: var(--alt);
  8212. border-radius: 3px;
  8213. border: 1px solid var(--sub);
  8214. color: white;
  8215. font: var(--font-size-12) var(--sans-serif);
  8216. height: unset;
  8217. text-align: center;
  8218. width: 2em;
  8219. }
  8220. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header .spell-slots-increment-reset, .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses .spell-slots-increment-reset {
  8221. padding-left: 5px;
  8222. font-size: var(--font-size-10);
  8223. }
  8224. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell {
  8225. border: none;
  8226. font-size: var(--font-size-13);
  8227. }
  8228. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .level-prepared-toggle {
  8229. flex: 0;
  8230. font-size: 0.75rem;
  8231. color: var(--secondary);
  8232. }
  8233. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name {
  8234. align-items: center;
  8235. display: flex;
  8236. flex-wrap: nowrap;
  8237. justify-content: start;
  8238. justify-self: start;
  8239. min-height: 1.75rem;
  8240. }
  8241. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h3 {
  8242. white-space: nowrap;
  8243. }
  8244. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name + span {
  8245. font-size: 0.75rem;
  8246. }
  8247. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .focus-pool-input {
  8248. align-items: center;
  8249. display: flex;
  8250. flex-wrap: nowrap;
  8251. }
  8252. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .slash {
  8253. font-size: 0.75rem;
  8254. }
  8255. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-slots,
  8256. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-max {
  8257. padding-top: 3px;
  8258. font-size: 0.75rem;
  8259. }
  8260. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-slots.infinity,
  8261. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .spell-max.infinity {
  8262. position: relative;
  8263. top: -2px;
  8264. }
  8265. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .item-image {
  8266. height: 1.5rem;
  8267. width: 1.5rem;
  8268. flex: 0 0 auto;
  8269. margin: 2px 0;
  8270. }
  8271. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h4 {
  8272. margin: 0;
  8273. padding: 0;
  8274. font-size: var(--font-size-14);
  8275. letter-spacing: -0.075em;
  8276. line-height: 1;
  8277. margin-left: 8px;
  8278. cursor: pointer;
  8279. }
  8280. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h4:hover {
  8281. color: var(--secondary);
  8282. }
  8283. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name .activity-icon {
  8284. margin-left: 4px;
  8285. }
  8286. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name.empty {
  8287. grid-column: 1/span 4;
  8288. }
  8289. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-range {
  8290. grid-area: range;
  8291. padding-left: 0.2em;
  8292. }
  8293. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-components {
  8294. grid-area: components;
  8295. justify-self: right;
  8296. padding: 0 0.5em;
  8297. }
  8298. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-components .tag {
  8299. font: var(--font-size-12) var(--sans-serif-condensed);
  8300. }
  8301. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .spell-cast {
  8302. grid-area: cast-spell;
  8303. display: flex;
  8304. justify-content: center;
  8305. }
  8306. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-controls {
  8307. grid-area: controls;
  8308. display: flex;
  8309. justify-self: end;
  8310. padding-right: 0.25em;
  8311. }
  8312. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li button.cast-spell {
  8313. align-items: center;
  8314. background: var(--secondary);
  8315. border-radius: 2px;
  8316. border: black;
  8317. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  8318. color: white;
  8319. cursor: pointer;
  8320. display: flex;
  8321. font: 700 0.55rem var(--sans-serif);
  8322. justify-self: center;
  8323. letter-spacing: 0.25px;
  8324. max-width: fit-content;
  8325. padding: 0.5em 1em;
  8326. text-transform: uppercase;
  8327. }
  8328. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-summary {
  8329. grid-area: content;
  8330. width: 100%;
  8331. padding: 8px;
  8332. border-bottom: 1px solid var(--sub);
  8333. border-top: 1px solid #aca5a3;
  8334. background-color: var(--bg);
  8335. }
  8336. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list[data-category=spontaneous] .virtual {
  8337. position: relative;
  8338. }
  8339. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list[data-category=spontaneous] .virtual::before {
  8340. pointer-events: none;
  8341. content: "";
  8342. position: absolute;
  8343. height: 100%;
  8344. width: 100%;
  8345. background-color: rgba(0, 5, 255, 0.1137254902);
  8346. mix-blend-mode: saturation;
  8347. }
  8348. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list[data-category=spontaneous] .item:not(.virtual) + .virtual {
  8349. border-top: 1px solid rgba(0, 0, 0, 0.15);
  8350. }
  8351. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .level-prepared-header {
  8352. font-size: 0.75rem;
  8353. color: white;
  8354. margin: 0;
  8355. padding: 4px;
  8356. text-align: center;
  8357. background: var(--secondary);
  8358. position: relative;
  8359. }
  8360. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spell .item-name {
  8361. width: 100%;
  8362. }
  8363. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list input.toggle-signature-spell[type=checkbox] {
  8364. width: 12px;
  8365. height: 12px;
  8366. margin: 0 2px 0 0;
  8367. flex: 0 0 auto;
  8368. }
  8369. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spellbook-empty {
  8370. display: flex;
  8371. align-items: center;
  8372. min-height: 28px;
  8373. justify-content: flex-end;
  8374. }
  8375. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spellbook-empty h4 {
  8376. margin: 0;
  8377. white-space: nowrap;
  8378. margin-right: auto;
  8379. }
  8380. .actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list .spellbook-empty a {
  8381. flex: 0 1 0;
  8382. white-space: nowrap;
  8383. margin-left: 8px;
  8384. }
  8385. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list > h3, .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list > li > h3 {
  8386. font-size: 1rem;
  8387. font-weight: 500;
  8388. font-family: var(--serif);
  8389. line-height: 1;
  8390. color: white;
  8391. margin: 0;
  8392. padding: 0;
  8393. margin-left: 8px;
  8394. }
  8395. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header {
  8396. align-items: center;
  8397. background: var(--primary);
  8398. border: none;
  8399. border-radius: 0.25em;
  8400. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  8401. display: flex;
  8402. flex-basis: 100%;
  8403. flex-wrap: nowrap;
  8404. height: 32px;
  8405. justify-content: space-between;
  8406. margin-left: 0;
  8407. margin-top: 8px;
  8408. padding: 0 0.5em;
  8409. position: relative;
  8410. width: 100%;
  8411. z-index: 2;
  8412. }
  8413. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header:first-child {
  8414. margin-top: 0;
  8415. }
  8416. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header + li {
  8417. border-top: none;
  8418. }
  8419. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header .drag-handle {
  8420. cursor: move;
  8421. }
  8422. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header > a .fas, .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header > a > .fa {
  8423. flex-basis: 0;
  8424. color: white;
  8425. margin-right: 0.25em;
  8426. padding-top: 0.25em;
  8427. }
  8428. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header .item-controls {
  8429. color: white;
  8430. flex: 1 0 auto;
  8431. font: 0.85em var(--sans-serif);
  8432. letter-spacing: 0.05em;
  8433. margin-left: auto;
  8434. max-width: fit-content;
  8435. text-transform: uppercase;
  8436. font-size: var(--font-size-12);
  8437. }
  8438. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header h3 {
  8439. color: white;
  8440. flex: 1 1 100%;
  8441. margin-bottom: 0;
  8442. font-size: var(--font-size-16);
  8443. }
  8444. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header h3 input.item-name-input {
  8445. color: white;
  8446. max-width: 100%;
  8447. font-weight: 500;
  8448. }
  8449. .actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header h3 input.item-name-input:read-only {
  8450. pointer-events: none;
  8451. }
  8452. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container {
  8453. padding: 0 0.5rem 2rem 0;
  8454. }
  8455. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper {
  8456. display: grid;
  8457. justify-items: center;
  8458. }
  8459. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .action-radio {
  8460. display: none;
  8461. }
  8462. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels {
  8463. min-height: min-content;
  8464. width: 100%;
  8465. }
  8466. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-panel {
  8467. display: none;
  8468. }
  8469. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-panel.active {
  8470. display: flex;
  8471. flex-direction: column;
  8472. }
  8473. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options {
  8474. border-image-repeat: repeat;
  8475. border-image-slice: 11;
  8476. border-image-source: url("../assets/sheet/frame-elegant.svg");
  8477. border-image-width: 14px;
  8478. border-style: double;
  8479. display: flex;
  8480. flex-wrap: wrap;
  8481. margin-bottom: 0.5rem;
  8482. padding: 0.5rem 1rem;
  8483. }
  8484. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option {
  8485. align-items: center;
  8486. display: flex;
  8487. width: 100%;
  8488. margin: 1px 0;
  8489. }
  8490. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label * {
  8491. vertical-align: middle;
  8492. }
  8493. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label input {
  8494. margin: 0;
  8495. padding: 0;
  8496. }
  8497. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options .actions-option label .unchecked-disabled {
  8498. color: var(--color-text-dark-inactive);
  8499. }
  8500. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list {
  8501. padding-left: 0;
  8502. }
  8503. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action-header {
  8504. align-items: center;
  8505. display: flex;
  8506. }
  8507. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action {
  8508. align-items: center;
  8509. display: flex;
  8510. flex-wrap: wrap;
  8511. padding: 4px;
  8512. width: 100%;
  8513. border-top: 1px solid #d5cac1;
  8514. border: solid transparent;
  8515. border-width: 0 0 1px;
  8516. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  8517. }
  8518. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action p:empty {
  8519. display: none;
  8520. }
  8521. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name {
  8522. align-items: center;
  8523. display: flex;
  8524. flex: 1;
  8525. margin: 0;
  8526. }
  8527. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name h4 {
  8528. cursor: pointer;
  8529. margin: 0;
  8530. }
  8531. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name h4:hover {
  8532. color: var(--primary);
  8533. }
  8534. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name .item-image {
  8535. height: 22px;
  8536. width: 22px;
  8537. color: transparent;
  8538. background-repeat: no-repeat;
  8539. background-size: contain;
  8540. margin-right: 8px;
  8541. font-size: var(--font-size-18);
  8542. display: flex;
  8543. justify-content: center;
  8544. align-items: center;
  8545. cursor: pointer;
  8546. }
  8547. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name .item-image:hover {
  8548. background: none !important;
  8549. color: var(--primary);
  8550. }
  8551. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name .actions-title {
  8552. flex: 1;
  8553. }
  8554. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name .actions-title .action-name {
  8555. display: flex;
  8556. flex-direction: row;
  8557. }
  8558. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name .actions-title .action-name h4 {
  8559. cursor: pointer;
  8560. }
  8561. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name .actions-title .action-name h4:hover {
  8562. color: var(--primary);
  8563. }
  8564. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-name .actions-title .action-name h4:hover .activity-icon {
  8565. color: var(--body);
  8566. }
  8567. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-controls {
  8568. white-space: nowrap;
  8569. font-size: var(--font-size-11);
  8570. }
  8571. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary {
  8572. flex-basis: 100%;
  8573. margin-bottom: 8px;
  8574. }
  8575. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .title,
  8576. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .framing {
  8577. color: var(--primary);
  8578. margin: 0;
  8579. padding: 0;
  8580. margin-top: 1em;
  8581. }
  8582. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .framing {
  8583. color: var(--secondary);
  8584. margin: 1em 0 0.25em;
  8585. }
  8586. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .framing strong {
  8587. font-weight: 500;
  8588. }
  8589. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .framing + p {
  8590. margin-top: 0;
  8591. }
  8592. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary img {
  8593. border: none;
  8594. vertical-align: middle;
  8595. }
  8596. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary img.actionlight {
  8597. background: var(--alt);
  8598. vertical-align: middle;
  8599. border: 1px solid var(--body);
  8600. }
  8601. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .item-properties .tag.toggled-on:hover, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .item-properties .tag.toggled-off:hover {
  8602. box-shadow: none;
  8603. text-shadow: 0 0 2px white;
  8604. }
  8605. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .item-properties .tag.toggled-on, .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .item-properties .tag.toggled-off {
  8606. cursor: pointer;
  8607. }
  8608. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .item-properties .tag.toggled-on {
  8609. background-color: rgba(23, 31, 105, 0.5);
  8610. color: black;
  8611. text-shadow: 0 0 2px white;
  8612. }
  8613. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary {
  8614. border-image-repeat: repeat;
  8615. border-image-slice: 11;
  8616. border-image-source: url("../assets/sheet/frame-elegant.svg");
  8617. border-image-width: 14px;
  8618. border-style: double;
  8619. padding: 0.5rem 1rem 1rem;
  8620. margin-top: 0.75rem;
  8621. }
  8622. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary dd {
  8623. margin: 0;
  8624. margin-bottom: 0.5rem;
  8625. }
  8626. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action .item-summary .tag.tag_secondary {
  8627. background-color: rgba(0, 0, 0, 0.8);
  8628. }
  8629. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action.expanded h4 {
  8630. color: var(--primary);
  8631. font-weight: 700;
  8632. }
  8633. .actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action.hidden {
  8634. display: none;
  8635. }
  8636. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography h3 {
  8637. margin-top: 0.75em;
  8638. font-family: var(--serif);
  8639. font-weight: 600;
  8640. color: var(--primary);
  8641. line-height: 1;
  8642. border-bottom: 1px solid var(--primary);
  8643. }
  8644. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography input {
  8645. font-family: var(--body-serif);
  8646. font-weight: bold;
  8647. width: calc(100% - 6px);
  8648. border-bottom: 1px solid #d3ccbc;
  8649. }
  8650. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography input::placeholder {
  8651. filter: opacity(0.5);
  8652. color: var(--body);
  8653. }
  8654. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography input:focus {
  8655. border-bottom: 1px solid #644f33;
  8656. }
  8657. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography input:focus::placeholder {
  8658. color: transparent;
  8659. }
  8660. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography input[type=number] {
  8661. padding-bottom: 0;
  8662. padding-left: 4px;
  8663. }
  8664. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography hr {
  8665. margin: 10px 6px 10px 0;
  8666. }
  8667. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .bio h3 {
  8668. margin: 0;
  8669. padding: 0;
  8670. background-color: rgba(28, 28, 28, 0.1);
  8671. border: none;
  8672. color: var(--body);
  8673. font: 700 var(--font-size-14) var(--body-serif);
  8674. grid-area: mod;
  8675. height: 26px;
  8676. padding: 8px 4px 6px;
  8677. width: calc(100% - 6px);
  8678. }
  8679. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .bio h3 i {
  8680. position: relative;
  8681. right: -2px;
  8682. top: -2px;
  8683. float: right;
  8684. }
  8685. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .bio h3 span.value {
  8686. display: inline-block;
  8687. max-width: 87%;
  8688. overflow: hidden;
  8689. text-overflow: ellipsis;
  8690. white-space: nowrap;
  8691. }
  8692. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content {
  8693. margin-left: 8px;
  8694. padding: 4px;
  8695. /* Typography */
  8696. }
  8697. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content h1, .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content h2 {
  8698. font-family: var(--serif);
  8699. line-height: 1.1;
  8700. }
  8701. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content h1 {
  8702. text-align: center;
  8703. font-size: 2.5em;
  8704. margin-bottom: 30px;
  8705. }
  8706. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content h2 {
  8707. color: var(--secondary);
  8708. font-size: 2.25em;
  8709. }
  8710. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content h3 {
  8711. font-size: 2em;
  8712. border-bottom: 0px;
  8713. }
  8714. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content h4 {
  8715. color: #000000;
  8716. border-bottom: 1px solid #000000;
  8717. margin-bottom: 0px;
  8718. text-transform: uppercase;
  8719. }
  8720. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content h5 {
  8721. text-transform: uppercase;
  8722. }
  8723. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content h6 {
  8724. background-color: var(--header-bg);
  8725. color: var(--header-color);
  8726. margin-bottom: 5px;
  8727. padding-left: 8px;
  8728. padding-top: 5px;
  8729. padding-bottom: 3px;
  8730. font-size: 1.25em;
  8731. text-transform: uppercase;
  8732. border-radius: 12px 12px 0px 0px;
  8733. }
  8734. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content p, .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content p + p, .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content ul, .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content ol {
  8735. font-family: var(--body-serif);
  8736. text-align: justify;
  8737. line-height: 1.4;
  8738. }
  8739. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content .editor .editor-edit {
  8740. background: var(--primary);
  8741. color: white;
  8742. }
  8743. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content .editor .tox.tox-tinymce {
  8744. height: 200px !important;
  8745. }
  8746. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content .editor .tox .tox-editor-container .tox-editor-header .tox-toolbar-overlord {
  8747. background-color: var(--secondary);
  8748. }
  8749. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content .editor .tox .tox-editor-container .tox-editor-header .tox-toolbar-overlord .tox-toolbar__primary {
  8750. background-color: var(--alt);
  8751. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);
  8752. }
  8753. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content .editor .tox .tox-tbtn {
  8754. color: #cdcdcd;
  8755. border-radius: 1px;
  8756. }
  8757. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content .editor .tox .tox-tbtn svg {
  8758. fill: #cdcdcd;
  8759. }
  8760. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content .editor .tox .tox-tbtn:hover {
  8761. background: var(--secondary);
  8762. color: white;
  8763. }
  8764. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content .editor .tox .tox-tbtn:hover svg {
  8765. fill: white;
  8766. }
  8767. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-content .editor .editor-content {
  8768. background: rgba(0, 0, 0, 0.05);
  8769. min-height: 75px;
  8770. overflow-y: inherit;
  8771. }
  8772. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-details {
  8773. display: flex;
  8774. flex-direction: column;
  8775. }
  8776. .actor.sheet .crb-style .sheet-body .sheet-content .tab.biography .biography-details span {
  8777. width: 100%;
  8778. }
  8779. .actor.sheet .crb-style .sheet-body .sheet-content footer {
  8780. font-family: var(--sans-serif);
  8781. font-size: var(--font-size-10);
  8782. text-transform: uppercase;
  8783. letter-spacing: 0.05em;
  8784. text-rendering: optimizeLegibility;
  8785. color: var(--primary);
  8786. text-align: right;
  8787. line-height: 1.4;
  8788. margin: 1em 1em 0;
  8789. }
  8790. .actor.sheet .crb-style nav.sheet-navigation {
  8791. display: inline-flex;
  8792. justify-content: center;
  8793. align-items: center;
  8794. height: 20px;
  8795. background: var(--secondary);
  8796. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  8797. transition: all 0.1s ease-out;
  8798. box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
  8799. border-top: 1px solid rgba(255, 255, 255, 0.1);
  8800. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  8801. position: relative;
  8802. }
  8803. .actor.sheet .crb-style nav.sheet-navigation .navigation-title {
  8804. color: var(--text-light);
  8805. margin-right: auto;
  8806. padding-left: 1em;
  8807. white-space: nowrap;
  8808. width: 7em;
  8809. }
  8810. .actor.sheet .crb-style nav.sheet-navigation > a {
  8811. display: flex;
  8812. justify-content: center;
  8813. align-items: center;
  8814. margin: 0 6px;
  8815. font-size: var(--font-size-12);
  8816. }
  8817. .actor.sheet .crb-style nav.sheet-navigation .item {
  8818. height: 24px;
  8819. width: 24px;
  8820. border-radius: 50%;
  8821. z-index: 1;
  8822. transition: all 0.1s ease-out;
  8823. color: var(--tertiary);
  8824. fill: var(--tertiary);
  8825. background-image: url("../assets/sheet/nav-item-inactive.webp");
  8826. background-size: contain;
  8827. /* prettier-ignore */
  8828. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25);
  8829. }
  8830. .actor.sheet .crb-style nav.sheet-navigation .item.active {
  8831. 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);
  8832. }
  8833. .actor.sheet .crb-style nav.sheet-navigation .item:last-child {
  8834. margin-right: 10px;
  8835. }
  8836. .actor.sheet .crb-style nav.sheet-navigation .item:hover, .actor.sheet .crb-style nav.sheet-navigation .item.active {
  8837. z-index: 2;
  8838. transform: scale(1.2);
  8839. color: var(--text-light);
  8840. fill: var(--text-light);
  8841. background-image: url("../assets/sheet/nav-item.webp");
  8842. }
  8843. .actor.sheet .crb-style nav.sheet-navigation .item .fas {
  8844. padding-bottom: 0;
  8845. }
  8846. .actor.sheet .crb-style nav.sheet-navigation .item:hover .pfs-icon {
  8847. filter: drop-shadow(0 0 8px var(--color-shadow-primary));
  8848. }
  8849. .actor.sheet .crb-style nav.sheet-navigation .item .action-icon {
  8850. align-self: baseline;
  8851. display: inline-block;
  8852. font-family: Pathfinder2eActions;
  8853. font-size: 1.4rem;
  8854. line-height: 1;
  8855. max-height: 0.75rem;
  8856. }
  8857. .actor.sheet .crb-style nav.sub-nav {
  8858. margin: 0;
  8859. padding: 0;
  8860. display: flex;
  8861. flex-wrap: nowrap;
  8862. justify-content: center;
  8863. align-items: center;
  8864. list-style: none;
  8865. background-color: var(--bg);
  8866. box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  8867. width: 100%;
  8868. flex: 0 0 44px;
  8869. }
  8870. .actor.sheet .crb-style nav.sub-nav::before, .actor.sheet .crb-style nav.sub-nav::after {
  8871. content: "";
  8872. width: 37px;
  8873. height: 16px;
  8874. background: url("../assets/sheet/sub-nav-decoration.webp");
  8875. margin: 0 16px;
  8876. }
  8877. .actor.sheet .crb-style nav.sub-nav::after {
  8878. transform: scaleX(-100%);
  8879. }
  8880. .actor.sheet .crb-style nav.sub-nav a, .actor.sheet .crb-style nav.sub-nav .tab {
  8881. border-left: 1px solid rgba(255, 255, 255, 0.3);
  8882. border-right: 1px solid rgba(0, 0, 0, 0.2);
  8883. color: var(--alt);
  8884. cursor: pointer;
  8885. display: block;
  8886. font: 400 var(--font-size-16) var(--serif);
  8887. flex: 1;
  8888. margin: 0 0.25rem;
  8889. max-width: 30%;
  8890. text-align: center;
  8891. text-decoration: none;
  8892. transition: all 0.1s ease-out;
  8893. }
  8894. .actor.sheet .crb-style nav.sub-nav a.active, .actor.sheet .crb-style nav.sub-nav .tab.active {
  8895. color: var(--primary);
  8896. font-weight: 600;
  8897. }
  8898. .actor.sheet .crb-style nav.sub-nav a:first-child, .actor.sheet .crb-style nav.sub-nav .tab:first-child {
  8899. border-left: none;
  8900. }
  8901. .actor.sheet .crb-style nav.sub-nav a:last-child, .actor.sheet .crb-style nav.sub-nav .tab:last-child {
  8902. border-right: none;
  8903. }
  8904. .actor.sheet .crb-style nav.sub-nav a:hover, .actor.sheet .crb-style nav.sub-nav .tab:hover {
  8905. text-shadow: 0 0 3px rgba(255, 255, 255, 0.5);
  8906. }
  8907. .actor.sheet .crb-style .tab nav.sub-nav {
  8908. padding-right: 20px;
  8909. }
  8910. .actor.sheet .crb-style .stroke-header {
  8911. position: relative;
  8912. }
  8913. .actor.sheet .crb-style .stroke-header svg {
  8914. position: absolute;
  8915. fill: var(--primary);
  8916. }
  8917. .actor.sheet .crb-style .stroke-header h3 {
  8918. position: relative;
  8919. }
  8920. .actor.sheet .crb-style.limited .sidebar {
  8921. display: flex;
  8922. align-items: center;
  8923. flex-direction: column;
  8924. }
  8925. .actor.sheet .crb-style.limited .sidebar .profile-img {
  8926. display: flex;
  8927. align-items: flex-end;
  8928. margin: 1rem 0;
  8929. max-width: 85%;
  8930. max-height: 200px;
  8931. background-color: var(--tertiary);
  8932. background-size: cover;
  8933. background-position: top center;
  8934. border: 1px solid rgba(0, 0, 0, 0.5);
  8935. box-shadow: 0 0 0 1px #C0C0C0, 0 0 0 2px #808080;
  8936. }
  8937. .actor.sheet .crb-style.limited .sidebar .plaque {
  8938. color: var(--sidebar-title);
  8939. font-size: 1rem;
  8940. font-weight: 500;
  8941. margin-bottom: 0.25rem;
  8942. display: flex;
  8943. }
  8944. .actor.sheet .crb-style.limited .sidebar .plaque::before, .actor.sheet .crb-style.limited .sidebar .plaque::after {
  8945. display: block;
  8946. content: url("../assets/icons/pathfinder-orn.svg");
  8947. height: 100%;
  8948. width: 25px;
  8949. }
  8950. .actor.sheet .crb-style.limited .sidebar .plaque::after {
  8951. transform: scaleX(-1);
  8952. margin-left: 4px;
  8953. }
  8954. .actor.sheet .crb-style.limited .sidebar .plaque::before {
  8955. margin-right: 4px;
  8956. }
  8957. .actor.sheet .crb-style.limited .sidebar ul.stats {
  8958. margin: 0;
  8959. padding: 0;
  8960. list-style: none;
  8961. text-align: center;
  8962. }
  8963. .actor.sheet .crb-style.limited .sidebar ul.stats li {
  8964. margin: 0;
  8965. padding: 0;
  8966. }
  8967. .actor.sheet .crb-style.limited .tab.character .character-bio {
  8968. display: flex;
  8969. flex-direction: column;
  8970. height: 100%;
  8971. }
  8972. .actor.sheet .crb-style.limited .tab.character .character-bio footer {
  8973. margin-top: auto;
  8974. text-align: left;
  8975. margin: 0;
  8976. padding: 0;
  8977. margin-top: auto;
  8978. margin-bottom: 8px;
  8979. }
  8980. .actor.sheet .crb-style.limited .tab.character .character-bio footer p {
  8981. color: var(--alt);
  8982. }
  8983. .actor.sheet .crb-style input.adjusted:not(:focus) {
  8984. font-weight: 700;
  8985. color: #009988;
  8986. }
  8987. .actor.sheet .crb-style button.tag:disabled {
  8988. cursor: not-allowed;
  8989. background-color: var(--color-text-dark-inactive);
  8990. }
  8991. .spellcasting-entry.preparation h3 {
  8992. border-bottom: none;
  8993. }
  8994. .spellcasting-entry.preparation button > i {
  8995. margin-right: 0;
  8996. }
  8997. .spellcasting-entry.preparation ol.spell-list {
  8998. margin: 0;
  8999. padding: 0;
  9000. border-bottom: 1px solid var(--color-border-light-2);
  9001. flex-basis: 100%;
  9002. gap: 1px;
  9003. position: relative;
  9004. width: 100%;
  9005. z-index: 1;
  9006. }
  9007. .spellcasting-entry.preparation ol.spell-list > li {
  9008. margin: 0;
  9009. padding: 0;
  9010. align-items: center;
  9011. background: none;
  9012. cursor: default;
  9013. display: grid;
  9014. grid: "name range components cast-spell controls" auto "content content content content content" auto/9fr 4fr 4fr 2fr 2.5fr;
  9015. justify-content: center;
  9016. padding: 0 0.3em 1px 0.35em;
  9017. }
  9018. .spellcasting-entry.preparation ol.spell-list > li[data-expended-state=true] h4 {
  9019. color: var(--color-disabled);
  9020. text-decoration: line-through;
  9021. }
  9022. .spellcasting-entry.preparation ol.spell-list > li[data-expended-state=true] .cast-spell {
  9023. background: var(--color-disabled);
  9024. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  9025. cursor: not-allowed;
  9026. }
  9027. .spellcasting-entry.preparation ol.spell-list > li:nth-child(odd) {
  9028. background-color: rgba(120, 100, 82, 0.1);
  9029. }
  9030. .spellcasting-entry.preparation ol.spell-list > li:last-child {
  9031. border-bottom: 1px solid var(--sub);
  9032. }
  9033. .spellcasting-entry.preparation ol.spell-list > li:last-child .item-image {
  9034. margin-bottom: 0;
  9035. margin-top: 2px;
  9036. }
  9037. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header {
  9038. margin: 0;
  9039. padding: 0;
  9040. background: rgba(96, 88, 86, 0.25);
  9041. border: 1px solid var(--color-border-light-2);
  9042. border-radius: 2px;
  9043. color: var(--body);
  9044. font: 500 var(--font-size-12) var(--sans-serif);
  9045. letter-spacing: 0.25px;
  9046. line-height: 1;
  9047. padding: 0 0.5em;
  9048. text-transform: uppercase;
  9049. }
  9050. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header h3 {
  9051. text-transform: capitalize;
  9052. font-size: var(--font-size-13);
  9053. margin-left: 0;
  9054. padding: 4px 0;
  9055. }
  9056. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .item-name {
  9057. line-height: 1;
  9058. gap: 0.25em;
  9059. }
  9060. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .item-name h3 {
  9061. margin: 0;
  9062. padding: 0;
  9063. font-weight: 700;
  9064. }
  9065. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .item-controls {
  9066. grid-column: span 2;
  9067. }
  9068. .spellcasting-entry.preparation ol.spell-list > li .uses {
  9069. align-items: center;
  9070. display: flex;
  9071. gap: 0.25em;
  9072. line-height: 1;
  9073. }
  9074. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header input, .spellcasting-entry.preparation ol.spell-list > li .uses input {
  9075. background: var(--alt);
  9076. border-radius: 3px;
  9077. border: 1px solid var(--sub);
  9078. color: white;
  9079. font: var(--font-size-12) var(--sans-serif);
  9080. height: unset;
  9081. text-align: center;
  9082. width: 2em;
  9083. }
  9084. .spellcasting-entry.preparation ol.spell-list > li.spell-level-header .spell-slots-increment-reset, .spellcasting-entry.preparation ol.spell-list > li .uses .spell-slots-increment-reset {
  9085. padding-left: 5px;
  9086. font-size: var(--font-size-10);
  9087. }
  9088. .spellcasting-entry.preparation ol.spell-list > li.spell {
  9089. border: none;
  9090. font-size: var(--font-size-13);
  9091. }
  9092. .spellcasting-entry.preparation ol.spell-list > li .level-prepared-toggle {
  9093. flex: 0;
  9094. font-size: 0.75rem;
  9095. color: var(--secondary);
  9096. }
  9097. .spellcasting-entry.preparation ol.spell-list > li .item-name {
  9098. align-items: center;
  9099. display: flex;
  9100. flex-wrap: nowrap;
  9101. justify-content: start;
  9102. justify-self: start;
  9103. min-height: 1.75rem;
  9104. }
  9105. .spellcasting-entry.preparation ol.spell-list > li .item-name h3 {
  9106. white-space: nowrap;
  9107. }
  9108. .spellcasting-entry.preparation ol.spell-list > li .item-name + span {
  9109. font-size: 0.75rem;
  9110. }
  9111. .spellcasting-entry.preparation ol.spell-list > li .item-name .focus-pool-input {
  9112. align-items: center;
  9113. display: flex;
  9114. flex-wrap: nowrap;
  9115. }
  9116. .spellcasting-entry.preparation ol.spell-list > li .item-name .slash {
  9117. font-size: 0.75rem;
  9118. }
  9119. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-slots,
  9120. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-max {
  9121. padding-top: 3px;
  9122. font-size: 0.75rem;
  9123. }
  9124. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-slots.infinity,
  9125. .spellcasting-entry.preparation ol.spell-list > li .item-name .spell-max.infinity {
  9126. position: relative;
  9127. top: -2px;
  9128. }
  9129. .spellcasting-entry.preparation ol.spell-list > li .item-name .item-image {
  9130. height: 1.5rem;
  9131. width: 1.5rem;
  9132. flex: 0 0 auto;
  9133. margin: 2px 0;
  9134. }
  9135. .spellcasting-entry.preparation ol.spell-list > li .item-name h4 {
  9136. margin: 0;
  9137. padding: 0;
  9138. font-size: var(--font-size-14);
  9139. letter-spacing: -0.075em;
  9140. line-height: 1;
  9141. margin-left: 8px;
  9142. cursor: pointer;
  9143. }
  9144. .spellcasting-entry.preparation ol.spell-list > li .item-name h4:hover {
  9145. color: var(--secondary);
  9146. }
  9147. .spellcasting-entry.preparation ol.spell-list > li .item-name .activity-icon {
  9148. margin-left: 4px;
  9149. }
  9150. .spellcasting-entry.preparation ol.spell-list > li .item-name.empty {
  9151. grid-column: 1/span 4;
  9152. }
  9153. .spellcasting-entry.preparation ol.spell-list > li .spell-range {
  9154. grid-area: range;
  9155. padding-left: 0.2em;
  9156. }
  9157. .spellcasting-entry.preparation ol.spell-list > li .spell-components {
  9158. grid-area: components;
  9159. justify-self: right;
  9160. padding: 0 0.5em;
  9161. }
  9162. .spellcasting-entry.preparation ol.spell-list > li .spell-components .tag {
  9163. font: var(--font-size-12) var(--sans-serif-condensed);
  9164. }
  9165. .spellcasting-entry.preparation ol.spell-list > li .spell-cast {
  9166. grid-area: cast-spell;
  9167. display: flex;
  9168. justify-content: center;
  9169. }
  9170. .spellcasting-entry.preparation ol.spell-list > li .item-controls {
  9171. grid-area: controls;
  9172. display: flex;
  9173. justify-self: end;
  9174. padding-right: 0.25em;
  9175. }
  9176. .spellcasting-entry.preparation ol.spell-list > li button.cast-spell {
  9177. align-items: center;
  9178. background: var(--secondary);
  9179. border-radius: 2px;
  9180. border: black;
  9181. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  9182. color: white;
  9183. cursor: pointer;
  9184. display: flex;
  9185. font: 700 0.55rem var(--sans-serif);
  9186. justify-self: center;
  9187. letter-spacing: 0.25px;
  9188. max-width: fit-content;
  9189. padding: 0.5em 1em;
  9190. text-transform: uppercase;
  9191. }
  9192. .spellcasting-entry.preparation ol.spell-list > li .item-summary {
  9193. grid-area: content;
  9194. width: 100%;
  9195. padding: 8px;
  9196. border-bottom: 1px solid var(--sub);
  9197. border-top: 1px solid #aca5a3;
  9198. background-color: var(--bg);
  9199. }
  9200. .spellcasting-entry.preparation ol.spell-list[data-category=spontaneous] .virtual {
  9201. position: relative;
  9202. }
  9203. .spellcasting-entry.preparation ol.spell-list[data-category=spontaneous] .virtual::before {
  9204. pointer-events: none;
  9205. content: "";
  9206. position: absolute;
  9207. height: 100%;
  9208. width: 100%;
  9209. background-color: rgba(0, 5, 255, 0.1137254902);
  9210. mix-blend-mode: saturation;
  9211. }
  9212. .spellcasting-entry.preparation ol.spell-list[data-category=spontaneous] .item:not(.virtual) + .virtual {
  9213. border-top: 1px solid rgba(0, 0, 0, 0.15);
  9214. }
  9215. .spellcasting-entry.preparation ol.spell-list .level-prepared-header {
  9216. font-size: 0.75rem;
  9217. color: white;
  9218. margin: 0;
  9219. padding: 4px;
  9220. text-align: center;
  9221. background: var(--secondary);
  9222. position: relative;
  9223. }
  9224. .spellcasting-entry.preparation ol.spell-list .spell .item-name {
  9225. width: 100%;
  9226. }
  9227. .spellcasting-entry.preparation ol.spell-list input.toggle-signature-spell[type=checkbox] {
  9228. width: 12px;
  9229. height: 12px;
  9230. margin: 0 2px 0 0;
  9231. flex: 0 0 auto;
  9232. }
  9233. .spellcasting-entry.preparation ol.spell-list .spellbook-empty {
  9234. display: flex;
  9235. align-items: center;
  9236. min-height: 28px;
  9237. justify-content: flex-end;
  9238. }
  9239. .spellcasting-entry.preparation ol.spell-list .spellbook-empty h4 {
  9240. margin: 0;
  9241. white-space: nowrap;
  9242. margin-right: auto;
  9243. }
  9244. .spellcasting-entry.preparation ol.spell-list .spellbook-empty a {
  9245. flex: 0 1 0;
  9246. white-space: nowrap;
  9247. margin-left: 8px;
  9248. }
  9249. .spellcasting-entry.preparation form {
  9250. display: flex;
  9251. flex-direction: column;
  9252. height: 100%;
  9253. padding: 4px;
  9254. }
  9255. .spellcasting-entry.preparation .sheet-header {
  9256. align-items: baseline;
  9257. display: block;
  9258. flex: 0;
  9259. padding-right: 16px;
  9260. }
  9261. .spellcasting-entry.preparation .sheet-header h1 {
  9262. display: flex;
  9263. flex: 1;
  9264. overflow: hidden;
  9265. font-family: var(--serif-condensed);
  9266. font-weight: 700;
  9267. white-space: nowrap;
  9268. justify-content: space-between;
  9269. }
  9270. .spellcasting-entry.preparation .sheet-header p.hint {
  9271. margin: auto auto 1em;
  9272. }
  9273. .spellcasting-entry.preparation .sheet-header .item-controls {
  9274. flex: 0;
  9275. white-space: nowrap;
  9276. }
  9277. .spellcasting-entry.preparation .sheet-content {
  9278. overflow: hidden scroll;
  9279. scrollbar-width: thin;
  9280. scrollbar-color: var(--primary) transparent;
  9281. padding-bottom: 1em;
  9282. padding-right: 8px;
  9283. }
  9284. .currency {
  9285. display: flex;
  9286. padding: 3px;
  9287. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  9288. background-color: var(--sub);
  9289. margin: 0;
  9290. align-items: center;
  9291. list-style: none;
  9292. font-size: var(--font-size-13);
  9293. }
  9294. .currency .label {
  9295. margin-right: 10px;
  9296. margin-left: 4px;
  9297. color: white;
  9298. font-weight: bold;
  9299. justify-content: flex-start;
  9300. }
  9301. .currency .denomination {
  9302. flex: 0 1 auto;
  9303. width: 100%;
  9304. color: white;
  9305. display: flex;
  9306. align-items: center;
  9307. justify-content: flex-start;
  9308. flex-wrap: nowrap;
  9309. background-color: transparent;
  9310. border-right: 1px solid rgba(255, 255, 255, 0.1);
  9311. border-left: 1px solid rgba(0, 0, 0, 0.2);
  9312. text-shadow: 0 0 3px rgba(0, 0, 0, 0.75);
  9313. }
  9314. .currency .denomination:first-child {
  9315. border-left: none;
  9316. }
  9317. .currency .denomination:last-child {
  9318. border-right: none;
  9319. margin-right: 8px;
  9320. }
  9321. .currency .denomination label {
  9322. color: #ffe8d1;
  9323. text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.2), -1px -1px 1px rgba(0, 0, 0, 0.2);
  9324. font-family: var(--sans-serif);
  9325. font-size: var(--font-size-10);
  9326. text-transform: uppercase;
  9327. letter-spacing: 0.05em;
  9328. text-rendering: optimizeLegibility;
  9329. }
  9330. .currency .denomination span {
  9331. padding-left: 8px;
  9332. padding-right: 12px;
  9333. }
  9334. .currency .denomination.pp .currency-image {
  9335. background: url("../icons/equipment/treasure/currency/platinum-pieces.webp") no-repeat;
  9336. }
  9337. .currency .denomination.gp .currency-image {
  9338. background: url("../icons/equipment/treasure/currency/gold-pieces.webp") no-repeat;
  9339. }
  9340. .currency .denomination.sp .currency-image {
  9341. background: url("../icons/equipment/treasure/currency/silver-pieces.webp") no-repeat;
  9342. }
  9343. .currency .denomination.cp .currency-image {
  9344. background: url("../icons/equipment/treasure/currency/copper-pieces.webp") no-repeat;
  9345. }
  9346. .currency .denomination .currency-image {
  9347. height: 24px;
  9348. width: 24px;
  9349. box-shadow: 0 0 0 1px #9f725b, 0 0 0 2px var(--tertiary), 0 0 0 3px #956d58;
  9350. background-size: cover !important;
  9351. }
  9352. .currency .add-coins-popup > button,
  9353. .currency .remove-coins-popup > button,
  9354. .currency .sell-all-treasure > button {
  9355. display: flex;
  9356. justify-content: center;
  9357. align-items: center;
  9358. margin: 0;
  9359. padding: 0;
  9360. line-height: 1;
  9361. color: rgba(0, 0, 0, 0.75);
  9362. background-color: var(--tertiary);
  9363. border: none;
  9364. border-radius: 1px;
  9365. 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);
  9366. width: 30px;
  9367. height: 24px;
  9368. font-size: var(--font-size-13);
  9369. font-weight: 600;
  9370. margin-left: 2px;
  9371. }
  9372. .currency .add-coins-popup > button > i,
  9373. .currency .remove-coins-popup > button > i,
  9374. .currency .sell-all-treasure > button > i {
  9375. margin: 0;
  9376. padding: 0;
  9377. }
  9378. .currency .add-coins-popup > button:hover,
  9379. .currency .remove-coins-popup > button:hover,
  9380. .currency .sell-all-treasure > button:hover {
  9381. background-color: var(--primary);
  9382. color: white;
  9383. cursor: pointer;
  9384. }
  9385. .wealth {
  9386. font-family: var(--sans-serif);
  9387. font-size: var(--font-size-10);
  9388. text-transform: uppercase;
  9389. letter-spacing: 0.05em;
  9390. text-rendering: optimizeLegibility;
  9391. align-items: center;
  9392. background-color: var(--alt);
  9393. display: flex;
  9394. margin-bottom: 10px;
  9395. min-height: 22px;
  9396. justify-content: flex-end;
  9397. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  9398. }
  9399. .wealth h3 {
  9400. font-size: var(--font-size-13);
  9401. text-transform: capitalize;
  9402. text-shadow: 0 0 2px rgba(0, 0, 0, 0.75);
  9403. margin: 2px;
  9404. margin-left: 4px;
  9405. cursor: default;
  9406. }
  9407. .wealth h3:hover {
  9408. color: white;
  9409. }
  9410. .wealth h3.item-name {
  9411. flex-grow: 1;
  9412. color: white;
  9413. margin-bottom: 0;
  9414. font-weight: bold;
  9415. margin: 0 5px;
  9416. }
  9417. .wealth h3.item-name span {
  9418. margin-left: 5px;
  9419. font-weight: normal;
  9420. text-transform: uppercase;
  9421. }
  9422. .wealth ol {
  9423. padding-right: 0;
  9424. padding-bottom: 0;
  9425. margin-bottom: 0;
  9426. margin-right: 0;
  9427. }
  9428. /* Actor-type Imports */
  9429. .familiar .window-content {
  9430. background: url("../assets/sheet/background.webp");
  9431. background-repeat: repeat-x, no-repeat;
  9432. background-size: cover;
  9433. background-attachment: local;
  9434. display: flex;
  9435. flex-direction: row;
  9436. }
  9437. .familiar .window-content .section-container {
  9438. display: flex;
  9439. flex-direction: column;
  9440. }
  9441. .familiar .window-content .section-container .section-header {
  9442. border: 1px solid #5e0000;
  9443. border-radius: 3px 3px 0px 0px;
  9444. background: #5e0000;
  9445. display: flex;
  9446. flex: 0;
  9447. width: 100%;
  9448. flex-direction: row;
  9449. justify-content: space-between;
  9450. align-items: baseline;
  9451. text-align: left;
  9452. color: #f5efe0;
  9453. font-size: var(--font-size-13);
  9454. padding: 0 8px;
  9455. line-height: 2em;
  9456. }
  9457. .familiar .window-content .section-container .section-header h4 {
  9458. flex: auto;
  9459. display: flex;
  9460. align-items: baseline;
  9461. gap: 4px;
  9462. margin-bottom: 0px;
  9463. text-transform: uppercase;
  9464. }
  9465. .familiar .window-content .section-container .section-header input {
  9466. color: inherit;
  9467. width: auto;
  9468. }
  9469. .familiar .window-content .section-container .section-header .controls {
  9470. display: flex;
  9471. gap: 8px;
  9472. justify-self: flex-end;
  9473. }
  9474. .familiar .window-content .section-container .section-body {
  9475. border: 1px solid #5e0000;
  9476. border-radius: 0px 0px 3px 3px;
  9477. display: flex;
  9478. flex: auto;
  9479. flex-wrap: wrap;
  9480. flex-direction: row;
  9481. align-items: baseline;
  9482. justify-content: flex-start;
  9483. width: 100%;
  9484. }
  9485. .familiar .window-content .section-container.headerless .section-body {
  9486. border-radius: 3px;
  9487. }
  9488. .familiar .window-content .actions-list, .familiar .window-content .attacks-list {
  9489. align-items: baseline;
  9490. margin: 0px;
  9491. padding: 0px;
  9492. width: 100%;
  9493. }
  9494. .familiar .window-content .actions-list .item-controls, .familiar .window-content .attacks-list .item-controls {
  9495. font-size: 0.8rem;
  9496. display: flex;
  9497. flex-wrap: nowrap;
  9498. align-items: baseline;
  9499. margin-left: auto;
  9500. }
  9501. .familiar .window-content .actions-list .item-controls .chat, .familiar .window-content .attacks-list .item-controls .chat {
  9502. margin-right: 3px;
  9503. font-size: 0.9em;
  9504. }
  9505. .familiar .window-content .actions-list .action, .familiar .window-content .attacks-list .action {
  9506. display: flex;
  9507. flex: 1 0 46%;
  9508. flex-direction: column;
  9509. margin-left: 6px;
  9510. margin-right: 6px;
  9511. }
  9512. .familiar .window-content .actions-list .action:not(:last-child), .familiar .window-content .attacks-list .action:not(:last-child) {
  9513. border-bottom: 1px solid var(--color-border-light-tertiary);
  9514. }
  9515. .familiar .window-content .actions-list .action .action-header, .familiar .window-content .attacks-list .action .action-header {
  9516. display: flex;
  9517. flex: 1 0 auto;
  9518. flex-direction: row;
  9519. justify-content: space-between;
  9520. align-items: center;
  9521. width: 100%;
  9522. }
  9523. .familiar .window-content .actions-list .action .action-header .action-name, .familiar .window-content .attacks-list .action .action-header .action-name {
  9524. display: flex;
  9525. flex: auto;
  9526. font-size: 0.9rem;
  9527. }
  9528. .familiar .window-content .actions-list .action .action-header .action-name h4, .familiar .window-content .attacks-list .action .action-header .action-name h4 {
  9529. margin: 0px;
  9530. margin-bottom: 0px;
  9531. }
  9532. .familiar .window-content .actions-list .action .action-header .action-name .action-traits, .familiar .window-content .attacks-list .action .action-header .action-name .action-traits {
  9533. margin-left: 12px;
  9534. }
  9535. .familiar .window-content .actions-list .action .action-header .action-name .action-tracking, .familiar .window-content .attacks-list .action .action-header .action-name .action-tracking {
  9536. flex: 0;
  9537. align-items: center;
  9538. display: flex;
  9539. flex-direction: row;
  9540. flex-wrap: nowrap;
  9541. margin-left: auto;
  9542. margin-right: 16px;
  9543. }
  9544. .familiar .window-content .actions-list .action .action-header .action-name .action-tracking input, .familiar .window-content .attacks-list .action .action-header .action-name .action-tracking input {
  9545. width: 0;
  9546. flex: 0 1 48px;
  9547. font-family: inherit;
  9548. font-size: 0.9rem;
  9549. background: none;
  9550. text-align: center;
  9551. border: 0;
  9552. padding: 0 3px;
  9553. height: auto;
  9554. }
  9555. .familiar .window-content .actions-list .action .action-header .action-name .action-tracking span, .familiar .window-content .attacks-list .action .action-header .action-name .action-tracking span {
  9556. white-space: nowrap;
  9557. }
  9558. .familiar .window-content .actions-list .action .item-summary, .familiar .window-content .attacks-list .action .item-summary {
  9559. flex: 0 1 auto;
  9560. margin-top: 0.5em;
  9561. }
  9562. .familiar .window-content .actions-list .attack, .familiar .window-content .attacks-list .attack {
  9563. display: flex;
  9564. flex-direction: column;
  9565. justify-content: flex-start;
  9566. margin: 8px 6px 0 6px;
  9567. border-bottom: 1px solid var(--color-border-light-tertiary);
  9568. }
  9569. .familiar .window-content .actions-list .attack:last-child, .familiar .window-content .attacks-list .attack:last-child {
  9570. border-bottom: none;
  9571. }
  9572. .familiar .window-content .actions-list .attack .attack-header, .familiar .window-content .attacks-list .attack .attack-header {
  9573. display: flex;
  9574. flex: 1 0 auto;
  9575. flex-direction: row;
  9576. align-items: baseline;
  9577. width: 100%;
  9578. }
  9579. .familiar .window-content .actions-list .attack .attack-name, .familiar .window-content .attacks-list .attack .attack-name {
  9580. display: flex;
  9581. flex-wrap: wrap;
  9582. align-items: center;
  9583. gap: 2px;
  9584. white-space: nowrap;
  9585. margin: 0 4px 0 0;
  9586. font-size: 0.9rem;
  9587. font-weight: 500;
  9588. }
  9589. .familiar .window-content .actions-list .attack .attack-name > span, .familiar .window-content .attacks-list .attack .attack-name > span {
  9590. gap: 3px;
  9591. margin-right: 4px;
  9592. display: flex;
  9593. align-items: baseline;
  9594. line-height: 1.125rem;
  9595. }
  9596. .familiar .window-content .actions-list .attack .attack-body, .familiar .window-content .attacks-list .attack .attack-body {
  9597. display: flex;
  9598. align-items: flex-start;
  9599. flex-direction: column;
  9600. width: 100%;
  9601. padding-top: 3px;
  9602. }
  9603. .familiar .window-content .actions-list .attack .attack-body .flexrow,
  9604. .familiar .window-content .actions-list .attack .attack-body .sub-section, .familiar .window-content .attacks-list .attack .attack-body .flexrow,
  9605. .familiar .window-content .attacks-list .attack .attack-body .sub-section {
  9606. gap: 2px;
  9607. }
  9608. .familiar .window-content .actions-list .attack .attack-body .sub-section, .familiar .window-content .attacks-list .attack .attack-body .sub-section {
  9609. align-items: flex-start;
  9610. display: flex;
  9611. flex-direction: row;
  9612. flex-wrap: wrap;
  9613. flex: auto;
  9614. justify-content: flex-start;
  9615. }
  9616. .familiar .window-content .actions-list .attack .attack-body .sub-section h4, .familiar .window-content .attacks-list .attack .attack-body .sub-section h4 {
  9617. margin-left: 12px;
  9618. margin-right: 12px;
  9619. }
  9620. .familiar .window-content .actions-list .attack .attack-body button, .familiar .window-content .attacks-list .attack .attack-body button {
  9621. width: auto !important;
  9622. cursor: pointer;
  9623. margin: 0;
  9624. padding: 0 8px;
  9625. font-size: var(--font-size-11);
  9626. height: 18px;
  9627. line-height: 18px;
  9628. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  9629. background: var(--color-primary);
  9630. color: #f5efe0;
  9631. text-align: center;
  9632. white-space: nowrap;
  9633. border-radius: 3px;
  9634. border: none;
  9635. }
  9636. .familiar .window-content .actions-list .attack .attack-body button:first-child, .familiar .window-content .attacks-list .attack .attack-body button:first-child {
  9637. margin-left: 0px;
  9638. }
  9639. .familiar .window-content .actions-list .attack .attack-body button:hover, .familiar .window-content .attacks-list .attack .attack-body button:hover {
  9640. box-shadow: none;
  9641. text-shadow: 0 0 2px white;
  9642. }
  9643. .familiar .window-content .actions-list .attack .attack-body .attack-button, .familiar .window-content .attacks-list .attack .attack-body .attack-button {
  9644. background-color: var(--secondary);
  9645. }
  9646. .familiar .window-content .actions-list .attack .attack-body .damage-button,
  9647. .familiar .window-content .actions-list .attack .attack-body .critical-button, .familiar .window-content .attacks-list .attack .attack-body .damage-button,
  9648. .familiar .window-content .attacks-list .attack .attack-body .critical-button {
  9649. background-color: var(--primary);
  9650. }
  9651. .familiar .window-content .actions-list .attack .attack-body .attack-description, .familiar .window-content .attacks-list .attack .attack-body .attack-description {
  9652. min-height: 10px;
  9653. }
  9654. .familiar .window-content input {
  9655. border: none;
  9656. border-radius: 0;
  9657. background-color: rgba(28, 28, 28, 0.1);
  9658. }
  9659. .familiar .window-content input:focus {
  9660. box-shadow: none;
  9661. }
  9662. .familiar .window-content select {
  9663. border: 1px solid transparent;
  9664. background: rgba(0, 0, 0, 0.05);
  9665. font-family: var(--body-serif);
  9666. font-size: var(--font-size-14);
  9667. font-weight: normal;
  9668. }
  9669. .familiar .window-content select:hover {
  9670. border: 1px solid black;
  9671. }
  9672. .familiar .window-content .familiar-sheet-header {
  9673. display: flex;
  9674. flex-direction: row;
  9675. padding: 4px 6px 0;
  9676. }
  9677. .familiar .window-content .familiar-sheet-header .image-container {
  9678. display: flex;
  9679. }
  9680. .familiar .window-content .familiar-sheet-header .image-container img.actor-image {
  9681. flex: 0;
  9682. width: 125px;
  9683. height: 100%;
  9684. border-radius: 0;
  9685. }
  9686. .familiar .window-content .familiar-sheet-header .image-container [data-action=show-image] {
  9687. bottom: 2px;
  9688. right: 2px;
  9689. }
  9690. .familiar .window-content .familiar-sheet-header .header-content {
  9691. display: flex;
  9692. flex-direction: column;
  9693. border-radius: 0;
  9694. flex-grow: 1;
  9695. margin-left: 10px;
  9696. }
  9697. .familiar .window-content .familiar-sheet-header .header-content .charname {
  9698. display: flex;
  9699. flex-direction: row;
  9700. font-family: var(--sans-serif-condensed);
  9701. font-size: 1.75rem;
  9702. font-weight: 700;
  9703. width: 100%;
  9704. flex-wrap: nowrap;
  9705. align-items: baseline;
  9706. text-transform: capitalize;
  9707. gap: 0.25em;
  9708. }
  9709. .familiar .window-content .familiar-sheet-header .header-content .charname input {
  9710. font-weight: bold;
  9711. width: calc(100% - 6px);
  9712. border-bottom: 1px solid #d3ccbc;
  9713. text-transform: capitalize;
  9714. padding: 0;
  9715. margin-right: 5px;
  9716. font-variant: small-caps;
  9717. color: #323232;
  9718. }
  9719. .familiar .window-content .familiar-sheet-header .header-content .charname input::placeholder {
  9720. filter: opacity(0.5);
  9721. color: #1c1c1c;
  9722. }
  9723. .familiar .window-content .familiar-sheet-header .header-content .charname input:focus {
  9724. border-bottom: 1px solid #644f33;
  9725. }
  9726. .familiar .window-content .familiar-sheet-header .header-content .charname input:focus::placeholder {
  9727. color: transparent;
  9728. }
  9729. .familiar .window-content .familiar-sheet-header .header-content .charname .charname-value {
  9730. flex: 1 1;
  9731. }
  9732. .familiar .window-content .familiar-sheet-header .header-content .charname .familiar-title {
  9733. flex: 0 1;
  9734. text-align: right;
  9735. margin-right: 0.1em;
  9736. text-transform: uppercase;
  9737. }
  9738. .familiar .window-content .familiar-sheet-header .header-content .sub-header {
  9739. display: flex;
  9740. margin-bottom: 10px;
  9741. }
  9742. .familiar .window-content .familiar-sheet-header .header-content .sub-header .traits {
  9743. flex: 1;
  9744. }
  9745. .familiar .window-content .familiar-sheet-header .header-content .traits {
  9746. margin: 0.25em 0;
  9747. }
  9748. .familiar .window-content .familiar-sheet-header .header-content .traits span {
  9749. color: white;
  9750. font-size: 0.75em;
  9751. font-weight: 700;
  9752. padding: 0.25em 0.5em;
  9753. letter-spacing: 1px;
  9754. text-transform: uppercase;
  9755. background-color: var(--primary);
  9756. border: 1px solid var(--tertiary);
  9757. }
  9758. .familiar .window-content .familiar-sheet-header .header-content .details-section {
  9759. display: flex;
  9760. flex-direction: row;
  9761. justify-content: space-between;
  9762. }
  9763. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section {
  9764. display: grid;
  9765. flex-direction: column;
  9766. height: max-content;
  9767. width: 150px;
  9768. grid-template-columns: min-content 1fr;
  9769. font-size: var(--font-size-14);
  9770. }
  9771. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section div {
  9772. white-space: nowrap;
  9773. }
  9774. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section .label {
  9775. display: flex;
  9776. flex-direction: row;
  9777. align-items: center;
  9778. white-space: nowrap;
  9779. }
  9780. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section .label h4 {
  9781. font-weight: bold;
  9782. margin: 0 0.25em 0 0;
  9783. padding-left: 6px;
  9784. }
  9785. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section .value {
  9786. display: flex;
  9787. flex-direction: row;
  9788. align-items: center;
  9789. padding-left: 4px;
  9790. }
  9791. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section .value input {
  9792. width: 2em;
  9793. text-align: right;
  9794. padding-right: 3px;
  9795. border: 1px solid transparent;
  9796. background: none;
  9797. height: auto;
  9798. }
  9799. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section .value input:hover, .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section .value input:focus {
  9800. border: 1px solid black;
  9801. box-shadow: 0 0 10px #00005a;
  9802. }
  9803. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section .value .total-hp {
  9804. flex-grow: 1;
  9805. }
  9806. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section .temp-hp {
  9807. display: flex;
  9808. margin-left: 8px;
  9809. align-items: baseline;
  9810. }
  9811. .familiar .window-content .familiar-sheet-header .header-content .details-section .hp-section .temp-hp input {
  9812. text-align: left;
  9813. }
  9814. .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section {
  9815. display: flex;
  9816. flex-direction: column;
  9817. }
  9818. .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list {
  9819. display: flex;
  9820. flex-direction: row;
  9821. justify-content: space-between;
  9822. gap: 12px;
  9823. }
  9824. .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name, .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac {
  9825. display: flex;
  9826. flex-direction: column;
  9827. align-items: center;
  9828. column-gap: 0.5em;
  9829. }
  9830. .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name .name, .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac .name {
  9831. font-weight: bold;
  9832. text-transform: capitalize;
  9833. }
  9834. .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name .value, .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac .value {
  9835. font-style: normal;
  9836. }
  9837. .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .save-name .value i, .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac .value i {
  9838. margin-right: 2px;
  9839. }
  9840. .familiar .window-content .familiar-sheet-header .header-content .details-section .defenses-section .defenses-list .ac {
  9841. border-right: 1px solid rgba(0, 0, 0, 0.15);
  9842. padding-right: 12px;
  9843. }
  9844. .familiar .window-content .familiar-sheet-header .header-content .dying-section {
  9845. display: flex;
  9846. gap: 10px;
  9847. justify-content: end;
  9848. }
  9849. .familiar .window-content .familiar-sheet-header .header-content .dying-section .name {
  9850. font-weight: bold;
  9851. }
  9852. .familiar .window-content .familiar-sheet-header .header-content .dying-section .dots {
  9853. display: flex;
  9854. gap: 4px;
  9855. align-items: baseline;
  9856. }
  9857. .familiar .window-content .familiar-sheet-header .header-content .dying-section .pips {
  9858. display: flex;
  9859. gap: 1px;
  9860. }
  9861. .familiar .window-content .section-container {
  9862. margin: 6px 6px;
  9863. }
  9864. .familiar .window-content .section-container .section-body {
  9865. align-items: stretch;
  9866. flex-direction: column;
  9867. padding: 4px;
  9868. }
  9869. .familiar .window-content .section-container .section-body input {
  9870. font-family: var(--body-serif);
  9871. font-weight: bold;
  9872. width: calc(100% - 6px);
  9873. border-bottom: 1px solid #d3ccbc;
  9874. text-transform: capitalize;
  9875. }
  9876. .familiar .window-content .section-container .section-body input::placeholder {
  9877. filter: opacity(0.5);
  9878. color: #1c1c1c;
  9879. }
  9880. .familiar .window-content .section-container .section-body input:focus {
  9881. border-bottom: 1px solid #644f33;
  9882. }
  9883. .familiar .window-content .section-container .section-body input:focus::placeholder {
  9884. color: transparent;
  9885. }
  9886. .familiar .window-content .familiar-content {
  9887. display: flex;
  9888. flex-direction: row;
  9889. margin-bottom: 5px;
  9890. column-gap: 15px;
  9891. }
  9892. .familiar .window-content .familiar-content input {
  9893. border: none;
  9894. border-radius: 0;
  9895. }
  9896. .familiar .window-content .familiar-content input[type=text] {
  9897. background-color: rgba(0, 0, 0, 0.05);
  9898. }
  9899. .familiar .window-content .familiar-content input:focus {
  9900. box-shadow: none;
  9901. }
  9902. .familiar .window-content .familiar-content h3 {
  9903. background-color: rgba(0, 0, 0, 0.05);
  9904. height: 26px;
  9905. font-family: var(--body-serif);
  9906. font-size: var(--font-size-14);
  9907. padding: 8px 4px 6px;
  9908. line-height: 1;
  9909. }
  9910. .familiar .window-content .familiar-content .familiar-species {
  9911. flex-basis: 50%;
  9912. }
  9913. .familiar .window-content .familiar-content .familiar-size {
  9914. flex-basis: 50%;
  9915. }
  9916. .familiar .window-content .familiar-content .familiar-modifier {
  9917. flex-basis: 50%;
  9918. }
  9919. .familiar .window-content .familiar-content .familiar-modifier select {
  9920. font-weight: bold;
  9921. }
  9922. .familiar .window-content .familiar-content .familiar-senses {
  9923. flex-basis: 50%;
  9924. height: min-content;
  9925. }
  9926. .familiar .window-content .familiar-content .familiar-senses .tags {
  9927. margin: 0;
  9928. padding: 0;
  9929. }
  9930. .familiar .window-content .familiar-content .familiar-senses .tags ol {
  9931. margin: 0;
  9932. }
  9933. .familiar .window-content .familiar-content .familiar-speed {
  9934. flex-basis: 30%;
  9935. }
  9936. .familiar .window-content .detail {
  9937. display: flex;
  9938. flex-direction: column;
  9939. flex-wrap: nowrap;
  9940. margin-top: 3px;
  9941. }
  9942. .familiar .window-content .detail .detail-label {
  9943. font-size: var(--font-size-10);
  9944. font-weight: 800;
  9945. line-height: 1;
  9946. text-transform: uppercase;
  9947. font-family: var(--sans-serif);
  9948. color: var(--primary);
  9949. white-space: nowrap;
  9950. margin-bottom: 3px;
  9951. }
  9952. .familiar .window-content .detail h4 {
  9953. font-size: var(--font-size-14);
  9954. font-family: var(--serif);
  9955. font-weight: bold;
  9956. background-color: rgba(0, 0, 0, 0.05);
  9957. padding-left: 2px;
  9958. margin: none;
  9959. }
  9960. .familiar .window-content .top-sections {
  9961. display: flex;
  9962. flex-direction: row;
  9963. justify-content: flex-start;
  9964. align-items: stretch;
  9965. }
  9966. .familiar .window-content .familiar-section {
  9967. flex-basis: 50%;
  9968. display: flex;
  9969. flex-direction: column;
  9970. }
  9971. .familiar .window-content .familiar-section .familiar-detail {
  9972. display: flex;
  9973. flex-direction: row;
  9974. align-items: baseline;
  9975. justify-content: space-between;
  9976. gap: 1em;
  9977. }
  9978. .familiar .window-content .main-section {
  9979. display: flex;
  9980. flex-direction: row;
  9981. }
  9982. .familiar .window-content .main-section .main-container {
  9983. flex-grow: 2;
  9984. }
  9985. .familiar .window-content .skills-content {
  9986. display: flex;
  9987. flex-direction: column;
  9988. width: 150px;
  9989. gap: 10px;
  9990. }
  9991. .familiar .window-content .skills-content .skills-list {
  9992. display: flex;
  9993. column-gap: 0.25em;
  9994. row-gap: 0.25em;
  9995. flex-direction: column;
  9996. justify-content: center;
  9997. }
  9998. .familiar .window-content .skills-content .skills-list .skill-name {
  9999. display: flex;
  10000. flex-direction: row;
  10001. align-items: center;
  10002. border: 1px solid #999;
  10003. border-radius: 3px;
  10004. height: 20px;
  10005. cursor: pointer;
  10006. font-size: var(--font-size-14);
  10007. font-family: var(--serif);
  10008. }
  10009. .familiar .window-content .skills-content .skills-list .skill-name:hover {
  10010. padding: none;
  10011. border: 1px solid #323232;
  10012. }
  10013. .familiar .window-content .skills-content .skills-list .skill-name .name {
  10014. flex: 4;
  10015. }
  10016. .familiar .window-content .skills-content .skills-list .skill-name .score {
  10017. flex: 1;
  10018. text-align: center;
  10019. padding-left: 1em;
  10020. color: var(--primary);
  10021. font-weight: bold;
  10022. }
  10023. .familiar .window-content .skills-content .skills-attack {
  10024. flex: 1;
  10025. align-self: center;
  10026. border: 1px solid transparent;
  10027. cursor: pointer;
  10028. }
  10029. .familiar .window-content .skills-content .skills-attack:hover {
  10030. border-bottom: 1px solid #323232;
  10031. }
  10032. .familiar .window-content .actions-list .action {
  10033. padding-top: 4px;
  10034. padding-bottom: 4px;
  10035. }
  10036. .familiar .window-content .effects-list {
  10037. margin: 0;
  10038. padding: 0;
  10039. gap: 0.2em;
  10040. }
  10041. .familiar .window-content .effects-list .item {
  10042. display: flex;
  10043. flex-wrap: wrap;
  10044. align-items: center;
  10045. justify-content: space-between;
  10046. padding: 2px 4px 2px 12px;
  10047. width: 100%;
  10048. }
  10049. .familiar .window-content .effects-list .item p:empty {
  10050. display: none;
  10051. }
  10052. .familiar .window-content .effects-list .item .item-name {
  10053. display: flex;
  10054. align-items: center;
  10055. flex: 1;
  10056. }
  10057. .familiar .window-content .effects-list .item .item-name h4 {
  10058. cursor: pointer;
  10059. margin: 0;
  10060. }
  10061. .familiar .window-content .effects-list .item .item-name .item-image {
  10062. margin-right: 8px;
  10063. }
  10064. .familiar .window-content .effects-list .item .item-controls {
  10065. white-space: nowrap;
  10066. font-size: var(--font-size-12);
  10067. }
  10068. .familiar .window-content .effects-list .item .item-controls a.info-only:hover {
  10069. cursor: default;
  10070. text-shadow: none;
  10071. }
  10072. .familiar .window-content .effects-list .item .item-controls a + a {
  10073. margin-left: 4px;
  10074. }
  10075. .familiar .window-content .effects-list .item .item-summary {
  10076. flex-basis: 100%;
  10077. }
  10078. .familiar .window-content .effects-list .item .item-summary .title,
  10079. .familiar .window-content .effects-list .item .item-summary .framing {
  10080. color: var(--primary);
  10081. margin: 0;
  10082. padding: 0;
  10083. margin-top: 1em;
  10084. }
  10085. .familiar .window-content .effects-list .item .item-summary .framing {
  10086. color: var(--secondary);
  10087. margin: 1em 0 0.25em;
  10088. }
  10089. .familiar .window-content .effects-list .item .item-summary .framing strong {
  10090. font-weight: 500;
  10091. }
  10092. .familiar .window-content .effects-list .item .item-summary .framing + p {
  10093. margin-top: 0;
  10094. }
  10095. .familiar .window-content .effects-list .item .item-summary img {
  10096. border: none;
  10097. vertical-align: middle;
  10098. }
  10099. .familiar .window-content .effects-list .item .item-summary img.actionlight {
  10100. background: var(--alt);
  10101. vertical-align: middle;
  10102. border: 1px solid var(--body);
  10103. }
  10104. .familiar .window-content .effects-list .item .item-summary .item-properties .tag.toggled-on:hover, .familiar .window-content .effects-list .item .item-summary .item-properties .tag.toggled-off:hover {
  10105. box-shadow: none;
  10106. text-shadow: 0 0 2px white;
  10107. }
  10108. .familiar .window-content .effects-list .item .item-summary .item-properties .tag.toggled-on, .familiar .window-content .effects-list .item .item-summary .item-properties .tag.toggled-off {
  10109. cursor: pointer;
  10110. }
  10111. .familiar .window-content .effects-list .item .item-summary .item-properties .tag.toggled-on {
  10112. background-color: rgba(23, 31, 105, 0.5);
  10113. color: black;
  10114. text-shadow: 0 0 2px white;
  10115. }
  10116. .familiar .window-content .effects-list .item.unidentified {
  10117. border-radius: 1px;
  10118. outline: 1px dotted rgba(75, 74, 68, 0.5);
  10119. background: var(--visibility-gm-bg);
  10120. }
  10121. .familiar .window-content .effects-list .item .button-group {
  10122. display: flex;
  10123. justify-content: flex-end;
  10124. align-items: center;
  10125. flex-wrap: nowrap;
  10126. width: 50%;
  10127. flex: 0;
  10128. }
  10129. .familiar .window-content .effects-list .item .button-group button {
  10130. margin: 0;
  10131. border: none;
  10132. cursor: pointer;
  10133. font-family: var(--sans-serif);
  10134. font-size: var(--font-size-10);
  10135. text-transform: uppercase;
  10136. letter-spacing: 0.05em;
  10137. text-rendering: optimizeLegibility;
  10138. padding: 5px;
  10139. color: white;
  10140. width: 70px;
  10141. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  10142. background: var(--secondary);
  10143. border-radius: 2px;
  10144. flex: 0;
  10145. white-space: nowrap;
  10146. margin-left: 4px;
  10147. flex: 0;
  10148. }
  10149. .familiar .window-content .effects-list .item .button-group button:hover {
  10150. box-shadow: none;
  10151. text-shadow: 0 0 2px white;
  10152. }
  10153. .familiar .window-content .effects-list .item {
  10154. margin: 0;
  10155. padding: 0;
  10156. margin: 0.25em 0;
  10157. }
  10158. .sheet.hazard .section-container {
  10159. display: flex;
  10160. flex-direction: column;
  10161. }
  10162. .sheet.hazard .section-container .section-header {
  10163. border: 1px solid #5e0000;
  10164. border-radius: 3px 3px 0px 0px;
  10165. background: #5e0000;
  10166. display: flex;
  10167. flex: 0;
  10168. width: 100%;
  10169. flex-direction: row;
  10170. justify-content: space-between;
  10171. align-items: baseline;
  10172. text-align: left;
  10173. color: #f5efe0;
  10174. font-size: var(--font-size-13);
  10175. padding: 0 8px;
  10176. line-height: 2em;
  10177. }
  10178. .sheet.hazard .section-container .section-header h4 {
  10179. flex: auto;
  10180. display: flex;
  10181. align-items: baseline;
  10182. gap: 4px;
  10183. margin-bottom: 0px;
  10184. text-transform: uppercase;
  10185. }
  10186. .sheet.hazard .section-container .section-header input {
  10187. color: inherit;
  10188. width: auto;
  10189. }
  10190. .sheet.hazard .section-container .section-header .controls {
  10191. display: flex;
  10192. gap: 8px;
  10193. justify-self: flex-end;
  10194. }
  10195. .sheet.hazard .section-container .section-body {
  10196. border: 1px solid #5e0000;
  10197. border-radius: 0px 0px 3px 3px;
  10198. display: flex;
  10199. flex: auto;
  10200. flex-wrap: wrap;
  10201. flex-direction: row;
  10202. align-items: baseline;
  10203. justify-content: flex-start;
  10204. width: 100%;
  10205. }
  10206. .sheet.hazard .section-container.headerless .section-body {
  10207. border-radius: 3px;
  10208. }
  10209. .sheet.hazard .actions-list, .sheet.hazard .attacks-list {
  10210. align-items: baseline;
  10211. margin: 0px;
  10212. padding: 0px;
  10213. width: 100%;
  10214. }
  10215. .sheet.hazard .actions-list .item-controls, .sheet.hazard .attacks-list .item-controls {
  10216. font-size: 0.8rem;
  10217. display: flex;
  10218. flex-wrap: nowrap;
  10219. align-items: baseline;
  10220. margin-left: auto;
  10221. }
  10222. .sheet.hazard .actions-list .item-controls .chat, .sheet.hazard .attacks-list .item-controls .chat {
  10223. margin-right: 3px;
  10224. font-size: 0.9em;
  10225. }
  10226. .sheet.hazard .actions-list .action, .sheet.hazard .attacks-list .action {
  10227. display: flex;
  10228. flex: 1 0 46%;
  10229. flex-direction: column;
  10230. margin-left: 6px;
  10231. margin-right: 6px;
  10232. }
  10233. .sheet.hazard .actions-list .action:not(:last-child), .sheet.hazard .attacks-list .action:not(:last-child) {
  10234. border-bottom: 1px solid var(--color-border-light-tertiary);
  10235. }
  10236. .sheet.hazard .actions-list .action .action-header, .sheet.hazard .attacks-list .action .action-header {
  10237. display: flex;
  10238. flex: 1 0 auto;
  10239. flex-direction: row;
  10240. justify-content: space-between;
  10241. align-items: center;
  10242. width: 100%;
  10243. }
  10244. .sheet.hazard .actions-list .action .action-header .action-name, .sheet.hazard .attacks-list .action .action-header .action-name {
  10245. display: flex;
  10246. flex: auto;
  10247. font-size: 0.9rem;
  10248. }
  10249. .sheet.hazard .actions-list .action .action-header .action-name h4, .sheet.hazard .attacks-list .action .action-header .action-name h4 {
  10250. margin: 0px;
  10251. margin-bottom: 0px;
  10252. }
  10253. .sheet.hazard .actions-list .action .action-header .action-name .action-traits, .sheet.hazard .attacks-list .action .action-header .action-name .action-traits {
  10254. margin-left: 12px;
  10255. }
  10256. .sheet.hazard .actions-list .action .action-header .action-name .action-tracking, .sheet.hazard .attacks-list .action .action-header .action-name .action-tracking {
  10257. flex: 0;
  10258. align-items: center;
  10259. display: flex;
  10260. flex-direction: row;
  10261. flex-wrap: nowrap;
  10262. margin-left: auto;
  10263. margin-right: 16px;
  10264. }
  10265. .sheet.hazard .actions-list .action .action-header .action-name .action-tracking input, .sheet.hazard .attacks-list .action .action-header .action-name .action-tracking input {
  10266. width: 0;
  10267. flex: 0 1 48px;
  10268. font-family: inherit;
  10269. font-size: 0.9rem;
  10270. background: none;
  10271. text-align: center;
  10272. border: 0;
  10273. padding: 0 3px;
  10274. height: auto;
  10275. }
  10276. .sheet.hazard .actions-list .action .action-header .action-name .action-tracking span, .sheet.hazard .attacks-list .action .action-header .action-name .action-tracking span {
  10277. white-space: nowrap;
  10278. }
  10279. .sheet.hazard .actions-list .action .item-summary, .sheet.hazard .attacks-list .action .item-summary {
  10280. flex: 0 1 auto;
  10281. margin-top: 0.5em;
  10282. }
  10283. .sheet.hazard .actions-list .attack, .sheet.hazard .attacks-list .attack {
  10284. display: flex;
  10285. flex-direction: column;
  10286. justify-content: flex-start;
  10287. margin: 8px 6px 0 6px;
  10288. border-bottom: 1px solid var(--color-border-light-tertiary);
  10289. }
  10290. .sheet.hazard .actions-list .attack:last-child, .sheet.hazard .attacks-list .attack:last-child {
  10291. border-bottom: none;
  10292. }
  10293. .sheet.hazard .actions-list .attack .attack-header, .sheet.hazard .attacks-list .attack .attack-header {
  10294. display: flex;
  10295. flex: 1 0 auto;
  10296. flex-direction: row;
  10297. align-items: baseline;
  10298. width: 100%;
  10299. }
  10300. .sheet.hazard .actions-list .attack .attack-name, .sheet.hazard .attacks-list .attack .attack-name {
  10301. display: flex;
  10302. flex-wrap: wrap;
  10303. align-items: center;
  10304. gap: 2px;
  10305. white-space: nowrap;
  10306. margin: 0 4px 0 0;
  10307. font-size: 0.9rem;
  10308. font-weight: 500;
  10309. }
  10310. .sheet.hazard .actions-list .attack .attack-name > span, .sheet.hazard .attacks-list .attack .attack-name > span {
  10311. gap: 3px;
  10312. margin-right: 4px;
  10313. display: flex;
  10314. align-items: baseline;
  10315. line-height: 1.125rem;
  10316. }
  10317. .sheet.hazard .actions-list .attack .attack-body, .sheet.hazard .attacks-list .attack .attack-body {
  10318. display: flex;
  10319. align-items: flex-start;
  10320. flex-direction: column;
  10321. width: 100%;
  10322. padding-top: 3px;
  10323. }
  10324. .sheet.hazard .actions-list .attack .attack-body .flexrow,
  10325. .sheet.hazard .actions-list .attack .attack-body .sub-section, .sheet.hazard .attacks-list .attack .attack-body .flexrow,
  10326. .sheet.hazard .attacks-list .attack .attack-body .sub-section {
  10327. gap: 2px;
  10328. }
  10329. .sheet.hazard .actions-list .attack .attack-body .sub-section, .sheet.hazard .attacks-list .attack .attack-body .sub-section {
  10330. align-items: flex-start;
  10331. display: flex;
  10332. flex-direction: row;
  10333. flex-wrap: wrap;
  10334. flex: auto;
  10335. justify-content: flex-start;
  10336. }
  10337. .sheet.hazard .actions-list .attack .attack-body .sub-section h4, .sheet.hazard .attacks-list .attack .attack-body .sub-section h4 {
  10338. margin-left: 12px;
  10339. margin-right: 12px;
  10340. }
  10341. .sheet.hazard .actions-list .attack .attack-body button, .sheet.hazard .attacks-list .attack .attack-body button {
  10342. width: auto !important;
  10343. cursor: pointer;
  10344. margin: 0;
  10345. padding: 0 8px;
  10346. font-size: var(--font-size-11);
  10347. height: 18px;
  10348. line-height: 18px;
  10349. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  10350. background: var(--color-primary);
  10351. color: #f5efe0;
  10352. text-align: center;
  10353. white-space: nowrap;
  10354. border-radius: 3px;
  10355. border: none;
  10356. }
  10357. .sheet.hazard .actions-list .attack .attack-body button:first-child, .sheet.hazard .attacks-list .attack .attack-body button:first-child {
  10358. margin-left: 0px;
  10359. }
  10360. .sheet.hazard .actions-list .attack .attack-body button:hover, .sheet.hazard .attacks-list .attack .attack-body button:hover {
  10361. box-shadow: none;
  10362. text-shadow: 0 0 2px white;
  10363. }
  10364. .sheet.hazard .actions-list .attack .attack-body .attack-button, .sheet.hazard .attacks-list .attack .attack-body .attack-button {
  10365. background-color: var(--secondary);
  10366. }
  10367. .sheet.hazard .actions-list .attack .attack-body .damage-button,
  10368. .sheet.hazard .actions-list .attack .attack-body .critical-button, .sheet.hazard .attacks-list .attack .attack-body .damage-button,
  10369. .sheet.hazard .attacks-list .attack .attack-body .critical-button {
  10370. background-color: var(--primary);
  10371. }
  10372. .sheet.hazard .actions-list .attack .attack-body .attack-description, .sheet.hazard .attacks-list .attack .attack-body .attack-description {
  10373. min-height: 10px;
  10374. }
  10375. .sheet.hazard ul, .sheet.hazard ol {
  10376. margin: 0;
  10377. padding: 0;
  10378. list-style-type: none;
  10379. }
  10380. .sheet.hazard h1, .sheet.hazard h2, .sheet.hazard h3, .sheet.hazard h4 {
  10381. margin: 0;
  10382. padding: 0;
  10383. border-bottom: none;
  10384. }
  10385. .sheet.hazard form {
  10386. display: flex;
  10387. flex-direction: column;
  10388. height: 100%;
  10389. }
  10390. .sheet.hazard form .tagify > span {
  10391. min-width: 20px;
  10392. }
  10393. .sheet.hazard form .tagify--hasMaxTags > span {
  10394. display: none;
  10395. }
  10396. .sheet.hazard .window-content {
  10397. margin: 0;
  10398. padding: 0;
  10399. }
  10400. .sheet.hazard input[type=text], .sheet.hazard input[type=number] {
  10401. margin: 0;
  10402. padding: 0;
  10403. background: none;
  10404. border: 1px solid transparent;
  10405. }
  10406. .sheet.hazard input[type=text]:hover:not(:disabled), .sheet.hazard input[type=text]:focus, .sheet.hazard input[type=number]:hover:not(:disabled), .sheet.hazard input[type=number]:focus {
  10407. border: 1px solid black;
  10408. box-shadow: 0 0 10px #00005a;
  10409. }
  10410. .sheet.hazard .container {
  10411. display: flex;
  10412. background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
  10413. height: 100%;
  10414. overflow: hidden;
  10415. }
  10416. .sheet.hazard .content {
  10417. flex: 1;
  10418. padding-left: 5px;
  10419. padding-right: 5px;
  10420. padding: 0 5px 20px 5px;
  10421. overflow: hidden scroll;
  10422. scrollbar-width: thin;
  10423. scrollbar-color: var(--primary) transparent;
  10424. }
  10425. .sheet.hazard form > header {
  10426. align-items: center;
  10427. background: url("../assets/sheet/header-bw.webp"), url("../assets/sheet/background.webp");
  10428. background-blend-mode: multiply;
  10429. background-color: #238580;
  10430. background-repeat: repeat-x, no-repeat;
  10431. background-size: cover;
  10432. box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  10433. color: white;
  10434. display: flex;
  10435. font-family: var(--sans-serif);
  10436. font-weight: 600;
  10437. gap: 8px;
  10438. justify-content: space-between;
  10439. margin-bottom: 0.1em;
  10440. padding: 0 16px;
  10441. text-transform: uppercase;
  10442. width: 100%;
  10443. }
  10444. .sheet.hazard form > header .frame-container {
  10445. flex: 0 0 60px;
  10446. padding: 4px;
  10447. margin: 16px 0;
  10448. }
  10449. .sheet.hazard form > header .frame-container .frame {
  10450. width: 60px;
  10451. height: 60px;
  10452. }
  10453. .sheet.hazard form > header .frame-container .image-container [data-action=show-image] {
  10454. color: var(--color-text-dark-primary);
  10455. }
  10456. .sheet.hazard form > header .frame-container .actor-image {
  10457. object-fit: cover;
  10458. object-position: top;
  10459. border: none;
  10460. border-radius: 0;
  10461. max-height: 178px;
  10462. width: 100%;
  10463. border: none;
  10464. 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;
  10465. }
  10466. .sheet.hazard form > header .frame-container .edit-mode-button {
  10467. position: absolute;
  10468. width: 20px;
  10469. height: 20px;
  10470. bottom: -10px;
  10471. left: -10px;
  10472. border-radius: 10px;
  10473. background-color: white;
  10474. color: black;
  10475. cursor: pointer;
  10476. border: none;
  10477. 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;
  10478. display: flex;
  10479. justify-content: center;
  10480. align-items: center;
  10481. font-size: 1.05em;
  10482. }
  10483. .sheet.hazard form > header .details {
  10484. margin: 4px 0;
  10485. flex: 1;
  10486. }
  10487. .sheet.hazard form > header .details tags.tags.paizo-style .tagify__input::before {
  10488. color: var(--color-text-light-7);
  10489. }
  10490. .sheet.hazard form > header input[type=text], .sheet.hazard form > header input[type=number] {
  10491. color: white;
  10492. border: none;
  10493. border-bottom: 1px solid transparent;
  10494. }
  10495. .sheet.hazard form > header input[type=text]:hover:not(:disabled), .sheet.hazard form > header input[type=text]:focus, .sheet.hazard form > header input[type=number]:hover:not(:disabled), .sheet.hazard form > header input[type=number]:focus {
  10496. border: none;
  10497. border-bottom: 1px solid var(--text-light);
  10498. box-shadow: none;
  10499. }
  10500. .sheet.hazard form > header .title {
  10501. display: flex;
  10502. flex-direction: row;
  10503. align-items: baseline;
  10504. gap: 4px;
  10505. font-size: var(--font-size-28);
  10506. font-family: var(--serif-condensed);
  10507. font-weight: 700;
  10508. }
  10509. .sheet.hazard form > header .title .name {
  10510. flex: 1;
  10511. font-size: var(--font-size-32);
  10512. }
  10513. .sheet.hazard form > header .title .level {
  10514. width: 32px;
  10515. text-align: center;
  10516. }
  10517. .sheet.hazard .sidebar {
  10518. border-right: 1px solid #888;
  10519. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  10520. display: flex;
  10521. flex-direction: column;
  10522. gap: 8px;
  10523. height: 100%;
  10524. padding: 10px 8px 8px 8px;
  10525. width: 220px;
  10526. overflow: hidden scroll;
  10527. scrollbar-width: thin;
  10528. scrollbar-color: var(--primary) transparent;
  10529. }
  10530. .sheet.hazard .sidebar .sidebar-title {
  10531. display: flex;
  10532. justify-content: space-between;
  10533. border-bottom: 1px solid black;
  10534. margin-bottom: 4px;
  10535. }
  10536. .sheet.hazard .sidebar .sidebar-title h2 {
  10537. font-size: var(--font-size-15);
  10538. }
  10539. .sheet.hazard .sidebar .valued-icon {
  10540. display: flex;
  10541. align-items: baseline;
  10542. }
  10543. .sheet.hazard .sidebar .valued-icon i {
  10544. margin-right: 4px;
  10545. }
  10546. .sheet.hazard .sidebar .valued-icon i + input {
  10547. margin-left: -1px;
  10548. }
  10549. .sheet.hazard .sidebar .health input {
  10550. width: 34px;
  10551. }
  10552. .sheet.hazard .sidebar .health input.current {
  10553. text-align: end;
  10554. }
  10555. .sheet.hazard .sidebar .armor-class input {
  10556. width: 25px;
  10557. text-align: right;
  10558. }
  10559. .sheet.hazard .sidebar .health-line {
  10560. display: flex;
  10561. flex-direction: row;
  10562. font-size: var(--font-size-16);
  10563. gap: 3px;
  10564. justify-content: center;
  10565. }
  10566. .sheet.hazard .sidebar .hp-details {
  10567. width: 100%;
  10568. }
  10569. .sheet.hazard .sidebar .initiative {
  10570. display: flex;
  10571. font-size: var(--font-size-18);
  10572. }
  10573. .sheet.hazard .sidebar .initiative h2 {
  10574. font-size: inherit;
  10575. }
  10576. .sheet.hazard .sidebar .initiative .roll-init {
  10577. display: flex;
  10578. align-items: center;
  10579. }
  10580. .sheet.hazard .sidebar .initiative .roll-init i {
  10581. margin-right: 4px;
  10582. }
  10583. .sheet.hazard .sidebar .sidebar-saves {
  10584. display: flex;
  10585. justify-content: space-between;
  10586. }
  10587. .sheet.hazard .sidebar .sidebar-saves h2 {
  10588. font-size: var(--font-size-18);
  10589. }
  10590. .sheet.hazard .sidebar .sidebar-saves .save {
  10591. align-items: center;
  10592. display: flex;
  10593. flex: 1;
  10594. flex-direction: column;
  10595. font-size: var(--font-size-18);
  10596. }
  10597. .sheet.hazard .sidebar .sidebar-saves input {
  10598. max-width: 50px;
  10599. text-align: center;
  10600. }
  10601. .sheet.hazard .sidebar .emits-sound .hint:hover {
  10602. text-shadow: 0 0 8px var(--color-shadow-primary);
  10603. }
  10604. .sheet.hazard .sidebar .emits-sound select {
  10605. font-size: var(--font-size-12);
  10606. }
  10607. .sheet.hazard .sidebar .rollable {
  10608. cursor: pointer;
  10609. }
  10610. .sheet.hazard .sidebar .rollable:hover {
  10611. text-shadow: 0 0 8px var(--color-shadow-primary);
  10612. }
  10613. .sheet.hazard .sidebar .rollable:hover i {
  10614. animation: rotation 2s infinite linear;
  10615. }
  10616. .sheet.hazard .section-container {
  10617. padding: 4px 6px 0;
  10618. }
  10619. .sheet.hazard .section-container .editor {
  10620. width: 100%;
  10621. }
  10622. .sheet.hazard .section-container .editor .editor-content, .sheet.hazard .section-container .editor .tox-edit-area {
  10623. padding: 4px;
  10624. }
  10625. .sheet.hazard .section-container .editor .tox {
  10626. width: 100%;
  10627. }
  10628. .sheet.hazard .section-container.skills > .section-body .list {
  10629. display: flex;
  10630. flex-direction: row;
  10631. flex-wrap: wrap;
  10632. }
  10633. .sheet.hazard .section-container .actions-list, .sheet.hazard .section-container .attacks-list {
  10634. border-bottom: 1px solid var(--alt);
  10635. }
  10636. .sheet.hazard .section-container .actions-list:last-child, .sheet.hazard .section-container .attacks-list:last-child {
  10637. border-bottom: none;
  10638. }
  10639. .sheet.hazard .section-container .actions-list .action, .sheet.hazard .section-container .attacks-list .action {
  10640. padding: 4px 0;
  10641. }
  10642. .sheet.hazard .source {
  10643. margin-top: 4px;
  10644. }
  10645. .sheet.hazard .source .section-body {
  10646. display: flex;
  10647. gap: 4px;
  10648. padding: 0 6px;
  10649. }
  10650. .sheet.hazard .source .section-body .source-input {
  10651. flex: 1;
  10652. }
  10653. .sheet.hazard .source .section-body label {
  10654. flex: 0;
  10655. font-weight: bold;
  10656. }
  10657. .sheet.hazard .tox.tox-tinymce {
  10658. height: 200px !important;
  10659. }
  10660. .sheet.hazard .hazard-editor .editor .editor-edit {
  10661. display: none;
  10662. }
  10663. .npc ol.spell-list {
  10664. margin: 0;
  10665. padding: 0;
  10666. border-bottom: 1px solid var(--color-border-light-2);
  10667. flex-basis: 100%;
  10668. gap: 1px;
  10669. position: relative;
  10670. width: 100%;
  10671. z-index: 1;
  10672. }
  10673. .npc ol.spell-list > li {
  10674. margin: 0;
  10675. padding: 0;
  10676. align-items: center;
  10677. background: none;
  10678. cursor: default;
  10679. display: grid;
  10680. grid: "name range components cast-spell controls" auto "content content content content content" auto/9fr 4fr 4fr 2fr 2.5fr;
  10681. justify-content: center;
  10682. padding: 0 0.3em 1px 0.35em;
  10683. }
  10684. .npc ol.spell-list > li[data-expended-state=true] h4 {
  10685. color: var(--color-disabled);
  10686. text-decoration: line-through;
  10687. }
  10688. .npc ol.spell-list > li[data-expended-state=true] .cast-spell {
  10689. background: var(--color-disabled);
  10690. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  10691. cursor: not-allowed;
  10692. }
  10693. .npc ol.spell-list > li:nth-child(odd) {
  10694. background-color: rgba(120, 100, 82, 0.1);
  10695. }
  10696. .npc ol.spell-list > li:last-child {
  10697. border-bottom: 1px solid var(--sub);
  10698. }
  10699. .npc ol.spell-list > li:last-child .item-image {
  10700. margin-bottom: 0;
  10701. margin-top: 2px;
  10702. }
  10703. .npc ol.spell-list > li.spell-level-header {
  10704. margin: 0;
  10705. padding: 0;
  10706. background: rgba(96, 88, 86, 0.25);
  10707. border: 1px solid var(--color-border-light-2);
  10708. border-radius: 2px;
  10709. color: var(--body);
  10710. font: 500 var(--font-size-12) var(--sans-serif);
  10711. letter-spacing: 0.25px;
  10712. line-height: 1;
  10713. padding: 0 0.5em;
  10714. text-transform: uppercase;
  10715. }
  10716. .npc ol.spell-list > li.spell-level-header h3 {
  10717. text-transform: capitalize;
  10718. font-size: var(--font-size-13);
  10719. margin-left: 0;
  10720. padding: 4px 0;
  10721. }
  10722. .npc ol.spell-list > li.spell-level-header .item-name {
  10723. line-height: 1;
  10724. gap: 0.25em;
  10725. }
  10726. .npc ol.spell-list > li.spell-level-header .item-name h3 {
  10727. margin: 0;
  10728. padding: 0;
  10729. font-weight: 700;
  10730. }
  10731. .npc ol.spell-list > li.spell-level-header .item-controls {
  10732. grid-column: span 2;
  10733. }
  10734. .npc ol.spell-list > li .uses {
  10735. align-items: center;
  10736. display: flex;
  10737. gap: 0.25em;
  10738. line-height: 1;
  10739. }
  10740. .npc ol.spell-list > li.spell-level-header input, .npc ol.spell-list > li .uses input {
  10741. background: var(--alt);
  10742. border-radius: 3px;
  10743. border: 1px solid var(--sub);
  10744. color: white;
  10745. font: var(--font-size-12) var(--sans-serif);
  10746. height: unset;
  10747. text-align: center;
  10748. width: 2em;
  10749. }
  10750. .npc ol.spell-list > li.spell-level-header .spell-slots-increment-reset, .npc ol.spell-list > li .uses .spell-slots-increment-reset {
  10751. padding-left: 5px;
  10752. font-size: var(--font-size-10);
  10753. }
  10754. .npc ol.spell-list > li.spell {
  10755. border: none;
  10756. font-size: var(--font-size-13);
  10757. }
  10758. .npc ol.spell-list > li .level-prepared-toggle {
  10759. flex: 0;
  10760. font-size: 0.75rem;
  10761. color: var(--secondary);
  10762. }
  10763. .npc ol.spell-list > li .item-name {
  10764. align-items: center;
  10765. display: flex;
  10766. flex-wrap: nowrap;
  10767. justify-content: start;
  10768. justify-self: start;
  10769. min-height: 1.75rem;
  10770. }
  10771. .npc ol.spell-list > li .item-name h3 {
  10772. white-space: nowrap;
  10773. }
  10774. .npc ol.spell-list > li .item-name + span {
  10775. font-size: 0.75rem;
  10776. }
  10777. .npc ol.spell-list > li .item-name .focus-pool-input {
  10778. align-items: center;
  10779. display: flex;
  10780. flex-wrap: nowrap;
  10781. }
  10782. .npc ol.spell-list > li .item-name .slash {
  10783. font-size: 0.75rem;
  10784. }
  10785. .npc ol.spell-list > li .item-name .spell-slots,
  10786. .npc ol.spell-list > li .item-name .spell-max {
  10787. padding-top: 3px;
  10788. font-size: 0.75rem;
  10789. }
  10790. .npc ol.spell-list > li .item-name .spell-slots.infinity,
  10791. .npc ol.spell-list > li .item-name .spell-max.infinity {
  10792. position: relative;
  10793. top: -2px;
  10794. }
  10795. .npc ol.spell-list > li .item-name .item-image {
  10796. height: 1.5rem;
  10797. width: 1.5rem;
  10798. flex: 0 0 auto;
  10799. margin: 2px 0;
  10800. }
  10801. .npc ol.spell-list > li .item-name h4 {
  10802. margin: 0;
  10803. padding: 0;
  10804. font-size: var(--font-size-14);
  10805. letter-spacing: -0.075em;
  10806. line-height: 1;
  10807. margin-left: 8px;
  10808. cursor: pointer;
  10809. }
  10810. .npc ol.spell-list > li .item-name h4:hover {
  10811. color: var(--secondary);
  10812. }
  10813. .npc ol.spell-list > li .item-name .activity-icon {
  10814. margin-left: 4px;
  10815. }
  10816. .npc ol.spell-list > li .item-name.empty {
  10817. grid-column: 1/span 4;
  10818. }
  10819. .npc ol.spell-list > li .spell-range {
  10820. grid-area: range;
  10821. padding-left: 0.2em;
  10822. }
  10823. .npc ol.spell-list > li .spell-components {
  10824. grid-area: components;
  10825. justify-self: right;
  10826. padding: 0 0.5em;
  10827. }
  10828. .npc ol.spell-list > li .spell-components .tag {
  10829. font: var(--font-size-12) var(--sans-serif-condensed);
  10830. }
  10831. .npc ol.spell-list > li .spell-cast {
  10832. grid-area: cast-spell;
  10833. display: flex;
  10834. justify-content: center;
  10835. }
  10836. .npc ol.spell-list > li .item-controls {
  10837. grid-area: controls;
  10838. display: flex;
  10839. justify-self: end;
  10840. padding-right: 0.25em;
  10841. }
  10842. .npc ol.spell-list > li button.cast-spell {
  10843. align-items: center;
  10844. background: var(--secondary);
  10845. border-radius: 2px;
  10846. border: black;
  10847. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  10848. color: white;
  10849. cursor: pointer;
  10850. display: flex;
  10851. font: 700 0.55rem var(--sans-serif);
  10852. justify-self: center;
  10853. letter-spacing: 0.25px;
  10854. max-width: fit-content;
  10855. padding: 0.5em 1em;
  10856. text-transform: uppercase;
  10857. }
  10858. .npc ol.spell-list > li .item-summary {
  10859. grid-area: content;
  10860. width: 100%;
  10861. padding: 8px;
  10862. border-bottom: 1px solid var(--sub);
  10863. border-top: 1px solid #aca5a3;
  10864. background-color: var(--bg);
  10865. }
  10866. .npc ol.spell-list[data-category=spontaneous] .virtual {
  10867. position: relative;
  10868. }
  10869. .npc ol.spell-list[data-category=spontaneous] .virtual::before {
  10870. pointer-events: none;
  10871. content: "";
  10872. position: absolute;
  10873. height: 100%;
  10874. width: 100%;
  10875. background-color: rgba(0, 5, 255, 0.1137254902);
  10876. mix-blend-mode: saturation;
  10877. }
  10878. .npc ol.spell-list[data-category=spontaneous] .item:not(.virtual) + .virtual {
  10879. border-top: 1px solid rgba(0, 0, 0, 0.15);
  10880. }
  10881. .npc ol.spell-list .level-prepared-header {
  10882. font-size: 0.75rem;
  10883. color: white;
  10884. margin: 0;
  10885. padding: 4px;
  10886. text-align: center;
  10887. background: var(--secondary);
  10888. position: relative;
  10889. }
  10890. .npc ol.spell-list .spell .item-name {
  10891. width: 100%;
  10892. }
  10893. .npc ol.spell-list input.toggle-signature-spell[type=checkbox] {
  10894. width: 12px;
  10895. height: 12px;
  10896. margin: 0 2px 0 0;
  10897. flex: 0 0 auto;
  10898. }
  10899. .npc ol.spell-list .spellbook-empty {
  10900. display: flex;
  10901. align-items: center;
  10902. min-height: 28px;
  10903. justify-content: flex-end;
  10904. }
  10905. .npc ol.spell-list .spellbook-empty h4 {
  10906. margin: 0;
  10907. white-space: nowrap;
  10908. margin-right: auto;
  10909. }
  10910. .npc ol.spell-list .spellbook-empty a {
  10911. flex: 0 1 0;
  10912. white-space: nowrap;
  10913. margin-left: 8px;
  10914. }
  10915. .npc .npc-skills-editor {
  10916. display: flex;
  10917. flex-direction: column;
  10918. flex-wrap: wrap;
  10919. justify-content: flex-start;
  10920. align-items: baseline;
  10921. overflow-y: scroll;
  10922. overflow-x: hidden;
  10923. font-size: 0.8rem;
  10924. }
  10925. .npc .npc-skills-editor .header {
  10926. font-weight: bold;
  10927. text-transform: uppercase;
  10928. padding: 4px;
  10929. background-color: #5e0000 !important;
  10930. color: white;
  10931. }
  10932. .npc .npc-skills-editor .skills-list {
  10933. list-style: none;
  10934. padding: 0px;
  10935. }
  10936. .npc .npc-skills-editor .skills-list .skill {
  10937. display: grid;
  10938. flex: auto;
  10939. width: 100%;
  10940. grid-template-columns: auto 32px 48px;
  10941. grid-template-rows: auto;
  10942. column-gap: 18px;
  10943. padding: 4px;
  10944. }
  10945. .npc .npc-skills-editor .skills-list .skill:nth-child(even) {
  10946. background-color: #ede3c8;
  10947. }
  10948. .npc .npc-skills-editor .skills-list .skill:nth-child(odd) {
  10949. background-color: #f5efe0;
  10950. }
  10951. .npc .npc-skills-editor .skills-list .skill .item-controls {
  10952. text-align: right;
  10953. }
  10954. .npc .npc-skills-editor .skills-list .sub-section {
  10955. background-color: #171f69;
  10956. color: white;
  10957. grid-template-columns: auto;
  10958. text-transform: uppercase;
  10959. padding: 4px;
  10960. margin-top: 12px;
  10961. }
  10962. .npc .npc-skills-editor .btn {
  10963. padding: 4px;
  10964. margin: 0px 4px;
  10965. background-color: #171f69;
  10966. border-radius: 4px;
  10967. color: white;
  10968. text-align: center;
  10969. }
  10970. .npc .npc-skills-editor .footer {
  10971. margin: 0 auto;
  10972. }
  10973. .npc.data-entry form {
  10974. columns: 2;
  10975. }
  10976. .npc.data-entry form .form-group {
  10977. display: flex;
  10978. }
  10979. .npc .npc-sheet {
  10980. display: flex;
  10981. flex-direction: row;
  10982. align-items: flex-start;
  10983. color: #323232;
  10984. }
  10985. .npc .npc-sheet .expandable {
  10986. display: none;
  10987. }
  10988. .npc .npc-sheet .section-container.inventory-toggles {
  10989. padding: 4px 6px 6px 6px;
  10990. }
  10991. .npc .npc-sheet .inventory-section {
  10992. flex: 1 0 auto;
  10993. padding: 0px;
  10994. margin: 0px;
  10995. }
  10996. .npc .npc-sheet .inventory-section .coinage {
  10997. margin-bottom: 8px;
  10998. }
  10999. .npc .npc-sheet .inventory-section .coinage .currency {
  11000. background-color: #171f69;
  11001. }
  11002. .npc .npc-sheet .inventory-section .coinage .wealth {
  11003. background-color: #5e0000;
  11004. }
  11005. .npc .npc-sheet .inventory-section .inventory-list > :first-child {
  11006. border-radius: 3px 3px 0px 0px;
  11007. }
  11008. .npc .npc-sheet .inventory-section .inventory-list .inventory-header {
  11009. background-color: #171f69;
  11010. display: flex;
  11011. flex: 1;
  11012. flex-flow: row nowrap;
  11013. color: white;
  11014. align-items: baseline;
  11015. }
  11016. .npc .npc-sheet .inventory-section .inventory-list .inventory-header h4 {
  11017. margin: 0px;
  11018. }
  11019. .npc .npc-sheet .inventory-section .inventory-list .inventory-header div {
  11020. border: none;
  11021. }
  11022. .npc .npc-sheet .inventory-section .inventory-list .item {
  11023. border-left: 1px solid #5e0000;
  11024. border-right: 1px solid #5e0000;
  11025. border-bottom: 1px solid #5e0000;
  11026. }
  11027. .npc .npc-sheet .inventory-section .inventory-list .item:not(:last-child) {
  11028. border-bottom: 1px solid #7a7971;
  11029. }
  11030. .npc .npc-sheet .inventory-section .inventory-list .item .item-image {
  11031. border: 2px solid #7a7971;
  11032. border-radius: 3px;
  11033. margin: 2px 4px 2px 6px;
  11034. }
  11035. .npc .npc-sheet .inventory-section .inventory-list .item[data-item-rarity=common] .item-name h4 {
  11036. border-color: #323232;
  11037. color: #323232;
  11038. }
  11039. .npc .npc-sheet .inventory-section .inventory-list .item[data-item-rarity=uncommon] .item-name h4 {
  11040. border-color: #98513d;
  11041. color: #98513d;
  11042. }
  11043. .npc .npc-sheet .inventory-section .inventory-list .item[data-item-rarity=rare] .item-name h4 {
  11044. border-color: #002664;
  11045. color: #002664;
  11046. }
  11047. .npc .npc-sheet .inventory-section .inventory-list .item[data-item-rarity=unique] .item-name h4 {
  11048. border-color: #54166e;
  11049. color: #54166e;
  11050. }
  11051. .npc .npc-sheet .inventory-section .inventory-list .item .controls .item-toggle-equip {
  11052. color: rgba(0, 0, 0, 0.4);
  11053. }
  11054. .npc .npc-sheet .inventory-section .inventory-list .item .controls .item-toggle-equip.active {
  11055. color: rgba(0, 0, 0, 0.75);
  11056. }
  11057. .npc .npc-sheet .inventory-section .footer {
  11058. display: flex;
  11059. flex: 1 0 auto;
  11060. width: 100%;
  11061. justify-content: center;
  11062. align-items: baseline;
  11063. background-color: #5e0000;
  11064. color: #f5efe0;
  11065. border-radius: 0px 0px 3px 3px;
  11066. }
  11067. .npc .npc-sheet .entries-list {
  11068. list-style: none;
  11069. padding: 2px;
  11070. margin: 0;
  11071. }
  11072. .npc .npc-sheet .entries-list .spellcasting-entry {
  11073. display: block;
  11074. width: 100%;
  11075. margin: 0px;
  11076. border: 1px solid var(--sub);
  11077. border-radius: 4px;
  11078. }
  11079. .npc .npc-sheet .entries-list .spellcasting-entry:not(:first-child) {
  11080. margin-top: 0.5rem;
  11081. }
  11082. .npc .npc-sheet .entries-list .spellcasting-entry .header {
  11083. background-color: #5e0000;
  11084. color: #f5efe0;
  11085. display: flex;
  11086. flex: 1 0 auto;
  11087. flex-direction: row;
  11088. flex-wrap: nowrap;
  11089. justify-content: space-between;
  11090. align-items: baseline;
  11091. padding: 4px 0.5em;
  11092. border-radius: 3px 3px 0px 0px;
  11093. gap: 0.25em;
  11094. }
  11095. .npc .npc-sheet .entries-list .spellcasting-entry .header .drag-handle {
  11096. cursor: move;
  11097. }
  11098. .npc .npc-sheet .entries-list .spellcasting-entry .header h4.name {
  11099. flex: 1;
  11100. margin: 0 4px 0 0;
  11101. padding-right: 6px;
  11102. width: max-content;
  11103. }
  11104. .npc .npc-sheet .entries-list .spellcasting-entry .header h4.name input {
  11105. color: white;
  11106. max-width: 100%;
  11107. font-weight: 500;
  11108. border: none;
  11109. }
  11110. .npc .npc-sheet .entries-list .spellcasting-entry .header h4.name input:focus, .npc .npc-sheet .entries-list .spellcasting-entry .header h4.name input:hover {
  11111. box-shadow: none;
  11112. }
  11113. .npc .npc-sheet .entries-list .spellcasting-entry .header h4.name input:read-only {
  11114. pointer-events: none;
  11115. }
  11116. .npc .npc-sheet .entries-list .spellcasting-entry .header .inline-field {
  11117. flex: 0;
  11118. display: flex;
  11119. flex-direction: row;
  11120. flex-wrap: nowrap;
  11121. justify-content: flex-start;
  11122. align-items: baseline;
  11123. }
  11124. .npc .npc-sheet .entries-list .spellcasting-entry .header .inline-field label {
  11125. margin-left: 2px;
  11126. flex: 1;
  11127. }
  11128. .npc .npc-sheet .entries-list .spellcasting-entry .header .inline-field input {
  11129. margin-left: 4px;
  11130. }
  11131. .npc .npc-sheet .entries-list .spellcasting-entry .header .inline-field .attack-input, .npc .npc-sheet .entries-list .spellcasting-entry .header .inline-field .dc-input {
  11132. flex: 1 0 32px;
  11133. text-align: center;
  11134. background-color: #f5efe0;
  11135. font-weight: bold;
  11136. width: 32px;
  11137. }
  11138. .npc .npc-sheet .entries-list .spellcasting-entry .header .ability-score select {
  11139. max-width: 55px;
  11140. padding: 2px !important;
  11141. }
  11142. .npc .npc-sheet .entries-list .spellcasting-entry .header .item-controls {
  11143. display: flex;
  11144. justify-content: space-between;
  11145. }
  11146. .npc .npc-sheet .entries-list .spellcasting-entry .header .item-controls a {
  11147. padding: 2px;
  11148. }
  11149. .npc .npc-sheet .entries-list .spellcasting-entry .spell-level-header input {
  11150. background: #f5efe0;
  11151. border: 1px solid transparent;
  11152. color: var(--body);
  11153. flex: 1 0 2rem;
  11154. font-weight: 700;
  11155. height: 18px;
  11156. text-align: center;
  11157. width: 2rem;
  11158. }
  11159. .npc .npc-sheet .footer {
  11160. display: flex;
  11161. flex: 1;
  11162. justify-content: center;
  11163. margin-top: 12px;
  11164. }
  11165. .npc .npc-sheet .footer button.spellcasting-create {
  11166. cursor: pointer;
  11167. margin: 8px;
  11168. padding: 6px 12px;
  11169. font-size: var(--font-size-10);
  11170. line-height: 16px;
  11171. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11172. background: #5e0000;
  11173. color: #f5efe0;
  11174. text-align: center;
  11175. white-space: nowrap;
  11176. border-radius: 3px;
  11177. border: none;
  11178. }
  11179. .npc .npc-sheet .effects .section-body .effects-list {
  11180. gap: 0.2em;
  11181. padding-left: 0px;
  11182. padding-right: 5px;
  11183. }
  11184. .npc .npc-sheet .effects .section-body .effects-list .item {
  11185. display: flex;
  11186. flex-wrap: wrap;
  11187. align-items: center;
  11188. justify-content: space-between;
  11189. padding: 2px 4px 2px 12px;
  11190. width: 100%;
  11191. }
  11192. .npc .npc-sheet .effects .section-body .effects-list .item p:empty {
  11193. display: none;
  11194. }
  11195. .npc .npc-sheet .effects .section-body .effects-list .item .item-name {
  11196. display: flex;
  11197. align-items: center;
  11198. flex: 1;
  11199. }
  11200. .npc .npc-sheet .effects .section-body .effects-list .item .item-name h4 {
  11201. cursor: pointer;
  11202. margin: 0;
  11203. }
  11204. .npc .npc-sheet .effects .section-body .effects-list .item .item-name .item-image {
  11205. margin-right: 8px;
  11206. }
  11207. .npc .npc-sheet .effects .section-body .effects-list .item .item-controls {
  11208. white-space: nowrap;
  11209. font-size: var(--font-size-12);
  11210. }
  11211. .npc .npc-sheet .effects .section-body .effects-list .item .item-controls a.info-only:hover {
  11212. cursor: default;
  11213. text-shadow: none;
  11214. }
  11215. .npc .npc-sheet .effects .section-body .effects-list .item .item-controls a + a {
  11216. margin-left: 4px;
  11217. }
  11218. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary {
  11219. flex-basis: 100%;
  11220. }
  11221. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .title,
  11222. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .framing {
  11223. color: var(--primary);
  11224. margin: 0;
  11225. padding: 0;
  11226. margin-top: 1em;
  11227. }
  11228. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .framing {
  11229. color: var(--secondary);
  11230. margin: 1em 0 0.25em;
  11231. }
  11232. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .framing strong {
  11233. font-weight: 500;
  11234. }
  11235. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .framing + p {
  11236. margin-top: 0;
  11237. }
  11238. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary img {
  11239. border: none;
  11240. vertical-align: middle;
  11241. }
  11242. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary img.actionlight {
  11243. background: var(--alt);
  11244. vertical-align: middle;
  11245. border: 1px solid var(--body);
  11246. }
  11247. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .item-properties .tag.toggled-on:hover, .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .item-properties .tag.toggled-off:hover {
  11248. box-shadow: none;
  11249. text-shadow: 0 0 2px white;
  11250. }
  11251. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .item-properties .tag.toggled-on, .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .item-properties .tag.toggled-off {
  11252. cursor: pointer;
  11253. }
  11254. .npc .npc-sheet .effects .section-body .effects-list .item .item-summary .item-properties .tag.toggled-on {
  11255. background-color: rgba(23, 31, 105, 0.5);
  11256. color: black;
  11257. text-shadow: 0 0 2px white;
  11258. }
  11259. .npc .npc-sheet .effects .section-body .effects-list .item.unidentified {
  11260. border-radius: 1px;
  11261. outline: 1px dotted rgba(75, 74, 68, 0.5);
  11262. background: var(--visibility-gm-bg);
  11263. }
  11264. .npc .npc-sheet .effects .section-body .effects-list .item .button-group {
  11265. display: flex;
  11266. justify-content: flex-end;
  11267. align-items: center;
  11268. flex-wrap: nowrap;
  11269. width: 50%;
  11270. flex: 0;
  11271. }
  11272. .npc .npc-sheet .effects .section-body .effects-list .item .button-group button {
  11273. margin: 0;
  11274. border: none;
  11275. cursor: pointer;
  11276. font-family: var(--sans-serif);
  11277. font-size: var(--font-size-10);
  11278. text-transform: uppercase;
  11279. letter-spacing: 0.05em;
  11280. text-rendering: optimizeLegibility;
  11281. padding: 5px;
  11282. color: white;
  11283. width: 70px;
  11284. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11285. background: var(--secondary);
  11286. border-radius: 2px;
  11287. flex: 0;
  11288. white-space: nowrap;
  11289. margin-left: 4px;
  11290. flex: 0;
  11291. }
  11292. .npc .npc-sheet .effects .section-body .effects-list .item .button-group button:hover {
  11293. box-shadow: none;
  11294. text-shadow: 0 0 2px white;
  11295. }
  11296. .npc .npc-sheet .section-container {
  11297. display: flex;
  11298. flex-direction: column;
  11299. }
  11300. .npc .npc-sheet .section-container .section-header {
  11301. border: 1px solid #5e0000;
  11302. border-radius: 3px 3px 0px 0px;
  11303. background: #5e0000;
  11304. display: flex;
  11305. flex: 0;
  11306. width: 100%;
  11307. flex-direction: row;
  11308. justify-content: space-between;
  11309. align-items: baseline;
  11310. text-align: left;
  11311. color: #f5efe0;
  11312. font-size: var(--font-size-13);
  11313. padding: 0 8px;
  11314. line-height: 2em;
  11315. }
  11316. .npc .npc-sheet .section-container .section-header h4 {
  11317. flex: auto;
  11318. display: flex;
  11319. align-items: baseline;
  11320. gap: 4px;
  11321. margin-bottom: 0px;
  11322. text-transform: uppercase;
  11323. }
  11324. .npc .npc-sheet .section-container .section-header input {
  11325. color: inherit;
  11326. width: auto;
  11327. }
  11328. .npc .npc-sheet .section-container .section-header .controls {
  11329. display: flex;
  11330. gap: 8px;
  11331. justify-self: flex-end;
  11332. }
  11333. .npc .npc-sheet .section-container .section-body {
  11334. border: 1px solid #5e0000;
  11335. border-radius: 0px 0px 3px 3px;
  11336. display: flex;
  11337. flex: auto;
  11338. flex-wrap: wrap;
  11339. flex-direction: row;
  11340. align-items: baseline;
  11341. justify-content: flex-start;
  11342. width: 100%;
  11343. }
  11344. .npc .npc-sheet .section-container.headerless .section-body {
  11345. border-radius: 3px;
  11346. }
  11347. .npc .npc-sheet .actions-list, .npc .npc-sheet .attacks-list {
  11348. align-items: baseline;
  11349. margin: 0px;
  11350. padding: 0px;
  11351. width: 100%;
  11352. }
  11353. .npc .npc-sheet .actions-list .item-controls, .npc .npc-sheet .attacks-list .item-controls {
  11354. font-size: 0.8rem;
  11355. display: flex;
  11356. flex-wrap: nowrap;
  11357. align-items: baseline;
  11358. margin-left: auto;
  11359. }
  11360. .npc .npc-sheet .actions-list .item-controls .chat, .npc .npc-sheet .attacks-list .item-controls .chat {
  11361. margin-right: 3px;
  11362. font-size: 0.9em;
  11363. }
  11364. .npc .npc-sheet .actions-list .action, .npc .npc-sheet .attacks-list .action {
  11365. display: flex;
  11366. flex: 1 0 46%;
  11367. flex-direction: column;
  11368. margin-left: 6px;
  11369. margin-right: 6px;
  11370. }
  11371. .npc .npc-sheet .actions-list .action:not(:last-child), .npc .npc-sheet .attacks-list .action:not(:last-child) {
  11372. border-bottom: 1px solid var(--color-border-light-tertiary);
  11373. }
  11374. .npc .npc-sheet .actions-list .action .action-header, .npc .npc-sheet .attacks-list .action .action-header {
  11375. display: flex;
  11376. flex: 1 0 auto;
  11377. flex-direction: row;
  11378. justify-content: space-between;
  11379. align-items: center;
  11380. width: 100%;
  11381. }
  11382. .npc .npc-sheet .actions-list .action .action-header .action-name, .npc .npc-sheet .attacks-list .action .action-header .action-name {
  11383. display: flex;
  11384. flex: auto;
  11385. font-size: 0.9rem;
  11386. }
  11387. .npc .npc-sheet .actions-list .action .action-header .action-name h4, .npc .npc-sheet .attacks-list .action .action-header .action-name h4 {
  11388. margin: 0px;
  11389. margin-bottom: 0px;
  11390. }
  11391. .npc .npc-sheet .actions-list .action .action-header .action-name .action-traits, .npc .npc-sheet .attacks-list .action .action-header .action-name .action-traits {
  11392. margin-left: 12px;
  11393. }
  11394. .npc .npc-sheet .actions-list .action .action-header .action-name .action-tracking, .npc .npc-sheet .attacks-list .action .action-header .action-name .action-tracking {
  11395. flex: 0;
  11396. align-items: center;
  11397. display: flex;
  11398. flex-direction: row;
  11399. flex-wrap: nowrap;
  11400. margin-left: auto;
  11401. margin-right: 16px;
  11402. }
  11403. .npc .npc-sheet .actions-list .action .action-header .action-name .action-tracking input, .npc .npc-sheet .attacks-list .action .action-header .action-name .action-tracking input {
  11404. width: 0;
  11405. flex: 0 1 48px;
  11406. font-family: inherit;
  11407. font-size: 0.9rem;
  11408. background: none;
  11409. text-align: center;
  11410. border: 0;
  11411. padding: 0 3px;
  11412. height: auto;
  11413. }
  11414. .npc .npc-sheet .actions-list .action .action-header .action-name .action-tracking span, .npc .npc-sheet .attacks-list .action .action-header .action-name .action-tracking span {
  11415. white-space: nowrap;
  11416. }
  11417. .npc .npc-sheet .actions-list .action .item-summary, .npc .npc-sheet .attacks-list .action .item-summary {
  11418. flex: 0 1 auto;
  11419. margin-top: 0.5em;
  11420. }
  11421. .npc .npc-sheet .actions-list .attack, .npc .npc-sheet .attacks-list .attack {
  11422. display: flex;
  11423. flex-direction: column;
  11424. justify-content: flex-start;
  11425. margin: 8px 6px 0 6px;
  11426. border-bottom: 1px solid var(--color-border-light-tertiary);
  11427. }
  11428. .npc .npc-sheet .actions-list .attack:last-child, .npc .npc-sheet .attacks-list .attack:last-child {
  11429. border-bottom: none;
  11430. }
  11431. .npc .npc-sheet .actions-list .attack .attack-header, .npc .npc-sheet .attacks-list .attack .attack-header {
  11432. display: flex;
  11433. flex: 1 0 auto;
  11434. flex-direction: row;
  11435. align-items: baseline;
  11436. width: 100%;
  11437. }
  11438. .npc .npc-sheet .actions-list .attack .attack-name, .npc .npc-sheet .attacks-list .attack .attack-name {
  11439. display: flex;
  11440. flex-wrap: wrap;
  11441. align-items: center;
  11442. gap: 2px;
  11443. white-space: nowrap;
  11444. margin: 0 4px 0 0;
  11445. font-size: 0.9rem;
  11446. font-weight: 500;
  11447. }
  11448. .npc .npc-sheet .actions-list .attack .attack-name > span, .npc .npc-sheet .attacks-list .attack .attack-name > span {
  11449. gap: 3px;
  11450. margin-right: 4px;
  11451. display: flex;
  11452. align-items: baseline;
  11453. line-height: 1.125rem;
  11454. }
  11455. .npc .npc-sheet .actions-list .attack .attack-body, .npc .npc-sheet .attacks-list .attack .attack-body {
  11456. display: flex;
  11457. align-items: flex-start;
  11458. flex-direction: column;
  11459. width: 100%;
  11460. padding-top: 3px;
  11461. }
  11462. .npc .npc-sheet .actions-list .attack .attack-body .flexrow,
  11463. .npc .npc-sheet .actions-list .attack .attack-body .sub-section, .npc .npc-sheet .attacks-list .attack .attack-body .flexrow,
  11464. .npc .npc-sheet .attacks-list .attack .attack-body .sub-section {
  11465. gap: 2px;
  11466. }
  11467. .npc .npc-sheet .actions-list .attack .attack-body .sub-section, .npc .npc-sheet .attacks-list .attack .attack-body .sub-section {
  11468. align-items: flex-start;
  11469. display: flex;
  11470. flex-direction: row;
  11471. flex-wrap: wrap;
  11472. flex: auto;
  11473. justify-content: flex-start;
  11474. }
  11475. .npc .npc-sheet .actions-list .attack .attack-body .sub-section h4, .npc .npc-sheet .attacks-list .attack .attack-body .sub-section h4 {
  11476. margin-left: 12px;
  11477. margin-right: 12px;
  11478. }
  11479. .npc .npc-sheet .actions-list .attack .attack-body button, .npc .npc-sheet .attacks-list .attack .attack-body button {
  11480. width: auto !important;
  11481. cursor: pointer;
  11482. margin: 0;
  11483. padding: 0 8px;
  11484. font-size: var(--font-size-11);
  11485. height: 18px;
  11486. line-height: 18px;
  11487. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11488. background: var(--color-primary);
  11489. color: #f5efe0;
  11490. text-align: center;
  11491. white-space: nowrap;
  11492. border-radius: 3px;
  11493. border: none;
  11494. }
  11495. .npc .npc-sheet .actions-list .attack .attack-body button:first-child, .npc .npc-sheet .attacks-list .attack .attack-body button:first-child {
  11496. margin-left: 0px;
  11497. }
  11498. .npc .npc-sheet .actions-list .attack .attack-body button:hover, .npc .npc-sheet .attacks-list .attack .attack-body button:hover {
  11499. box-shadow: none;
  11500. text-shadow: 0 0 2px white;
  11501. }
  11502. .npc .npc-sheet .actions-list .attack .attack-body .attack-button, .npc .npc-sheet .attacks-list .attack .attack-body .attack-button {
  11503. background-color: var(--secondary);
  11504. }
  11505. .npc .npc-sheet .actions-list .attack .attack-body .damage-button,
  11506. .npc .npc-sheet .actions-list .attack .attack-body .critical-button, .npc .npc-sheet .attacks-list .attack .attack-body .damage-button,
  11507. .npc .npc-sheet .attacks-list .attack .attack-body .critical-button {
  11508. background-color: var(--primary);
  11509. }
  11510. .npc .npc-sheet .actions-list .attack .attack-body .attack-description, .npc .npc-sheet .attacks-list .attack .attack-body .attack-description {
  11511. min-height: 10px;
  11512. }
  11513. .npc .npc-sheet .npc-sheet-header {
  11514. display: flex;
  11515. flex: 1 0 auto;
  11516. flex-direction: column;
  11517. }
  11518. .npc .npc-sheet .npc-sheet-header .name {
  11519. font-family: var(--sans-serif-condensed);
  11520. font-size: 1.75rem;
  11521. font-weight: 700;
  11522. width: 100%;
  11523. flex-wrap: nowrap;
  11524. }
  11525. .npc .npc-sheet .npc-sheet-header .name input {
  11526. font-weight: inherit;
  11527. height: 32px;
  11528. }
  11529. .npc .npc-sheet .npc-sheet-header .name .name-value {
  11530. font-variant: small-caps;
  11531. margin-left: 6px;
  11532. margin-right: 18px;
  11533. }
  11534. .npc .npc-sheet .npc-sheet-header .name .level-label {
  11535. flex: 0;
  11536. text-align: right;
  11537. margin-right: 0.1em;
  11538. text-transform: uppercase;
  11539. }
  11540. .npc .npc-sheet .npc-sheet-header .name input.level {
  11541. flex: 0 0 40px;
  11542. text-align: center;
  11543. }
  11544. .npc .npc-sheet .npc-sheet-header .paizo-style {
  11545. border: none;
  11546. margin-top: 2px;
  11547. padding-left: 0;
  11548. padding-right: 0;
  11549. }
  11550. .npc .npc-sheet hr {
  11551. margin: 10px 6px 10px 0;
  11552. }
  11553. .npc .npc-sheet .side-bar {
  11554. flex: 160px 0 0;
  11555. height: 100%;
  11556. overflow: hidden scroll;
  11557. scrollbar-width: thin;
  11558. scrollbar-color: var(--primary) transparent;
  11559. }
  11560. .npc .npc-sheet .side-bar .image-container {
  11561. border: 1px solid var(--color-border-dark);
  11562. }
  11563. .npc .npc-sheet .side-bar .image-container img.actor-image {
  11564. border: none;
  11565. }
  11566. .npc .npc-sheet .side-bar .armor-section .armor-value {
  11567. flex: 0;
  11568. text-align: right;
  11569. font-weight: 700;
  11570. padding-right: 4px;
  11571. }
  11572. .npc .npc-sheet .side-bar .health-section .side-bar-label, .npc .npc-sheet .side-bar .shield-section .side-bar-label {
  11573. align-items: center;
  11574. }
  11575. .npc .npc-sheet .side-bar .health-section .hit-points, .npc .npc-sheet .side-bar .shield-section .hit-points {
  11576. display: flex;
  11577. flex-direction: row;
  11578. flex: 0;
  11579. margin-left: auto;
  11580. }
  11581. .npc .npc-sheet .side-bar .health-section .hit-points input.current, .npc .npc-sheet .side-bar .shield-section .hit-points input.current {
  11582. width: 36px;
  11583. text-align: right;
  11584. padding-right: 3px;
  11585. }
  11586. .npc .npc-sheet .side-bar .health-section .hit-points .slash, .npc .npc-sheet .side-bar .health-section .hit-points .max, .npc .npc-sheet .side-bar .shield-section .hit-points .slash, .npc .npc-sheet .side-bar .shield-section .hit-points .max {
  11587. align-items: center;
  11588. display: flex;
  11589. }
  11590. .npc .npc-sheet .side-bar .health-section .hit-points .max, .npc .npc-sheet .side-bar .shield-section .hit-points .max {
  11591. font-weight: 700;
  11592. margin-right: 4px;
  11593. text-align: center;
  11594. }
  11595. .npc .npc-sheet .side-bar .health-section .hit-points .max.lt10, .npc .npc-sheet .side-bar .shield-section .hit-points .max.lt10 {
  11596. width: 8px;
  11597. }
  11598. .npc .npc-sheet .side-bar .health-section .hit-points .max.lt100, .npc .npc-sheet .side-bar .shield-section .hit-points .max.lt100 {
  11599. width: 24px;
  11600. }
  11601. .npc .npc-sheet .side-bar .health-section .hit-points .max.lt1000, .npc .npc-sheet .side-bar .shield-section .hit-points .max.lt1000 {
  11602. width: 36px;
  11603. }
  11604. .npc .npc-sheet .side-bar .shield-section .shield-details {
  11605. display: flex;
  11606. flex: auto;
  11607. flex-direction: row;
  11608. justify-content: flex-start;
  11609. align-items: baseline;
  11610. }
  11611. .npc .npc-sheet .side-bar .shield-section .shield-details .label {
  11612. flex: 0;
  11613. font-weight: bold;
  11614. }
  11615. .npc .npc-sheet .side-bar .shield-section .shield-details .value {
  11616. flex: auto;
  11617. font-weight: normal;
  11618. margin-left: 6px !important;
  11619. }
  11620. .npc .npc-sheet .side-bar .shield-section.broken {
  11621. color: rgba(0, 0, 0, 0.4);
  11622. }
  11623. .npc .npc-sheet .side-bar .shield-section.broken .shield-label {
  11624. color: rgba(0, 0, 0, 0.4);
  11625. }
  11626. .npc .npc-sheet .side-bar .shield-section.broken .shield-label h4 {
  11627. text-decoration: line-through;
  11628. }
  11629. .npc .npc-sheet .side-bar .shield-section.broken .shield-value {
  11630. color: rgba(0, 0, 0, 0.4);
  11631. }
  11632. .npc .npc-sheet .side-bar .shield-section.broken .shield-value .shield-current {
  11633. color: rgba(0, 0, 0, 0.4);
  11634. }
  11635. .npc .npc-sheet .side-bar .shield-section.broken .shield-value .shield-max {
  11636. color: rgba(0, 0, 0, 0.4);
  11637. }
  11638. .npc .npc-sheet .side-bar .speed-section {
  11639. text-align: left;
  11640. }
  11641. .npc .npc-sheet .side-bar .speed-section .land-speed-value {
  11642. flex: 0 0 30px;
  11643. text-align: right;
  11644. }
  11645. .npc .npc-sheet .side-bar .speed-section .land-speed .speed-details {
  11646. flex: 1;
  11647. }
  11648. .npc .npc-sheet .side-bar .speed-section .other-speeds {
  11649. display: flex;
  11650. justify-content: left;
  11651. align-items: left;
  11652. width: 100%;
  11653. flex-wrap: wrap;
  11654. }
  11655. .npc .npc-sheet .side-bar .saves {
  11656. margin-top: 12px;
  11657. display: flex;
  11658. flex-direction: row;
  11659. width: 100%;
  11660. flex: 1 0 auto;
  11661. font-size: 1.1rem;
  11662. }
  11663. .npc .npc-sheet .side-bar .saves .container {
  11664. display: flex;
  11665. flex-direction: column;
  11666. text-align: center;
  11667. }
  11668. .npc .npc-sheet .side-bar .saves .container label {
  11669. font-weight: 600;
  11670. }
  11671. .npc .npc-sheet .side-bar .saves .container input.modifier {
  11672. text-align: center;
  11673. z-index: 1;
  11674. }
  11675. .npc .npc-sheet .side-bar-section {
  11676. display: flex;
  11677. flex: auto;
  11678. flex-direction: column;
  11679. justify-content: flex-start;
  11680. align-items: flex-start;
  11681. }
  11682. .npc .npc-sheet .side-bar-section .controls {
  11683. padding-right: 4px;
  11684. }
  11685. .npc .npc-sheet .side-bar-section.initiative a.roll-init {
  11686. display: flex;
  11687. flex-wrap: nowrap;
  11688. font-weight: 700;
  11689. margin-left: auto;
  11690. margin-bottom: 2px;
  11691. padding-right: 0.5em;
  11692. }
  11693. .npc .npc-sheet .side-bar-section.initiative a.roll-init i.fa-dice-d20 {
  11694. font-size: 1rem;
  11695. margin-right: 0.2em;
  11696. }
  11697. .npc .npc-sheet .side-bar-section.initiative select {
  11698. background: none;
  11699. text-transform: unset;
  11700. }
  11701. .npc .npc-sheet .side-bar-section-content {
  11702. display: flex;
  11703. width: 100%;
  11704. flex-direction: row;
  11705. flex-wrap: wrap;
  11706. justify-content: flex-start;
  11707. align-items: flex-start;
  11708. padding-top: 2px;
  11709. }
  11710. .npc .npc-sheet .side-bar-section-header {
  11711. display: flex;
  11712. width: 100%;
  11713. font-size: 1rem;
  11714. border-bottom: 1px solid;
  11715. border-color: #7a7971;
  11716. margin-top: 10px;
  11717. margin-bottom: 0px;
  11718. }
  11719. .npc .npc-sheet .side-bar-section-header .side-bar-label {
  11720. display: flex;
  11721. flex: auto;
  11722. flex-direction: row;
  11723. align-items: flex-start;
  11724. }
  11725. .npc .npc-sheet .side-bar-section-header .side-bar-label .fa {
  11726. font-size: 0.8rem;
  11727. }
  11728. .npc .npc-sheet .side-bar-section-header .side-bar-label h4 {
  11729. font-size: 0.8rem;
  11730. margin-bottom: 0px;
  11731. padding-left: 2px;
  11732. }
  11733. .npc .npc-sheet .sheet-body {
  11734. flex: auto;
  11735. }
  11736. .npc .npc-sheet .sheet-body .tab {
  11737. overflow: hidden scroll;
  11738. scrollbar-width: thin;
  11739. scrollbar-color: var(--primary) transparent;
  11740. }
  11741. .npc .npc-sheet .sheet-body .tab .identification-skills ul {
  11742. display: inline;
  11743. list-style-type: none;
  11744. padding: 0;
  11745. }
  11746. .npc .npc-sheet .sheet-body .tab .identification-skills ul li {
  11747. display: inline;
  11748. }
  11749. .npc .npc-sheet .sheet-body .tab .identification-skills ul li:not(:last-of-type):after {
  11750. content: ",";
  11751. }
  11752. .npc .npc-sheet input.adjustable:not(:focus), .npc .npc-sheet span.adjustable, .npc .npc-sheet div.adjustable {
  11753. display: inline;
  11754. text-align: right;
  11755. }
  11756. .npc .npc-sheet input.adjustable:not(:focus).adjusted-higher, .npc .npc-sheet span.adjustable.adjusted-higher, .npc .npc-sheet div.adjustable.adjusted-higher {
  11757. color: #009988;
  11758. }
  11759. .npc .npc-sheet input.adjustable:not(:focus).adjusted-lower, .npc .npc-sheet span.adjustable.adjusted-lower, .npc .npc-sheet div.adjustable.adjusted-lower {
  11760. color: #cc3311;
  11761. }
  11762. .npc .npc-sheet .controls {
  11763. font-size: 0.8rem;
  11764. display: flex;
  11765. flex-wrap: nowrap;
  11766. align-items: baseline;
  11767. margin-left: auto;
  11768. gap: 1px;
  11769. }
  11770. .npc .npc-sheet .controls .chat {
  11771. margin-right: 3px;
  11772. font-size: 0.9em;
  11773. }
  11774. .npc .npc-sheet .controls > a.item-control {
  11775. padding-left: 4px;
  11776. }
  11777. .npc .npc-sheet .disabled {
  11778. color: #ababab;
  11779. border-color: #ababab;
  11780. }
  11781. .npc .npc-sheet .disabled:hover, .npc .npc-sheet .disabled.active {
  11782. color: #323232;
  11783. border-color: #7a7971;
  11784. }
  11785. .npc .npc-sheet .trait {
  11786. flex: auto 0 0;
  11787. padding: 4px;
  11788. background: var(--primary);
  11789. border: 2px solid var(--color-border-trait);
  11790. color: var(--color-text-trait);
  11791. font-size: 0.9em;
  11792. font-weight: 500;
  11793. text-transform: uppercase;
  11794. }
  11795. .npc .npc-sheet .effects-list {
  11796. display: flex;
  11797. flex: 1 0 auto;
  11798. flex-direction: row;
  11799. flex-wrap: wrap;
  11800. width: 100%;
  11801. }
  11802. .npc .npc-sheet .effects-list .separator {
  11803. flex: 0 0 1px;
  11804. height: 32px;
  11805. margin-right: 4px;
  11806. border-left: 2px solid #323232;
  11807. }
  11808. .npc .npc-sheet .effects-list > .effect {
  11809. display: flex;
  11810. flex: 0 0 32px;
  11811. height: 32px;
  11812. margin-right: 4px;
  11813. margin-bottom: 4px;
  11814. border-bottom: none !important;
  11815. }
  11816. .npc .npc-sheet .effects-list > .effect .item-image {
  11817. background-size: cover;
  11818. border: 1px solid #323232;
  11819. border-bottom: 1px solid #323232;
  11820. border-radius: 3px;
  11821. width: 32px;
  11822. }
  11823. .npc .npc-sheet .effects-list > .effect .item-image:hover {
  11824. border: 1px solid #f5efe0;
  11825. border-radius: 3px;
  11826. }
  11827. .npc .npc-sheet .actions-options .actions-option {
  11828. display: flex;
  11829. align-items: center;
  11830. width: 100%;
  11831. }
  11832. .npc .npc-sheet .actions-options .actions-option label {
  11833. width: 100%;
  11834. }
  11835. .npc .npc-sheet .actions-options .actions-option label * {
  11836. display: inline;
  11837. vertical-align: middle;
  11838. }
  11839. .npc .npc-sheet .actions-options .actions-option label input {
  11840. margin: 0;
  11841. padding: 0;
  11842. }
  11843. .npc .npc-sheet .actions-options .actions-option select {
  11844. background: none;
  11845. text-transform: none;
  11846. }
  11847. .npc .npc-sheet .actions-list {
  11848. width: 97%;
  11849. }
  11850. .npc .npc-sheet .actions-list .action {
  11851. width: 100%;
  11852. margin-top: 6px;
  11853. }
  11854. .npc .npc-sheet .labelled-field {
  11855. display: flex;
  11856. flex-direction: row;
  11857. align-items: baseline;
  11858. }
  11859. .npc .npc-sheet .labelled-field label {
  11860. flex: 1;
  11861. font-weight: bold;
  11862. }
  11863. .npc .npc-sheet .labelled-field input[type=text],
  11864. .npc .npc-sheet .labelled-field input[type=number] {
  11865. flex: 0;
  11866. font-weight: normal;
  11867. margin: 1px 4px;
  11868. margin-left: auto;
  11869. min-width: 2.5em;
  11870. padding-right: 1px;
  11871. text-align: right;
  11872. }
  11873. .npc .npc-sheet .labelled-field.hp-temp > label {
  11874. margin-right: 0.5em;
  11875. }
  11876. .npc .npc-sheet .top-sections {
  11877. display: flex;
  11878. flex-direction: row;
  11879. justify-content: flex-start;
  11880. align-items: flex-start;
  11881. }
  11882. .npc .npc-sheet .top-sections .skills {
  11883. flex: 3;
  11884. align-self: stretch;
  11885. }
  11886. .npc .npc-sheet .top-sections .senses {
  11887. flex: 2;
  11888. }
  11889. .npc .npc-sheet .top-sections .senses .perception {
  11890. width: 100%;
  11891. }
  11892. .npc .npc-sheet .top-sections .senses .perception label {
  11893. flex-basis: 5em;
  11894. }
  11895. .npc .npc-sheet .top-sections .senses .perception input {
  11896. flex: 0 0 24px;
  11897. z-index: 1;
  11898. }
  11899. .npc .npc-sheet .top-sections .ability-scores {
  11900. flex: 2;
  11901. flex-direction: column;
  11902. }
  11903. .npc .npc-sheet .top-sections .ability-scores .list {
  11904. display: grid;
  11905. padding-left: 0.75em;
  11906. grid-template-columns: repeat(3, minmax(0, 1fr));
  11907. }
  11908. .npc .npc-sheet .top-sections .ability-scores .list input {
  11909. flex: 0 0 24px;
  11910. margin-right: 1em;
  11911. z-index: 1;
  11912. }
  11913. .npc .npc-sheet .section-container {
  11914. padding: 4px 6px 0;
  11915. }
  11916. .npc .npc-sheet .section-container .section-body {
  11917. padding: 4px;
  11918. }
  11919. .npc .npc-sheet .section-container.headerless .section-body {
  11920. border-radius: 3px;
  11921. }
  11922. .npc .npc-sheet .section-container.skills > .section-body .list {
  11923. display: flex;
  11924. flex-direction: row;
  11925. flex-wrap: wrap;
  11926. }
  11927. .npc .npc-sheet .section-container.recall-knowledge .section-header {
  11928. align-items: center;
  11929. }
  11930. .npc .npc-sheet .section-container.recall-knowledge .section-header .breakdown {
  11931. width: auto;
  11932. cursor: pointer;
  11933. font-size: var(--font-size-9);
  11934. line-height: 15px;
  11935. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  11936. background: #171f69;
  11937. color: #f5efe0;
  11938. font-family: var(--sans-serif);
  11939. text-transform: uppercase;
  11940. border-radius: 3px;
  11941. border: none;
  11942. padding: 2px 4px 0;
  11943. }
  11944. .npc .npc-sheet .section-container.recall-knowledge .section-header .breakdown:hover {
  11945. box-shadow: none;
  11946. text-shadow: 0 0 2px white;
  11947. }
  11948. .npc .npc-sheet .section-container.languages {
  11949. flex: 1;
  11950. }
  11951. .npc .npc-sheet .tag {
  11952. line-height: 0.8rem;
  11953. }
  11954. .npc .npc-sheet select {
  11955. flex: auto 0 0;
  11956. padding: 4px !important;
  11957. height: auto !important;
  11958. font-family: var(--sans-serif);
  11959. font-weight: 500;
  11960. text-transform: uppercase;
  11961. }
  11962. .npc .npc-sheet select option {
  11963. color: var(--text-light);
  11964. background-color: var(--alt);
  11965. }
  11966. .npc .npc-sheet .adjustment-select .adjustment.active {
  11967. background-color: #5e0000;
  11968. color: #f5efe0;
  11969. }
  11970. .npc .npc-sheet .adjustment-select .adjustment:not(.active) {
  11971. background-color: #7a7971;
  11972. color: #f5efe0;
  11973. }
  11974. .npc .npc-sheet .npc-body {
  11975. display: flex;
  11976. flex: auto;
  11977. flex-direction: column;
  11978. height: 100%;
  11979. width: 100%;
  11980. overflow-y: hidden;
  11981. }
  11982. .npc .npc-sheet .notes {
  11983. padding-right: 15px;
  11984. }
  11985. .npc .npc-sheet .notes.active {
  11986. display: flex;
  11987. flex-direction: column;
  11988. }
  11989. .npc .npc-sheet .notes .details-label {
  11990. padding: 4px;
  11991. font-family: var(--sans-serif);
  11992. font-size: var(--font-size-10);
  11993. font-weight: 800;
  11994. line-height: 1;
  11995. text-transform: uppercase;
  11996. color: var(--primary);
  11997. margin-right: 2px;
  11998. white-space: nowrap;
  11999. }
  12000. .npc .npc-sheet .notes .notes-section {
  12001. flex: 1 0 auto;
  12002. display: flex;
  12003. flex-direction: column;
  12004. }
  12005. .npc .npc-sheet .notes .notes-text {
  12006. margin-left: 8px;
  12007. padding: 4px;
  12008. color: #333;
  12009. flex-grow: 1;
  12010. }
  12011. .npc .npc-sheet .notes .notes-text .editor {
  12012. height: 100%;
  12013. }
  12014. .npc .npc-sheet .notes .notes-text .editor .editor-edit {
  12015. background: var(--primary);
  12016. color: white;
  12017. }
  12018. .npc .npc-sheet .notes .notes-text .editor .editor-content {
  12019. min-height: 75px;
  12020. height: 100%;
  12021. }
  12022. .npc .npc-sheet .notes .source {
  12023. flex-shrink: 0;
  12024. }
  12025. .npc .npc-sheet .notes .source .section-body {
  12026. border-width: 2px;
  12027. }
  12028. .npc .npc-sheet .notes .source label {
  12029. margin-right: 4px;
  12030. flex: 0;
  12031. font-weight: 700;
  12032. }
  12033. .npc .npc-sheet .notes .source .source-input {
  12034. flex: 2;
  12035. }
  12036. .npc .npc-sheet.dead .profile {
  12037. background-size: cover;
  12038. background-color: #dbd9cd;
  12039. box-sizing: border-box;
  12040. border: 1px solid black;
  12041. border-radius: 2px;
  12042. }
  12043. .npc .npc-sheet.dead .profile > img {
  12044. border: none;
  12045. width: 100%;
  12046. opacity: 0.33;
  12047. }
  12048. .npc .npc-sheet.dead h2.name {
  12049. margin-top: 3px;
  12050. text-align: center;
  12051. border-bottom: none;
  12052. }
  12053. .sheet.actor.loot .inventory .inventory-list {
  12054. overflow: hidden scroll;
  12055. scrollbar-width: thin;
  12056. scrollbar-color: var(--primary) transparent;
  12057. height: 100%;
  12058. margin-bottom: 2px;
  12059. }
  12060. .sheet.actor.loot .inventory .inventory-list .item-name h4 {
  12061. flex: 2;
  12062. margin: 0;
  12063. }
  12064. .sheet.actor.loot .inventory .inventory-list .item-name .prepared {
  12065. margin-left: 3px;
  12066. font-size: var(--font-size-10);
  12067. }
  12068. .sheet.actor.loot .inventory .inventory-list .item-sell-value,
  12069. .sheet.actor.loot .inventory .inventory-list .item-quantity,
  12070. .sheet.actor.loot .inventory .inventory-list .item-weight {
  12071. border-left: 1px solid var(--secondary-background);
  12072. color: #666;
  12073. }
  12074. .sheet.actor.loot .inventory .inventory-list .item-controls {
  12075. flex: 0 0 70px;
  12076. border-left: 1px solid var(--secondary-background);
  12077. }
  12078. .sheet.actor.loot .inventory .inventory-list .inventory-header {
  12079. font-weight: 700;
  12080. background: var(--primary-background);
  12081. margin: 0;
  12082. padding: 0;
  12083. border-bottom: 1px solid var(--secondary-background);
  12084. }
  12085. .sheet.actor.loot .inventory .inventory-list .inventory-header .item-name,
  12086. .sheet.actor.loot .inventory .inventory-list .inventory-header .item-sell-value,
  12087. .sheet.actor.loot .inventory .inventory-list .inventory-header .item-quantity,
  12088. .sheet.actor.loot .inventory .inventory-list .inventory-header .item-weight,
  12089. .sheet.actor.loot .inventory .inventory-list .inventory-header .item-controls {
  12090. line-height: 1.8em;
  12091. color: white;
  12092. height: 100%;
  12093. }
  12094. .sheet.actor.loot .inventory .inventory-list .inventory-header .item-name {
  12095. margin: 0;
  12096. font-weight: bold;
  12097. flex: 1;
  12098. }
  12099. .sheet.actor.loot .inventory .inventory-list .inventory-header .item-controls {
  12100. color: white;
  12101. }
  12102. .sheet.actor.loot .inventory .inventory-list li {
  12103. padding: 0;
  12104. border-bottom: 1px solid var(--secondary-background);
  12105. }
  12106. .sheet.actor.loot .inventory .inventory-list .item {
  12107. line-height: 1.8em;
  12108. }
  12109. .sheet.actor.loot .inventory .inventory-list .item .item-controls a {
  12110. font-size: var(--font-size-10);
  12111. color: #666;
  12112. }
  12113. .sheet.actor.loot .inventory-list .item .item-controls a.item-toggle-equip,
  12114. .sheet.actor.loot .pf2e.actor .item.action-header .item-controls a.item-toggle-equip {
  12115. display: none;
  12116. }
  12117. .sheet.actor.loot form {
  12118. display: flex;
  12119. flex-direction: row;
  12120. height: 100%;
  12121. }
  12122. .sheet.actor.loot section.sidebar {
  12123. display: flex;
  12124. flex-direction: column;
  12125. width: 200px;
  12126. height: 100%;
  12127. border-right: 1px solid #888;
  12128. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  12129. }
  12130. .sheet.actor.loot section.sidebar > * {
  12131. flex: 0;
  12132. }
  12133. .sheet.actor.loot section.sidebar .image-container {
  12134. display: flex;
  12135. }
  12136. .sheet.actor.loot section.sidebar .image-container > img.actor-image {
  12137. flex: none;
  12138. border: none;
  12139. border-bottom: 1px solid #888;
  12140. }
  12141. .sheet.actor.loot section.sidebar .image-container [data-action=show-image] {
  12142. bottom: 3px;
  12143. right: 2px;
  12144. }
  12145. .sheet.actor.loot section.sidebar .gm-settings, .sheet.actor.loot section.sidebar .sidebar-meta {
  12146. display: flex;
  12147. flex-direction: column;
  12148. padding: 0.25rem;
  12149. }
  12150. .sheet.actor.loot section.sidebar .gm-settings {
  12151. border-bottom: 1px solid #888;
  12152. }
  12153. .sheet.actor.loot section.sidebar .gm-settings .loot-distribution {
  12154. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  12155. background-color: var(--tertiary);
  12156. }
  12157. .sheet.actor.loot section.sidebar .gm-settings label {
  12158. display: flex;
  12159. align-items: center;
  12160. font-weight: bold;
  12161. }
  12162. .sheet.actor.loot section.sidebar .sidebar-meta {
  12163. border-top: 1px solid #888;
  12164. }
  12165. .sheet.actor.loot section.sidebar .hidden-when-empty, .sheet.actor.loot section.sidebar .bulk {
  12166. align-self: end;
  12167. }
  12168. .sheet.actor.loot section.sidebar .bulk {
  12169. line-height: 1.5em;
  12170. margin-right: 8px;
  12171. }
  12172. .sheet.actor.loot section.sidebar > .editor, .sheet.actor.loot section.sidebar .description {
  12173. flex-basis: auto;
  12174. min-height: 40px;
  12175. flex: 1;
  12176. }
  12177. .sheet.actor.loot section.sidebar > .editor > .tox-tinymce .tox-edit-area {
  12178. min-height: 120px;
  12179. }
  12180. .sheet.actor.loot section.sidebar .description, .sheet.actor.loot section.sidebar .editor-content {
  12181. padding: 0.25rem;
  12182. overflow: hidden scroll;
  12183. scrollbar-width: thin;
  12184. scrollbar-color: var(--primary) transparent;
  12185. }
  12186. .sheet.actor.loot section.content {
  12187. display: flex;
  12188. flex-direction: column;
  12189. flex: 1;
  12190. height: 100%;
  12191. }
  12192. .sheet.actor.loot .sheet-header {
  12193. display: flex;
  12194. flex-direction: row;
  12195. align-items: center;
  12196. gap: 0.2rem;
  12197. padding-top: 0.25rem;
  12198. border-bottom: 1px solid #888;
  12199. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  12200. }
  12201. .sheet.actor.loot .sheet-header h1 {
  12202. margin: 0;
  12203. border: none;
  12204. flex: 1;
  12205. padding-left: 0.5rem;
  12206. }
  12207. .sheet.actor.loot .sheet-header h1 > input {
  12208. height: 40px;
  12209. width: 100%;
  12210. margin: 2px;
  12211. border: none;
  12212. }
  12213. .sheet.actor.loot .sheet-header h1, .sheet.actor.loot .sheet-header input {
  12214. font-family: var(--serif-condensed);
  12215. font-size: var(--font-size-36);
  12216. font-weight: 700;
  12217. }
  12218. .sheet.actor.loot .sheet-header .sheet-type i.fas {
  12219. padding: 0 2px;
  12220. }
  12221. .sheet.actor.loot .sheet-header .traits-bar {
  12222. flex: 0 0 auto;
  12223. margin-left: auto;
  12224. align-self: center;
  12225. font-size: var(--font-size-16);
  12226. margin-right: 0.5em;
  12227. }
  12228. .sheet.actor.loot .sheet-header .traits-bar > .trait {
  12229. padding: 0.1em 0.4em;
  12230. height: unset;
  12231. }
  12232. .sheet.actor.loot .sheet-header .traits-bar > .trait option {
  12233. background-color: #5e0000;
  12234. color: white;
  12235. }
  12236. .sheet.actor.loot .sheet-header .currency {
  12237. margin-bottom: 8px;
  12238. }
  12239. .sheet.actor.loot .sheet-body {
  12240. padding: 0.5rem;
  12241. overflow: hidden scroll;
  12242. scrollbar-width: thin;
  12243. scrollbar-color: var(--primary) transparent;
  12244. }
  12245. .loot-actor-popup .confirm-button {
  12246. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  12247. width: calc(100% - 6px);
  12248. background-color: var(--tertiary);
  12249. }
  12250. .loot-actor-popup .checkboxes label {
  12251. display: block;
  12252. padding-right: 10px;
  12253. padding-left: 22px;
  12254. text-indent: -22px;
  12255. }
  12256. .loot-actor-popup .checkboxes input {
  12257. vertical-align: middle;
  12258. }
  12259. .loot-actor-popup .checkboxes label span {
  12260. vertical-align: middle;
  12261. }
  12262. .sheet.party {
  12263. /** White background navigation with little decorations on the left and right */
  12264. }
  12265. .sheet.party form {
  12266. display: flex;
  12267. flex-direction: column;
  12268. height: 100%;
  12269. background: url("../assets/sheet/background.webp");
  12270. background-repeat: no-repeat;
  12271. background-size: cover;
  12272. background-attachment: local;
  12273. }
  12274. .sheet.party form > header {
  12275. background: url("../assets/sheet/header-bw.webp"), url("../assets/sheet/background.webp");
  12276. background-repeat: repeat-x, no-repeat;
  12277. background-size: cover;
  12278. background-color: #2f9d50;
  12279. background-blend-mode: multiply;
  12280. color: white;
  12281. width: 100%;
  12282. font-family: var(--sans-serif);
  12283. text-transform: uppercase;
  12284. font-weight: 600;
  12285. display: flex;
  12286. justify-content: space-between;
  12287. align-items: center;
  12288. padding: 0 0.75rem;
  12289. gap: 8px;
  12290. box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  12291. }
  12292. .sheet.party form > header .frame-container {
  12293. flex: 0 0 60px;
  12294. padding: 4px;
  12295. margin: 0.75rem 0;
  12296. }
  12297. .sheet.party form > header .frame-container .frame {
  12298. position: relative;
  12299. width: 2.5rem;
  12300. height: 2.5rem;
  12301. }
  12302. .sheet.party form > header .frame-container .player-image {
  12303. object-fit: cover;
  12304. object-position: top;
  12305. border: none;
  12306. border-radius: 0;
  12307. width: 100%;
  12308. cursor: pointer;
  12309. border: none;
  12310. 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;
  12311. }
  12312. .sheet.party form > header .details {
  12313. margin: 4px 0;
  12314. flex: 1;
  12315. }
  12316. .sheet.party form > header input[type=text], .sheet.party form > header input[type=number] {
  12317. color: white;
  12318. border: none;
  12319. border-bottom: 1px solid transparent;
  12320. }
  12321. .sheet.party form > header input[type=text]:hover, .sheet.party form > header input[type=text]:focus, .sheet.party form > header input[type=number]:hover, .sheet.party form > header input[type=number]:focus {
  12322. border: none;
  12323. border-bottom: 1px solid var(--text-light);
  12324. box-shadow: none;
  12325. }
  12326. .sheet.party form > header .title {
  12327. display: flex;
  12328. flex-direction: row;
  12329. align-items: baseline;
  12330. gap: 4px;
  12331. font-size: var(--font-size-28);
  12332. font-family: var(--serif-condensed);
  12333. font-weight: 700;
  12334. }
  12335. .sheet.party form > header .title .name {
  12336. flex: 1;
  12337. font-size: var(--font-size-32);
  12338. }
  12339. .sheet.party nav.sheet-navigation {
  12340. display: inline-flex;
  12341. justify-content: center;
  12342. align-items: center;
  12343. height: 20px;
  12344. background: var(--secondary);
  12345. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  12346. transition: all 0.1s ease-out;
  12347. box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
  12348. border-top: 1px solid rgba(255, 255, 255, 0.1);
  12349. border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  12350. position: relative;
  12351. }
  12352. .sheet.party nav.sheet-navigation .navigation-title {
  12353. color: var(--text-light);
  12354. margin-right: auto;
  12355. padding-left: 1em;
  12356. white-space: nowrap;
  12357. width: 7em;
  12358. }
  12359. .sheet.party nav.sheet-navigation > a {
  12360. display: flex;
  12361. justify-content: center;
  12362. align-items: center;
  12363. margin: 0 6px;
  12364. font-size: var(--font-size-12);
  12365. }
  12366. .sheet.party nav.sheet-navigation .item {
  12367. height: 24px;
  12368. width: 24px;
  12369. border-radius: 50%;
  12370. z-index: 1;
  12371. transition: all 0.1s ease-out;
  12372. color: var(--tertiary);
  12373. fill: var(--tertiary);
  12374. background-image: url("../assets/sheet/nav-item-inactive.webp");
  12375. background-size: contain;
  12376. /* prettier-ignore */
  12377. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px #9f725b, inset 0 0 4px rgba(0, 0, 0, 0.25);
  12378. }
  12379. .sheet.party nav.sheet-navigation .item.active {
  12380. 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);
  12381. }
  12382. .sheet.party nav.sheet-navigation .item:last-child {
  12383. margin-right: 10px;
  12384. }
  12385. .sheet.party nav.sheet-navigation .item:hover, .sheet.party nav.sheet-navigation .item.active {
  12386. z-index: 2;
  12387. transform: scale(1.2);
  12388. color: var(--text-light);
  12389. fill: var(--text-light);
  12390. background-image: url("../assets/sheet/nav-item.webp");
  12391. }
  12392. .sheet.party nav.sheet-navigation .item .fas {
  12393. padding-bottom: 0;
  12394. }
  12395. .sheet.party nav.sheet-navigation .item:hover .pfs-icon {
  12396. filter: drop-shadow(0 0 8px var(--color-shadow-primary));
  12397. }
  12398. .sheet.party nav.sheet-navigation .item .action-icon {
  12399. align-self: baseline;
  12400. display: inline-block;
  12401. font-family: Pathfinder2eActions;
  12402. font-size: 1.4rem;
  12403. line-height: 1;
  12404. max-height: 0.75rem;
  12405. }
  12406. .sheet.party nav.sub-nav {
  12407. margin: 0;
  12408. padding: 0;
  12409. display: flex;
  12410. flex-wrap: nowrap;
  12411. justify-content: center;
  12412. align-items: center;
  12413. list-style: none;
  12414. background-color: var(--bg);
  12415. box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  12416. width: 100%;
  12417. flex: 0 0 44px;
  12418. }
  12419. .sheet.party nav.sub-nav::before, .sheet.party nav.sub-nav::after {
  12420. content: "";
  12421. width: 37px;
  12422. height: 16px;
  12423. background: url("../assets/sheet/sub-nav-decoration.webp");
  12424. margin: 0 16px;
  12425. }
  12426. .sheet.party nav.sub-nav::after {
  12427. transform: scaleX(-100%);
  12428. }
  12429. .sheet.party nav.sub-nav a, .sheet.party nav.sub-nav .tab {
  12430. border-left: 1px solid rgba(255, 255, 255, 0.3);
  12431. border-right: 1px solid rgba(0, 0, 0, 0.2);
  12432. color: var(--alt);
  12433. cursor: pointer;
  12434. display: block;
  12435. font: 400 var(--font-size-16) var(--serif);
  12436. flex: 1;
  12437. margin: 0 0.25rem;
  12438. max-width: 30%;
  12439. text-align: center;
  12440. text-decoration: none;
  12441. transition: all 0.1s ease-out;
  12442. }
  12443. .sheet.party nav.sub-nav a.active, .sheet.party nav.sub-nav .tab.active {
  12444. color: var(--primary);
  12445. font-weight: 600;
  12446. }
  12447. .sheet.party nav.sub-nav a:first-child, .sheet.party nav.sub-nav .tab:first-child {
  12448. border-left: none;
  12449. }
  12450. .sheet.party nav.sub-nav a:last-child, .sheet.party nav.sub-nav .tab:last-child {
  12451. border-right: none;
  12452. }
  12453. .sheet.party nav.sub-nav a:hover, .sheet.party nav.sub-nav .tab:hover {
  12454. text-shadow: 0 0 3px rgba(255, 255, 255, 0.5);
  12455. }
  12456. .sheet.party .tab nav.sub-nav {
  12457. padding-right: 20px;
  12458. }
  12459. .sheet.party .actor-link {
  12460. cursor: pointer;
  12461. }
  12462. .sheet.party .container {
  12463. height: 100%;
  12464. overflow: hidden;
  12465. }
  12466. .sheet.party .content {
  12467. overflow: hidden scroll;
  12468. scrollbar-width: thin;
  12469. scrollbar-color: var(--primary) transparent;
  12470. flex: 1;
  12471. }
  12472. .sheet.party .tab.active {
  12473. display: flex;
  12474. height: 100%;
  12475. }
  12476. .sheet.party .item-list.directory-list {
  12477. gap: 0.2em;
  12478. margin: 0;
  12479. padding: 0;
  12480. display: flex;
  12481. flex-direction: column;
  12482. width: 100%;
  12483. }
  12484. .sheet.party .item-list.directory-list .item {
  12485. display: flex;
  12486. flex-wrap: wrap;
  12487. align-items: center;
  12488. justify-content: space-between;
  12489. padding: 2px 4px 2px 12px;
  12490. width: 100%;
  12491. }
  12492. .sheet.party .item-list.directory-list .item p:empty {
  12493. display: none;
  12494. }
  12495. .sheet.party .item-list.directory-list .item .item-name {
  12496. display: flex;
  12497. align-items: center;
  12498. flex: 1;
  12499. }
  12500. .sheet.party .item-list.directory-list .item .item-name h4 {
  12501. cursor: pointer;
  12502. margin: 0;
  12503. }
  12504. .sheet.party .item-list.directory-list .item .item-name .item-image {
  12505. margin-right: 8px;
  12506. }
  12507. .sheet.party .item-list.directory-list .item .item-controls {
  12508. white-space: nowrap;
  12509. font-size: var(--font-size-12);
  12510. }
  12511. .sheet.party .item-list.directory-list .item .item-controls a.info-only:hover {
  12512. cursor: default;
  12513. text-shadow: none;
  12514. }
  12515. .sheet.party .item-list.directory-list .item .item-controls a + a {
  12516. margin-left: 4px;
  12517. }
  12518. .sheet.party .item-list.directory-list .item .item-summary {
  12519. flex-basis: 100%;
  12520. }
  12521. .sheet.party .item-list.directory-list .item .item-summary .title,
  12522. .sheet.party .item-list.directory-list .item .item-summary .framing {
  12523. color: var(--primary);
  12524. margin: 0;
  12525. padding: 0;
  12526. margin-top: 1em;
  12527. }
  12528. .sheet.party .item-list.directory-list .item .item-summary .framing {
  12529. color: var(--secondary);
  12530. margin: 1em 0 0.25em;
  12531. }
  12532. .sheet.party .item-list.directory-list .item .item-summary .framing strong {
  12533. font-weight: 500;
  12534. }
  12535. .sheet.party .item-list.directory-list .item .item-summary .framing + p {
  12536. margin-top: 0;
  12537. }
  12538. .sheet.party .item-list.directory-list .item .item-summary img {
  12539. border: none;
  12540. vertical-align: middle;
  12541. }
  12542. .sheet.party .item-list.directory-list .item .item-summary img.actionlight {
  12543. background: var(--alt);
  12544. vertical-align: middle;
  12545. border: 1px solid var(--body);
  12546. }
  12547. .sheet.party .item-list.directory-list .item .item-summary .item-properties .tag.toggled-on:hover, .sheet.party .item-list.directory-list .item .item-summary .item-properties .tag.toggled-off:hover {
  12548. box-shadow: none;
  12549. text-shadow: 0 0 2px white;
  12550. }
  12551. .sheet.party .item-list.directory-list .item .item-summary .item-properties .tag.toggled-on, .sheet.party .item-list.directory-list .item .item-summary .item-properties .tag.toggled-off {
  12552. cursor: pointer;
  12553. }
  12554. .sheet.party .item-list.directory-list .item .item-summary .item-properties .tag.toggled-on {
  12555. background-color: rgba(23, 31, 105, 0.5);
  12556. color: black;
  12557. text-shadow: 0 0 2px white;
  12558. }
  12559. .sheet.party .item-list.directory-list .item.unidentified {
  12560. border-radius: 1px;
  12561. outline: 1px dotted rgba(75, 74, 68, 0.5);
  12562. background: var(--visibility-gm-bg);
  12563. }
  12564. .sheet.party .item-list.directory-list .item .button-group {
  12565. display: flex;
  12566. justify-content: flex-end;
  12567. align-items: center;
  12568. flex-wrap: nowrap;
  12569. width: 50%;
  12570. flex: 0;
  12571. }
  12572. .sheet.party .item-list.directory-list .item .button-group button {
  12573. margin: 0;
  12574. border: none;
  12575. cursor: pointer;
  12576. font-family: var(--sans-serif);
  12577. font-size: var(--font-size-10);
  12578. text-transform: uppercase;
  12579. letter-spacing: 0.05em;
  12580. text-rendering: optimizeLegibility;
  12581. padding: 5px;
  12582. color: white;
  12583. width: 70px;
  12584. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
  12585. background: var(--secondary);
  12586. border-radius: 2px;
  12587. flex: 0;
  12588. white-space: nowrap;
  12589. margin-left: 4px;
  12590. flex: 0;
  12591. }
  12592. .sheet.party .item-list.directory-list .item .button-group button:hover {
  12593. box-shadow: none;
  12594. text-shadow: 0 0 2px white;
  12595. }
  12596. .sheet.party .item-list.directory-list .item {
  12597. margin: 2px 0;
  12598. border: solid transparent;
  12599. border-width: 0 0 1px;
  12600. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  12601. }
  12602. .sheet.party .item-list.directory-list .item .item-summary {
  12603. margin-top: 8px;
  12604. }
  12605. .sheet.party .sidebar {
  12606. overflow: hidden scroll;
  12607. scrollbar-width: thin;
  12608. scrollbar-color: var(--primary) transparent;
  12609. border-right: 1px solid #888;
  12610. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  12611. display: flex;
  12612. flex-direction: column;
  12613. gap: 8px;
  12614. height: 100%;
  12615. padding: 0.5rem;
  12616. width: 13.5rem;
  12617. }
  12618. .sheet.party .sidebar .box {
  12619. border: 1px solid rgba(0, 0, 0, 0.28);
  12620. filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.18));
  12621. font-family: var(--sans-serif);
  12622. border-radius: 3px;
  12623. font-size: var(--font-size-12);
  12624. }
  12625. .sheet.party .sidebar .box header, .sheet.party .sidebar .box footer {
  12626. margin: -1px;
  12627. padding: 0.25rem;
  12628. }
  12629. .sheet.party .sidebar .box header {
  12630. background-color: var(--sub);
  12631. border-radius: 3px 3px 0 0;
  12632. color: white;
  12633. font-weight: 700;
  12634. }
  12635. .sheet.party .sidebar .box footer {
  12636. background-color: var(--bg-dark);
  12637. border-radius: 0 0 3px 3px;
  12638. color: var(--sub);
  12639. border: 1px solid rgba(0, 0, 0, 0.28);
  12640. border-top: none;
  12641. }
  12642. .sheet.party .tag-light {
  12643. --tag-color: #424242;
  12644. border: 1px solid var(--tag-color);
  12645. border-radius: 2px;
  12646. color: var(--tag-color);
  12647. padding: 0 4px 0.1em 4px;
  12648. height: 1.25rem;
  12649. white-space: nowrap;
  12650. font-size: var(--font-size-13);
  12651. font-variant: all-small-caps;
  12652. font-weight: 500;
  12653. display: flex;
  12654. align-items: center;
  12655. }
  12656. .sheet.party [data-tab=inventory] .inventory-members {
  12657. display: flex;
  12658. color: var(--alt-dark);
  12659. flex-direction: column;
  12660. font-family: var(--sans-serif);
  12661. padding: 0;
  12662. margin: 0;
  12663. gap: 0.5rem;
  12664. }
  12665. .sheet.party [data-tab=inventory] .inventory-members .box .summary-data > div {
  12666. align-items: center;
  12667. display: flex;
  12668. margin: 0.5rem 0.25rem 0.5rem 0.5rem;
  12669. }
  12670. .sheet.party [data-tab=inventory] .inventory-members .box .summary-data > div label {
  12671. flex: 1;
  12672. font-weight: 600;
  12673. }
  12674. .sheet.party [data-tab=inventory] .inventory-members .box .actor-link {
  12675. align-items: center;
  12676. display: grid;
  12677. grid-template-areas: "image name " "image value";
  12678. grid-template-columns: auto 1fr;
  12679. padding: 0.5rem;
  12680. overflow: hidden;
  12681. }
  12682. .sheet.party [data-tab=inventory] .inventory-members .box .actor-link img {
  12683. border: none;
  12684. grid-area: image;
  12685. width: 2rem;
  12686. height: 2rem;
  12687. margin-right: 0.4rem;
  12688. object-fit: contain;
  12689. }
  12690. .sheet.party [data-tab=inventory] .inventory-members .box .actor-link .name {
  12691. grid-area: name;
  12692. font-weight: 700;
  12693. overflow: hidden;
  12694. text-overflow: ellipsis;
  12695. white-space: nowrap;
  12696. }
  12697. .sheet.party [data-tab=inventory] .inventory-members .box .actor-link .value {
  12698. grid-area: value;
  12699. }
  12700. .sheet.party [data-tab=inventory] .inventory-members .box .inventory-data {
  12701. display: flex;
  12702. gap: 0.25rem;
  12703. padding: 2px 3px;
  12704. font-size: var(--font-size-12);
  12705. }
  12706. .sheet.party [data-tab=inventory] .inventory {
  12707. overflow: hidden scroll;
  12708. scrollbar-width: thin;
  12709. scrollbar-color: var(--primary) transparent;
  12710. flex: 1;
  12711. padding: 0 4px;
  12712. display: flex;
  12713. flex-direction: column;
  12714. height: 100%;
  12715. }
  12716. .sheet.party [data-tab=overview] .summary {
  12717. border-image-repeat: repeat;
  12718. border-image-slice: 11;
  12719. border-image-source: url("../assets/sheet/frame-elegant.svg");
  12720. border-image-width: 14px;
  12721. border-style: double;
  12722. padding: 0.5rem;
  12723. margin: 16px 16px 8px 16px;
  12724. }
  12725. .sheet.party [data-tab=overview] .summary label {
  12726. color: var(--alt-dark);
  12727. font-family: var(--serif);
  12728. font-weight: 500;
  12729. line-height: 1em;
  12730. }
  12731. .sheet.party [data-tab=overview] .summary .tags {
  12732. margin: 0;
  12733. }
  12734. .sheet.party [data-tab=overview] .member-breakdown {
  12735. display: flex;
  12736. flex-direction: row;
  12737. font-family: var(--sans-serif);
  12738. padding: 0.5rem 16px;
  12739. position: relative;
  12740. }
  12741. .sheet.party [data-tab=overview] .member-breakdown:not(:last-child):after {
  12742. content: "";
  12743. background-color: rgba(68, 55, 48, 0.1);
  12744. width: 100%;
  12745. height: 1px;
  12746. position: absolute;
  12747. bottom: 0;
  12748. }
  12749. .sheet.party [data-tab=overview] .member-breakdown .member-image {
  12750. position: relative;
  12751. min-width: 5.75rem;
  12752. height: 5.75rem;
  12753. margin-right: 8px;
  12754. }
  12755. .sheet.party [data-tab=overview] .member-breakdown .member-image img {
  12756. position: absolute;
  12757. border: none;
  12758. height: 100%;
  12759. width: 100%;
  12760. object-fit: contain;
  12761. }
  12762. .sheet.party [data-tab=overview] .member-breakdown .member-image .ac {
  12763. position: absolute;
  12764. left: 0;
  12765. right: 0;
  12766. bottom: -0.5rem;
  12767. margin-left: auto;
  12768. margin-right: auto;
  12769. font-weight: 600;
  12770. display: flex;
  12771. flex-direction: column;
  12772. align-items: center;
  12773. justify-content: end;
  12774. width: 2.5rem;
  12775. height: 2.8rem;
  12776. padding-bottom: 0.55rem;
  12777. filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.4)) drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
  12778. }
  12779. .sheet.party [data-tab=overview] .member-breakdown .member-image .ac::before, .sheet.party [data-tab=overview] .member-breakdown .member-image .ac::after {
  12780. content: "";
  12781. background: url("../assets/sheet/accent-decoration.webp");
  12782. position: absolute;
  12783. right: 50%;
  12784. bottom: 0.15rem;
  12785. width: 2.85rem;
  12786. height: 1.254rem;
  12787. }
  12788. .sheet.party [data-tab=overview] .member-breakdown .member-image .ac:after {
  12789. transform: scaleX(-1);
  12790. transform-origin: right center;
  12791. }
  12792. .sheet.party [data-tab=overview] .member-breakdown .member-image .ac .shield, .sheet.party [data-tab=overview] .member-breakdown .member-image .ac label, .sheet.party [data-tab=overview] .member-breakdown .member-image .ac .value {
  12793. z-index: 1;
  12794. }
  12795. .sheet.party [data-tab=overview] .member-breakdown .member-image .ac .shield {
  12796. position: absolute;
  12797. inset: 0;
  12798. background: url("../assets/sheet/shield-blue.webp") no-repeat center bottom;
  12799. background-size: contain;
  12800. }
  12801. .sheet.party [data-tab=overview] .member-breakdown .member-image .ac label {
  12802. color: var(--tertiary-dark);
  12803. font-size: var(--font-size-12);
  12804. font-variant: all-small-caps;
  12805. line-height: 1em;
  12806. }
  12807. .sheet.party [data-tab=overview] .member-breakdown .member-image .ac .value {
  12808. color: white;
  12809. font-size: var(--font-size-18);
  12810. line-height: 1em;
  12811. }
  12812. .sheet.party [data-tab=overview] .member-breakdown .member-data {
  12813. display: flex;
  12814. border-left: 1px solid #C9BFA9;
  12815. flex-direction: column;
  12816. min-height: 100%;
  12817. padding-left: 8px;
  12818. flex: 1;
  12819. }
  12820. .sheet.party [data-tab=overview] .member-breakdown .name {
  12821. align-items: center;
  12822. display: flex;
  12823. font-family: var(--serif);
  12824. font-size: var(--font-size-20);
  12825. font-weight: 600;
  12826. line-height: 1em;
  12827. }
  12828. .sheet.party [data-tab=overview] .member-breakdown .name .hero-points {
  12829. display: flex;
  12830. flex: 1;
  12831. align-items: center;
  12832. justify-content: flex-end;
  12833. gap: 2px;
  12834. }
  12835. .sheet.party [data-tab=overview] .member-breakdown .name .hero-points .empty {
  12836. border: 2px dashed rgba(0, 0, 0, 0.5);
  12837. border-radius: 50%;
  12838. width: 1.2rem;
  12839. height: 1.2rem;
  12840. }
  12841. .sheet.party [data-tab=overview] .member-breakdown .name .hero-points img {
  12842. border: none;
  12843. width: 1.2rem;
  12844. height: 1.2rem;
  12845. }
  12846. .sheet.party [data-tab=overview] .member-breakdown .main-stats {
  12847. display: flex;
  12848. gap: 0.5rem;
  12849. margin-bottom: 0.25rem;
  12850. }
  12851. .sheet.party [data-tab=overview] .member-breakdown .main-stats > div {
  12852. border: 1px solid rgba(0, 0, 0, 0.28);
  12853. border-radius: 2px;
  12854. height: 2.6rem;
  12855. display: flex;
  12856. align-items: center;
  12857. justify-content: space-between;
  12858. flex: 1 1 0;
  12859. }
  12860. .sheet.party [data-tab=overview] .member-breakdown .main-stats .score {
  12861. display: flex;
  12862. flex-direction: column;
  12863. align-items: center;
  12864. justify-content: center;
  12865. font-size: var(--font-size-18);
  12866. }
  12867. .sheet.party [data-tab=overview] .member-breakdown .main-stats .score label {
  12868. font-size: var(--font-size-10);
  12869. font-weight: 500;
  12870. }
  12871. .sheet.party [data-tab=overview] .member-breakdown .main-stats .health-section {
  12872. flex: 1;
  12873. min-width: 9rem;
  12874. }
  12875. .sheet.party [data-tab=overview] .member-breakdown .main-stats .health {
  12876. padding-right: 0.5rem;
  12877. margin-right: 0.125rem;
  12878. justify-content: center;
  12879. gap: 0.5rem;
  12880. }
  12881. .sheet.party [data-tab=overview] .member-breakdown .main-stats .health .max {
  12882. font-weight: 500;
  12883. }
  12884. .sheet.party [data-tab=overview] .member-breakdown .main-stats .health .value, .sheet.party [data-tab=overview] .member-breakdown .main-stats .health .max {
  12885. display: inline-block;
  12886. font-variant-numeric: tabular-nums;
  12887. }
  12888. .sheet.party [data-tab=overview] .member-breakdown .main-stats .health .value {
  12889. text-align: end;
  12890. }
  12891. .sheet.party [data-tab=overview] .member-breakdown .main-stats .saving-throws {
  12892. flex: 0.85;
  12893. min-width: 5.5rem;
  12894. }
  12895. .sheet.party [data-tab=overview] .member-breakdown .main-stats .saving-throws .score {
  12896. flex: 1;
  12897. font-weight: 500;
  12898. }
  12899. .sheet.party [data-tab=overview] .member-breakdown .main-stats .senses {
  12900. flex: 1.4;
  12901. }
  12902. .sheet.party [data-tab=overview] .member-breakdown .main-stats .senses .value {
  12903. display: flex;
  12904. font-size: var(--font-size-12);
  12905. gap: 0.125rem;
  12906. align-items: center;
  12907. overflow: hidden;
  12908. }
  12909. .sheet.party [data-tab=overview] .member-breakdown .main-stats .senses [data-acuity=imprecise], .sheet.party [data-tab=overview] .member-breakdown .main-stats .senses [data-acuity=vague] {
  12910. border-style: dashed;
  12911. }
  12912. .sheet.party [data-tab=overview] .member-breakdown .main-stats .senses .blank {
  12913. font-size: var(--font-size-14);
  12914. }
  12915. .sheet.party [data-tab=overview] .member-breakdown .main-stats .ability-scores {
  12916. flex: 1.2;
  12917. }
  12918. .sheet.party [data-tab=overview] .member-breakdown .main-stats .ability-scores .ability-score-grid {
  12919. display: grid;
  12920. grid-template-columns: repeat(3, 1fr);
  12921. gap: 2px 8px;
  12922. padding: 8px;
  12923. width: 100%;
  12924. }
  12925. .sheet.party [data-tab=overview] .member-breakdown .main-stats .ability-scores .ability-score-grid .score {
  12926. flex-direction: row;
  12927. font-size: var(--font-size-12);
  12928. justify-content: space-between;
  12929. align-items: center;
  12930. }
  12931. .sheet.party [data-tab=overview] .member-breakdown .main-stats .ability-scores .ability-score-grid .score label {
  12932. font-size: var(--font-size-12);
  12933. font-weight: 600;
  12934. }
  12935. .sheet.party [data-tab=overview] .member-breakdown .main-stats .master {
  12936. flex: 1.15;
  12937. font-size: var(--font-size-16);
  12938. }
  12939. .sheet.party [data-tab=overview] .member-breakdown .skills {
  12940. display: flex;
  12941. flex-wrap: wrap;
  12942. gap: 0.25rem;
  12943. }
  12944. .sheet.party [data-tab=overview] .member-breakdown .skills .tag-light[data-rank="1"] {
  12945. --tag-color: #171f69;
  12946. }
  12947. .sheet.party [data-tab=overview] .member-breakdown .skills .tag-light[data-rank="2"] {
  12948. --tag-color: #3c005e;
  12949. }
  12950. .sheet.party [data-tab=overview] .member-breakdown .skills .tag-light[data-rank="3"] {
  12951. --tag-color: #664400;
  12952. }
  12953. .sheet.party [data-tab=overview] .member-breakdown .skills .tag-light[data-rank="4"] {
  12954. --tag-color: #5e0000;
  12955. }
  12956. .sheet.party [data-tab=overview] .member-breakdown .skills .perception {
  12957. color: white;
  12958. background-color: var(--tag-color);
  12959. }
  12960. .sheet.party [data-tab=orphaned] .item-list {
  12961. margin: 16px;
  12962. }
  12963. /* Mystification data revealed to GMs */
  12964. .gm-mystified-data {
  12965. opacity: 0.75;
  12966. }
  12967. #compendium-browser > section.window-content > .content-box, #license-viewer > section.window-content > .content-box {
  12968. flex: 1;
  12969. overflow: hidden;
  12970. height: inherit;
  12971. }
  12972. #compendium-browser > section.window-content > .content-box div[class^=slider-], #license-viewer > section.window-content > .content-box div[class^=slider-] {
  12973. height: 10px;
  12974. width: 80%;
  12975. border: 1px solid black;
  12976. }
  12977. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base {
  12978. background: #dddddd;
  12979. }
  12980. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle {
  12981. background: none;
  12982. border: none;
  12983. box-shadow: none;
  12984. color: white;
  12985. cursor: grab;
  12986. font-size: var(--font-size-16);
  12987. height: 14px;
  12988. right: -7px;
  12989. text-shadow: 0 0 4px black;
  12990. top: -4px;
  12991. width: 14px;
  12992. }
  12993. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle:active, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle:active {
  12994. cursor: grabbing;
  12995. }
  12996. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle.handle, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle.handle {
  12997. background: #c85019;
  12998. border-radius: 2px;
  12999. border: 1px solid black;
  13000. box-shadow: 1px 1px 4px black;
  13001. }
  13002. #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, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle::before, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle::after {
  13003. background: none;
  13004. }
  13005. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle .noUi-touch-area, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-origin .noUi-handle .noUi-touch-area {
  13006. cursor: pointer;
  13007. }
  13008. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-tooltip, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-tooltip {
  13009. display: none;
  13010. }
  13011. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-active .noUi-tooltip, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-active .noUi-tooltip {
  13012. display: block;
  13013. background-color: rgba(0, 0, 0, 0.9);
  13014. color: white;
  13015. line-height: 18px;
  13016. padding: 6px 14px;
  13017. }
  13018. #compendium-browser > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-connect.range_selected, #license-viewer > section.window-content > .content-box div[class^=slider-] .noUi-base .noUi-connect.range_selected {
  13019. background: rgba(255, 255, 240, 0.8);
  13020. }
  13021. #compendium-browser > section.window-content > .content-box > nav, #license-viewer > section.window-content > .content-box > nav {
  13022. border-style: solid;
  13023. border-image-outset: 0;
  13024. border-width: 9px;
  13025. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  13026. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  13027. flex: 0;
  13028. width: 100%;
  13029. display: inline-flex;
  13030. justify-content: space-evenly;
  13031. align-items: center;
  13032. background: var(--secondary);
  13033. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  13034. }
  13035. #compendium-browser > section.window-content > .content-box > nav > a, #license-viewer > section.window-content > .content-box > nav > a {
  13036. color: var(--sidebar-label);
  13037. padding: 4px 0;
  13038. font-family: var(--sans-serif);
  13039. font-size: var(--font-size-12);
  13040. position: relative;
  13041. }
  13042. #compendium-browser > section.window-content > .content-box > nav > a.active::after, #license-viewer > section.window-content > .content-box > nav > a.active::after {
  13043. bottom: -2px;
  13044. right: 39%;
  13045. position: absolute;
  13046. content: "";
  13047. width: 0;
  13048. height: 0;
  13049. border-left: 4px solid transparent;
  13050. border-right: 4px solid transparent;
  13051. border-top: 4px solid var(--sidebar-label);
  13052. }
  13053. #compendium-browser > section.window-content > .content-box .compendium-browser-settings, #license-viewer > section.window-content > .content-box .compendium-browser-settings {
  13054. height: 100%;
  13055. }
  13056. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form, #license-viewer > section.window-content > .content-box .compendium-browser-settings form {
  13057. display: flex;
  13058. height: 88%;
  13059. flex-direction: column;
  13060. margin-bottom: 10px;
  13061. }
  13062. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section, #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section {
  13063. border: 1px solid #bbb;
  13064. border-radius: 5px;
  13065. margin-top: 5px;
  13066. padding: 2px;
  13067. /* Checkbox */
  13068. }
  13069. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section h3, #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section h3 {
  13070. margin: 0;
  13071. cursor: pointer;
  13072. }
  13073. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section dt, #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section dt {
  13074. width: 10%;
  13075. }
  13076. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section dt > input[type=checkbox], #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section dt > input[type=checkbox] {
  13077. transform: none;
  13078. flex: none;
  13079. height: auto;
  13080. margin: 3px 3px;
  13081. }
  13082. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section dd, #license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section dd {
  13083. width: 88%;
  13084. }
  13085. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form dl, #license-viewer > section.window-content > .content-box .compendium-browser-settings form dl {
  13086. margin: 5px 0;
  13087. }
  13088. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form dt, #license-viewer > section.window-content > .content-box .compendium-browser-settings form dt {
  13089. display: inline-block;
  13090. width: 40%;
  13091. padding-left: 5px;
  13092. }
  13093. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form dd, #license-viewer > section.window-content > .content-box .compendium-browser-settings form dd {
  13094. display: inline-block;
  13095. width: 58%;
  13096. margin-left: 0;
  13097. }
  13098. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container, #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container {
  13099. overflow-y: auto;
  13100. display: flex;
  13101. flex-wrap: wrap;
  13102. }
  13103. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container .tab[data-tab].active, #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container .tab[data-tab].active {
  13104. display: flex;
  13105. flex-direction: row;
  13106. flex-wrap: wrap;
  13107. justify-content: center;
  13108. width: 100%;
  13109. }
  13110. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container .single-column, #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container .single-column {
  13111. width: 100%;
  13112. }
  13113. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container h2, #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container h2 {
  13114. margin-top: 1em;
  13115. margin-bottom: 0.5em;
  13116. width: 100%;
  13117. }
  13118. #compendium-browser > section.window-content > .content-box .compendium-browser-settings form .settings-container div, #license-viewer > section.window-content > .content-box .compendium-browser-settings form .settings-container div {
  13119. width: 365px;
  13120. margin-right: 1em;
  13121. }
  13122. #compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav, #license-viewer > section.window-content > .content-box .compendium-browser-settings > nav {
  13123. border-style: solid;
  13124. border-image-outset: 0;
  13125. border-width: 9px;
  13126. border-image: url("../assets/sheet/corner-box.webp") 9 repeat;
  13127. box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  13128. flex: 0;
  13129. width: 100%;
  13130. display: inline-flex;
  13131. justify-content: space-evenly;
  13132. align-items: center;
  13133. background: var(--secondary);
  13134. background: url("../assets/sheet/border-pattern.webp") repeat-x top, url("../assets/sheet/border-pattern.webp") repeat-x bottom, var(--secondary);
  13135. }
  13136. #compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav > a, #license-viewer > section.window-content > .content-box .compendium-browser-settings > nav > a {
  13137. color: var(--sidebar-label);
  13138. padding: 4px 0;
  13139. font-family: var(--sans-serif);
  13140. font-size: var(--font-size-12);
  13141. position: relative;
  13142. }
  13143. #compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav > a.active::after, #license-viewer > section.window-content > .content-box .compendium-browser-settings > nav > a.active::after {
  13144. bottom: -2px;
  13145. right: 39%;
  13146. position: absolute;
  13147. content: "";
  13148. width: 0;
  13149. height: 0;
  13150. border-left: 4px solid transparent;
  13151. border-right: 4px solid transparent;
  13152. border-top: 4px solid var(--sidebar-label);
  13153. }
  13154. #compendium-browser > section.window-content > .content-box .compendium-browser-settings nav, #license-viewer > section.window-content > .content-box .compendium-browser-settings nav {
  13155. border-width: unset;
  13156. }
  13157. #compendium-browser > section.window-content > .content-box .compendium-browser-settings button.save-settings, #license-viewer > section.window-content > .content-box .compendium-browser-settings button.save-settings {
  13158. background: rgba(0, 0, 0, 0.1);
  13159. border: 2px groove var(--color-border-light-highlight);
  13160. }
  13161. #compendium-browser > section.window-content > .content-box .spell-browser, #license-viewer > section.window-content > .content-box .spell-browser {
  13162. display: flex;
  13163. min-height: 100px;
  13164. height: 100%;
  13165. /* Sort and filter areas */
  13166. }
  13167. #compendium-browser > section.window-content > .content-box .spell-browser .control-area, #license-viewer > section.window-content > .content-box .spell-browser .control-area {
  13168. position: sticky;
  13169. display: block;
  13170. min-width: 320px;
  13171. width: 320px;
  13172. padding-right: 5px;
  13173. overflow: auto;
  13174. }
  13175. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer,
  13176. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer, #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer,
  13177. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer {
  13178. border: 1px solid #bbb;
  13179. border-radius: 5px;
  13180. margin-top: 5px;
  13181. padding: 2px;
  13182. }
  13183. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer div.title,
  13184. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer div.title, #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer div.title,
  13185. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer div.title {
  13186. display: flex;
  13187. flex-direction: row;
  13188. justify-content: space-between;
  13189. height: 22px;
  13190. }
  13191. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer div.title h3,
  13192. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer div.title h3, #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer div.title h3,
  13193. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer div.title h3 {
  13194. margin: 0;
  13195. cursor: pointer;
  13196. }
  13197. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer div.title button,
  13198. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer div.title button, #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer div.title button,
  13199. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer div.title button {
  13200. width: fit-content;
  13201. line-height: 22px;
  13202. }
  13203. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer > dl dt > input[type=checkbox],
  13204. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer > dl dt > input[type=checkbox], #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer > dl dt > input[type=checkbox],
  13205. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer > dl dt > input[type=checkbox] {
  13206. transform: none;
  13207. flex: none;
  13208. height: auto;
  13209. margin: 3px 3px;
  13210. }
  13211. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer > dl dd > a.direction,
  13212. #compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer > dl dd > a.direction, #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer > dl dd > a.direction,
  13213. #license-viewer > section.window-content > .content-box .spell-browser .sortcontainer > dl dd > a.direction {
  13214. padding: 2px;
  13215. }
  13216. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer dt, #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer dt {
  13217. width: 10%;
  13218. }
  13219. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer dd, #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer dd {
  13220. width: 82%;
  13221. }
  13222. #compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer .filter-conjunction input[type=radio], #license-viewer > section.window-content > .content-box .spell-browser .filtercontainer .filter-conjunction input[type=radio] {
  13223. margin: 0 5px 0 3px;
  13224. }
  13225. #compendium-browser > section.window-content > .content-box .spell-browser .rangecontainer div, #license-viewer > section.window-content > .content-box .spell-browser .rangecontainer div {
  13226. text-align: center;
  13227. margin-top: 5px;
  13228. }
  13229. #compendium-browser > section.window-content > .content-box .spell-browser .rangecontainer input, #license-viewer > section.window-content > .content-box .spell-browser .rangecontainer input {
  13230. width: 45%;
  13231. }
  13232. #compendium-browser > section.window-content > .content-box .spell-browser .slidercontainer-flex, #license-viewer > section.window-content > .content-box .spell-browser .slidercontainer-flex {
  13233. display: flex;
  13234. justify-content: space-around;
  13235. align-items: baseline;
  13236. }
  13237. #compendium-browser > section.window-content > .content-box .spell-browser .slidercontainer-flex label, #license-viewer > section.window-content > .content-box .spell-browser .slidercontainer-flex label {
  13238. width: 10px;
  13239. }
  13240. #compendium-browser > section.window-content > .content-box .spell-browser dl, #license-viewer > section.window-content > .content-box .spell-browser dl {
  13241. margin: 5px 0;
  13242. }
  13243. #compendium-browser > section.window-content > .content-box .spell-browser dt, #license-viewer > section.window-content > .content-box .spell-browser dt {
  13244. display: inline-block;
  13245. padding-left: 5px;
  13246. }
  13247. #compendium-browser > section.window-content > .content-box .spell-browser dd, #license-viewer > section.window-content > .content-box .spell-browser dd {
  13248. text-transform: capitalize;
  13249. display: inline-block;
  13250. }
  13251. #compendium-browser > section.window-content > .content-box .spell-browser dd select, #license-viewer > section.window-content > .content-box .spell-browser dd select {
  13252. width: 6em;
  13253. margin-left: 0.5em;
  13254. }
  13255. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list {
  13256. width: 100%;
  13257. float: right;
  13258. display: block;
  13259. margin: 0;
  13260. height: 100%;
  13261. overflow: hidden scroll;
  13262. scrollbar-width: thin;
  13263. scrollbar-color: var(--primary) transparent;
  13264. overflow: visible scroll;
  13265. }
  13266. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li {
  13267. line-height: var(--font-size-32);
  13268. margin: 2px 0;
  13269. }
  13270. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li:nth-child(odd), #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li:nth-child(odd) {
  13271. background-color: rgba(0, 0, 0, 0.12);
  13272. }
  13273. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > *, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > * {
  13274. align-self: center;
  13275. }
  13276. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .image, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .image {
  13277. height: 32px;
  13278. max-width: 32px;
  13279. }
  13280. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .name, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .name {
  13281. line-height: 1em;
  13282. padding-left: 5px;
  13283. }
  13284. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .tags, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .tags {
  13285. justify-content: center;
  13286. margin-left: 0.5em;
  13287. max-width: 6em;
  13288. }
  13289. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .tags .tag, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .tags .tag {
  13290. line-height: var(--font-size-10);
  13291. }
  13292. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .level, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .level {
  13293. flex-grow: 1;
  13294. font-weight: 900;
  13295. height: 32px;
  13296. max-width: 18px;
  13297. text-align: center;
  13298. }
  13299. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .price, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .price {
  13300. flex: none;
  13301. height: 32px;
  13302. margin-right: 10px;
  13303. min-width: 5em;
  13304. text-align: right;
  13305. }
  13306. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li > .end, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li > .end {
  13307. font-weight: 900;
  13308. height: 32px;
  13309. margin-right: 3px;
  13310. max-width: 100px;
  13311. text-align: right;
  13312. }
  13313. #compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li:hover, #license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li:hover {
  13314. background-color: rgba(255, 255, 255, 0.25);
  13315. cursor: grab;
  13316. }
  13317. #compendium-browser > section.window-content > .content-box .spell-browser #tagfilter input, #license-viewer > section.window-content > .content-box .spell-browser #tagfilter input {
  13318. width: 100%;
  13319. }
  13320. #compendium-browser > section.window-content > .content-box .spell-browser .hint, #license-viewer > section.window-content > .content-box .spell-browser .hint {
  13321. font-size: var(--font-size-12);
  13322. border: 1px solid rgba(0, 255, 5, 0.2784313725);
  13323. border-radius: 5px;
  13324. padding: 3px;
  13325. }
  13326. #compendium-browser > section.window-content > .content-box .spell-browser .spacer, #license-viewer > section.window-content > .content-box .spell-browser .spacer {
  13327. display: inline-block;
  13328. min-width: 5px;
  13329. }
  13330. #compendium-browser > section.window-content > .content-box .spell-browser .spacer-large, #license-viewer > section.window-content > .content-box .spell-browser .spacer-large {
  13331. display: inline-block;
  13332. min-width: 15px;
  13333. }
  13334. #compendium-browser > section.window-content > .content-box .spell-browser .equipment-controls, #license-viewer > section.window-content > .content-box .spell-browser .equipment-controls {
  13335. margin-left: 0.25em;
  13336. margin-right: 0.25em;
  13337. max-width: 1em;
  13338. width: 1em;
  13339. }
  13340. #compendium-browser > section.window-content > .content-box > section.content, #license-viewer > section.window-content > .content-box > section.content {
  13341. height: 92%;
  13342. }
  13343. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active, #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active {
  13344. height: inherit;
  13345. }
  13346. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active > div, #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active > div {
  13347. display: grid;
  13348. grid-template-columns: 320px auto;
  13349. }
  13350. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active > div .control-area, #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active > div .control-area {
  13351. grid-column-start: 1;
  13352. }
  13353. #compendium-browser > section.window-content > .content-box > section.content > .tab.browser.active > div ul, #license-viewer > section.window-content > .content-box > section.content > .tab.browser.active > div ul {
  13354. grid-column-start: 2;
  13355. }
  13356. .pf2e.item.sheet h3 {
  13357. border-bottom: none;
  13358. }
  13359. .pf2e.item.sheet button > i {
  13360. margin-right: 0;
  13361. }
  13362. .pf2e.item.sheet .sheet-header {
  13363. display: flex;
  13364. flex: 0 0 70px;
  13365. align-items: bottom;
  13366. width: 100%;
  13367. padding-bottom: 6px;
  13368. border-bottom: 1px solid var(--secondary-background);
  13369. }
  13370. .pf2e.item.sheet .sheet-header img {
  13371. border: none;
  13372. object-fit: contain;
  13373. flex: 0 0 64px;
  13374. margin-right: 6px;
  13375. }
  13376. .pf2e.item.sheet .sheet-header .details {
  13377. display: flex;
  13378. flex-wrap: wrap;
  13379. align-items: baseline;
  13380. }
  13381. .pf2e.item.sheet .sheet-header .details input, .pf2e.item.sheet .sheet-header .details .level {
  13382. font-family: var(--serif-condensed);
  13383. font-size: var(--font-size-36);
  13384. font-weight: 700;
  13385. }
  13386. .pf2e.item.sheet .sheet-header input[type=text], .pf2e.item.sheet .sheet-header input[type=number] {
  13387. border: none;
  13388. height: var(--font-size-34);
  13389. }
  13390. .pf2e.item.sheet .sheet-header input[type=text]:hover, .pf2e.item.sheet .sheet-header input[type=text]:focus, .pf2e.item.sheet .sheet-header input[type=number]:hover, .pf2e.item.sheet .sheet-header input[type=number]:focus {
  13391. box-shadow: none;
  13392. }
  13393. .pf2e.item.sheet .sheet-header input[name=name] {
  13394. flex: 1;
  13395. }
  13396. .pf2e.item.sheet .sheet-header .level {
  13397. flex: 0;
  13398. white-space: nowrap;
  13399. margin-left: auto;
  13400. padding-left: 8px;
  13401. }
  13402. .pf2e.item.sheet .sheet-header .level i {
  13403. font-size: 0.6em;
  13404. margin-right: 4px;
  13405. margin-bottom: 4px;
  13406. }
  13407. .pf2e.item.sheet .sheet-header .level input {
  13408. width: 40px;
  13409. text-align: center;
  13410. }
  13411. .pf2e.item.sheet .sheet-header .feat-action-cost {
  13412. font-size: 2.5rem;
  13413. margin-top: -0.6rem;
  13414. margin-bottom: -0.3rem;
  13415. padding-left: 0.4rem;
  13416. }
  13417. .pf2e.item.sheet .sheet-header .paizo-style {
  13418. flex-basis: 100%;
  13419. width: 0;
  13420. border: none;
  13421. margin-top: 2px;
  13422. padding-left: 0;
  13423. padding-right: 0;
  13424. }
  13425. .pf2e.item.sheet .sheet-body {
  13426. height: calc(100% - 35px);
  13427. overflow: hidden;
  13428. display: flex;
  13429. flex-direction: column;
  13430. flex-wrap: nowrap;
  13431. }
  13432. .pf2e.item.sheet.affliction form .affliction-stage .link:not(.linked) {
  13433. opacity: 0.6;
  13434. color: #a00;
  13435. }
  13436. .pf2e.item.sheet.deity form .tab.item-details select {
  13437. max-width: fit-content;
  13438. }
  13439. .pf2e.item.sheet.feat form .item-details .form-group > label {
  13440. min-width: fit-content;
  13441. margin-right: 1em;
  13442. }
  13443. .pf2e.item.sheet.heritage form article .sheet-sidebar .required-ancestry {
  13444. flex-wrap: nowrap;
  13445. width: 100%;
  13446. white-space: nowrap;
  13447. max-width: 100%;
  13448. }
  13449. .pf2e.item.sheet.heritage form article .sheet-sidebar .required-ancestry label {
  13450. flex: 0;
  13451. }
  13452. .pf2e.item.sheet.heritage form article .sheet-sidebar .required-ancestry .drop-zone {
  13453. background-color: rgba(0, 0, 0, 0.05);
  13454. border-radius: 2px;
  13455. border: 1px dotted var(--alt-dark);
  13456. display: flex;
  13457. font-weight: normal;
  13458. justify-content: center;
  13459. margin: 2px 3px 0 auto;
  13460. max-width: 8em;
  13461. padding: 3px;
  13462. position: relative;
  13463. }
  13464. .pf2e.item.sheet.heritage form article .sheet-sidebar .required-ancestry .drop-zone span {
  13465. display: inline-block;
  13466. overflow: hidden;
  13467. text-overflow: ellipsis;
  13468. }
  13469. .pf2e.item.sheet.heritage form article .sheet-sidebar .required-ancestry .drop-zone.ancestry-ref-broken {
  13470. background-color: rgba(255, 0, 0, 0.15);
  13471. border-color: var(--primary);
  13472. }
  13473. .pf2e.item.sheet.heritage form article .sheet-sidebar .required-ancestry .drop-zone a.remove-ancestry {
  13474. display: none;
  13475. position: absolute;
  13476. right: -0.5em;
  13477. top: -0.25em;
  13478. }
  13479. .pf2e.item.sheet.heritage form article .sheet-sidebar .required-ancestry .drop-zone a.remove-ancestry:hover {
  13480. display: flex;
  13481. }
  13482. .pf2e.item.sheet.heritage form article .sheet-sidebar .required-ancestry .drop-zone:hover a.remove-ancestry {
  13483. display: flex;
  13484. }
  13485. .pf2e.item.sheet.kit form .kit-list ul.kit-items {
  13486. padding: 0;
  13487. }
  13488. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item {
  13489. display: grid;
  13490. grid-template-columns: 26px 30px auto 10px;
  13491. align-items: center;
  13492. }
  13493. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item:nth-of-type(even) {
  13494. background-color: rgba(120, 100, 82, 0.1);
  13495. }
  13496. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item .kit-item-name {
  13497. line-height: 1em;
  13498. height: 1em;
  13499. }
  13500. .pf2e.item.sheet.kit form .kit-list ul.kit-items li.kit-item .kit-item-name .fa.fa-globe {
  13501. padding: 0 3px;
  13502. float: right;
  13503. }
  13504. .pf2e.item.sheet.kit form .kit-list ul.kit-items ul {
  13505. padding-left: 0.5em;
  13506. margin-top: 0;
  13507. grid-column: 1/5;
  13508. }
  13509. .pf2e.item.sheet.kit form .kit-list ul.kit-items ul:empty {
  13510. display: none;
  13511. }
  13512. .pf2e.item.sheet.melee form .sheet-body .item-details .form-group.attack-modifier label, .pf2e.item.sheet.melee form .sheet-body .item-details li.damage-partial form-group label {
  13513. max-width: fit-content;
  13514. }
  13515. .pf2e.item.sheet.melee form .sheet-body .item-details .form-group.attack-modifier input, .pf2e.item.sheet.melee form .sheet-body .item-details li.damage-partial form-group input {
  13516. max-width: 6ch;
  13517. }
  13518. .pf2e.item.sheet.melee form .sheet-body .item-details ol.form-list li.damage-partial {
  13519. align-items: center;
  13520. display: flex;
  13521. gap: 1em;
  13522. }
  13523. .pf2e.item.sheet.melee form .sheet-body .item-details ol.form-list li.damage-partial input {
  13524. max-width: 12ch;
  13525. }
  13526. .pf2e.item.sheet.melee form .sheet-body .item-details ol.form-list li.damage-partial .type {
  13527. gap: 0.25em;
  13528. }
  13529. .pf2e.item.sheet.melee form .sheet-body .item-details ol.form-list li.damage-partial .remove-partial {
  13530. margin: 0 0.5em 0 auto;
  13531. }
  13532. .pf2e.item.sheet.spell form .damage-formulas {
  13533. margin-top: 8px;
  13534. }
  13535. .pf2e.item.sheet.spell form .damage-formulas .details-container-flex-row {
  13536. gap: 2px;
  13537. margin-top: 4px;
  13538. }
  13539. .pf2e.item.sheet.spell form .damage-formulas input[type=checkbox] {
  13540. margin-left: 2px;
  13541. }
  13542. .pf2e.item.sheet.spell form .damage-formulas .traits-list {
  13543. display: flex;
  13544. margin-top: 2px;
  13545. }
  13546. .pf2e.item.sheet.spell form .damage-formulas .tag {
  13547. float: none;
  13548. }
  13549. .pf2e.item.sheet.spell form button[data-action=damage-add] {
  13550. margin-top: 4px;
  13551. }
  13552. .pf2e.item.sheet.spell form .variants .variant {
  13553. display: grid;
  13554. grid-template-columns: 1fr 1fr 0.2fr;
  13555. }
  13556. .pf2e.item.sheet.spell form .variants .variant .item-controls {
  13557. justify-self: end;
  13558. }
  13559. .pf2e.item.sheet.weapon form .item-details label {
  13560. min-width: 9em;
  13561. }
  13562. .pf2e.item.sheet.weapon form .item-details .precious-material select {
  13563. width: 19.5em;
  13564. }
  13565. .pf2e.item.sheet form {
  13566. display: flex;
  13567. flex-direction: column;
  13568. flex-wrap: nowrap;
  13569. width: 100%;
  13570. height: 100%;
  13571. overflow: hidden;
  13572. }
  13573. .pf2e.item.sheet form .item-ref-group ul.item-refs {
  13574. border: 1px solid var(--color-border-light-2);
  13575. border-radius: 3px;
  13576. padding: 0;
  13577. }
  13578. .pf2e.item.sheet form .item-ref-group ul.item-refs.empty {
  13579. background-color: rgba(120, 100, 82, 0.1);
  13580. height: 28px;
  13581. }
  13582. .pf2e.item.sheet form .item-ref-group ul.item-refs > li {
  13583. align-items: center;
  13584. display: grid;
  13585. grid-template-columns: 26px auto 2em 1em;
  13586. padding: 1px;
  13587. }
  13588. .pf2e.item.sheet form .item-ref-group ul.item-refs > li:nth-of-type(even) {
  13589. background-color: rgba(120, 100, 82, 0.1);
  13590. }
  13591. .pf2e.item.sheet form .item-ref-group ul.item-refs > li .name {
  13592. display: block;
  13593. margin-left: 0.25em;
  13594. line-height: 1em;
  13595. height: 1em;
  13596. }
  13597. .pf2e.item.sheet form .item-ref-group ul.item-refs > li .name .fa.fa-globe {
  13598. padding: 0 3px;
  13599. float: right;
  13600. }
  13601. .pf2e.item.sheet form .item-ref-group ul.item-refs > li .level {
  13602. font-weight: bold;
  13603. height: 1.25em;
  13604. text-align: center;
  13605. }
  13606. .pf2e.item.sheet form .item-ref-group ul.item-refs > li a.remove {
  13607. padding: 0 2px;
  13608. }
  13609. .pf2e.item.sheet form .item-ref-group ul.item-refs ul {
  13610. grid-column: 1/5;
  13611. margin-top: 0;
  13612. padding-left: 0.5em;
  13613. }
  13614. .pf2e.item.sheet form .item-ref-group ul.item-refs ul:empty {
  13615. display: none;
  13616. }
  13617. .pf2e.item.sheet form .item-ref-list {
  13618. align-items: start;
  13619. }
  13620. .pf2e.item.sheet form .form-group.form-group-trait {
  13621. height: auto;
  13622. margin: 2px 0;
  13623. }
  13624. .pf2e.item.sheet form .form-group.form-group-trait label {
  13625. vertical-align: top;
  13626. }
  13627. .pf2e.item.sheet form .form-group.form-group-trait > ul.abc-traits-list {
  13628. list-style: none;
  13629. margin: 0;
  13630. padding: 0;
  13631. display: flex;
  13632. flex-wrap: wrap;
  13633. }
  13634. .pf2e.item.sheet form .form-group.form-group-trait > ul.abc-traits-list span.tag {
  13635. float: none;
  13636. }
  13637. .pf2e.item.sheet form .form-group.other-weapons input {
  13638. flex: 2;
  13639. }
  13640. .pf2e.item.sheet form .form-group.other-weapons select {
  13641. flex: 1;
  13642. }
  13643. .pf2e.item.sheet form .form-group.additional-language input {
  13644. flex: 0.5;
  13645. }
  13646. .pf2e.item.sheet form .form-group.additional-language span {
  13647. flex: 2.5;
  13648. padding-left: 4px;
  13649. }
  13650. .pf2e.item.sheet form .item-activations {
  13651. padding: 8px 8px 0;
  13652. overflow: hidden scroll;
  13653. scrollbar-width: thin;
  13654. scrollbar-color: var(--primary) transparent;
  13655. }
  13656. .pf2e.item.sheet form .item-activations .activation + .activation, .pf2e.item.sheet form .item-activations .activation + button {
  13657. margin-top: 0.5em;
  13658. }
  13659. .pf2e.item.sheet form .item-activations .activation .editor {
  13660. min-height: 28px;
  13661. }
  13662. .pf2e.item.sheet form .item-activations header {
  13663. font-size: 1.05em;
  13664. margin-bottom: 0.25em;
  13665. line-height: 1.25em;
  13666. }
  13667. .pf2e.item.sheet form .item-activations .activation-time {
  13668. flex: 1;
  13669. height: 20px;
  13670. }
  13671. .pf2e.item.sheet form .item-activations .frequency {
  13672. flex: 1;
  13673. gap: 4px;
  13674. padding-right: 6px;
  13675. }
  13676. .pf2e.item.sheet form .item-activations .frequency input[type=number] {
  13677. border: none;
  13678. background: none;
  13679. text-align: right;
  13680. margin: 0 0 0 24px;
  13681. }
  13682. .pf2e.item.sheet form .item-activations .frequency > select:first-child {
  13683. margin-left: 24px;
  13684. }
  13685. .pf2e.item.sheet form .item-activations .frequency.empty {
  13686. text-align: right;
  13687. }
  13688. .pf2e.item.sheet form .item-activations .tags {
  13689. margin-top: 4px;
  13690. }
  13691. .pf2e.item.sheet form .item-activations .tags label {
  13692. margin-right: 3px;
  13693. }
  13694. .pf2e.item.sheet form .item-activations .tox {
  13695. min-height: 150px;
  13696. }
  13697. .pf2e.item.sheet form .identify-popup {
  13698. min-width: 300px;
  13699. }
  13700. .pf2e.item.sheet form section.sheet-body .item-mystification.active .mystification-status label {
  13701. color: #353535;
  13702. font-weight: 500;
  13703. }
  13704. .pf2e.item.sheet form section.sheet-body .item-mystification.active .mystification-status select {
  13705. max-width: fit-content;
  13706. margin-right: auto;
  13707. }
  13708. .pf2e.item.sheet form section.sheet-body .item-mystification.active .unidentified {
  13709. display: flex;
  13710. align-items: center;
  13711. flex-wrap: wrap;
  13712. }
  13713. .pf2e.item.sheet form section.sheet-body .item-mystification.active .unidentified > * {
  13714. display: flex;
  13715. }
  13716. .pf2e.item.sheet form section.sheet-body .item-mystification.active .unidentified img {
  13717. height: 40px;
  13718. width: 40px;
  13719. }
  13720. .pf2e.item.sheet form section.sheet-body .item-mystification.active .unidentified input {
  13721. margin-left: 4px;
  13722. width: 50%;
  13723. }
  13724. .pf2e.item.sheet form section.sheet-body .item-mystification.active .unidentified .editor {
  13725. height: auto;
  13726. min-height: 100px;
  13727. margin: 4px auto;
  13728. min-width: 100%;
  13729. }
  13730. .pf2e.item.sheet form section.sheet-body .item-mystification.active .unidentified .tox.tox-tinymce {
  13731. min-height: 200px;
  13732. }
  13733. .pf2e.item.sheet form .item-rules {
  13734. overflow: hidden scroll;
  13735. scrollbar-width: thin;
  13736. scrollbar-color: var(--primary) transparent;
  13737. }
  13738. .pf2e.item.sheet form .item-rules select {
  13739. font-size: var(--font-size-12);
  13740. height: 1.36rem;
  13741. width: auto;
  13742. }
  13743. .pf2e.item.sheet form .item-rules select span {
  13744. padding: 0;
  13745. }
  13746. .pf2e.item.sheet form .item-rules .nerd-details {
  13747. margin-bottom: 10px;
  13748. }
  13749. .pf2e.item.sheet form .item-rules .nerd-details .form-group {
  13750. margin: 0;
  13751. }
  13752. .pf2e.item.sheet form .item-rules .nerd-details label {
  13753. align-items: center;
  13754. display: flex;
  13755. flex: 0 0 70px;
  13756. line-height: 1.5em;
  13757. margin-right: 4px;
  13758. min-width: 8em;
  13759. }
  13760. .pf2e.item.sheet form .item-rules .nerd-details label i.fa-info-circle {
  13761. margin-left: auto;
  13762. margin-right: 0.5em;
  13763. }
  13764. .pf2e.item.sheet form .item-rules .rules {
  13765. padding-top: 7px;
  13766. padding-right: 7px;
  13767. }
  13768. .pf2e.item.sheet form .item-rules .rules .rule-element-header {
  13769. display: flex;
  13770. justify-content: space-between;
  13771. }
  13772. .pf2e.item.sheet form .item-rules .rules .rule-element-header h3.unrecognized {
  13773. color: #880000;
  13774. }
  13775. .pf2e.item.sheet form .item-rules .rules .add-rule-element {
  13776. text-align: right;
  13777. }
  13778. .pf2e.item.sheet form .item-rules .rules textarea {
  13779. padding: 4px;
  13780. min-height: 60px;
  13781. resize: vertical;
  13782. }
  13783. .pf2e.item.sheet form .item-rules .create-rule-element {
  13784. display: flex;
  13785. align-items: center;
  13786. white-space: nowrap;
  13787. gap: 6px;
  13788. justify-content: flex-end;
  13789. }
  13790. .pf2e.item.sheet form .item-rules .rule-editing {
  13791. display: flex;
  13792. flex-direction: column;
  13793. height: 100%;
  13794. gap: 5px;
  13795. }
  13796. .pf2e.item.sheet form .item-rules .rule-editing > .cm-editor {
  13797. flex: 1;
  13798. background-color: white;
  13799. overflow: hidden;
  13800. }
  13801. .pf2e.item.sheet form .item-rules .rule-editing > .cm-editor .cm-scroller {
  13802. overflow: hidden scroll;
  13803. scrollbar-width: thin;
  13804. scrollbar-color: var(--primary) transparent;
  13805. overflow: scroll;
  13806. }
  13807. .pf2e.item.sheet form .item-rules .rule-editing > .cm-editor button {
  13808. width: auto;
  13809. line-height: normal;
  13810. }
  13811. .pf2e.item.sheet form .item-rules .rule-editing > .cm-editor input[type=checkbox] {
  13812. width: auto;
  13813. height: auto;
  13814. }
  13815. .pf2e.item.sheet form .item-rules .rule-editing > .cm-editor label {
  13816. display: inline;
  13817. }
  13818. .pf2e.item.sheet form .item-rules .rule-editing > .cm-editor .cm-search .cm-textfield {
  13819. width: 100px;
  13820. }
  13821. .pf2e.item.sheet form .item-rules .rule-editing > .cm-editor ::selection {
  13822. color: black;
  13823. }
  13824. .pf2e.item.sheet form .item-rules .rule-editing .item-controls {
  13825. margin: 0;
  13826. }
  13827. .pf2e.item.sheet form .item-rules .rule-form label, .pf2e.item.sheet form .item-rules .rule-form .labelled-element {
  13828. display: flex;
  13829. align-items: center;
  13830. gap: 4px;
  13831. }
  13832. .pf2e.item.sheet form .item-rules .rule-form label input, .pf2e.item.sheet form .item-rules .rule-form label tags, .pf2e.item.sheet form .item-rules .rule-form .labelled-element input, .pf2e.item.sheet form .item-rules .rule-form .labelled-element tags {
  13833. flex: 1;
  13834. }
  13835. .pf2e.item.sheet form .item-rules .rule-form .range {
  13836. display: flex;
  13837. gap: 3px;
  13838. align-items: center;
  13839. }
  13840. .pf2e.item.sheet form .item-rules .rule-form .range input {
  13841. width: 40px;
  13842. }
  13843. .pf2e.item.sheet form .item-rules .rule-form .attached-input {
  13844. display: flex;
  13845. align-items: center;
  13846. justify-content: center;
  13847. flex: 1;
  13848. }
  13849. .pf2e.item.sheet form .item-rules .rule-form .attached-input .attachment {
  13850. display: flex;
  13851. justify-content: center;
  13852. align-items: center;
  13853. padding: 0 6px;
  13854. margin: 0;
  13855. line-height: unset;
  13856. flex: 0 0 auto;
  13857. width: auto;
  13858. min-width: 68px;
  13859. align-self: stretch;
  13860. border: 1px solid #aaa;
  13861. border-right: none;
  13862. border-radius: 3px 0 0 3px;
  13863. }
  13864. .pf2e.item.sheet form .item-rules .rule-form .attached-input input, .pf2e.item.sheet form .item-rules .rule-form .attached-input tags {
  13865. border-top-left-radius: 0;
  13866. border-bottom-left-radius: 0;
  13867. margin: 0;
  13868. flex: 1;
  13869. }
  13870. .pf2e.item.sheet form .item-rules .rule-form .spaced-fields {
  13871. display: flex;
  13872. align-items: center;
  13873. gap: 4px;
  13874. }
  13875. .pf2e.item.sheet form .item-rules .rule-form .spaced-fields label {
  13876. font-weight: 500;
  13877. padding-right: 2px;
  13878. }
  13879. .pf2e.item.sheet form .item-rules .rule-form .spaced-fields label:not(:first-child) {
  13880. padding-left: 2px;
  13881. }
  13882. .pf2e.item.sheet form .item-rules .rule-form .brackets {
  13883. margin-left: 9.5em;
  13884. }
  13885. .pf2e.item.sheet form .item-rules .rule-form[data-key=FastHealing] .details, .pf2e.item.sheet form .item-rules .rule-form[data-key=FastHealing] tags {
  13886. flex: 3;
  13887. }
  13888. .pf2e.item.sheet form .item-rules .rule-form[data-key=FastHealing] .value {
  13889. flex: 1;
  13890. min-width: 80px;
  13891. }
  13892. .pf2e.item.sheet form .item-rules .rule-form[data-key=FlatModifier] .type-input {
  13893. flex: 0;
  13894. }
  13895. .pf2e.item.sheet form .item-rules .rule-form[data-key=GrantItem] a.granted {
  13896. display: flex;
  13897. flex: 0 0 auto;
  13898. flex-direction: row;
  13899. align-items: center;
  13900. gap: 3px;
  13901. }
  13902. .pf2e.item.sheet form .item-rules .rule-form[data-key=GrantItem] a.granted img {
  13903. width: 16px;
  13904. height: 16px;
  13905. }
  13906. .pf2e.item.sheet form .item-rules .rule-form[data-key=Note] {
  13907. display: flex;
  13908. flex-direction: column;
  13909. gap: 2px;
  13910. }
  13911. .pf2e.item.sheet form label {
  13912. display: block;
  13913. }
  13914. .pf2e.item.sheet form .mce-panel span {
  13915. display: inherit;
  13916. }
  13917. .pf2e.item.sheet form.editable .rollable:hover {
  13918. color: #000;
  13919. text-shadow: 0 0 10px #00005a;
  13920. cursor: pointer;
  13921. }
  13922. .pf2e.item.sheet form .tab {
  13923. flex: 1;
  13924. }
  13925. .pf2e.item.sheet form .tag-legacy {
  13926. float: left;
  13927. margin: 0 2px 2px 0;
  13928. padding: 0 3px;
  13929. font-size: var(--font-size-10);
  13930. line-height: 16px;
  13931. border: 1px solid #999;
  13932. border-radius: 3px;
  13933. white-space: normal;
  13934. font-weight: 500;
  13935. }
  13936. .pf2e.item.sheet form p.hint {
  13937. font-family: var(--font-primary);
  13938. font-weight: normal;
  13939. }
  13940. .pf2e.item.sheet form .item-controls {
  13941. display: flex;
  13942. margin: 0 0 0 4px;
  13943. align-items: baseline;
  13944. gap: 2px;
  13945. }
  13946. .pf2e.item.sheet form .sheet-navigation {
  13947. display: flex;
  13948. align-items: baseline;
  13949. border-bottom: 1px solid var(--secondary-background);
  13950. flex: 0 0 30px;
  13951. line-height: 30px;
  13952. margin-bottom: 0.5rem;
  13953. }
  13954. .pf2e.item.sheet form .sheet-navigation a {
  13955. flex: 1 1 auto;
  13956. }
  13957. .pf2e.item.sheet form .sheet-navigation a.active {
  13958. text-decoration: underline;
  13959. }
  13960. .pf2e.item.sheet form .sheet-navigation .sidebar-summary {
  13961. flex: 0 0 220px;
  13962. margin: 0;
  13963. text-align: center;
  13964. }
  13965. .pf2e.item.sheet form .sheet-navigation .sheet-tabs {
  13966. font-weight: 500;
  13967. margin: 0;
  13968. flex: 1;
  13969. align-items: baseline;
  13970. }
  13971. .pf2e.item.sheet form .sheet-navigation .sheet-tabs > .list-row {
  13972. font-size: var(--font-size-12);
  13973. text-align: center;
  13974. }
  13975. .pf2e.item.sheet form .sheet-navigation .sheet-tabs > .list-row:last-of-type {
  13976. padding-right: 4px;
  13977. }
  13978. .pf2e.item.sheet form .sheet-navigation .sheet-tabs > .list-row.active {
  13979. color: #000;
  13980. font-weight: 700;
  13981. }
  13982. .pf2e.item.sheet form article.sheet-content {
  13983. width: 100%;
  13984. display: flex;
  13985. flex-direction: row;
  13986. flex-wrap: wrap;
  13987. justify-content: flex-start;
  13988. height: calc(100% - 35px);
  13989. overflow: hidden;
  13990. }
  13991. .pf2e.item.sheet form article.sheet-content > * {
  13992. flex: 1;
  13993. }
  13994. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar, .pf2e.item.sheet form article.sheet-content > section.sheet-body {
  13995. height: calc(100% - 10px);
  13996. overflow-y: auto;
  13997. }
  13998. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar {
  13999. flex: 0 0 220px;
  14000. display: flex;
  14001. flex-direction: column;
  14002. flex-wrap: nowrap;
  14003. }
  14004. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar > * {
  14005. flex: 1;
  14006. }
  14007. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .item-summary {
  14008. font-family: var(--serif-condensed);
  14009. font-weight: 700;
  14010. flex: 0 0 28px;
  14011. line-height: 28px;
  14012. text-align: center;
  14013. font-size: var(--font-size-18);
  14014. color: #444;
  14015. }
  14016. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar ol.item-tags {
  14017. padding-left: 0;
  14018. flex: 0;
  14019. list-style: none;
  14020. }
  14021. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar ol.item-tags .tag {
  14022. display: block;
  14023. width: 100%;
  14024. text-align: center;
  14025. }
  14026. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details {
  14027. overflow: hidden scroll;
  14028. scrollbar-width: thin;
  14029. scrollbar-color: var(--primary) transparent;
  14030. padding: 0 4px 0 0;
  14031. }
  14032. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details label, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details label {
  14033. color: #353535;
  14034. font-weight: bold;
  14035. white-space: nowrap;
  14036. max-width: 6em;
  14037. }
  14038. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .form-group, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .form-group {
  14039. margin: 3px 0;
  14040. }
  14041. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .form-group input, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .form-group input {
  14042. text-align: right;
  14043. }
  14044. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .form-group input.left-of-select, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .form-group input.left-of-select {
  14045. min-width: 4ch;
  14046. padding-right: 0.5em;
  14047. }
  14048. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .form-group select, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .form-group select {
  14049. max-width: 12em;
  14050. }
  14051. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .form-group.longtext, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .form-group.longtext {
  14052. height: fit-content;
  14053. align-items: start;
  14054. margin: 0 0 0.5em 0;
  14055. }
  14056. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .form-group.longtext label, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .form-group.longtext label {
  14057. max-width: 6em;
  14058. white-space: normal;
  14059. line-height: unset;
  14060. }
  14061. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .form-group.longtext .editor-content, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .form-group.longtext .editor-content {
  14062. min-height: 3em;
  14063. }
  14064. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .form-group.longtext .editor-content > p, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .form-group.longtext .editor-content > p {
  14065. font-weight: 400;
  14066. margin: 0;
  14067. }
  14068. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .price-fields, .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .price-fields {
  14069. display: flex;
  14070. gap: 4px;
  14071. }
  14072. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .inventory-details .price-fields input[name="system.price.per"], .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .feat-details .price-fields input[name="system.price.per"] {
  14073. width: 22px;
  14074. }
  14075. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar select {
  14076. font-family: inherit;
  14077. font-size: 0.85em;
  14078. height: 1.8em;
  14079. }
  14080. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar button {
  14081. padding-top: 0;
  14082. padding-bottom: 0;
  14083. white-space: nowrap;
  14084. }
  14085. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .badge-label-row {
  14086. width: 100%;
  14087. }
  14088. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .badge-label-row label {
  14089. cursor: pointer;
  14090. max-width: unset;
  14091. }
  14092. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .badge-label-row input[type=radio] {
  14093. margin: 0;
  14094. top: 0;
  14095. }
  14096. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .badge-label-row .badge-value {
  14097. margin-right: 0.1rem;
  14098. width: 3ch;
  14099. font-weight: bold;
  14100. text-align: end;
  14101. }
  14102. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .badge-label-row input[type=text] {
  14103. flex: 1;
  14104. text-align: end;
  14105. }
  14106. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .add-badge {
  14107. display: flex;
  14108. align-items: center;
  14109. }
  14110. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .add-badge select {
  14111. flex: 1;
  14112. max-width: unset;
  14113. }
  14114. .pf2e.item.sheet form article.sheet-content > section.sheet-sidebar .add-badge button {
  14115. flex: 0;
  14116. line-height: 1.2em;
  14117. }
  14118. .pf2e.item.sheet form article.sheet-content input[type=text], .pf2e.item.sheet form article.sheet-content input[type=number] {
  14119. width: calc(100% - 2px);
  14120. height: calc(100% - 2px);
  14121. background: none;
  14122. padding: 0;
  14123. margin: 1px 0;
  14124. border: 1px solid transparent;
  14125. }
  14126. .pf2e.item.sheet form article.sheet-content input[type=text]:hover:not(:disabled), .pf2e.item.sheet form article.sheet-content input[type=text]:focus, .pf2e.item.sheet form article.sheet-content input[type=number]:hover:not(:disabled), .pf2e.item.sheet form article.sheet-content input[type=number]:focus {
  14127. border: 1px solid black;
  14128. box-shadow: 0 0 10px #00005a;
  14129. }
  14130. .pf2e.item.sheet form article.sheet-content select {
  14131. background: rgba(255, 255, 255, 0.5);
  14132. }
  14133. .pf2e.item.sheet form section.sheet-body input[type=text], .pf2e.item.sheet form section.sheet-body input[type=number] {
  14134. background: rgba(255, 255, 255, 0.5);
  14135. border: 1px solid #aaa;
  14136. padding: 3px;
  14137. }
  14138. .pf2e.item.sheet form section.sheet-body .tab {
  14139. padding-left: 0.5rem;
  14140. /** Details */
  14141. }
  14142. .pf2e.item.sheet form section.sheet-body .tab.item-details {
  14143. padding: 0.5rem 0.5rem 0;
  14144. overflow: hidden scroll;
  14145. scrollbar-width: thin;
  14146. scrollbar-color: var(--primary) transparent;
  14147. }
  14148. .pf2e.item.sheet form section.sheet-body .tab.item-details label {
  14149. color: var(--color-text-dark-2);
  14150. font-weight: 500;
  14151. padding-right: 0.5em;
  14152. white-space: nowrap;
  14153. }
  14154. .pf2e.item.sheet form section.sheet-body .tab.item-details label.no-data {
  14155. color: var(--color-text-dark-4);
  14156. }
  14157. .pf2e.item.sheet form section.sheet-body .tab.item-details select {
  14158. font-size: var(--font-size-12);
  14159. height: 1.5rem;
  14160. padding-right: 1em;
  14161. }
  14162. .pf2e.item.sheet form section.sheet-body .tab.item-details select.rarity {
  14163. max-width: fit-content;
  14164. }
  14165. .pf2e.item.sheet form section.sheet-body .tab.item-details .tags .tag {
  14166. font-size: var(--font-size-10);
  14167. }
  14168. .pf2e.item.sheet form section.sheet-body .tab.item-mystification {
  14169. padding: 8px 8px 0;
  14170. overflow: hidden scroll;
  14171. scrollbar-width: thin;
  14172. scrollbar-color: var(--primary) transparent;
  14173. }
  14174. .pf2e.item.sheet form section.sheet-body .tab.item-mystification label {
  14175. color: #353535;
  14176. font-weight: bold;
  14177. }
  14178. .pf2e.item.sheet form section.sheet-body .tab.item-activations, .pf2e.item.sheet form section.sheet-body .tab.item-rules {
  14179. overflow: hidden scroll;
  14180. scrollbar-width: thin;
  14181. scrollbar-color: var(--primary) transparent;
  14182. }
  14183. .pf2e.item.sheet form section.sheet-body .editor {
  14184. --space-s: 0.25em;
  14185. --space-m: 0.5em;
  14186. --space-l: 1em;
  14187. --space-xl: 1.5em;
  14188. --radius: 3px;
  14189. --space-s: 0.25em;
  14190. --space-m: 0.5em;
  14191. --space-l: 1em;
  14192. --space-xl: 1.5em;
  14193. --space-2xl: 2em;
  14194. --radius: 3px;
  14195. }
  14196. .pf2e.item.sheet form section.sheet-body .editor p {
  14197. min-height: unset;
  14198. }
  14199. .pf2e.item.sheet form section.sheet-body .editor :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  14200. margin-top: 1em;
  14201. }
  14202. .pf2e.item.sheet form section.sheet-body .editor .inline-header {
  14203. display: flex;
  14204. align-items: center;
  14205. gap: var(--space-l);
  14206. background-color: var(--alt);
  14207. font-family: var(--sans-serif);
  14208. color: white;
  14209. padding: 0;
  14210. font-size: 0.8em;
  14211. font-weight: 400;
  14212. border: none;
  14213. }
  14214. .pf2e.item.sheet form section.sheet-body .editor .inline-header strong {
  14215. display: inline-flex;
  14216. padding: 0 var(--space-m);
  14217. background-color: var(--primary);
  14218. min-width: 15ch;
  14219. border-right: 1px solid rgba(0, 0, 0, 0.4);
  14220. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  14221. font-weight: 400;
  14222. }
  14223. .pf2e.item.sheet form section.sheet-body .editor .inline-header + p {
  14224. margin-top: var(--space-s);
  14225. }
  14226. .pf2e.item.sheet form section.sheet-body .editor .info {
  14227. background-color: var(--secondary);
  14228. padding: var(--space-m);
  14229. color: white;
  14230. margin-left: auto;
  14231. margin-right: auto;
  14232. padding: 0;
  14233. border-radius: var(--radius);
  14234. font-family: var(--sans-serif);
  14235. padding-bottom: var(--space-m);
  14236. }
  14237. .pf2e.item.sheet form section.sheet-body .editor .info > * + * {
  14238. margin-top: var(--space-m);
  14239. }
  14240. .pf2e.item.sheet form section.sheet-body .editor .info + * {
  14241. margin-top: var(--space-xl);
  14242. }
  14243. .pf2e.item.sheet form section.sheet-body .editor .info + .pf2e.item.sheet form section.sheet-body .editor .info {
  14244. margin-top: var(--space-s);
  14245. }
  14246. .pf2e.item.sheet form section.sheet-body .editor .info h4 {
  14247. font-size: 0.9em;
  14248. font-weight: 400;
  14249. line-height: 1.2;
  14250. font-family: var(--sans-serif);
  14251. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  14252. padding: var(--space-m) var(--space-l);
  14253. position: relative;
  14254. display: flex;
  14255. align-items: center;
  14256. justify-content: space-between;
  14257. color: white;
  14258. }
  14259. .pf2e.item.sheet form section.sheet-body .editor .info h4::after {
  14260. font-family: "Font Awesome 6";
  14261. content: "\f05a";
  14262. font-weight: 900;
  14263. margin-right: var(--space-s);
  14264. }
  14265. .pf2e.item.sheet form section.sheet-body .editor .info p {
  14266. font-size: 0.8em;
  14267. margin: 0;
  14268. padding: 0 var(--space-l);
  14269. }
  14270. .pf2e.item.sheet form section.sheet-body .editor .info p:first-of-type {
  14271. padding-top: var(--space-m);
  14272. border-top: 1px solid rgba(255, 255, 255, 0.1);
  14273. }
  14274. .pf2e.item.sheet form section.sheet-body .editor .traits {
  14275. display: flex;
  14276. flex-wrap: wrap;
  14277. padding: 0;
  14278. }
  14279. .pf2e.item.sheet form section.sheet-body .editor .traits p {
  14280. display: inline-flex;
  14281. padding: 0.16rem 0.25rem;
  14282. margin: 0;
  14283. background-color: var(--primary);
  14284. border: 2px solid var(--color-border-trait);
  14285. color: white;
  14286. font: 500 var(--font-size-10) var(--sans-serif);
  14287. text-transform: uppercase;
  14288. }
  14289. .pf2e.item.sheet form section.sheet-body .editor .statblock {
  14290. font-family: var(--sans-serif-condensed);
  14291. color: black;
  14292. line-height: 1.2;
  14293. margin-bottom: var(--space-m);
  14294. }
  14295. .pf2e.item.sheet form section.sheet-body .editor .statblock > * + * {
  14296. margin-top: var(--space-s);
  14297. margin-bottom: 0;
  14298. }
  14299. .pf2e.item.sheet form section.sheet-body .editor .statblock p {
  14300. --indent: var(--space-l);
  14301. margin-left: var(--indent);
  14302. position: relative;
  14303. }
  14304. .pf2e.item.sheet form section.sheet-body .editor .statblock p strong:first-of-type {
  14305. margin-left: calc(var(--indent) * -1);
  14306. }
  14307. .pf2e.item.sheet form section.sheet-body .editor .statblock p .trait:first-of-type {
  14308. margin-left: calc(var(--indent) * -1 - 2px);
  14309. }
  14310. .pf2e.item.sheet form section.sheet-body .editor .statblock span.pf2-icon {
  14311. line-height: 1;
  14312. }
  14313. .pf2e.item.sheet form section.sheet-body .editor .statblock h1,
  14314. .pf2e.item.sheet form section.sheet-body .editor .statblock h2,
  14315. .pf2e.item.sheet form section.sheet-body .editor .statblock h3,
  14316. .pf2e.item.sheet form section.sheet-body .editor .statblock h4 {
  14317. display: flex;
  14318. align-items: baseline;
  14319. justify-content: space-between;
  14320. border-bottom: 1px solid black;
  14321. text-transform: uppercase;
  14322. letter-spacing: -0.05em;
  14323. font-family: var(--sans-serif-condensed);
  14324. font-weight: 700;
  14325. }
  14326. .pf2e.item.sheet form section.sheet-body .editor .statblock hr {
  14327. border: none;
  14328. border-bottom: 1px solid black;
  14329. }
  14330. .pf2e.item.sheet form section.sheet-body .editor .message {
  14331. font-family: var(--journal-cursive);
  14332. font-size: 2em;
  14333. line-height: 1.2;
  14334. }
  14335. .pf2e.item.sheet form section.sheet-body .item-description .descriptions {
  14336. display: flex;
  14337. flex-direction: column;
  14338. gap: 3px;
  14339. height: 100%;
  14340. padding: 0 0.25em;
  14341. }
  14342. .pf2e.item.sheet form section.sheet-body .item-description .descriptions > * {
  14343. display: inherit;
  14344. flex-direction: inherit;
  14345. }
  14346. .pf2e.item.sheet form section.sheet-body .item-description .descriptions .gm-notes {
  14347. background-color: var(--visibility-gm-bg);
  14348. border: 1px dotted rgba(75, 74, 68, 0.5);
  14349. padding: 0 0.25em;
  14350. }
  14351. .pf2e.item.sheet form section.sheet-body .item-description .descriptions .gm-notes:not(.has-content) {
  14352. display: none;
  14353. }
  14354. .pf2e.item.sheet form section.sheet-body .item-description .descriptions .gm-notes .editor {
  14355. min-height: 2.5em;
  14356. }
  14357. .pf2e.item.sheet form section.sheet-body .item-description .descriptions .main {
  14358. flex-grow: 1;
  14359. }
  14360. .pf2e.item.sheet form section.sheet-body .item-description .descriptions .editor {
  14361. display: inherit;
  14362. flex-direction: inherit;
  14363. flex-grow: inherit;
  14364. }
  14365. .pf2e.item.sheet form section.sheet-body .item-description .descriptions .editor a.add-gm-notes, .pf2e.item.sheet form section.sheet-body .item-description .descriptions .editor a.editor-edit {
  14366. font-size: 1.33em;
  14367. background: rgb(205, 205, 205);
  14368. }
  14369. .pf2e.item.sheet form section.sheet-body .item-description .descriptions .editor a.add-gm-notes i, .pf2e.item.sheet form section.sheet-body .item-description .descriptions .editor a.editor-edit i {
  14370. width: 1em;
  14371. text-align: center;
  14372. }
  14373. .pf2e.item.sheet form section.sheet-body .item-description .descriptions .editor a.add-gm-notes {
  14374. border-radius: 4px;
  14375. border: 1px solid var(--color-border-dark-1);
  14376. box-shadow: 0 0 1px var(--color-shadow-dark);
  14377. display: none;
  14378. padding: 1px 2px;
  14379. position: absolute;
  14380. right: 35px;
  14381. top: 5px;
  14382. }
  14383. .pf2e.item.sheet form section.sheet-body .item-description .descriptions .editor:hover a.add-gm-notes {
  14384. display: block;
  14385. }
  14386. .pf2e.item.sheet form h3 .item-controls, .pf2e.item.sheet form header .item-controls {
  14387. cursor: pointer;
  14388. float: right;
  14389. }
  14390. .pf2e.item.sheet form .form-group .item-controls {
  14391. flex: 0 1 auto;
  14392. }
  14393. .pf2e.item.sheet form .form-section {
  14394. margin-top: 8px;
  14395. }
  14396. .pf2e.item.sheet form .form-list {
  14397. border-radius: 5px;
  14398. border: 1px solid var(--secondary-background);
  14399. list-style-type: none;
  14400. margin: 0.5em 0;
  14401. padding: 0.25em;
  14402. }
  14403. .pf2e.item.sheet form .form-list:first-child {
  14404. margin-top: 0;
  14405. }
  14406. .pf2e.item.sheet form .form-list h3 {
  14407. font-weight: 600;
  14408. font-size: 1.05em;
  14409. margin-bottom: 0.25em;
  14410. }
  14411. .pf2e.item.sheet form .form-list.subsection {
  14412. padding: 0;
  14413. }
  14414. .pf2e.item.sheet form .form-list.subsection > * {
  14415. padding: 0.25rem;
  14416. }
  14417. .pf2e.item.sheet form .form-list.subsection > header {
  14418. align-items: baseline;
  14419. background-color: var(--secondary);
  14420. border-radius: 5px 5px 0 0;
  14421. color: white;
  14422. display: flex;
  14423. justify-content: space-between;
  14424. margin: -1px -1px 0 -1px;
  14425. padding: 1px;
  14426. }
  14427. .pf2e.item.sheet form .form-list.subsection > header h3, .pf2e.item.sheet form .form-list.subsection > header .item-controls {
  14428. padding: 0.25rem;
  14429. margin-bottom: 0;
  14430. }
  14431. .pf2e.item.sheet form .two-by-two {
  14432. display: grid;
  14433. grid-template-columns: 1fr 1fr;
  14434. column-gap: 0.25rem;
  14435. }
  14436. .pf2e.item.sheet form .two-by-two .item-controls {
  14437. margin-left: 2px;
  14438. gap: 0;
  14439. }
  14440. .pf2e.item.sheet form .form-group {
  14441. margin: 2px 0;
  14442. font-weight: 500;
  14443. }
  14444. .pf2e.item.sheet form .form-group.scalable {
  14445. height: auto;
  14446. min-height: 24px;
  14447. }
  14448. .pf2e.item.sheet form .form-group.scalable ul.traits-list {
  14449. list-style-type: none;
  14450. }
  14451. .pf2e.item.sheet form .form-group > label:not(.large) {
  14452. max-width: 11em;
  14453. }
  14454. .pf2e.item.sheet form .form-group > label.short {
  14455. max-width: 9em;
  14456. }
  14457. .pf2e.item.sheet form .form-group > input[type=checkbox] {
  14458. margin-left: auto;
  14459. }
  14460. .pf2e.item.sheet form .form-group input[type=checkbox]:last-child {
  14461. margin-right: 0;
  14462. }
  14463. .pf2e.item.sheet form .form-group .checkbox-pair {
  14464. display: flex;
  14465. align-items: center;
  14466. }
  14467. .pf2e.item.sheet form .form-group .checkbox-pair span {
  14468. font-weight: 400;
  14469. }
  14470. .pf2e.item.sheet form .form-group input.adjusted-higher:not(:focus) {
  14471. font-weight: 700;
  14472. color: #009988;
  14473. }
  14474. .pf2e.item.sheet form .form-group input.adjusted-lower:not(:focus) {
  14475. font-weight: 700;
  14476. color: #cc3311;
  14477. }
  14478. .pf2e.item.sheet form .tags {
  14479. padding-left: 0;
  14480. }
  14481. .pf2e.item.sheet form .details-container, .pf2e.item.sheet form .dice-data {
  14482. display: grid;
  14483. grid: "dice die type"/40px 60px auto;
  14484. }
  14485. .pf2e.item.sheet form .effects-container {
  14486. display: grid;
  14487. grid: "effect number"/auto 40px;
  14488. }
  14489. .pf2e.item.sheet form .details-container-two-columns {
  14490. display: grid;
  14491. grid: "size type"/50% 50%;
  14492. }
  14493. .pf2e.item.sheet form .details-container-three-columns {
  14494. display: grid;
  14495. grid-template-columns: 1fr 1fr 1fr;
  14496. }
  14497. .pf2e.item.sheet form .details-container-flex-row {
  14498. display: flex;
  14499. flex-direction: row;
  14500. align-items: center;
  14501. justify-content: space-between;
  14502. }
  14503. .pf2e.item.sheet form .details-container-flex-row > label {
  14504. display: flex;
  14505. flex-direction: row;
  14506. align-items: center;
  14507. white-space: nowrap;
  14508. }
  14509. .pf2e.item.sheet form .details-container-flex-row select {
  14510. flex: 1;
  14511. width: auto;
  14512. }
  14513. .pf2e.item.sheet form .details-container-flex-row input[type=checkbox] {
  14514. width: 16px;
  14515. height: 16px;
  14516. flex-basis: auto;
  14517. }
  14518. .pf2e.item.sheet form .details-container-flex-row input[type=checkbox]:first-child:last-child {
  14519. margin-left: auto;
  14520. justify-self: flex-end;
  14521. }
  14522. .pf2e.item.sheet form .toggle-button-list {
  14523. display: flex;
  14524. gap: 2px;
  14525. margin: 4px 0;
  14526. }
  14527. .pf2e.item.sheet form .toggle-button-list button {
  14528. margin: 0;
  14529. font-size: var(--font-size-10);
  14530. line-height: 16px;
  14531. display: flex;
  14532. align-items: center;
  14533. white-space: nowrap;
  14534. padding: 3px 4px;
  14535. }
  14536. .pf2e.item.sheet form .consumable-details {
  14537. flex: 0 0 24px;
  14538. }
  14539. .pf2e.item.sheet form .consumable-details label {
  14540. font-weight: bold;
  14541. }
  14542. .pf2e.item.sheet form .consumable-details input {
  14543. flex: 0 0 24px;
  14544. margin-right: 6px;
  14545. text-align: right;
  14546. }
  14547. .pf2e.item.sheet form .consumable-details span {
  14548. line-height: 24px;
  14549. }
  14550. .pf2e.item.sheet form .consumable-details .max-charges {
  14551. flex: 0 0 16px;
  14552. text-align: center;
  14553. }
  14554. .pf2e.item.sheet form .consumable-charges label {
  14555. flex: 0 0 144px;
  14556. }
  14557. .pf2e.item.sheet form .consumable-charges input {
  14558. flex: 0 0 64px;
  14559. text-align: center;
  14560. }
  14561. .pf2e.item.sheet form .consumable-charges span.flex0 {
  14562. line-height: 24px;
  14563. }
  14564. .pf2e.item.sheet form .feat-uses select {
  14565. flex: 2;
  14566. margin-right: 5px;
  14567. }
  14568. .pf2e.item.sheet form .feat-uses input {
  14569. flex: 1;
  14570. text-align: center;
  14571. }
  14572. .pf2e.item.sheet form .feat-uses span.sep {
  14573. flex: 0 0 16px;
  14574. line-height: 24px;
  14575. font-size: var(--font-size-14);
  14576. text-align: center;
  14577. }
  14578. .pf2e.item.sheet form .spell-components input {
  14579. margin-left: 0;
  14580. }
  14581. .pf2e.item.sheet form .spell-components label {
  14582. padding-right: 6px;
  14583. }
  14584. .pf2e.item.sheet form input.adjusted:not(:focus) {
  14585. font-weight: 700;
  14586. color: #009988;
  14587. }
  14588. .pf2e.item.sheet form .frequency {
  14589. align-items: baseline;
  14590. display: flex;
  14591. gap: 0.2rem;
  14592. text-align: end;
  14593. }
  14594. .pf2e.item.sheet form .frequency.empty {
  14595. justify-content: flex-end;
  14596. }
  14597. .pf2e.item.sheet form .frequency select {
  14598. flex: 1 1 auto;
  14599. }
  14600. .pf2e.item.sheet form .frequency a {
  14601. align-self: center;
  14602. }
  14603. .persistent-damage-dialog {
  14604. /** Work around Font Awesome styling bug present as of version 6.2 */
  14605. }
  14606. .persistent-damage-dialog i.fa-fw {
  14607. min-width: 1em;
  14608. }
  14609. .persistent-damage-dialog h3 {
  14610. display: flex;
  14611. align-items: baseline;
  14612. justify-content: space-between;
  14613. }
  14614. .persistent-damage-dialog h3 a {
  14615. float: right;
  14616. font-size: 0.8em;
  14617. }
  14618. .persistent-damage-dialog h3 a:hover i {
  14619. animation: rotation 2s infinite linear;
  14620. }
  14621. .persistent-damage-dialog .entries {
  14622. display: flex;
  14623. flex-direction: column;
  14624. gap: 0.125rem;
  14625. }
  14626. .persistent-damage-dialog .entries:not(.new) {
  14627. margin-bottom: 0.5rem;
  14628. }
  14629. .persistent-damage-dialog .persistent-entry {
  14630. display: flex;
  14631. align-items: baseline;
  14632. gap: 0.25rem;
  14633. }
  14634. .persistent-damage-dialog .persistent-entry.inactive .input-fields input span, .persistent-damage-dialog .persistent-entry.inactive .input-fields input i, .persistent-damage-dialog .persistent-entry.inactive .input-fields input:not(:focus), .persistent-damage-dialog .persistent-entry.inactive .input-fields select span, .persistent-damage-dialog .persistent-entry.inactive .input-fields select i, .persistent-damage-dialog .persistent-entry.inactive .input-fields select:not(:focus), .persistent-damage-dialog .persistent-entry.inactive .input-fields label:not(:focus-within) span, .persistent-damage-dialog .persistent-entry.inactive .input-fields label:not(:focus-within) i, .persistent-damage-dialog .persistent-entry.inactive .input-fields label:not(:focus-within):not(:focus) {
  14635. opacity: 0.7;
  14636. text-decoration: line-through;
  14637. }
  14638. .persistent-damage-dialog .persistent-entry a {
  14639. padding: 0.25em;
  14640. }
  14641. .persistent-damage-dialog .persistent-entry .input-fields {
  14642. display: flex;
  14643. gap: 0.25rem;
  14644. align-items: baseline;
  14645. select-height: var(--form-field-height);
  14646. }
  14647. .persistent-damage-dialog .persistent-entry .input-fields label {
  14648. display: flex;
  14649. align-items: baseline;
  14650. gap: 0.19rem;
  14651. height: 100%;
  14652. }
  14653. .persistent-damage-dialog .persistent-entry .input-fields .dc {
  14654. width: 2.5rem;
  14655. }
  14656. .persistent-damage-dialog .persistent-entry .input-fields .invalid {
  14657. box-shadow: 0 0 5px 0px red;
  14658. border-color: red;
  14659. }
  14660. #darkness-adjuster {
  14661. background: none;
  14662. box-shadow: 0 0 10px black;
  14663. height: 38px !important;
  14664. }
  14665. #darkness-adjuster .window-header {
  14666. display: none;
  14667. }
  14668. #darkness-adjuster .window-content {
  14669. background: rgba(0, 0, 0, 0.5);
  14670. border: 1px solid black;
  14671. border-radius: 5px;
  14672. padding: 6px 12px 0;
  14673. }
  14674. #darkness-adjuster .slider {
  14675. height: 6px;
  14676. }
  14677. #darkness-adjuster .slider .noUi-base {
  14678. background: #ecc1b3;
  14679. cursor: pointer;
  14680. }
  14681. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle {
  14682. background: none;
  14683. border: none;
  14684. box-shadow: none;
  14685. color: white;
  14686. font-size: var(--font-size-16);
  14687. height: 14px;
  14688. width: 14px;
  14689. top: -5px;
  14690. right: -7px;
  14691. text-shadow: 0 0 4px black;
  14692. }
  14693. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.threshold_bright-light, #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.threshold_darkness {
  14694. pointer-events: none;
  14695. }
  14696. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.threshold_darkness {
  14697. font-size: var(--font-size-14);
  14698. }
  14699. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.darkness-level {
  14700. background: #c85019;
  14701. border: 1px solid black;
  14702. border-radius: 2px;
  14703. box-shadow: 1px 1px 4px black;
  14704. height: 12px;
  14705. width: 12px;
  14706. right: -6px;
  14707. top: -4px;
  14708. }
  14709. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.darkness-level .noUi-touch-area {
  14710. cursor: grab;
  14711. }
  14712. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle.darkness-level:active .noUi-touch-area {
  14713. cursor: grabbing;
  14714. }
  14715. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle::before, #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle::after {
  14716. background: none;
  14717. }
  14718. #darkness-adjuster .slider .noUi-base .noUi-origin .noUi-handle i.fa-solid {
  14719. cursor: default;
  14720. left: -1px;
  14721. opacity: 0.6;
  14722. position: absolute;
  14723. top: 0;
  14724. }
  14725. #darkness-adjuster .slider .noUi-base .noUi-connect.range_bright-light {
  14726. background: #fdfbd3;
  14727. }
  14728. #darkness-adjuster .slider .noUi-base .noUi-connect.range_darkness {
  14729. background: #16193a;
  14730. }
  14731. #darkness-adjuster .slider .noUi-pips {
  14732. height: 12px;
  14733. }
  14734. #darkness-adjuster .slider .noUi-pips .noUi-marker.noUi-marker-large {
  14735. height: 12px;
  14736. }
  14737. #darkness-adjuster .slider .noUi-pips .noUi-value {
  14738. display: none;
  14739. }
  14740. #darkness-adjuster .synchronized .slider .noUi-base {
  14741. cursor: not-allowed;
  14742. }
  14743. #darkness-adjuster .synchronized .slider .message {
  14744. display: flex;
  14745. justify-content: center;
  14746. position: relative;
  14747. top: 0.5em;
  14748. width: 100%;
  14749. }
  14750. #darkness-adjuster .synchronized .slider .message span {
  14751. color: var(--color-text-light-1);
  14752. text-shadow: 1px 1px black;
  14753. z-index: 1;
  14754. }
  14755. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle {
  14756. cursor: not-allowed;
  14757. }
  14758. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle.darkness-level {
  14759. background: var(--color-disabled);
  14760. border: none;
  14761. box-shadow: none;
  14762. }
  14763. #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 {
  14764. cursor: inherit;
  14765. }
  14766. #darkness-adjuster .synchronized .slider .noUi-origin .noUi-handle i.fas {
  14767. cursor: inherit;
  14768. }
  14769. #darkness-adjuster .synchronized .slider .noUi-pips {
  14770. visibility: hidden;
  14771. }
  14772. .scene-sheet span.range-value.disabled {
  14773. border: none;
  14774. color: #777;
  14775. }
  14776. .app.token-sheet .tab.active[data-tab=appearance] fieldset {
  14777. border: 1px solid #b5b3a4;
  14778. }
  14779. .app.token-sheet .tab.active[data-tab=appearance] fieldset > legend {
  14780. font-size: var(--font-size-15);
  14781. color: #333;
  14782. }
  14783. .app.token-sheet .tab.active[data-tab=appearance] fieldset input[type=number] {
  14784. max-width: 60px;
  14785. text-align: center;
  14786. }
  14787. .app.token-sheet .tab.active[data-tab=appearance] fieldset input[type=number]:disabled {
  14788. border: none;
  14789. color: var(--color-text-dark-6);
  14790. }
  14791. .app.token-sheet .tab.active[data-tab=appearance] fieldset select.alternate-images {
  14792. max-width: 20em;
  14793. }
  14794. .app.token-sheet .tab.active[data-tab=appearance] fieldset:last-child {
  14795. margin: 6px 0;
  14796. }
  14797. .app.token-sheet .tab[data-tab=vision] .disabled[data-tab] {
  14798. color: var(--color-text-dark-6);
  14799. pointer-events: none;
  14800. }
  14801. .app.token-sheet .tab[data-tab=vision] a.managed-by-rbv {
  14802. padding-left: 0.33em;
  14803. }
  14804. .app.token-sheet .form-group.children-disabled .range-value {
  14805. border: none;
  14806. background-color: rgba(0, 0, 0, 0.05);
  14807. color: #777;
  14808. }
  14809. #homebrew-settings section.window-content {
  14810. display: block;
  14811. }
  14812. #homebrew-settings section.window-content .form-group.setting {
  14813. display: inherit;
  14814. }
  14815. #homebrew-settings section.window-content .form-group.setting tags {
  14816. background-color: rgba(0, 0, 0, 0.05);
  14817. border: 1px solid #7a7971;
  14818. border-radius: 3px;
  14819. }
  14820. #homebrew-settings section.window-content .form-group.setting tags.tagify--focus {
  14821. border: 1px solid #7a7971;
  14822. box-shadow: 0 0 5px red;
  14823. }
  14824. #homebrew-settings section.window-content .form-group.setting .homebrew {
  14825. --tag-text-color--edit: #111;
  14826. --tag-pad: 0.2em 0.4em;
  14827. --tag-remove-bg: var(--tag-hover);
  14828. --tag-remove-btn-bg--hover: black;
  14829. font-size: var(--font-size-13);
  14830. min-width: 0;
  14831. }
  14832. #homebrew-settings section.window-content .form-group.buttons {
  14833. margin-top: 0.5em;
  14834. }
  14835. #homebrew-settings .damage-types th, #homebrew-settings .damage-types td {
  14836. white-space: nowrap;
  14837. }
  14838. #homebrew-settings .damage-types th:not(:last-child), #homebrew-settings .damage-types td:not(:last-child) {
  14839. padding-right: 0.25rem;
  14840. }
  14841. #homebrew-settings .damage-types .icon-preview {
  14842. display: flex;
  14843. align-items: center;
  14844. gap: 0.125rem;
  14845. }
  14846. #homebrew-settings .damage-types .delete-cell {
  14847. text-align: end;
  14848. width: 1rem;
  14849. }
  14850. #homebrew-settings .damage-types .delete-cell i {
  14851. padding: 0.125rem 0.25rem;
  14852. cursor: pointer;
  14853. }
  14854. #world-clock-settings form .form-group .form-fields {
  14855. flex-grow: 1;
  14856. }
  14857. #world-clock-settings form .form-group button.reset-world-time {
  14858. flex: 1;
  14859. }
  14860. #game-details > li.system-info {
  14861. margin-bottom: 6px;
  14862. }
  14863. #game-details > li.system-info > a[href] {
  14864. font-size: var(--font-size-12);
  14865. text-transform: uppercase;
  14866. margin-right: 6px;
  14867. }
  14868. #game-details > li.system-info > a[href]:hover {
  14869. text-shadow: 0 0 8px var(--color-text-hyperlink);
  14870. }
  14871. #client-settings form .form-group > label {
  14872. flex: 2.5;
  14873. }
  14874. .settings-menu form .form-group > label {
  14875. flex: 2.5;
  14876. }
  14877. .settings-menu .instructions {
  14878. text-align: center;
  14879. }
  14880. #metagame-settings form .form-group > label {
  14881. flex: 3;
  14882. }
  14883. .select-craft-item-dialog .drop-item-zone {
  14884. display: flex;
  14885. align-items: center;
  14886. margin: 0 2px 5px;
  14887. }
  14888. .select-craft-item-dialog .item-icon {
  14889. height: 32px;
  14890. width: 32px;
  14891. margin-right: 3px;
  14892. }
  14893. .select-craft-item-dialog .button-panel {
  14894. display: flex;
  14895. }
  14896. .select-repair-item-dialog .drop-item-zone {
  14897. display: flex;
  14898. align-items: center;
  14899. margin: 0 2px 5px;
  14900. }
  14901. .select-repair-item-dialog .item-icon {
  14902. height: 32px;
  14903. width: 32px;
  14904. margin-right: 3px;
  14905. }
  14906. .select-repair-item-dialog .button-panel {
  14907. display: flex;
  14908. }
  14909. .app.choice-set-prompt section.window-content h3 {
  14910. display: flex;
  14911. justify-content: center;
  14912. }
  14913. .app.choice-set-prompt section.window-content button, .app.choice-set-prompt section.window-content select {
  14914. display: flex;
  14915. margin: 4px auto;
  14916. }
  14917. .app.choice-set-prompt section.window-content .choices {
  14918. max-width: max-content;
  14919. justify-items: center;
  14920. margin: auto;
  14921. }
  14922. .app.choice-set-prompt section.window-content .choices.select-menu {
  14923. min-width: 18em;
  14924. }
  14925. .app.choice-set-prompt section.window-content .choices.select-menu tags {
  14926. background-color: rgba(0, 0, 0, 0.05);
  14927. border: 1px solid var(--color-border-light-tertiary);
  14928. border-radius: 3px;
  14929. height: 2rem;
  14930. margin-bottom: 0.5em;
  14931. width: 100%;
  14932. }
  14933. .app.choice-set-prompt section.window-content .choices.select-menu tags .tagify__input {
  14934. align-items: center;
  14935. display: flex;
  14936. height: 100%;
  14937. margin: 0;
  14938. }
  14939. .app.choice-set-prompt section.window-content .choices button, .app.choice-set-prompt section.window-content .choices .drop-zone {
  14940. cursor: pointer;
  14941. max-width: 100%;
  14942. }
  14943. .app.choice-set-prompt section.window-content .choices button:not(.with-image), .app.choice-set-prompt section.window-content .choices .drop-zone:not(.with-image) {
  14944. min-width: 120px;
  14945. justify-content: center;
  14946. }
  14947. .app.choice-set-prompt section.window-content .choices button.with-image, .app.choice-set-prompt section.window-content .choices .drop-zone.with-image {
  14948. align-items: center;
  14949. }
  14950. .app.choice-set-prompt section.window-content .choices button.with-image img, .app.choice-set-prompt section.window-content .choices .drop-zone.with-image img {
  14951. border: 1px solid #444;
  14952. height: 1.6em;
  14953. margin-right: 0.5em;
  14954. }
  14955. .app.choice-set-prompt section.window-content .choices .drop-zone {
  14956. border: 1px solid var(--color-border-light-primary);
  14957. border-radius: 3px;
  14958. color: #222;
  14959. cursor: default;
  14960. display: flex;
  14961. padding: 1px 6px;
  14962. font-family: var(--font-primary);
  14963. font-size: var(--font-size-14);
  14964. line-height: 28px;
  14965. }
  14966. .app.choice-set-prompt section.window-content .choices .drop-zone i.fas {
  14967. border: 1px solid #BBB;
  14968. border-radius: 2px;
  14969. align-items: center;
  14970. display: flex;
  14971. height: 1.6em;
  14972. justify-content: center;
  14973. margin-right: 0.5em;
  14974. width: 1.6em;
  14975. }
  14976. .app.choice-set-prompt section.window-content .choices .drop-zone i.fas:after {
  14977. font-size: var(--font-size-20);
  14978. }
  14979. .app.choice-set-prompt section.window-content .choices .drop-zone span {
  14980. color: black;
  14981. flex: 1;
  14982. }
  14983. #ui-middle {
  14984. position: relative;
  14985. }
  14986. .effect-panel {
  14987. pointer-events: initial;
  14988. position: absolute;
  14989. top: 5px;
  14990. right: 0;
  14991. }
  14992. .effect-panel .effect-item {
  14993. display: flex;
  14994. justify-content: flex-end;
  14995. height: 52px;
  14996. }
  14997. .effect-panel .effect-item[data-badge-type=formula] .icon {
  14998. cursor: pointer;
  14999. }
  15000. .effect-panel .effect-item[data-badge-type=formula] .icon:hover::before {
  15001. content: "\f6cf";
  15002. background: rgba(0, 0, 0, 0.5);
  15003. font-family: "Font Awesome 5 Free";
  15004. font-weight: 900;
  15005. font-size: var(--font-size-26);
  15006. color: white;
  15007. position: absolute;
  15008. width: 100%;
  15009. height: 100%;
  15010. display: flex;
  15011. align-items: center;
  15012. justify-content: center;
  15013. padding-bottom: 4px;
  15014. }
  15015. .effect-panel .effect-item:hover .effect-info {
  15016. display: flex;
  15017. align-items: flex-end;
  15018. flex-direction: column;
  15019. }
  15020. .effect-panel .effect-item .effect-info {
  15021. background-color: rgba(0, 0, 0, 0.75);
  15022. color: white;
  15023. display: none;
  15024. height: min-content;
  15025. margin-right: 0.5em;
  15026. max-width: 300px;
  15027. padding: 0.25em 0.5rem;
  15028. }
  15029. .effect-panel .effect-item .effect-info h1 {
  15030. margin: 0;
  15031. padding: 0;
  15032. border: none;
  15033. font-size: var(--font-size-12);
  15034. padding-top: 0.25em;
  15035. text-align: right;
  15036. }
  15037. .effect-panel .effect-item .effect-info h1 i.fa-comment-alt {
  15038. margin-left: 2px;
  15039. }
  15040. .effect-panel .effect-item .effect-info .tags {
  15041. justify-content: flex-end;
  15042. }
  15043. .effect-panel .effect-item .effect-info .tags .tag {
  15044. margin-bottom: 0;
  15045. }
  15046. .effect-panel .effect-item .effect-info .tags .tag + .tag, .effect-panel .effect-item .effect-info .tags .tag:first-child {
  15047. margin-left: 3px;
  15048. margin-right: -2px;
  15049. }
  15050. .effect-panel .effect-item .effect-info > a, .effect-panel .effect-item .effect-info .description a {
  15051. display: block;
  15052. border: 1px outset white;
  15053. font-size: var(--font-size-10);
  15054. margin-top: 0.125rem;
  15055. padding: 0.125rem;
  15056. }
  15057. .effect-panel .effect-item .effect-info > a.content-link, .effect-panel .effect-item .effect-info > a.inline-roll, .effect-panel .effect-item .effect-info .description a.content-link, .effect-panel .effect-item .effect-info .description a.inline-roll {
  15058. padding: 1px 4px;
  15059. border: 1px solid var(--color-border-dark-tertiary);
  15060. width: fit-content;
  15061. display: inline;
  15062. color: var(--color-text-dark-primary);
  15063. }
  15064. .effect-panel .effect-item .effect-info span[data-pf2-check] {
  15065. color: var(--color-text-dark-primary);
  15066. }
  15067. .effect-panel .effect-item .effect-info .instructions, .effect-panel .effect-item .effect-info .description {
  15068. font-size: 0.75em;
  15069. text-align: right;
  15070. }
  15071. .effect-panel .effect-item .effect-info .description {
  15072. max-height: 15em;
  15073. overflow-y: auto;
  15074. text-align: justify;
  15075. }
  15076. .effect-panel .effect-item .icon {
  15077. border: 1px solid rgba(0, 0, 0, 0.5);
  15078. box-shadow: 0 0 0 1px #C0C0C0, 0 0 0 2px #808080;
  15079. align-items: center;
  15080. background-repeat: no-repeat;
  15081. background-size: contain;
  15082. box-shadow: 0 0 0 1px #c0c0c0, 0 0 0 2px #808080, inset 0 0 4px rgba(0, 0, 0, 0.5);
  15083. color: transparent;
  15084. display: flex;
  15085. justify-content: center;
  15086. position: relative;
  15087. margin: 2px 0;
  15088. height: 48px;
  15089. width: 48px;
  15090. }
  15091. .effect-panel .effect-item .icon.aura {
  15092. border-radius: 50%;
  15093. box-shadow: 0px 0px 10px 5px white;
  15094. }
  15095. .effect-panel .effect-item .icon.unidentified {
  15096. filter: drop-shadow(0 0 8px var(--visibility-gm-bg));
  15097. }
  15098. .effect-panel .effect-item .icon .expired {
  15099. position: absolute;
  15100. left: 0;
  15101. bottom: -1px;
  15102. width: 100%;
  15103. padding: 2px 1px;
  15104. font-family: var(--sans-serif);
  15105. font-size: var(--font-size-10);
  15106. text-transform: uppercase;
  15107. letter-spacing: 0.05em;
  15108. text-rendering: optimizeLegibility;
  15109. color: white;
  15110. background-color: var(--primary);
  15111. }
  15112. .effect-panel .effect-item .icon .linked {
  15113. position: absolute;
  15114. display: inline-block;
  15115. bottom: -1px;
  15116. right: -1px;
  15117. padding: 0px 2px;
  15118. color: white;
  15119. background-color: rgba(0, 0, 0, 0.75);
  15120. }
  15121. .effect-panel .effect-item .icon .value-wrapper {
  15122. position: absolute;
  15123. bottom: -1px;
  15124. left: -1px;
  15125. max-width: calc(100% + 2px);
  15126. padding: 0px 2px;
  15127. color: white;
  15128. background-color: rgba(0, 0, 0, 0.75);
  15129. font-size: var(--font-size-13);
  15130. letter-spacing: -0.05em;
  15131. white-space: nowrap;
  15132. overflow: hidden;
  15133. }
  15134. .effect-panel .effect-item .icon .value-wrapper .value {
  15135. overflow: hidden;
  15136. text-overflow: ellipsis;
  15137. }
  15138. .effect-panel .effect-item .icon .value-wrapper .value strong {
  15139. display: inline-block;
  15140. padding-right: 1px;
  15141. }
  15142. .effect-panel > hr {
  15143. margin-right: 0;
  15144. width: 48px;
  15145. }
  15146. .journal-entry-page .journal-page-content {
  15147. --space-s: 0.25em;
  15148. --space-m: 0.5em;
  15149. --space-l: 1em;
  15150. --space-xl: 1.5em;
  15151. --space-2xl: 2em;
  15152. --radius: 3px;
  15153. }
  15154. .journal-entry-page .journal-page-content p {
  15155. min-height: unset;
  15156. }
  15157. .journal-entry-page .journal-page-content :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
  15158. margin-top: 1em;
  15159. }
  15160. .journal-entry-page .journal-page-content .inline-header {
  15161. display: flex;
  15162. align-items: center;
  15163. gap: var(--space-l);
  15164. background-color: var(--alt);
  15165. font-family: var(--sans-serif);
  15166. color: white;
  15167. padding: 0;
  15168. font-size: 0.8em;
  15169. font-weight: 400;
  15170. border: none;
  15171. }
  15172. .journal-entry-page .journal-page-content .inline-header strong {
  15173. display: inline-flex;
  15174. padding: 0 var(--space-m);
  15175. background-color: var(--primary);
  15176. min-width: 15ch;
  15177. border-right: 1px solid rgba(0, 0, 0, 0.4);
  15178. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
  15179. font-weight: 400;
  15180. }
  15181. .journal-entry-page .journal-page-content .inline-header + p {
  15182. margin-top: var(--space-s);
  15183. }
  15184. .journal-entry-page .journal-page-content .info {
  15185. background-color: var(--secondary);
  15186. padding: var(--space-m);
  15187. color: white;
  15188. margin-left: auto;
  15189. margin-right: auto;
  15190. padding: 0;
  15191. border-radius: var(--radius);
  15192. font-family: var(--sans-serif);
  15193. padding-bottom: var(--space-m);
  15194. }
  15195. .journal-entry-page .journal-page-content .info > * + * {
  15196. margin-top: var(--space-m);
  15197. }
  15198. .journal-entry-page .journal-page-content .info + * {
  15199. margin-top: var(--space-xl);
  15200. }
  15201. .journal-entry-page .journal-page-content .info + .journal-entry-page .journal-page-content .info {
  15202. margin-top: var(--space-s);
  15203. }
  15204. .journal-entry-page .journal-page-content .info h4 {
  15205. font-size: 0.9em;
  15206. font-weight: 400;
  15207. line-height: 1.2;
  15208. font-family: var(--sans-serif);
  15209. border-bottom: 1px solid rgba(0, 0, 0, 0.6);
  15210. padding: var(--space-m) var(--space-l);
  15211. position: relative;
  15212. display: flex;
  15213. align-items: center;
  15214. justify-content: space-between;
  15215. color: white;
  15216. }
  15217. .journal-entry-page .journal-page-content .info h4::after {
  15218. font-family: "Font Awesome 6";
  15219. content: "\f05a";
  15220. font-weight: 900;
  15221. margin-right: var(--space-s);
  15222. }
  15223. .journal-entry-page .journal-page-content .info p {
  15224. font-size: 0.8em;
  15225. margin: 0;
  15226. padding: 0 var(--space-l);
  15227. }
  15228. .journal-entry-page .journal-page-content .info p:first-of-type {
  15229. padding-top: var(--space-m);
  15230. border-top: 1px solid rgba(255, 255, 255, 0.1);
  15231. }
  15232. .journal-entry-page .journal-page-content .traits {
  15233. display: flex;
  15234. flex-wrap: wrap;
  15235. padding: 0;
  15236. }
  15237. .journal-entry-page .journal-page-content .traits p {
  15238. display: inline-flex;
  15239. padding: 0.16rem 0.25rem;
  15240. margin: 0;
  15241. background-color: var(--primary);
  15242. border: 2px solid var(--color-border-trait);
  15243. color: white;
  15244. font: 500 var(--font-size-10) var(--sans-serif);
  15245. text-transform: uppercase;
  15246. }
  15247. .journal-entry-page .journal-page-content .statblock {
  15248. font-family: var(--sans-serif-condensed);
  15249. color: black;
  15250. line-height: 1.2;
  15251. margin-bottom: var(--space-m);
  15252. }
  15253. .journal-entry-page .journal-page-content .statblock > * + * {
  15254. margin-top: var(--space-s);
  15255. margin-bottom: 0;
  15256. }
  15257. .journal-entry-page .journal-page-content .statblock p {
  15258. --indent: var(--space-l);
  15259. margin-left: var(--indent);
  15260. position: relative;
  15261. }
  15262. .journal-entry-page .journal-page-content .statblock p strong:first-of-type {
  15263. margin-left: calc(var(--indent) * -1);
  15264. }
  15265. .journal-entry-page .journal-page-content .statblock p .trait:first-of-type {
  15266. margin-left: calc(var(--indent) * -1 - 2px);
  15267. }
  15268. .journal-entry-page .journal-page-content .statblock span.pf2-icon {
  15269. line-height: 1;
  15270. }
  15271. .journal-entry-page .journal-page-content .statblock h1,
  15272. .journal-entry-page .journal-page-content .statblock h2,
  15273. .journal-entry-page .journal-page-content .statblock h3,
  15274. .journal-entry-page .journal-page-content .statblock h4 {
  15275. display: flex;
  15276. align-items: baseline;
  15277. justify-content: space-between;
  15278. border-bottom: 1px solid black;
  15279. text-transform: uppercase;
  15280. letter-spacing: -0.05em;
  15281. font-family: var(--sans-serif-condensed);
  15282. font-weight: 700;
  15283. }
  15284. .journal-entry-page .journal-page-content .statblock hr {
  15285. border: none;
  15286. border-bottom: 1px solid black;
  15287. }
  15288. .journal-entry-page .journal-page-content .message {
  15289. font-family: var(--journal-cursive);
  15290. font-size: 2em;
  15291. line-height: 1.2;
  15292. }
  15293. .journal-entry-page .journal-page-content .fumble-deck h1 {
  15294. font-family: var(--font-primary);
  15295. font-size: 1.75em;
  15296. font-weight: bold;
  15297. line-height: normal;
  15298. text-transform: uppercase;
  15299. color: black;
  15300. border: 2px solid;
  15301. border-radius: 15px;
  15302. padding: 0 0 0 1.5em;
  15303. background-size: 1.22em;
  15304. background-repeat: no-repeat;
  15305. background-color: #e5bf85;
  15306. position: relative;
  15307. top: 1em;
  15308. width: 80%;
  15309. }
  15310. .journal-entry-page .journal-page-content .fumble-deck h1:first-child {
  15311. background-image: url("../icons/equipment/weapons/gnome-hooked-hammer.webp");
  15312. }
  15313. .journal-entry-page .journal-page-content .fumble-deck h1:nth-of-type(2) {
  15314. background-image: url("../icons/equipment/weapons/longbow.webp");
  15315. }
  15316. .journal-entry-page .journal-page-content .fumble-deck h1:nth-of-type(3) {
  15317. background-image: url("../icons/equipment/weapons/fist.webp");
  15318. }
  15319. .journal-entry-page .journal-page-content .fumble-deck h1:nth-of-type(4) {
  15320. background-image: url("../icons/spells/chain-lightning.webp");
  15321. }
  15322. .journal-entry-page .journal-page-content .fumble-deck blockquote {
  15323. font-family: var(--font-primary);
  15324. border-left: none;
  15325. background-color: #000059;
  15326. color: white;
  15327. font-size: 120%;
  15328. margin-left: 0.7em;
  15329. padding: 1.2em 1.25em 0.75em;
  15330. border-radius: 8px;
  15331. }
  15332. .journal-entry-page .journal-page-content .fumble-deck blockquote a {
  15333. color: black;
  15334. }
  15335. .journal-entry-page .journal-page-content .fumble-deck blockquote span.with-repost {
  15336. color: black;
  15337. }
  15338. .journal-entry-page .journal-page-content .fumble-deck code {
  15339. font-family: var(--font-primary);
  15340. font-weight: bold;
  15341. font-size: 100%;
  15342. line-height: normal;
  15343. background-image: url("../assets/critfumble-banner.webp");
  15344. background-size: 100% 100%;
  15345. box-shadow: 5px 5px 10px 3px #282a2d;
  15346. display: inline-block;
  15347. float: right;
  15348. text-align: center;
  15349. margin-top: -1.75em;
  15350. margin-right: 0.75em;
  15351. width: 7em;
  15352. padding: 0.5em;
  15353. }
  15354. .journal-entry-page .journal-page-content .critical-deck h1 {
  15355. font-family: var(--font-primary);
  15356. font-size: 1.75em;
  15357. font-weight: bold;
  15358. line-height: normal;
  15359. text-transform: uppercase;
  15360. color: black;
  15361. border: 2px solid;
  15362. border-radius: 15px;
  15363. padding: 0 0 0 1.5em;
  15364. background-size: 1.22em;
  15365. background-repeat: no-repeat;
  15366. background-color: #e5bf85;
  15367. position: relative;
  15368. top: 1em;
  15369. width: 80%;
  15370. }
  15371. .journal-entry-page .journal-page-content .critical-deck h1:first-child {
  15372. background-image: url("../icons/equipment/weapons/light-hammer.webp");
  15373. }
  15374. .journal-entry-page .journal-page-content .critical-deck h1:nth-of-type(2) {
  15375. background-image: url("../../../icons/weapons/polearms/javelin.webp");
  15376. }
  15377. .journal-entry-page .journal-page-content .critical-deck h1:nth-of-type(3) {
  15378. background-image: url("../../../icons/weapons/axes/axe-battle-worn.webp");
  15379. }
  15380. .journal-entry-page .journal-page-content .critical-deck h1:nth-of-type(4) {
  15381. background-image: url("../../../icons/weapons/thrown/bomb-fuse-cloth-pink.webp");
  15382. }
  15383. .journal-entry-page .journal-page-content .critical-deck blockquote {
  15384. font-family: var(--font-primary);
  15385. border-left: none;
  15386. background: rgb(14, 40, 17);
  15387. background: radial-gradient(circle, rgb(14, 40, 17) 10%, rgb(20, 59, 25) 50%, rgb(14, 40, 17) 90%);
  15388. color: white;
  15389. font-size: 120%;
  15390. margin-left: 0.7em;
  15391. padding: 1.2em 1.25em 0.75em;
  15392. border-radius: 8px;
  15393. }
  15394. .journal-entry-page .journal-page-content .critical-deck blockquote a {
  15395. color: black;
  15396. }
  15397. .journal-entry-page .journal-page-content .critical-deck blockquote span.with-repost {
  15398. color: black;
  15399. }
  15400. .journal-entry-page .journal-page-content .critical-deck code {
  15401. font-family: var(--font-primary);
  15402. font-weight: bold;
  15403. font-size: 100%;
  15404. line-height: normal;
  15405. background-image: url("../assets/critfumble-banner.webp");
  15406. background-size: 100% 100%;
  15407. box-shadow: 5px 5px 10px 3px #282a2d;
  15408. display: inline-block;
  15409. float: right;
  15410. text-align: center;
  15411. margin-top: -1.75em;
  15412. margin-right: 0.75em;
  15413. width: 9em;
  15414. padding: 0.5em;
  15415. }
  15416. #migration-summary > .window-content > h3 {
  15417. margin: auto;
  15418. }
  15419. #migration-summary > .window-content > .dialog-content > table i.fa-check {
  15420. color: green;
  15421. }
  15422. #migration-summary > .window-content > .dialog-content > table i.fa-times {
  15423. color: red;
  15424. }
  15425. #migration-summary > .window-content > .dialog-content > table td {
  15426. text-align: center;
  15427. }
  15428. #migration-summary > .window-content > .dialog-buttons {
  15429. display: flex;
  15430. }
  15431. #migration-summary > .window-content > .dialog-buttons:disabled::hover {
  15432. box-shadow: none;
  15433. }
  15434. #upw-viewer .window-content {
  15435. background: no-repeat right url("../assets/upw-logo.webp") black;
  15436. }
  15437. #upw-viewer .window-content .content {
  15438. color: #eee;
  15439. width: 435px;
  15440. font-size: larger;
  15441. }
  15442. #upw-viewer .window-content .content a[href] {
  15443. color: #8b6cae;
  15444. font-size: large;
  15445. display: block;
  15446. text-align: center;
  15447. }
  15448. #world-clock section.window-content {
  15449. font-size: 1rem;
  15450. }
  15451. #world-clock section.window-content h1 {
  15452. font-size: inherit;
  15453. text-align: center;
  15454. }
  15455. #world-clock section.window-content .input-grid {
  15456. align-items: center;
  15457. display: flex;
  15458. flex-wrap: wrap;
  15459. font-size: 0.8rem;
  15460. justify-content: space-evenly;
  15461. }
  15462. #world-clock section.window-content .input-grid > * {
  15463. flex-basis: 32%;
  15464. height: 1.5rem;
  15465. line-height: 20px;
  15466. }
  15467. #world-clock section.window-content .input-grid .sign {
  15468. font-family: var(--sans-serif-monospace);
  15469. font-size: inherit;
  15470. }
  15471. #world-clock section.window-content .input-grid button {
  15472. align-items: center;
  15473. display: flex;
  15474. font-size: inherit;
  15475. justify-content: center;
  15476. margin: 1px;
  15477. }
  15478. #world-clock section.window-content .input-grid button img {
  15479. border: none;
  15480. height: 1.5em;
  15481. }
  15482. #world-clock section.window-content .input-grid .time-of-day {
  15483. display: flex;
  15484. flex-basis: 100%;
  15485. margin: 0 3px;
  15486. }
  15487. #world-clock section.window-content .input-grid .time-of-day img.midnight {
  15488. height: 1.05rem;
  15489. }
  15490. .tags {
  15491. display: flex;
  15492. flex-wrap: wrap;
  15493. gap: 2px;
  15494. list-style-type: none;
  15495. margin-bottom: 2px;
  15496. padding-left: 0;
  15497. }
  15498. .tags .tag, .tags .tag option {
  15499. font-family: var(--sans-serif);
  15500. font-size: var(--font-size-10);
  15501. text-transform: uppercase;
  15502. letter-spacing: 0.05em;
  15503. text-rendering: optimizeLegibility;
  15504. align-items: center;
  15505. background-color: var(--primary);
  15506. border-radius: 2px;
  15507. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
  15508. color: white;
  15509. display: flex;
  15510. font-weight: 500;
  15511. min-height: 1.5em;
  15512. padding: 0 0.33em;
  15513. }
  15514. .tags .tag.edit-btn, .tags .tag option.edit-btn {
  15515. align-items: center;
  15516. background-color: white;
  15517. border-radius: 0;
  15518. color: var(--primary);
  15519. display: flex;
  15520. justify-content: center;
  15521. }
  15522. .tags .tag.edit-btn a, .tags .tag option.edit-btn a {
  15523. display: inline-flex;
  15524. }
  15525. .tags .tag.edit-btn a svg, .tags .tag option.edit-btn a svg {
  15526. height: 9px;
  15527. width: auto;
  15528. }
  15529. .tags .tag.tag_secondary, .tags .tag option.tag_secondary {
  15530. background-color: var(--secondary);
  15531. color: white;
  15532. }
  15533. .tags .tag.tag_tertiary, .tags .tag option.tag_tertiary {
  15534. background-color: var(--tertiary);
  15535. color: white;
  15536. }
  15537. .tags .tag.tag_alt, .tags .tag option.tag_alt {
  15538. background-color: var(--alt);
  15539. color: white;
  15540. }
  15541. .tags .tag.tag_material, .tags .tag option.tag_material {
  15542. background-color: var(--alt-dark);
  15543. color: white;
  15544. }
  15545. .tags .tag.tag_transparent, .tags .tag option.tag_transparent {
  15546. background-color: transparent;
  15547. color: var(--text-color-dark-2);
  15548. text-transform: none;
  15549. font-family: var(--font-primary);
  15550. font-size: var(--font-size-10);
  15551. box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3);
  15552. border-radius: 4px;
  15553. }
  15554. .tags .tag.mystified, .tags .tag option.mystified {
  15555. opacity: 0.7;
  15556. }
  15557. .tags .tag.common, .tags .tag[value=common], .tags .tag option.common, .tags .tag option[value=common] {
  15558. border-color: #323232;
  15559. background-color: #323232;
  15560. }
  15561. .tags .tag.uncommon, .tags .tag[value=uncommon], .tags .tag option.uncommon, .tags .tag option[value=uncommon] {
  15562. border-color: #98513d;
  15563. background-color: #98513d;
  15564. }
  15565. .tags .tag.rare, .tags .tag[value=rare], .tags .tag option.rare, .tags .tag option[value=rare] {
  15566. border-color: #002664;
  15567. background-color: #002664;
  15568. }
  15569. .tags .tag.unique, .tags .tag[value=unique], .tags .tag option.unique, .tags .tag option[value=unique] {
  15570. border-color: #54166e;
  15571. background-color: #54166e;
  15572. }
  15573. li.chat-message .tags .tag {
  15574. height: unset;
  15575. line-height: 1.65em;
  15576. min-height: 1em;
  15577. }
  15578. li.chat-message .tags .tag_transparent {
  15579. line-height: 1.25em;
  15580. padding: 0.1em 0.25em;
  15581. }
  15582. .tags.paizo-style {
  15583. align-items: center;
  15584. border-radius: 3px;
  15585. padding: 0.05em;
  15586. gap: 0;
  15587. }
  15588. .tags.paizo-style select.tag {
  15589. height: 22px;
  15590. }
  15591. .tags.paizo-style tag, .tags.paizo-style .tag, .tags.paizo-style select.tag {
  15592. border: 2px solid var(--color-border-trait);
  15593. margin: 0;
  15594. min-height: 22px;
  15595. }
  15596. .tags.paizo-style tag x, .tags.paizo-style .tag x, .tags.paizo-style select.tag x {
  15597. align-items: start;
  15598. margin: 0;
  15599. }
  15600. .tags.paizo-style tag__removeBtn, .tags.paizo-style .tag__removeBtn, .tags.paizo-style select.tag__removeBtn {
  15601. align-items: baseline;
  15602. }
  15603. .tags.paizo-style tag > div {
  15604. padding: 0 0.09rem 0 0.25rem;
  15605. }
  15606. .tags.paizo-style tag > div, .tags.paizo-style .tag, .tags.paizo-style select {
  15607. border-radius: 0;
  15608. display: flex;
  15609. font: 500 var(--font-size-10) var(--sans-serif);
  15610. }
  15611. .tags.paizo-style tag > div .tagify__tag-text, .tags.paizo-style .tag .tagify__tag-text, .tags.paizo-style select .tagify__tag-text {
  15612. text-transform: uppercase;
  15613. }
  15614. .tags.paizo-style[disabled] {
  15615. filter: none;
  15616. }
  15617. .tags.paizo-style[disabled] tag > div::before {
  15618. animation: none !important;
  15619. }
  15620. .tags.paizo-style[disabled] > .tagify__input {
  15621. display: none;
  15622. }
  15623. tags.tags.paizo-style {
  15624. background-color: rgba(0, 0, 0, 0.075);
  15625. --tag-bg: var(--primary);
  15626. --tag-hover: var(--primary);
  15627. --tag-remove-btn-color: var(--color-text-trait);
  15628. --tag-text-color: var(--color-text-trait);
  15629. --tags-border-color: var(--color-border-light-tertiary);
  15630. --tags-focus-border-color: var(--color-border-light-tertiary);
  15631. --tags-hover-border-color: var(--color-border-light-tertiary);
  15632. --readonly-striped: 0;
  15633. }
  15634. tags.tags.paizo-style .tagify__input {
  15635. margin: 0;
  15636. padding: 0.1em 0.5em;
  15637. }
  15638. tags.tags.paizo-style .tagify__input::before {
  15639. align-items: center;
  15640. color: var(--color-text-dark-secondary);
  15641. display: flex;
  15642. font: 500 var(--font-size-10) var(--sans-serif);
  15643. letter-spacing: 0.05em;
  15644. margin: 0;
  15645. min-height: 22px;
  15646. text-rendering: optimizeLegibility;
  15647. text-transform: uppercase;
  15648. width: fit-content;
  15649. }
  15650. tags.tags.paizo-style .conjunction-not .tagify__tag-text {
  15651. text-decoration: line-through;
  15652. text-decoration-color: var(--color-text-trait);
  15653. }
  15654. tags.tags.paizo-style tag[readonly=true] {
  15655. padding-right: 2px;
  15656. }
  15657. tags.tagify.pf2e-tagify {
  15658. --tag-bg: var(--color-text-light-3);
  15659. --tags-border-color: var(--color-text-light-5);
  15660. --tags-hover-border-color: var(--color-text-light-5);
  15661. align-items: center;
  15662. background-color: rgba(255, 255, 255, 0.5);
  15663. border-radius: 3px;
  15664. gap: 3px;
  15665. padding: 2px;
  15666. }
  15667. tags.tagify.pf2e-tagify:hover {
  15668. box-shadow: 0 0 10px #00005a;
  15669. }
  15670. tags.tagify.pf2e-tagify tag {
  15671. margin: 0;
  15672. padding: 1px;
  15673. }
  15674. tags.tagify.pf2e-tagify tag x {
  15675. margin: 0;
  15676. }
  15677. tags.tagify.pf2e-tagify tag > div {
  15678. padding: 2px;
  15679. }
  15680. tags.tagify.pf2e-tagify tag > div .tagify__tag-text {
  15681. font-weight: normal;
  15682. }
  15683. tags.tagify.pf2e-tagify tag .tagify__tag__removeBtn {
  15684. align-items: baseline;
  15685. }
  15686. tags.tagify.pf2e-tagify .tagify__input {
  15687. margin: 0;
  15688. }
  15689. tags.pf2e-tagify.tagify--hasMaxTags > span, tags.tags.paizo-style.tagify--hasMaxTags > span {
  15690. display: none;
  15691. }
  15692. tags.pf2e-tagify:not(.tagify--select) > span, tags.tags.paizo-style:not(.tagify--select) > span {
  15693. min-width: 20px;
  15694. }
  15695. .damage-tag {
  15696. white-space: nowrap;
  15697. margin: 0 1px 1px 0;
  15698. padding: 0 3px;
  15699. font-size: var(--font-size-10);
  15700. line-height: 16px;
  15701. border: 1px solid #999;
  15702. border-radius: 3px;
  15703. }
  15704. .damage-tag-base {
  15705. color: white;
  15706. background: rgba(0, 0, 0, 0.45);
  15707. }
  15708. .damage-tag-modifier {
  15709. background: rgba(0, 0, 0, 0.05);
  15710. }
  15711. .tagify {
  15712. --tag-inset-shadow-size: 10em ;
  15713. }
  15714. .tagify__tag__removeBtn {
  15715. overflow: visible;
  15716. }
  15717. .travel-duration h2 {
  15718. margin-top: 10px;
  15719. margin-bottom: 30px;
  15720. }
  15721. .travel-duration table td {
  15722. padding: 5px 10px;
  15723. }
  15724. .travel-duration table td.centered {
  15725. text-align: center;
  15726. }
  15727. .travel-duration .journey-input {
  15728. display: grid;
  15729. column-gap: 5px;
  15730. grid: "size type"/50px 1fr 1fr;
  15731. }
  15732. .travel-duration .fraction-input {
  15733. text-align: center;
  15734. }
  15735. .travel-duration .fraction-input input {
  15736. width: 30px;
  15737. }
  15738. .travel-duration .speed-input {
  15739. width: 30px;
  15740. }