@import url("https://fonts.googleapis.com/css?family=Baumans|Roboto+Mono&display=swap");
html {
  font-size: 13px;
}

#attributes:not(.active-section) > .available-dice, .sticky-sub {
  top: 70.5px;
  position: sticky;
  z-index: 100;
}

#main h6, #main .h6, #main button[type=roll].h6, #main button[type=action].h6,
.sheet-rolltemplate-scp h6,
.sheet-rolltemplate-scp .h6,
.sheet-rolltemplate-scp button[type=roll].h6,
.sheet-rolltemplate-scp button[type=action].h6, #main h5, #main .h5, #main button[type=roll].h5, #main button[type=action].h5,
.sheet-rolltemplate-scp h5,
.sheet-rolltemplate-scp .h5,
.sheet-rolltemplate-scp button[type=roll].h5,
.sheet-rolltemplate-scp button[type=action].h5, #main h4, #main .h4, #main button[type=roll].h4, #main button[type=action].h4,
.sheet-rolltemplate-scp h4,
.sheet-rolltemplate-scp .h4,
.sheet-rolltemplate-scp button[type=roll].h4,
.sheet-rolltemplate-scp button[type=action].h4, #main h3, #main .h3, #main button[type=roll].h3, #main button[type=action].h3,
.sheet-rolltemplate-scp h3,
.sheet-rolltemplate-scp .h3,
.sheet-rolltemplate-scp button[type=roll].h3,
.sheet-rolltemplate-scp button[type=action].h3, #main .input-label.large > input,
.sheet-rolltemplate-scp .input-label.large > input, #main h2, #main .h2, #main button[type=roll].h2, #main button[type=action].h2,
.sheet-rolltemplate-scp h2,
.sheet-rolltemplate-scp .h2,
.sheet-rolltemplate-scp button[type=roll].h2,
.sheet-rolltemplate-scp button[type=action].h2 {
  font-family: Roboto Mono;
}

#main *,
.sheet-rolltemplate-scp * {
  font-family: Tahoma;
}

#equipment.repeating-equipment h4, #attacks > h4:not(input), :is(#knowledges, #skills, #abilities) > .header {
  border: solid black;
  border-width: 2px 1px;
}

#main h5, #main .h5, #main button[type=roll].h5, #main button[type=action].h5,
.sheet-rolltemplate-scp h5,
.sheet-rolltemplate-scp .h5,
.sheet-rolltemplate-scp button[type=roll].h5,
.sheet-rolltemplate-scp button[type=action].h5, #main h4, #main .h4, #main button[type=roll].h4, #main button[type=action].h4,
.sheet-rolltemplate-scp h4,
.sheet-rolltemplate-scp .h4,
.sheet-rolltemplate-scp button[type=roll].h4,
.sheet-rolltemplate-scp button[type=action].h4, #main h3, #main .h3, #main button[type=roll].h3, #main button[type=action].h3,
.sheet-rolltemplate-scp h3,
.sheet-rolltemplate-scp .h3,
.sheet-rolltemplate-scp button[type=roll].h3,
.sheet-rolltemplate-scp button[type=action].h3, #main .input-label.large > input,
.sheet-rolltemplate-scp .input-label.large > input, #main h2, #main .h2, #main button[type=roll].h2, #main button[type=action].h2,
.sheet-rolltemplate-scp h2,
.sheet-rolltemplate-scp .h2,
.sheet-rolltemplate-scp button[type=roll].h2,
.sheet-rolltemplate-scp button[type=action].h2, #security_level > .head .security_level > input, #main h1, #main .h1, #main button[type=roll].h1, #main button[type=action].h1,
.sheet-rolltemplate-scp h1,
.sheet-rolltemplate-scp .h1,
.sheet-rolltemplate-scp button[type=roll].h1,
.sheet-rolltemplate-scp button[type=action].h1 {
  text-transform: capitalize;
  font-weight: bold;
  line-height: normal;
  display: block;
  white-space: nowrap;
}
#main h5 margin, #main .h5 margin, #main button[type=roll].h5 margin, #main button[type=action].h5 margin,
.sheet-rolltemplate-scp h5 margin,
.sheet-rolltemplate-scp .h5 margin,
.sheet-rolltemplate-scp button[type=roll].h5 margin,
.sheet-rolltemplate-scp button[type=action].h5 margin, #main h4 margin, #main .h4 margin, #main button[type=roll].h4 margin, #main button[type=action].h4 margin,
.sheet-rolltemplate-scp h4 margin,
.sheet-rolltemplate-scp .h4 margin,
.sheet-rolltemplate-scp button[type=roll].h4 margin,
.sheet-rolltemplate-scp button[type=action].h4 margin, #main h3 margin, #main .h3 margin, #main button[type=roll].h3 margin, #main button[type=action].h3 margin,
.sheet-rolltemplate-scp h3 margin,
.sheet-rolltemplate-scp .h3 margin,
.sheet-rolltemplate-scp button[type=roll].h3 margin,
.sheet-rolltemplate-scp button[type=action].h3 margin, #main .input-label.large > input margin,
.sheet-rolltemplate-scp .input-label.large > input margin, #main h2 margin, #main .h2 margin, #main button[type=roll].h2 margin, #main button[type=action].h2 margin,
.sheet-rolltemplate-scp h2 margin,
.sheet-rolltemplate-scp .h2 margin,
.sheet-rolltemplate-scp button[type=roll].h2 margin,
.sheet-rolltemplate-scp button[type=action].h2 margin, #security_level > .head .security_level > input margin, #main h1 margin, #main .h1 margin, #main button[type=roll].h1 margin, #main button[type=action].h1 margin,
.sheet-rolltemplate-scp h1 margin,
.sheet-rolltemplate-scp .h1 margin,
.sheet-rolltemplate-scp button[type=roll].h1 margin,
.sheet-rolltemplate-scp button[type=action].h1 margin {
  top: 0px;
  bottom: 0px;
}

#security_level > .head .security_level > input, #main h1, #main .h1, #main button[type=roll].h1, #main button[type=action].h1,
.sheet-rolltemplate-scp h1,
.sheet-rolltemplate-scp .h1,
.sheet-rolltemplate-scp button[type=roll].h1,
.sheet-rolltemplate-scp button[type=action].h1 {
  font-size: 3rem;
  display: block;
  font-family: Baumans;
}
#security_level > .head .security_level > input:not(input), #main h1:not(input), #main .h1:not(input), #main button[type=roll].h1:not(input), #main button[type=action].h1:not(input),
.sheet-rolltemplate-scp h1:not(input),
.sheet-rolltemplate-scp .h1:not(input),
.sheet-rolltemplate-scp button[type=roll].h1:not(input),
.sheet-rolltemplate-scp button[type=action].h1:not(input) {
  text-align: center;
}

#main .input-label.large > input,
.sheet-rolltemplate-scp .input-label.large > input, #main h2, #main .h2, #main button[type=roll].h2, #main button[type=action].h2,
.sheet-rolltemplate-scp h2,
.sheet-rolltemplate-scp .h2,
.sheet-rolltemplate-scp button[type=roll].h2,
.sheet-rolltemplate-scp button[type=action].h2 {
  font-size: 2.5rem;
  display: block;
}
#main .input-label.large > input:not(input),
.sheet-rolltemplate-scp .input-label.large > input:not(input), #main h2:not(input), #main .h2:not(input), #main button[type=roll].h2:not(input), #main button[type=action].h2:not(input),
.sheet-rolltemplate-scp h2:not(input),
.sheet-rolltemplate-scp .h2:not(input),
.sheet-rolltemplate-scp button[type=roll].h2:not(input),
.sheet-rolltemplate-scp button[type=action].h2:not(input) {
  text-align: center;
}

#main h3, #main .h3, #main button[type=roll].h3, #main button[type=action].h3,
.sheet-rolltemplate-scp h3,
.sheet-rolltemplate-scp .h3,
.sheet-rolltemplate-scp button[type=roll].h3,
.sheet-rolltemplate-scp button[type=action].h3 {
  font-size: 2rem;
  display: block;
}
#main h3:not(input), #main .h3:not(input), #main button[type=roll].h3:not(input), #main button[type=action].h3:not(input),
.sheet-rolltemplate-scp h3:not(input),
.sheet-rolltemplate-scp .h3:not(input),
.sheet-rolltemplate-scp button[type=roll].h3:not(input),
.sheet-rolltemplate-scp button[type=action].h3:not(input) {
  text-align: center;
}

#main h4, #main .h4, #main button[type=roll].h4, #main button[type=action].h4,
.sheet-rolltemplate-scp h4,
.sheet-rolltemplate-scp .h4,
.sheet-rolltemplate-scp button[type=roll].h4,
.sheet-rolltemplate-scp button[type=action].h4 {
  font-size: 1.5rem;
  font-weight: bold;
  display: block;
}
#main h4:not(input), #main .h4:not(input), #main button[type=roll].h4:not(input), #main button[type=action].h4:not(input),
.sheet-rolltemplate-scp h4:not(input),
.sheet-rolltemplate-scp .h4:not(input),
.sheet-rolltemplate-scp button[type=roll].h4:not(input),
.sheet-rolltemplate-scp button[type=action].h4:not(input) {
  text-align: center;
}

#main h5, #main .h5, #main button[type=roll].h5, #main button[type=action].h5,
.sheet-rolltemplate-scp h5,
.sheet-rolltemplate-scp .h5,
.sheet-rolltemplate-scp button[type=roll].h5,
.sheet-rolltemplate-scp button[type=action].h5 {
  font-size: 1rem;
  display: block;
}
#main h5:not(input), #main .h5:not(input), #main button[type=roll].h5:not(input), #main button[type=action].h5:not(input),
.sheet-rolltemplate-scp h5:not(input),
.sheet-rolltemplate-scp .h5:not(input),
.sheet-rolltemplate-scp button[type=roll].h5:not(input),
.sheet-rolltemplate-scp button[type=action].h5:not(input) {
  text-align: center;
}

#main h6, #main .h6, #main button[type=roll].h6, #main button[type=action].h6,
.sheet-rolltemplate-scp h6,
.sheet-rolltemplate-scp .h6,
.sheet-rolltemplate-scp button[type=roll].h6,
.sheet-rolltemplate-scp button[type=action].h6 {
  font-size: 1rem;
  display: block;
  font-style: italic;
}
#main h6:not(input), #main .h6:not(input), #main button[type=roll].h6:not(input), #main button[type=action].h6:not(input),
.sheet-rolltemplate-scp h6:not(input),
.sheet-rolltemplate-scp .h6:not(input),
.sheet-rolltemplate-scp button[type=roll].h6:not(input),
.sheet-rolltemplate-scp button[type=action].h6:not(input) {
  text-align: center;
}

.characterviewer > ul.nav-tabs > li.active {
  z-index: 100;
}
.characterviewer > ul.nav-tabs a[data-tab=charsheet] {
  display: flex;
  align-items: center;
  line-height: 1rem;
  padding-top: 0;
  padding-bottom: 1px;
  padding-left: 6px;
}
.characterviewer > ul.nav-tabs a[data-tab=charsheet]:before {
  content: "X";
  background-image: url(https://s3.amazonaws.com/files.d20.io/images/237119632/ALMH-rWYBVVqwtIQI970xw/original.png);
  width: 3rem;
  color: transparent;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  font-size: 2rem;
  line-height: normal;
}

#main,
.sheet-rolltemplate-scp {
  --grid-gap:1rem;
  --half-gap:calc(var(--grid-gap) / 2);
  --tiny-gap:calc(var(--half-gap) / 2);
  position: relative;
  gap: var(--grid-gap);
  --revealTime:500ms;
  --delayTime:200ms;
  --inputSwap:opacity var(--revealTime) ease var(--delayTime);
  --focusTrans:all 500ms ease var(--delayTime);
  --borderColor:black;
  --fontColor:black;
  --backColor:#636363;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
#main .transparent-logo,
.sheet-rolltemplate-scp .transparent-logo {
  aspect-ratio: 1/1;
  background-image: url("https://s3.amazonaws.com/files.d20.io/images/237119631/qha_0dNwFDUbYjLIGp2SCg/original.png");
  background-repeat: no-repeat;
  background-size: contain;
}
#main .black-logo,
#main .sheet-black-logo,
.sheet-rolltemplate-scp .black-logo,
.sheet-rolltemplate-scp .sheet-black-logo {
  aspect-ratio: 1/1;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  grid-template-areas: "content";
}
#main .black-logo > .logo,
#main .black-logo .sheet-logo,
#main .sheet-black-logo > .logo,
#main .sheet-black-logo .sheet-logo,
.sheet-rolltemplate-scp .black-logo > .logo,
.sheet-rolltemplate-scp .black-logo .sheet-logo,
.sheet-rolltemplate-scp .sheet-black-logo > .logo,
.sheet-rolltemplate-scp .sheet-black-logo .sheet-logo {
  grid-area: content;
  background-image: url("https://s3.amazonaws.com/files.d20.io/images/237119632/ALMH-rWYBVVqwtIQI970xw/original.png");
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 10;
}
#main .black-logo > .black-diamond,
#main .black-logo .sheet-black-diamond,
#main .sheet-black-logo > .black-diamond,
#main .sheet-black-logo .sheet-black-diamond,
.sheet-rolltemplate-scp .black-logo > .black-diamond,
.sheet-rolltemplate-scp .black-logo .sheet-black-diamond,
.sheet-rolltemplate-scp .sheet-black-logo > .black-diamond,
.sheet-rolltemplate-scp .sheet-black-logo .sheet-black-diamond {
  grid-area: content;
  background-color: var(--fontColor);
  width: 100%;
  height: 100%;
  transform: scale(0.75) rotate(45deg);
}
#main *,
.sheet-rolltemplate-scp * {
  color: black;
  transition: var(--focusTrans);
}
#main select, #main textarea, #main input, #main .uneditable-input, #main label, #main button,
.sheet-rolltemplate-scp select,
.sheet-rolltemplate-scp textarea,
.sheet-rolltemplate-scp input,
.sheet-rolltemplate-scp .uneditable-input,
.sheet-rolltemplate-scp label,
.sheet-rolltemplate-scp button {
  all: unset;
}
#main [hidden],
.sheet-rolltemplate-scp [hidden] {
  display: none;
}
#main button,
.sheet-rolltemplate-scp button {
  font-weight: bold;
  cursor: pointer;
}
#main textarea,
.sheet-rolltemplate-scp textarea {
  resize: vertical;
  min-height: 3.5rem;
  white-space: pre-wrap;
}
#main select, #main input, #main .uneditable-input,
.sheet-rolltemplate-scp select,
.sheet-rolltemplate-scp input,
.sheet-rolltemplate-scp .uneditable-input {
  padding: initial;
}
#main select, #main input, #main .uneditable-input, #main textarea,
.sheet-rolltemplate-scp select,
.sheet-rolltemplate-scp input,
.sheet-rolltemplate-scp .uneditable-input,
.sheet-rolltemplate-scp textarea {
  border-width: 1px 3px;
  border-style: solid;
  border-radius: 5px;
  border-color: transparent;
  box-sizing: border-box;
}
#main select:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus), #main input:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus), #main .uneditable-input:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus), #main textarea:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus),
.sheet-rolltemplate-scp select:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus),
.sheet-rolltemplate-scp input:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus),
.sheet-rolltemplate-scp .uneditable-input:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus),
.sheet-rolltemplate-scp textarea:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus) {
  border-width: 1px 3px;
  border-style: solid;
  border-color: black;
  border-radius: 5px;
  box-sizing: border-box;
  transition: var(--focusTrans);
}
#main select:not(:is([readonly])):focus, #main input:not(:is([readonly])):focus, #main .uneditable-input:not(:is([readonly])):focus, #main textarea:not(:is([readonly])):focus,
.sheet-rolltemplate-scp select:not(:is([readonly])):focus,
.sheet-rolltemplate-scp input:not(:is([readonly])):focus,
.sheet-rolltemplate-scp .uneditable-input:not(:is([readonly])):focus,
.sheet-rolltemplate-scp textarea:not(:is([readonly])):focus {
  background-color: #DCDCDC;
  transition: var(--focusTrans);
}
#main select,
.sheet-rolltemplate-scp select {
  appearance: none;
  text-transform: capitalize;
  overflow: hidden !important;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#main .circle,
.sheet-rolltemplate-scp .circle {
  border-radius: 50%;
}
#main label,
.sheet-rolltemplate-scp label {
  width: unset;
  margin: unset;
}
#main label[for],
.sheet-rolltemplate-scp label[for] {
  cursor: pointer;
}
#main input,
.sheet-rolltemplate-scp input {
  width: 100%;
}
#main input:placeholder,
.sheet-rolltemplate-scp input:placeholder {
  color: #ededed80;
}
#main input.plus-control:not([value*="-"]) + span:before,
.sheet-rolltemplate-scp input.plus-control:not([value*="-"]) + span:before {
  content: "+";
}
#main .right,
.sheet-rolltemplate-scp .right {
  align-text: right;
}
#main span, #main input, #main textarea,
.sheet-rolltemplate-scp span,
.sheet-rolltemplate-scp input,
.sheet-rolltemplate-scp textarea {
  font-size: 1rem;
}
#main label[for*="-0"],
.sheet-rolltemplate-scp label[for*="-0"] {
  display: none;
}
#main .hidden,
.sheet-rolltemplate-scp .hidden {
  display: none !important;
}
#main .italics,
.sheet-rolltemplate-scp .italics {
  font-style: italic;
}
#main :is(span, label),
.sheet-rolltemplate-scp :is(span, label) {
  line-height: normal;
  text-transform: capitalize;
}
#main .roller,
.sheet-rolltemplate-scp .roller {
  cursor: pointer;
  display: inline-grid;
}
#main .roll-label,
.sheet-rolltemplate-scp .roll-label {
  cursor: pointer;
  --beforeColor:grey;
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: auto;
  place-items: center start;
  place-content: center;
}
#main .roll-label .dice-icon,
.sheet-rolltemplate-scp .roll-label .dice-icon {
  justify-self: center;
  display: inline-grid;
  grid-template-columns: [d8-start] 0.5rem [d10-start] 0.5rem [d8-end d12-start] 0.5rem [d10-end] 0.5rem [d12-end];
  grid-template-rows: [d10-start content-start] 0.5rem [d8-start d12-start] 0.5rem [d10-start] 0.5rem [d8-end d12-end content-end];
}
#main .roll-label .dice-icon > .d8-font,
.sheet-rolltemplate-scp .roll-label .dice-icon > .d8-font {
  display: contents;
}
#main .roll-label .dice-icon > .d8-font:before,
.sheet-rolltemplate-scp .roll-label .dice-icon > .d8-font:before {
  content: "H";
  font-family: dicefontd8;
  grid-area: d8;
  place-self: center;
  color: var(--beforeColor);
  text-shadow: var(--selectShadow);
  transition: var(--focusTrans);
}
#main .roll-label .dice-icon > .d10-font,
.sheet-rolltemplate-scp .roll-label .dice-icon > .d10-font {
  display: contents;
}
#main .roll-label .dice-icon > .d10-font:before,
.sheet-rolltemplate-scp .roll-label .dice-icon > .d10-font:before {
  content: "K";
  font-family: dicefontd10;
  grid-area: d10;
  place-self: start center;
  color: var(--beforeColor);
  text-shadow: var(--selectShadow);
  transition: var(--focusTrans);
}
#main .roll-label .dice-icon > .d12-font,
.sheet-rolltemplate-scp .roll-label .dice-icon > .d12-font {
  display: contents;
}
#main .roll-label .dice-icon > .d12-font:before,
.sheet-rolltemplate-scp .roll-label .dice-icon > .d12-font:before {
  content: "L";
  font-family: dicefontd12;
  grid-area: d12;
  place-self: center;
  color: var(--beforeColor);
  text-shadow: var(--selectShadow);
  transition: var(--focusTrans);
}
#main .roll-label .dice-icon button,
.sheet-rolltemplate-scp .roll-label .dice-icon button {
  grid-area: content;
}
#main .roll-label:is(:hover, :focus, :focus-within),
.sheet-rolltemplate-scp .roll-label:is(:hover, :focus, :focus-within) {
  --beforeColor:var(--selectColor);
}
#main .roll-label:is(:hover, :focus, :focus-within) > button,
.sheet-rolltemplate-scp .roll-label:is(:hover, :focus, :focus-within) > button {
  color: var(--beforeColor);
  text-shadow: var(--selectShadow);
}
#main .pictos,
.sheet-rolltemplate-scp .pictos {
  font-family: pictos;
  text-transform: initial;
}
#main .pictos3,
.sheet-rolltemplate-scp .pictos3 {
  font-family: pictos three;
  text-transform: initial;
}
#main .pictoscustom,
.sheet-rolltemplate-scp .pictoscustom {
  font-family: pictos custom;
  text-transform: initial;
}
#main input[type=checkbox],
.sheet-rolltemplate-scp input[type=checkbox] {
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
  appearance: checkbox;
  width: auto;
}
#main input.number,
.sheet-rolltemplate-scp input.number {
  -moz-appearance: textfield !important;
  text-align: center;
}
#main textarea.fixed,
.sheet-rolltemplate-scp textarea.fixed {
  resize: none;
  overflow: auto;
}
#main section.page,
.sheet-rolltemplate-scp section.page {
  display: none;
}
#main .pseudo-button,
.sheet-rolltemplate-scp .pseudo-button {
  display: inline;
  cursor: pointer;
  border-radius: 5px;
  text-transform: uppercase;
  border: 1px solid black;
  text-align: center;
  padding: 0 5px;
}
#main .input-label,
.sheet-rolltemplate-scp .input-label {
  display: inline-grid;
  grid-gap: var(--half-gap);
  place-items: center stretch;
}
#main .input-label.stacked,
.sheet-rolltemplate-scp .input-label.stacked {
  grid-template-columns: auto;
  grid-template-areas: "over" "under";
}
#main .input-label.stacked.under,
.sheet-rolltemplate-scp .input-label.stacked.under {
  grid-template-rows: 1fr auto;
}
#main .input-label.stacked.under > span:last-of-type,
.sheet-rolltemplate-scp .input-label.stacked.under > span:last-of-type {
  grid-area: under;
}
#main .input-label.stacked.over,
.sheet-rolltemplate-scp .input-label.stacked.over {
  grid-template-rows: auto 1fr;
}
#main .input-label.stacked.over > span:last-of-type,
.sheet-rolltemplate-scp .input-label.stacked.over > span:last-of-type {
  grid-area: over;
}
#main .input-label.stacked.center > *,
.sheet-rolltemplate-scp .input-label.stacked.center > * {
  text-align: center;
}
#main .input-label.stacked:not(.center) > :not(input),
.sheet-rolltemplate-scp .input-label.stacked:not(.center) > :not(input) {
  text-align: left;
}
#main .input-label:not(:is(.stacked, .right)),
.sheet-rolltemplate-scp .input-label:not(:is(.stacked, .right)) {
  grid-template-columns: auto 1fr;
  grid-template-rows: auto;
  grid-template-areas: "left right";
}
#main .input-label:not(:is(.stacked, .right)) > span,
.sheet-rolltemplate-scp .input-label:not(:is(.stacked, .right)) > span {
  grid-area: left;
}
#main .input-label.right,
.sheet-rolltemplate-scp .input-label.right {
  grid-template-columns: 1fr auto;
  grid-template-rows: auto;
  grid-template-areas: "left right";
}
#main .input-label.right > span,
.sheet-rolltemplate-scp .input-label.right > span {
  grid-area: right;
}
#main .input-label > *,
.sheet-rolltemplate-scp .input-label > * {
  margin: 0;
}
#main .input-label > input:is([type=text], [type=number]),
.sheet-rolltemplate-scp .input-label > input:is([type=text], [type=number]) {
  width: 100%;
}
#main .dual.input-label,
.sheet-rolltemplate-scp .dual.input-label {
  grid-template-columns: 1fr auto 1fr;
  grid-template-areas: "over 	over 	over" "under 	under 	under";
}
#main .dual.input-label > span:last-of-type,
.sheet-rolltemplate-scp .dual.input-label > span:last-of-type {
  grid-column: 1/-1;
}
#main .dual.input-label > input,
.sheet-rolltemplate-scp .dual.input-label > input {
  width: 100%;
}
#main .dual.input-label > .slash,
.sheet-rolltemplate-scp .dual.input-label > .slash {
  line-height: 0rem;
  font-weight: normal;
}
#main .headed-textarea,
.sheet-rolltemplate-scp .headed-textarea {
  display: grid;
  grid-template-rows: auto 1fr;
  grid-template-columns: auto;
}
#main .boxed,
.sheet-rolltemplate-scp .boxed {
  border: 1px solid black;
}
#main .boxed.thick-left,
.sheet-rolltemplate-scp .boxed.thick-left {
  border-left-width: 5px;
}
#main .boxed.thick-bottom,
.sheet-rolltemplate-scp .boxed.thick-bottom {
  border-bottom-width: 5px;
}
#main .boxed.thick-right,
.sheet-rolltemplate-scp .boxed.thick-right {
  border-right-width: 5px;
}
#main .boxed.thick-top,
.sheet-rolltemplate-scp .boxed.thick-top {
  border-top-width: 5px;
}
#main .underlined,
.sheet-rolltemplate-scp .underlined {
  border-radius: 5px 5px 0 0;
  border-bottom: 1px solid black;
  transition: var(--focusTrans);
}
#main .underlined.thick,
.sheet-rolltemplate-scp .underlined.thick {
  border-bottom-width: 5px;
}
#main .ratio1-1,
.sheet-rolltemplate-scp .ratio1-1 {
  aspect-ratio: 1/1;
}
#main .repeat-columns,
.sheet-rolltemplate-scp .repeat-columns {
  display: grid;
  grid-gap: var(--half-gap);
  place-items: center;
}
#main .repcontainer,
.sheet-rolltemplate-scp .repcontainer {
  display: grid;
  grid-gap: var(--half-gap);
}
#main .repcontainer > .repitem,
.sheet-rolltemplate-scp .repcontainer > .repitem {
  display: grid;
  grid-gap: var(--half-gap);
}
#main .repcontainer > .repitem .itemcontrol,
.sheet-rolltemplate-scp .repcontainer > .repitem .itemcontrol {
  grid-column: 1/-1;
  place-self: start stretch;
}

#main {
  --selectedRadio:grey;
  --fillTrackRadioHeight:2rem;
  --fillTrackRadioWidth:1rem;
  --fillTrackSpanWidth:1rem;
  --fillTrackSpanHeight:0.5rem;
  --fillItemFlex:0 0 auto;
  --track-gap:var(--tiny-gap);
  display: grid;
}
#main.level-1, #main.sheet-level-1 {
  --backColor:#6abd47;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
#main.level-2, #main.sheet-level-2 {
  --backColor:#4f72b7;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
#main.level-3, #main.sheet-level-3 {
  --backColor:#ef6024;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
#main.level-4, #main.sheet-level-4 {
  --backColor:#ed2025;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
#main.level-5, #main.sheet-level-5 {
  --backColor:#7d52a1;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
#main.level-6, #main.sheet-level-6 {
  --backColor:#000000;
  --borderColor:white;
  --fontColor:#ededed;
}
#main.all {
  grid-template-columns: 2rem auto [sticky-background-start] 10rem auto auto auto auto auto auto 10rem [sticky-background-end];
  grid-template-rows: auto auto [sticky-background-start] auto [sticky-background-end] auto auto auto 1fr;
  grid-template-areas: "section-tabs	summary 	summary 				summary 				summary 				summary 		summary 		summary 			summary 			summary" "section-tabs	attributes 	experience 				experience 				purchase_guide 				purchase_guide 		purchase_guide 		purchase_guide 			player_name 			player_name" "section-tabs attributes 	reverence					defenses					defenses					defenses					defenses					defenses					defenses					exertion					" "section-tabs	attributes 	character_details character_details character_details character_details character_details character_details character_details character_details" "section-tabs	attributes 	actions		 				actions 					actions 					actions 					actions 					actions 					actions 					actions" "section-tabs	attacks 				attacks 					attacks 					attacks 					attacks 					attacks 					attacks 					attacks 					attacks" "section-tabs	equipment 				equipment 					equipment 					equipment 					equipment 					equipment 					equipment 					equipment 					equipment";
}
#main:not(.all) {
  grid-template-columns: 2rem [sticky-background-start character_details-start attributes-start attacks-start actions-start equipment-start] 10rem auto auto auto 10rem [sticky-background-end character_details-end attributes-end attacks-end actions-end equipment-end];
  grid-template-rows: auto auto [sticky-background-start] auto [sticky-background-end character_details-start attributes-start attacks-start actions-start equipment-start] 1fr [character_details-end attributes-end attacks-end actions-end equipment-end];
  grid-template-areas: "section-tabs	summary						summary						summary						summary 					summary" "section-tabs	experience 				experience				purchase_guide 		player_name 			player_name" "section-tabs	reverence					defenses					defenses					defenses					exertion" "section-tabs	content 					content						content 					content 					content";
}
#main #attributes {
  grid-area: attributes;
}
#main #character_details {
  grid-area: character_details;
}
#main #experience {
  grid-area: experience;
}
#main #player_name {
  grid-area: player_name;
}
#main #purchase_guide {
  grid-area: purchase_guide;
}
#main #credits {
  grid-area: credits;
}
#main #knowledges {
  grid-area: knowledges;
}
#main #skills {
  grid-area: skills;
}
#main #abilities {
  grid-area: abilities;
}
#main #exertion {
  grid-area: exertion;
}
#main #security_level {
  grid-area: security_level;
}
#main #defenses {
  grid-area: defenses;
}
#main #attacks {
  grid-area: attacks;
}
#main #actions {
  grid-area: actions;
}
#main #section-tabs {
  grid-area: section-tabs;
}
#main #reverence {
  grid-area: reverence;
}
#main #equipment {
  grid-area: equipment;
}
#main .help {
  grid-area: help;
  white-space: pre-wrap;
  text-transform: normal;
  font-size: 0.5rem;
}
#main .accented {
  accent-color: var(--backColor);
}
#main .fillTrack {
  position: relative;
  display: inline-flex;
  gap: var(--track-gap);
  align-items: center;
}
#main .fillTrack .separated-label {
  width: var(--fillTrackRadioWidth);
  height: var(--fillTrackRadioHeight);
}
#main .fillTrack .separated-span {
  width: var(--fillTrackSpanWidth);
  height: var(--fillTrackSpanHeight);
  box-sizing: border-box;
}
#main .fillTrack .separated-label,
#main .fillTrack .separated-span {
  -webkit-apperance: none;
  appearance: none;
  border: 1px solid black;
  background-color: var(--selectedRadio);
  order: 1;
  border-radius: 0;
  flex: var(--fillItemFlex);
  box-sizing: content-box;
}
#main .fillTrack .separated-label:before,
#main .fillTrack .separated-span:before {
  background-color: var(--selectedRadio);
}
#main .fillTrack .separated-label:checked,
#main .fillTrack .separated-span:checked {
  display: none;
}
#main .fillTrack .separated-label.clearer,
#main .fillTrack .separated-span.clearer {
  order: 2;
}
#main .fillTrack .separated-label.clearer:checked,
#main .fillTrack .separated-span.clearer:checked {
  display: none;
}
#main .fillTrack .separated-label:checked ~ .separated-label,
#main .fillTrack .separated-span:checked ~ .separated-label {
  order: 3;
  background-color: white;
}
#main .fillTrack .separated-label:checked ~ .separated-label:before,
#main .fillTrack .separated-span:checked ~ .separated-label:before {
  background-color: white;
}
#main .fillTrack .hidden + .separated-span ~ .separated-span {
  background-color: white;
}
#main .fillTrack .separated-label {
  cursor: pointer;
}
#main .fillTrack .separated-label[value="0"] + .readonly-dot {
  display: none;
}
#main .fillTrack:is(:hover, :focus-within, :focus) .clearer,
#main .fillTrack:is(:hover, :focus-within, :focus) .clearer:before {
  background-color: var(--selectedRadio);
  background-image: linear-gradient(45deg, transparent 0% 48%, white 48% calc(48% + 2px), transparent calc(48% + 2px)), linear-gradient(-45deg, transparent 0% 48%, white 48% calc(48% + 2px), transparent calc(48% + 2px));
}

main#main:not(.all) > section:not(.active-section) {
  display: none;
}

#summary {
  position: sticky;
  top: 0px;
  z-index: 110;
  grid-area: summary;
  background-color: var(--backColor);
  border-radius: 10px 10px 0 0;
  border-width: 2px 5px;
  border-style: solid;
  border-color: var(--borderColor);
  filter: drop-shadow(0px -10px white);
  padding: 5px;
  display: grid;
  grid-template-columns: 1fr [strength-start fate-start] auto [strength-end fate-end health-start charisma-start] auto [health-end charisma-end perception-start intelligence-start] auto [perception-end intelligence-end dexterity-start willpower-start] auto [dexterity-end willpower-end];
  grid-template-rows: [strength-start health-start perception-start dexterity-start] 1rem [fate-start charisma-start intelligence-start willpower-start] 1rem [strength-end health-end perception-end dexterity-end] 1rem [fate-end charisma-end intelligence-end willpower-end];
  grid-gap: var(--half-gap);
  grid-template-areas: "character_name	. . . ." "character_name	. . . ." "alias 					. . . .";
}
#summary > .character_name {
  grid-area: character_name;
}
#summary > .alias {
  grid-area: alias;
}
#summary > .strength {
  grid-area: strength;
}
#summary > .health {
  grid-area: health;
}
#summary > .perception {
  grid-area: perception;
}
#summary > .dexterity {
  grid-area: dexterity;
}
#summary > .fate {
  grid-area: fate;
}
#summary > .charisma {
  grid-area: charisma;
}
#summary > .intelligence {
  grid-area: intelligence;
}
#summary > .willpower {
  grid-area: willpower;
}
#summary .h4, #summary .h5 {
  line-height: 0;
  place-self: center;
}
#summary h6 {
  text-transform: uppercase;
}
#summary * {
  color: var(--fontColor);
}
#summary > .ability-summary {
  align-self: center;
  display: grid;
  grid-template-columns: 2.5rem repeat(3, 1rem auto);
}
#summary > .ability-summary > .die-num {
  justify-self: end;
}
#summary > .ability-summary > .die-size {
  justify-self: start;
  text-transform: initial;
}

.sticky-sub.background {
  background-color: white;
  grid-area: sticky-background;
  box-shadow: 0 0 0 10px white;
}

#reverence {
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: 2rem 2rem 1fr;
  grid-row-gap: var(--half-gap);
  grid-template-areas: "header" "." "help";
  background-color: teal;
  background: radial-gradient(transparent, 80%, grey), linear-gradient(90deg, teal, white, teal);
  border: 2px solid black;
}
#reverence > h3 {
  grid-area: header;
  line-height: normal;
  place-self: center;
}
#reverence > .fillTrack {
  place-self: center;
}
#reverence .help {
  background-color: grey;
}

#defenses {
  display: grid;
  grid: repeat(2, auto)/repeat(3, 1fr);
  grid-template-areas: "hp               hp_max     damage_reduction damage_reduction" "reaction_defense move_speed melee_multiplier ranged_multiplier";
  align-items: start;
}
#defenses .hp {
  grid-area: hp;
}
#defenses .hp_max {
  grid-area: hp_max;
}
#defenses .damage_reduction {
  grid-area: damage_reduction;
}
#defenses .reaction_defense {
  grid-area: reaction_defense;
}
#defenses .move_speed {
  grid-area: move_speed;
}
#defenses .melee_multiplier {
  grid-area: melee_multiplier;
}
#defenses .ranged_multiplier {
  grid-area: ranged_multiplier;
}

#exertion {
  display: grid;
  grid-template-rows: 2rem 1rem 0.25rem 1fr;
  grid-row-gap: 5px;
  grid-template-areas: "header" "." "." "help";
  border: 2px solid black;
  background-color: teal;
  background: radial-gradient(transparent, 80%, grey), linear-gradient(90deg, #ca6866, white, #ca6866);
  --fillTrackRadioHeight:1rem;
}
#exertion > .fillTrack {
  place-self: center;
}
#exertion .help {
  background-color: grey;
}

#section-tabs {
  position: sticky;
  top: -1px;
  border-radius: 5px;
  background-color: #adadad;
  display: flex;
  flex-direction: column;
  align-self: start;
}
#section-tabs input:checked + label,
#section-tabs label:hover {
  background-color: var(--backColor);
  color: var(--fontColor);
}
#section-tabs > .section-control {
  color: black;
  padding: 5px;
  border-radius: 5px;
  border: 1px solid transparent;
  transform: rotate(-180deg);
  writing-mode: vertical-rl;
}
#section-tabs input:checked + label, #section-tabs label:hover {
  box-shadow: inset 0 0 5px var(--fontColor);
}

#character_details {
  display: grid;
  grid-template-columns: 2fr repeat(2, 1fr) 2fr;
  grid-template-rows: auto auto auto auto auto auto auto;
  grid-gap: var(--half-gap);
  grid-template-areas: "character_name 			 character_name						alias						      alias" "character_name 			 character_name						alias						      alias" "gender                weight                   weight                height" "age                   hair                     hair                  eyes" "appearance 					 body_type 								body_type 						reasoning" "personnel_class       personnel_class          .                     credits" "security_level 			 security_level 					character_description character_description";
}
#character_details > .character_name {
  grid-area: character_name;
}
#character_details > .gender {
  grid-area: gender;
}
#character_details > .appearance {
  grid-area: appearance;
}
#character_details > .body_type {
  grid-area: body_type;
}
#character_details > .reasoning {
  grid-area: reasoning;
}
#character_details > .alias {
  grid-area: alias;
}
#character_details > .weight {
  grid-area: weight;
}
#character_details > .height {
  grid-area: height;
}
#character_details > .age {
  grid-area: age;
}
#character_details > .character_description {
  grid-area: character_description;
}
#character_details > .hair {
  grid-area: hair;
}
#character_details > .eyes {
  grid-area: eyes;
}
#character_details > .personnel_class {
  grid-area: personnel_class;
}
#character_details .body_type {
  place-self: center;
}
#character_details .personnel_class {
  place-self: start center;
  display: grid;
  grid-template-columns: repeat(5, auto);
  grid-template-rows: repeat(2, auto);
  grid-column-gap: var(--half-gap);
}
#character_details .personnel_class h5 {
  grid-column: span 5;
}
#character_details .personnel_class input:checked + label,
#character_details .personnel_class label:hover {
  background-color: black;
  color: white;
}
#character_details .personnel_class > label {
  font-family: Baumans;
  display: grid;
  place-items: center;
  place-self: center;
  height: 1rem;
  display: inline-block;
  text-align: center;
  font-weight: bold;
}

#security_level {
  place-self: start center;
  display: grid;
  grid-template-columns: 8rem auto;
  grid-template-rows: auto auto auto;
  grid-template-areas: "head 	 head" "qr-code merit" "qr-code id";
  border-radius: 10px;
  border-width: 2px 3px 3px 2px;
  border: solid black;
  overflow: hidden;
}
#security_level > .head {
  --scpSize:6rem;
  background-color: var(--backColor);
  transition: var(--focusTrans);
  grid-area: head;
  display: grid;
  grid-template-columns: 10rem 5rem 1fr;
  grid-template-rows: calc(var(--scpSize) - 1rem) 2rem;
  grid-template-areas: "header logo 	level" "sub	  . 		level";
  border-bottom: 2px solid var(--borderColor);
}
#security_level > .head *:not(input) {
  color: var(--fontColor);
}
#security_level > .head > .header {
  grid-area: header;
  font-size: var(--scpSize);
  text-transform: uppercase;
  place-self: start center;
  line-height: calc(var(--scpSize) - 1rem);
}
#security_level > .head .sub-header {
  font-family: Baumans;
  grid-area: sub;
  font-size: calc(var(--scpSize) * 0.16);
}
#security_level > .head .transparent-logo {
  grid-area: logo;
  width: 100%;
  place-self: center;
}
#security_level > .head .security_level {
  grid-area: level;
  place-items: center;
  gap: 0px;
  place-self: center;
}
#security_level > .head .security_level > input {
  width: 5rem;
  place-self: start center;
  background-color: white;
  height: unset;
  color: black;
}
#security_level > .head .security_level > span {
  font-size: 0.75rem;
  font-family: baumans;
  margin: 0;
}
#security_level > .qr-code {
  grid-area: qr-code;
  background-image: url("https://s3.amazonaws.com/files.d20.io/images/237721889/dzJg1nel3HT7J2OhxtWBJg/thumb.png");
  background-repeat: no-repeat;
  background-size: contain;
  place-self: center;
  width: 100%;
  aspect-ratio: 1/1;
}
#security_level > .merit {
  --selectedRadio:var(--backColor);
  --track-gap:calc(var(--tiny-gap) / 2);
  grid-area: merit;
  display: grid;
  grid-template-columns: 3rem 1fr;
  grid-template-rows: auto;
  grid-template-areas: "header tracker";
  grid-gap: var(--half-gap);
  padding-right: var(--half-gap);
}
#security_level > .merit > h5 {
  place-self: center;
  white-space: pre-wrap;
  place-self: center;
}
#security_level > .merit > .fillTrack {
  place-self: center;
  grid-auto-columns: 0.9rem;
}
#security_level > .merit > .fillTrack > .separated-label {
  filter: drop-shadow(-1px 0px 0 black) drop-shadow(1px 0px 0 black) drop-shadow(0px -1px 0 black) drop-shadow(0px 1px 0 black);
  background-color: transparent !important;
  border: 0px solid transparent;
}
#security_level > .merit > .fillTrack > .separated-label:before {
  clip-path: polygon(45% 0, 100% 50%, 45% 100%, 0% 100%, 55% 50%, 0% 0%);
  grid-area: b;
  position: absolute;
  content: "";
  place-self: center;
  width: 100%;
  height: 100%;
}
#security_level > .id {
  padding: 5px 0 0 5px;
  display: grid;
  --arrowsize:1.5rem;
  grid-template-columns: 3rem 1fr;
  grid-template-rows: 3.5rem;
  grid-column-gap: var(--half-gap);
  grid-template-areas: "logo id";
  background-color: var(--backColor);
  transition: var(--focusTrans);
  grid-area: id;
  border: solid var(--borderColor);
  border-width: 2px 0 0 2px;
}
#security_level > .id > .black-logo {
  grid-area: logo;
}
#security_level > .id > * {
  color: var(--fontColor);
}
#security_level > .id > span[name*=attr] {
  place-self: start center;
  font-size: 0.65rem;
  place-self: center;
}
#security_level > .id > :not([name*=attr]) {
  font-size: 0.5rem;
}

#credits.input-label {
  align-self: start;
  height: 2rem;
}

#attributes {
  --fillTrackRadioHeight:2.5rem;
  --track-gap:0;
  --fillItemFlex:1 1 0;
}
#attributes.active-section {
  display: grid;
  grid-template-columns: repeat(6, auto);
  grid-gap: var(--grid-gap);
  place-content: center;
}
#attributes.active-section > .ability_score {
  grid-column: span 2;
}
#attributes.active-section > .ability_score:nth-last-child(2) {
  grid-column: 2/span 2;
}
#attributes.active-section .available-dice {
  display: flex;
  justify-content: space-between;
}
#attributes:not(.active-section) > .available-dice {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--half-gap);
  margin-bottom: var(--grid-gap);
  box-shadow: 0 0 0 10px white;
  z-index: 100;
}
#attributes:not(.active-section) > .available-dice h4 {
  grid-column: 1/-1;
}
#attributes > .available-dice {
  grid-column: 1/-1;
  background-color: white;
}
#attributes > .available-dice > button[type=action] {
  background-color: #ededed;
  box-shadow: inset 0 0 5px black;
  color: black;
  border-radius: 5px;
  padding: 3px 5px;
  display: flex;
  justify-content: center;
  transition: var(--focusTrans);
}
#attributes > .available-dice > button[type=action] > span {
  text-transform: initial;
}
#attributes > .available-dice > button[type=action]:hover {
  background-color: var(--backColor);
  transition: var(--focusTrans);
  box-shadow: inset 0 0 5px var(--fontColor);
}
#attributes > .available-dice > button[type=action]:hover * {
  color: var(--fontColor);
}
#attributes:hover > .ability_score :is(label, span):not(.roll-label), #attributes:focus-within > .ability_score :is(label, span):not(.roll-label) {
  color: red;
  transition: var(--focusTrans);
}
#attributes > .ability_score {
  position: relative;
  display: grid;
  grid-template-columns: 4rem 13rem;
  grid-template-rows: repeat(4, auto);
  grid-template-areas: "header header " "d8			." "d10		." "d12		.";
  place-self: center;
  margin-bottom: var(--grid-gap);
  background-color: black;
  border: 1px solid black;
}
#attributes > .ability_score .attribute,
#attributes > .ability_score h5 {
  border: 1px solid black;
  line-height: var(--fillTrackRadioHeight);
  text-align: center;
  background-color: white;
}
#attributes > .ability_score .attribute[data-i18n*=d8],
#attributes > .ability_score h5[data-i18n*=d8] {
  grid-area: d8;
}
#attributes > .ability_score .attribute[data-i18n*=d10],
#attributes > .ability_score h5[data-i18n*=d10] {
  grid-area: d10;
}
#attributes > .ability_score .attribute[data-i18n*=d12],
#attributes > .ability_score h5[data-i18n*=d12] {
  grid-area: d12;
}
#attributes > .ability_score .attribute {
  grid-area: header;
  text-align: center;
}
#attributes .fill-label {
  color: transparent;
  font-size: 0.75rem;
  overflow: hidden;
  transition: var(--focusTrans);
}

#actions {
  column-width: 255px;
  column-gap: var(--grid-gap);
  column-rule: 1px solid black;
}
#actions .thick {
  padding-bottom: var(--half-gap);
}

:is(#knowledges, #skills, #abilities) {
  display: contents;
}
:is(#knowledges, #skills, #abilities):not(:first-child) > .header {
  margin-top: var(--half-gap);
}
:is(#knowledges, #skills, #abilities) > div {
  position: relative;
  display: inline-grid;
  width: 100%;
  grid-template-columns: 1fr 2rem 2rem;
  grid-gap: var(--half-gap);
  margin-bottom: var(--half-gap);
}
:is(#knowledges, #skills, #abilities) > div > label {
  place-self: center start;
  white-space: pre-wrap;
  text-transform: capitalize;
}
:is(#knowledges, #skills, #abilities) > div > input[name*=base_mod] {
  opacity: 0;
  z-index: 10;
  transition: var(--inputSwap);
  position: absolute;
  grid-column: 3/4;
}
:is(#knowledges, #skills, #abilities) > div > input[name*=base_mod] + input {
  opacity: 1;
  transition: var(--inputSwap);
}
:is(#knowledges, #skills, #abilities) > div > input[name*=base_mod]:is(:hover, :focus) {
  opacity: 1;
  transition: var(--inputSwap);
}
:is(#knowledges, #skills, #abilities) > div > input[name*=base_mod]:is(:hover, :focus) + input {
  opacity: 0;
  transition: var(--inputSwap);
}
:is(#knowledges, #skills, #abilities) > div > .underlined {
  align-self: center;
  width: 100%;
}

#attacks {
  --gridColumns:
  	[header-start] 2rem 1fr [weapon] 9rem [skill] 4rem [recoil] repeat(4, 3rem) [to-hits] repeat(2,2.5rem) [clip] repeat(2, 4rem) [damages] 4rem [element] 3rem [range] 1fr [special header-end] ;
  --attackColumns:". weapon  skill   recoil  melee   hip     ready   aim     clip clip_max base    x       element range   special";
  display: grid;
  grid: [header-start] auto [header-end] 2rem 2rem auto 1rem/var(--gridColumns);
  grid-auto-flow: row dense;
  grid-gap: var(--half-gap);
  grid-template-areas: ".       .       .       .       melee-mult  melee-mult melee-mult melee-mult   melee-mult . ranged-mult   ranged-mult  ranged-mult  ranged-mult  .      " ".       .       .       .       to-hit  to-hit  to-hit  to-hit  .  .        damage       damage       .            .            .      " var(--attackColumns) "content content content content content content content content content content    content      content      content      content      content" "control control control control control control control control control control    control      control      control      control      control";
  place-content: start stretch;
}
#attacks > h4:not(input) {
  grid-area: header;
  text-align: left;
  padding-left: 1rem;
}
#attacks .weapon {
  grid-area: weapon;
}
#attacks .skill {
  grid-area: skill;
}
#attacks .recoil {
  grid-area: recoil;
}
#attacks .melee {
  grid-area: melee;
}
#attacks .hip {
  grid-area: hip;
}
#attacks .ready {
  grid-area: ready;
}
#attacks .aim {
  grid-area: aim;
}
#attacks .clip {
  grid-area: clip;
}
#attacks .clip_max {
  grid-area: clip_max;
}
#attacks .base {
  grid-area: base;
}
#attacks .x {
  grid-area: x;
}
#attacks .element {
  grid-area: element;
}
#attacks .range {
  grid-area: range;
}
#attacks .special {
  grid-area: special;
}
#attacks .to-hit {
  grid-area: to-hit;
}
#attacks .damage {
  grid-area: damage;
}
#attacks .melee-mult {
  grid-area: melee-mult;
}
#attacks .ranged-mult {
  grid-area: ranged-mult;
}
#attacks > .input-label:is(.melee-mult, .ranged-mult) {
  grid-template-columns: auto 3rem;
  justify-content: center;
}
#attacks > .repeat-columns {
  display: contents;
}
#attacks > .repeat-columns > h5, #attacks > .repeat-columns h6 {
  border-bottom: 1px solid black;
}
#attacks > .repeat-columns h6 {
  text-transform: capitalize;
}
#attacks > .repeat-columns .clip {
  grid-column: clip-start/clip_max-end;
  grid-row: clip-start/clip-end;
}
#attacks > .repcontainer {
  grid-area: content;
}
#attacks > .repcontainer > .repitem {
  position: relative;
  grid: auto/var(--gridColumns);
  grid-template-areas: var(--attackColumns);
}
#attacks > .repcontainer > .repitem > :is(.base, .x) {
  text-align: center;
}
#attacks > .repcontainer > .repitem > .roll-label {
  opacity: 0;
  transition: var(--focusTrans);
}
#attacks > .repcontainer > .repitem:is(:hover, :focus-within) > .roll-label {
  opacity: 100;
  transition: var(--focusTrans);
}
#attacks > .repcontainer > .repitem > input[name=attr_recoil] {
  opacity: 1;
  transition: var(--inputSwap);
}
#attacks > .repcontainer > .repitem > input[name=attr_recoil_base] {
  opacity: 0;
  z-index: 10;
  transition: var(--inputSwap);
}
#attacks > .repcontainer > .repitem > input[name=attr_recoil_base]:is(:hover, :focus) {
  opacity: 1;
  transition: var(--inputSwap);
}
#attacks > .repcontainer > .repitem > input[name=attr_recoil_base]:is(:hover, :focus) + input {
  opacity: 0;
  transition: var(--inputSwap);
}
#attacks > .repcontainer > .repitem > .hover-button-container {
  position: relative;
  display: grid;
}
#attacks > .repcontainer > .repitem > .hover-button-container > * {
  grid-column: 1/2;
  grid-row: 1/2;
}
#attacks > .repcontainer > .repitem > .hover-button-container label {
  position: relative;
  opacity: 0;
  top: 0;
  background-color: transparent;
  transition: var(--focusTrans);
  display: grid;
  grid-template-columns: 1fr;
  place-content: center;
}
#attacks > .repcontainer > .repitem > .hover-button-container input[type=radio] {
  appearance: checkbox;
  accent-color: var(--backColor);
}
#attacks > .repcontainer > .repitem > .hover-button-container:is(:hover) label {
  z-index: 10;
  opacity: 1;
  top: 100%;
  background-color: white;
  transition: var(--focusTrans);
  height: 150%;
}
#attacks > .repcontainer > .repitem > .hover-button-container input[type=hidden] + input {
  transition: var(--focusTrans);
  place-self: center;
}
#attacks > .repcontainer > .repitem > .hover-button-container.hip input[type=hidden][value="1"] + input {
  border-width: 1px 3px;
  border-style: solid;
  border-color: black;
  border-radius: 5px;
  box-sizing: border-box;
  transition: var(--focusTrans);
  background-color: var(--backColor);
  color: var(--fontColor);
  font-weight: bold;
}
#attacks > .repcontainer > .repitem > .hover-button-container.ready input[type=hidden][value="2"] + input {
  border-width: 1px 3px;
  border-style: solid;
  border-color: black;
  border-radius: 5px;
  box-sizing: border-box;
  transition: var(--focusTrans);
  background-color: var(--backColor);
  color: var(--fontColor);
  font-weight: bold;
}
#attacks > .repcontainer > .repitem > .hover-button-container.aim input[type=hidden][value="3"] + input {
  border-width: 1px 3px;
  border-style: solid;
  border-color: black;
  border-radius: 5px;
  box-sizing: border-box;
  transition: var(--focusTrans);
  background-color: var(--backColor);
  color: var(--fontColor);
  font-weight: bold;
}
#attacks > .repcontainer.editmode > .repitem > .itemcontrol {
  grid-column: 1/-1;
  position: absolute;
  display: flex;
  justify-content: space-between;
}
#attacks > .repcontrol {
  grid-area: control;
  order: 10;
  display: flex;
  justify-content: space-between;
}

#equipment.repeating-equipment h4 {
  text-align: left;
}
#equipment .repcontainer {
  display: block;
  column-width: 200px;
}
#equipment .repcontainer > .repitem {
  display: inline-grid;
}
#equipment .repcontainer .item-container {
  display: flex;
  gap: var(--half-gap);
}
#equipment > .repcontrol {
  grid-area: control;
  order: 10;
  display: flex;
  justify-content: space-between;
}
#equipment .carry-check:not(:checked) + .item-container * {
  color: #00000080;
  border-bottom-color: currentColor;
}

/*

Roll Template

*/
.sheet-rolltemplate-scp {
  --templateRadius:1rem;
  --dieSize:50px;
  --templateBorderW:2px 5px 2px 5px;
  --fumbleColor:red;
  --critColor:green;
  --innerBorderRadius:5px;
  position: relative;
  margin-left: -40px;
}
.sheet-rolltemplate-scp h3 {
  line-height: 20px;
  text-transform: capitalize;
}
.sheet-rolltemplate-scp:first-child > .sheet-scp.sheet-continuation {
  margin-top: -9px;
  border-top-width: 0;
}
.sheet-rolltemplate-scp:not(:first-child) {
  margin-top: 10px;
}
.sheet-rolltemplate-scp > .sheet-scp {
  border: solid black;
  overflow: hidden;
  border-width: var(--templateBorderW);
  border-color: var(--borderColor);
  background-color: var(--backColor);
  color: var(--fontColor);
}
.sheet-rolltemplate-scp > .sheet-scp.level-1, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-1 {
  --backColor:#6abd47;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
.sheet-rolltemplate-scp > .sheet-scp.level-2, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-2 {
  --backColor:#4f72b7;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
.sheet-rolltemplate-scp > .sheet-scp.level-3, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-3 {
  --backColor:#ef6024;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
.sheet-rolltemplate-scp > .sheet-scp.level-4, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-4 {
  --backColor:#ed2025;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
.sheet-rolltemplate-scp > .sheet-scp.level-5, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-5 {
  --backColor:#7d52a1;
  --selectColor:var(--backColor);
  --selectShadow:none;
}
.sheet-rolltemplate-scp > .sheet-scp.level-6, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-6 {
  --backColor:#000000;
  --borderColor:white;
  --fontColor:#ededed;
}
.sheet-rolltemplate-scp > .sheet-scp h4 {
  text-transform: capitalize;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-color-cond,
.sheet-rolltemplate-scp > .sheet-scp .sheet-color-cond * {
  color: var(--fontColor);
}
.sheet-rolltemplate-scp > .sheet-scp:not(.sheet-continuation) {
  border-radius: var(--templateRadius) var(--templateRadius) 0 0;
}
.sheet-rolltemplate-scp > .sheet-scp:not(.sheet-continuation) .sheet-roll-content {
  border-top-left-radius: var(--innerBorderRadius);
  border-top-right-radius: var(--innerBorderRadius);
}
.sheet-rolltemplate-scp > .sheet-scp.sheet-continuation .sheet-roll-content {
  padding: 0;
}
.sheet-rolltemplate-scp > .sheet-scp.sheet-continuation.sheet-first .sheet-results {
  background-color: var(--backColor);
  border-radius: var(--innerBorderRadius);
}
.sheet-rolltemplate-scp > .sheet-scp.sheet-continuation.sheet-first .sheet-result-values {
  background-color: white;
  border-radius: var(--innerBorderRadius);
  width: calc(100% + 5px);
  margin-left: -5px;
}
.sheet-rolltemplate-scp > .sheet-scp.sheet-continuation .sheet-result-values {
  width: 100%;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head {
  color: var(--fontColor);
  display: grid;
  grid-template-rows: auto auto;
  grid-gap: 5px;
  padding: 5px;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head:not(.sheet-element) {
  grid-template-columns: 39px 1fr;
  grid-template-areas: "black-logo roll_name" "black-logo character_name";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head.sheet-element {
  grid-template-columns: 39px 1fr 2fr;
  grid-template-areas: "black-logo roll_name roll_name" "black-logo element   character_name";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head > * {
  white-space: pre-wrap;
  text-align: left;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head .sheet-black-logo {
  grid-area: black-logo;
  place-self: start stretch;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head .sheet-roll_name {
  grid-area: roll_name;
  place-self: center end;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head .sheet-character_name {
  grid-area: character_name;
  place-self: start end;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head .sheet-element {
  grid-area: element;
  border-width: 2px 5px;
  border-style: solid;
  border-color: var(--fontColor);
  border-radius: var(--templateRadius);
  background-color: white;
  padding: 0.5rem;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-modifier {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-modifier > :not(span) {
  text-transform: capitalize;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-content {
  background-color: white;
  padding: 2px;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-results {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding-left: 5px;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-result-values {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  align-items: center;
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total {
  position: relative;
  display: grid;
  place-items: center;
  color: var(--fontColor);
  grid-template-columns: 106px 50px 10px 70px;
  grid-template-rows: auto 1fr 1fr;
  grid-template-areas: "high-label .        . total-label" "high       modifier . total      " "high       ones     . total      ";
  place-content: stretch center;
  padding: 5px;
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-label {
  grid-area: high-label;
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-label {
  grid-area: total-label;
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total .sheet-modifier {
  grid-area: modifier;
  border-radius: 0 var(--templateRadius) 0 0;
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total .sheet-ones {
  grid-area: ones;
  border-radius: 0 0 var(--templateRadius);
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total .sheet-ones > span {
  color: var(--fumbleColor);
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-modifier,
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-ones {
  background-color: white;
  border-width: var(--templateBorderW);
  border-color: var(--borderColor);
  border-style: solid;
  display: grid;
  place-self: stretch;
  place-content: center;
  position: relative;
  left: -5px;
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice {
  border-radius: var(--templateRadius) 0 0 var(--templateRadius);
  grid-area: high;
  justify-self: end;
  place-self: stretch;
  display: flex;
  justify-content: space-around;
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-val-1 {
  color: var(--fumbleColor);
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-d8.sheet-val-8 > .sheet-die-icon,
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-d10.sheet-val-10 > .sheet-die-icon,
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-d12.sheet-val-12 > .sheet-die-icon,
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-d20.sheet-val-20 > .sheet-die-icon {
  color: var(--critColor);
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-value {
  border-radius: var(--templateRadius);
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice,
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-value {
  background-color: white;
  border-width: var(--templateBorderW);
  border-color: var(--borderColor);
  border-style: solid;
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-value {
  grid-area: total;
  --totalSize:calc(var(--dieSize)/2);
  font-size: var(--totalSize);
  line-height: var(--totalSize);
  padding: 5px;
  display: grid;
  place-content: center;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-value > span {
  font-size: var(--totalSize);
}
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult {
  position: relative;
}
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult[title*="0[computed value]"], .sheet-rolltemplate-scp > .sheet-scp .inlinerollresult[original-title*="[computed value]"] {
  pointer-events: none;
}
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult, .sheet-rolltemplate-scp > .sheet-scp .inlinerollresult:is(.fullcrit, .fullfail, .importantroll) {
  border: none;
  background-color: transparent;
}
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult.fullcrit + .sheet-die-icon {
  color: green;
}
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult.fullfail + .sheet-die-icon {
  color: red;
}
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult.importantroll + .sheet-die-icon {
  color: blue;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-die-icon {
  font-size: var(--dieSize);
  place-self: center;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-die-icon:before {
  line-height: var(--dieSize);
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8 {
  display: inline-grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  grid-template-areas: "content";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8 > * {
  grid-area: content;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8 > .inlinerollresult {
  opacity: 0;
  text-align: center;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8 > .sheet-die-icon:before {
  font-family: dicefontd8;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-1 > .sheet-die-icon:before {
  content: "A";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-2 > .sheet-die-icon:before {
  content: "B";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-3 > .sheet-die-icon:before {
  content: "C";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-4 > .sheet-die-icon:before {
  content: "D";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-5 > .sheet-die-icon:before {
  content: "E";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-6 > .sheet-die-icon:before {
  content: "F";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-7 > .sheet-die-icon:before {
  content: "G";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-8 > .sheet-die-icon:before {
  content: "H";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10 {
  display: inline-grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  grid-template-areas: "content";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10 > * {
  grid-area: content;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10 > .inlinerollresult {
  opacity: 0;
  text-align: center;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10 > .sheet-die-icon:before {
  font-family: dicefontd10;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-1 > .sheet-die-icon:before {
  content: "A";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-2 > .sheet-die-icon:before {
  content: "B";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-3 > .sheet-die-icon:before {
  content: "C";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-4 > .sheet-die-icon:before {
  content: "D";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-5 > .sheet-die-icon:before {
  content: "E";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-6 > .sheet-die-icon:before {
  content: "F";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-7 > .sheet-die-icon:before {
  content: "G";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-8 > .sheet-die-icon:before {
  content: "H";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-9 > .sheet-die-icon:before {
  content: "I";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-10 > .sheet-die-icon:before {
  content: "K";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12 {
  display: inline-grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  grid-template-areas: "content";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12 > * {
  grid-area: content;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12 > .inlinerollresult {
  opacity: 0;
  text-align: center;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12 > .sheet-die-icon:before {
  font-family: dicefontd12;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-1 > .sheet-die-icon:before {
  content: "A";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-2 > .sheet-die-icon:before {
  content: "B";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-3 > .sheet-die-icon:before {
  content: "C";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-4 > .sheet-die-icon:before {
  content: "D";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-5 > .sheet-die-icon:before {
  content: "E";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-6 > .sheet-die-icon:before {
  content: "F";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-7 > .sheet-die-icon:before {
  content: "G";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-8 > .sheet-die-icon:before {
  content: "H";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-9 > .sheet-die-icon:before {
  content: "I";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-10 > .sheet-die-icon:before {
  content: "J";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-11 > .sheet-die-icon:before {
  content: "K";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-12 > .sheet-die-icon:before {
  content: "L";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20 {
  display: inline-grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  grid-template-areas: "content";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20 > * {
  grid-area: content;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20 > .inlinerollresult {
  opacity: 0;
  text-align: center;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20 > .sheet-die-icon:before {
  font-family: dicefontd20;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-1 > .sheet-die-icon:before {
  content: "A";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-2 > .sheet-die-icon:before {
  content: "B";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-3 > .sheet-die-icon:before {
  content: "C";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-4 > .sheet-die-icon:before {
  content: "D";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-5 > .sheet-die-icon:before {
  content: "E";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-6 > .sheet-die-icon:before {
  content: "F";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-7 > .sheet-die-icon:before {
  content: "G";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-8 > .sheet-die-icon:before {
  content: "H";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-9 > .sheet-die-icon:before {
  content: "I";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-10 > .sheet-die-icon:before {
  content: "J";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-11 > .sheet-die-icon:before {
  content: "K";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-12 > .sheet-die-icon:before {
  content: "L";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-13 > .sheet-die-icon:before {
  content: "M";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-14 > .sheet-die-icon:before {
  content: "N";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-15 > .sheet-die-icon:before {
  content: "O";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-16 > .sheet-die-icon:before {
  content: "P";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-17 > .sheet-die-icon:before {
  content: "Q";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-18 > .sheet-die-icon:before {
  content: "R";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-19 > .sheet-die-icon:before {
  content: "S";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-20 > .sheet-die-icon:before {
  content: "T";
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage {
  display: grid;
  grid-template-columns: repeat(3, 50px);
  grid-template-rows: auto 34px;
  place-content: center;
  grid-column-gap: 10px;
  grid-template-areas: "base-label  x-label  total-label" "base-damage x-damage total-damage";
  border-radius: 0 0 var(--innerBorderRadius) var(--innerBorderRadius);
  padding: 2px;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage span {
  font-size: 2rem;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-base-damage {
  grid-area: base-damage;
  border-width: 2px 5px;
  border-style: solid;
  border-color: var(--fontColor);
  border-radius: var(--templateRadius);
  background-color: white;
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  place-content: center;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-base-label {
  grid-area: base-label;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-x-damage {
  grid-area: x-damage;
  border-width: 2px 5px;
  border-style: solid;
  border-color: var(--fontColor);
  border-radius: var(--templateRadius);
  background-color: white;
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  place-content: center;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-x-label {
  grid-area: x-label;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-total-damage {
  grid-area: total-damage;
  border-width: 2px 5px;
  border-style: solid;
  border-color: var(--fontColor);
  border-radius: var(--templateRadius);
  background-color: white;
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  place-content: center;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-total-label {
  grid-area: total-label;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  padding: 2px;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="!"],
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="~"] {
  background-color: white;
  border-radius: var(--templateRadius);
  border-width: var(--templateBorderW);
  border-color: black;
  text-transform: uppercase;
  color: var(--selectColor);
  text-shadow: var(--selectShadow);
  font-weight: bold;
}
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="!"] :hover,
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="!"] :focus,
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="~"] :hover,
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="~"] :focus {
  background-color: var(--backColor);
  color: var(--fontColor);
  border-color: var(--borderColor);
  transition: var(--focusTrans);
}
.sheet-rolltemplate-scp > .sheet-scp.sheet-finished {
  border-bottom-width: 2px;
}
.sheet-rolltemplate-scp > .sheet-scp.sheet-finished .sheet-roll-content {
  border-bottom-left-radius: var(--innerBorderRadius);
  border-bottom-right-radius: var(--innerBorderRadius);
}
.sheet-rolltemplate-scp > .sheet-scp.sheet-finished.sheet-continuation {
  border-radius: 0 0 var(--templateRadius) var(--templateRadius);
}
.sheet-rolltemplate-scp > .sheet-scp.sheet-finished:not(.sheet-continuation) {
  border-radius: var(--templateRadius);
}
.sheet-rolltemplate-scp .sheet-description {
  border-radius: var(--innerBorderRadius);
  background-color: white;
}
.sheet-rolltemplate-scp .sheet-description:empty {
  display: none;
}
.sheet-rolltemplate-scp .sheet-description > * {
  padding: 2px;
}
.sheet-rolltemplate-scp .sheet-description a,
.sheet-rolltemplate-scp .sheet-description a[href^="!"],
.sheet-rolltemplate-scp .sheet-description a[href^="~"] {
  color: var(--selectColor);
  text-shadow: var(--selectShadow);
  font-weight: bold;
  font-style: italic;
}
.sheet-rolltemplate-scp .sheet-description .sheet-range {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 2px;
}