roll20-character-sheets/blade_runner_rpg/bladerunner_rpg.css

@import url("https://fonts.googleapis.com/css?family=Homenaje|Play|Material+Symbols+Outlined|material+icons|Wallpoet|Saira+Extra+Condensed&display=swap");
.tabs .tabs__body .tabs__container:not(.k-active-tab) {
  display: none !important;
}

.charsheet .bladerunner [class*=container--character] {
  display: -ms-grid;
  display: grid;
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--character] .container__top {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1rem 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--character] .container__top .section__home {
  gap: 5px;
}
@media (max-width: 760px) {
  .charsheet .bladerunner [class*=container--character] .container__top {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}
.charsheet .bladerunner [class*=container--character] .section__basic {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 5px 1fr 5px auto;
  grid-template-columns: 1fr 1fr auto;
  grid-auto-flow: column;
  gap: 5px;
}
.charsheet .bladerunner [class*=container--character] .section__basic h1 {
  -ms-grid-row-span: 2;
  grid-row: span 2;
}
.charsheet .bladerunner [class*=container--character] .section__basic .option_replicant {
  -ms-grid-row-span: 2;
  grid-row: span 2;
  -ms-grid-column: 3;
  grid-column: 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 5px;
}
.charsheet .bladerunner [class*=container--character] .section__basic .option_replicant label {
  position: relative;
  text-align: center;
  color: var(--col-accent);
  border-radius: 5px;
  padding: 5px 1rem;
  cursor: pointer;
}
.charsheet .bladerunner [class*=container--character] .section__basic .option_replicant label:hover {
  outline: 2px solid var(--col-alt);
}
.charsheet .bladerunner [class*=container--character] .section__basic .option_replicant input {
  display: none;
}
.charsheet .bladerunner [class*=container--character] .section__basic .option_replicant label:first-of-type::after {
  position: absolute;
  content: "";
  inset: 0;
  border-radius: 5px;
  background: var(--col-deep);
  -webkit-transition: all 100ms ease-in-out;
  transition: all 100ms ease-in-out;
  z-index: -1;
}
.charsheet .bladerunner [class*=container--character] .section__basic .option_replicant input[type=hidden][value=human] ~ label:first-of-type {
  color: var(--col-alt);
}
.charsheet .bladerunner [class*=container--character] .section__basic .option_replicant input[type=hidden][value=replicant] ~ label:last-of-type {
  color: var(--col-alt);
}
.charsheet .bladerunner [class*=container--character] .section__basic .option_replicant input[type=hidden][value=replicant] ~ label:first-of-type::after {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
}
@media (max-width: 760px) {
  .charsheet .bladerunner [class*=container--character] .section__basic {
    -ms-grid-columns: 1fr auto;
    grid-template-columns: 1fr auto;
  }
}
.charsheet .bladerunner [class*=container--character] .container__shifts {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
      align-content: center;
  gap: 1rem;
  z-index: 5;
}
.charsheet .bladerunner [class*=container--character] .container__shifts::before {
  display: inline-block;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 30px;
  width: 30px;
  border: 2px solid var(--col-blue);
  border-radius: 4px;
  content: "hourglass_empty";
  font-family: var(--font-icon);
  font-size: 2rem;
  color: var(--col-blue);
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
          filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
}
.charsheet .bladerunner [class*=container--character] .container__shifts button::before {
  display: inline-block;
  content: "double_arrow";
  font-family: var(--font-icon);
  -webkit-transform: translateY(1px);
          transform: translateY(1px);
}
.charsheet .bladerunner [class*=container--character] .container__middle {
  display: -ms-grid;
  display: grid;
  grid-auto-flow: column;
  -ms-grid-columns: 1fr 1rem 1fr 1rem 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  -ms-grid-rows: auto 1rem auto 1rem auto 1rem 1fr;
  grid-template-rows: auto auto auto 1fr;
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(2) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(3) {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(4) {
  -ms-grid-row: 7;
  -ms-grid-column: 1;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(5) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(6) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(7) {
  -ms-grid-row: 5;
  -ms-grid-column: 3;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(8) {
  -ms-grid-row: 7;
  -ms-grid-column: 3;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(9) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(10) {
  -ms-grid-row: 3;
  -ms-grid-column: 5;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(11) {
  -ms-grid-row: 5;
  -ms-grid-column: 5;
}
.charsheet .bladerunner [class*=container--character] .container__middle > *:nth-child(12) {
  -ms-grid-row: 7;
  -ms-grid-column: 5;
}
.charsheet .bladerunner [class*=container--character] .container__middle .repcontrol {
  margin-top: 1rem;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__specialties {
  -ms-grid-row-span: 3;
  grid-row: span 3;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__specialties .repcontainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 5px;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__specialties .repcontainer .repitem {
  -ms-grid-columns: 1fr auto;
  grid-template-columns: 1fr auto;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons {
  grid-column: 1/-1;
  -ms-grid-row: 1;
  grid-row: 1;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 3rem;
  grid-template-columns: 1fr 3rem;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons h2, .charsheet .bladerunner [class*=container--character] .container__middle .section__weapons h3 {
  grid-column: 1/-1;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .repcontainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 5px;
  -ms-flex-item-align: start;
      -ms-grid-row-align: start;
      align-self: start;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .inputRow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media (max-width: 860px) {
  .charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .inputRow {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .inputRow input {
  width: 60px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .inputRow input:nth-of-type(1) {
  -webkit-box-flex: 2;
      -ms-flex: 2;
          flex: 2;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .inputRow input:nth-of-type(2) {
  width: 6rem;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .inputRow button.roller {
  font-family: var(--font-icon);
  width: 4rem;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .inputRow button.roller::after {
  content: "sendsendsend";
  position: relative;
  -webkit-clip-path: none;
          clip-path: none;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .inputRow button.roller:hover::after {
  letter-spacing: -10px;
  left: 10px;
  -webkit-transition: 50ms ease-out;
  transition: 50ms ease-out;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .repcontrol {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin: 0 5px;
  gap: 5px;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__weapons .repcontrol button {
  float: unset;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__armor {
  display: -ms-grid;
  display: grid;
  gap: 5px;
  -ms-grid-columns: 1fr 5px 3.5em;
  grid-template-columns: 1fr 3.5em;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__armor h2 {
  grid-column: 1/-1;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__armor input[name=attr_armor_name] {
  width: auto;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__armor .attribute__value {
  -ms-grid-row-align: center;
  -ms-grid-column-align: center;
  place-self: center;
}
.charsheet .bladerunner [class*=container--character] .container__middle .section__armor textarea {
  -ms-grid-column-span: 2;
  grid-column: span 2;
}
.charsheet .bladerunner [class*=container--character] .container__middle .injuries {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1rem;
  -ms-grid-row-span: 3;
  grid-row: span 3;
}
.charsheet .bladerunner [class*=container--character] .container__middle .injuries > div {
  gap: 1rem;
}
@media (max-width: 860px) {
  .charsheet .bladerunner [class*=container--character] .container__middle {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    grid-auto-flow: dense;
  }
  .charsheet .bladerunner [class*=container--character] .container__middle > div {
    grid-row: auto !important;
  }
}
.charsheet .bladerunner [class*=container--character] .section__attributes {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1rem 1fr 1rem 1fr 1rem 1fr;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--character] .section__attributes h2 {
  grid-column: 1/-2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.charsheet .bladerunner [class*=container--character] .section__attributes .driving {
  -ms-grid-column: 4;
  grid-column: 4;
  -ms-grid-row: 1;
  grid-row: 1;
}
@media (max-width: 860px) {
  .charsheet .bladerunner [class*=container--character] .section__attributes {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
  .charsheet .bladerunner [class*=container--character] .section__attributes h2 {
    grid-column: 1/-1;
  }
  .charsheet .bladerunner [class*=container--character] .section__attributes .driving {
    grid-column: auto;
    grid-row: unset;
    -webkit-box-ordinal-group: 100;
        -ms-flex-order: 99;
            order: 99;
  }
}
.charsheet .bladerunner [class*=container--character] .content__attribute {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 5px;
}
.charsheet .bladerunner [class*=container--character] .content__attribute:hover {
  z-index: 5;
}
.charsheet .bladerunner [class*=container--character] .repeating_weapons + .repcontainer .inputRow input:first-of-type {
  -webkit-box-flex: 2;
      -ms-flex: 2;
          flex: 2;
}
.charsheet .bladerunner [class*=container--character] .container__bottom {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1rem 1fr 1rem 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--character] .container__bottom .section__promotion, .charsheet .bladerunner [class*=container--character] .container__bottom .section__chinyen, .charsheet .bladerunner [class*=container--character] .container__bottom .section__humanity {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.charsheet .bladerunner [class*=container--character] .container__bottom .section__promotion h2, .charsheet .bladerunner [class*=container--character] .container__bottom .section__chinyen h2, .charsheet .bladerunner [class*=container--character] .container__bottom .section__humanity h2 {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 auto;
          flex: 1 0 auto;
  grid-column: 1/-1;
}
.charsheet .bladerunner [class*=container--character] .container__bottom .section__promotion .fill-left, .charsheet .bladerunner [class*=container--character] .container__bottom .section__chinyen .fill-left, .charsheet .bladerunner [class*=container--character] .container__bottom .section__humanity .fill-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-grid-columns: (auto)[11];
  grid-template-columns: repeat(11, auto);
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.charsheet .bladerunner [class*=container--character] .container__bottom .section__promotion .fill-left input:not(:checked), .charsheet .bladerunner [class*=container--character] .container__bottom .section__chinyen .fill-left input:not(:checked), .charsheet .bladerunner [class*=container--character] .container__bottom .section__humanity .fill-left input:not(:checked) {
  width: 18px;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 18px;
          flex: 1 1 18px;
}
.charsheet .bladerunner [class*=container--character] .container__bottom .section__promotion .fill-left input:checked, .charsheet .bladerunner [class*=container--character] .container__bottom .section__chinyen .fill-left input:checked, .charsheet .bladerunner [class*=container--character] .container__bottom .section__humanity .fill-left input:checked {
  -ms-grid-column-span: 2;
  grid-column: span 2;
  -webkit-box-flex: 2;
      -ms-flex: 2 1 18px;
          flex: 2 1 18px;
}
.charsheet .bladerunner [class*=container--character] .container__bottom .section__promotion .fill-left input:nth-of-type(n+11), .charsheet .bladerunner [class*=container--character] .container__bottom .section__chinyen .fill-left input:nth-of-type(n+11), .charsheet .bladerunner [class*=container--character] .container__bottom .section__humanity .fill-left input:nth-of-type(n+11) {
  -ms-grid-row: 2;
  grid-row: 2;
}
@media (max-width: 800px) {
  .charsheet .bladerunner [class*=container--character] .container__bottom {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}

.charsheet .bladerunner [class*=container--shift-log] {
  display: -ms-grid;
  display: grid;
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--shift-log] .section__basic {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 1rem 1fr;
  grid-template-columns: auto 1fr;
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--shift-log] .section__basic h1 {
  -ms-grid-row-span: 2;
  grid-row: span 2;
}
.charsheet .bladerunner [class*=container--shift-log] .section__shifts {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1rem 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: auto 1rem auto 1rem auto;
  grid-template-rows: auto auto auto;
      grid-template-areas: "header   header" "calendar details" "controls .";
  grid-auto-flow: column;
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--shift-log] .section__shifts > h2 {
  grid-column: 1/-1;
}
.charsheet .bladerunner [class*=container--shift-log] .section__shifts .repcontrol, .charsheet .bladerunner [class*=container--shift-log] .section__shifts .repcontrol-button {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
  grid-area: controls;
}
.charsheet .bladerunner [class*=container--shift-log] .section__shifts .repcontrol {
  -ms-grid-row-align: center;
  -ms-grid-column-align: end;
  place-self: center end;
}
.charsheet .bladerunner [class*=container--shift-log] .section__shifts .repcontrol-button {
  -ms-grid-row-align: center;
  -ms-grid-column-align: start;
  place-self: center start;
}
.charsheet .bladerunner [class*=container--shift-log] .shifts_calendar + fieldset + .repcontainer {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  -ms-flex-line-pack: start;
      align-content: flex-start;
  padding: 1rem;
  border: 1px solid var(--col-schematic);
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--shift-log] .shifts_calendar + fieldset + .repcontainer .repitem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.charsheet .bladerunner [class*=container--shift-log] .shifts_calendar + fieldset + .repcontainer button:not(.repcontrol_del) {
  display: -ms-grid;
  display: grid;
  place-items: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100px;
  height: 50px;
  padding: 0;
  border: 1px solid var(--col-schematic);
}
.charsheet .bladerunner [class*=container--shift-log] .shifts_calendar + fieldset + .repcontainer button:not(.repcontrol_del)::after {
  display: block;
  position: relative;
  -webkit-clip-path: none;
          clip-path: none;
  font-family: var(--font-icon);
  font-size: 3rem;
  line-height: 1;
  content: "description";
}
.charsheet .bladerunner [class*=container--shift-log] .shifts_calendar + fieldset + .repcontainer input {
  font-size: 10px;
  width: 100px;
  text-align: center;
}
.charsheet .bladerunner [class*=container--shift-log] .shifts_calendar + fieldset + .repcontainer input:not(:-moz-placeholder-shown) {
  border: none;
  box-shadow: none;
  background: none;
  border-bottom: 1px solid var(--col-schematic);
  border-bottom: 1px solid var(--col-schematic);
}
.charsheet .bladerunner [class*=container--shift-log] .shifts_calendar + fieldset + .repcontainer input:not(:-ms-input-placeholder) {
  border: none;
  box-shadow: none;
  background: none;
  border-bottom: 1px solid var(--col-schematic);
  border-bottom: 1px solid var(--col-schematic);
}
.charsheet .bladerunner [class*=container--shift-log] .shifts_calendar + fieldset + .repcontainer input:not(:placeholder-shown) {
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
  background: none;
  border-bottom: 1px solid var(--col-schematic);
  border-bottom: 1px solid var(--col-schematic);
}
.charsheet .bladerunner [class*=container--shift-log] .shift_display {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.5rem;
}
.charsheet .bladerunner [class*=container--shift-log] .shift_display h3:first-of-type {
  text-align: right;
  color: var(--col-blue);
  border-bottom: 1px solid var(--col-schematic-glow);
}
.charsheet .bladerunner [class*=container--shift-log] .shift_display h3:first-of-type span {
  color: var(--col-red);
  font-size: 1.5rem;
}
.charsheet .bladerunner [class*=container--shift-log] .shift_display h3:first-of-type span::before {
  content: "signal_cellular_alt_1_bar";
  font-family: var(--font-icon);
  margin-right: 5px;
}
.charsheet .bladerunner [class*=container--shift-log] .shift-panel {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr auto;
  grid-template-columns: 1fr auto;
}
.charsheet .bladerunner [class*=container--shift-log] .shift-panel h3 {
  -ms-grid-column-align: start;
      justify-self: start;
}

.charsheet .bladerunner [class*=container--vehicle] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--vehicle] .section__basic {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 1rem 1fr;
  grid-template-columns: auto 1fr;
  gap: 1rem;
}
.charsheet .bladerunner [class*=container--vehicle] .section__basic h1 {
  -ms-grid-row-span: 2;
  grid-row: span 2;
}
.charsheet .bladerunner [class*=container--vehicle] .section__stats {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 5px 1.2fr;
  grid-template-columns: 1fr 1.2fr;
  -ms-grid-rows: auto 5px auto;
  grid-template-rows: auto auto;
  grid-auto-flow: column;
  gap: 5px;
}
.charsheet .bladerunner [class*=container--vehicle] .section__stats > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.charsheet .bladerunner [class*=container--vehicle] .section__stats > *:nth-child(2) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.charsheet .bladerunner [class*=container--vehicle] .section__stats > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.charsheet .bladerunner [class*=container--vehicle] .section__stats > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
.charsheet .bladerunner [class*=container--vehicle] .section__stats .content__attribute {
  -ms-grid-row-span: 2;
  grid-row: span 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1rem;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
@media (max-width: 860px) {
  .charsheet .bladerunner [class*=container--vehicle] .section__stats {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
    grid-auto-flow: row;
  }
  .charsheet .bladerunner [class*=container--vehicle] .section__stats > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .charsheet .bladerunner [class*=container--vehicle] .section__stats > *:nth-child(2) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .charsheet .bladerunner [class*=container--vehicle] .section__stats .content__attribute {
    grid-row: unset;
    -ms-grid-column: 1;
    grid-column: 1;
  }
}

.sheet-rolltemplate-bladerunner-push,
.sheet-rolltemplate-bladerunner {
  --font-main: "Play", sans-serif;
  --font-title: "Saira Extra Condensed", sans-serif;
  --font-header: "Homenaje";
  --font-icon: "Material Symbols Outlined";
  --font-filled: "material icons";
  --col-deep: #071e29;
  --col-tone: rgb(174, 202, 201);
  --col-accent: rgb(183, 223, 167);
  --col-alt: rgb(235, 191, 95);
  --col-alt-glow: rgba(201, 236, 41, 0.7);
  --col-red: rgb(253, 128, 55);
  --col-red-glow: rgba(248, 14, 14, 0.7);
  --col-blue: rgb(88, 202, 255);
  --col-blue-glow: rgba(27, 87, 216, .7);
  --col-schematic: rgb(112, 148, 146);
  --col-schematic-glow: rgba(112, 148, 146, 0.5);
  --col-background: rgb(128, 160, 157);
  --dark-back-gradient-stops: transparent 1.5rem, rgb(57 72 95 / 15%) 6rem;
  --dark-back-gradient: linear-gradient(70deg,var(--dark-back-gradient-stops));
  --veritcal-dark-back-gradient: linear-gradient(160deg,var(--dark-back-gradient-stops));
  margin-left: -30px;
  margin-bottom: 10px;
  display: -ms-grid;
  display: grid;
  gap: 5px;
      grid-template-areas: ". ." ". ." "successes rolls" "successes push";
  background: linear-gradient(12deg, rgba(44, 39, 61, 0.5), rgba(27, 177, 177, 0.5));
  -webkit-box-shadow: -4px 4px 4px rgba(248, 0, 255, 0.18), 0px 4px 4px rgba(255, 212, 0, 0.18), 4px 4px 4px rgba(0, 194, 255, 0.18);
          box-shadow: -4px 4px 4px rgba(248, 0, 255, 0.18), 0px 4px 4px rgba(255, 212, 0, 0.18), 4px 4px 4px rgba(0, 194, 255, 0.18);
  border: 2px solid var(--col-schematic);
  outline: 1px solid var(--col-schematic);
  outline-offset: 1rem;
  font-family: var(--font-main);
  padding: 1rem;
  -webkit-transition: all 400ms ease-in;
  transition: all 400ms ease-in;
}
.sheet-rolltemplate-bladerunner-push:not(:first-child),
.sheet-rolltemplate-bladerunner:not(:first-child) {
  margin-top: 20px;
}
.sheet-rolltemplate-bladerunner-push .sheet-push,
.sheet-rolltemplate-bladerunner .sheet-push {
  text-transform: capitalize;
}
.sheet-rolltemplate-bladerunner-push h1,
.sheet-rolltemplate-bladerunner h1 {
  font-family: var(--font-title);
  text-align: right;
  font-size: 18px;
  font-weight: normal;
  line-height: 1;
  color: var(--col-alt);
  grid-column: 1/-1;
}
.sheet-rolltemplate-bladerunner-push h1 a,
.sheet-rolltemplate-bladerunner h1 a {
  color: var(--col-schematic);
}
.sheet-rolltemplate-bladerunner-push h2,
.sheet-rolltemplate-bladerunner h2 {
  padding-left: 1rem;
  background: var(--col-alt);
  width: calc(100% + 1rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  font-family: var(--font-header);
  text-transform: uppercase;
  color: var(--col-schematic);
  font-size: 32px;
  grid-column: 1/-1;
  overflow: hidden;
}
.sheet-rolltemplate-bladerunner-push h3,
.sheet-rolltemplate-bladerunner h3 {
  color: inherit;
  font-family: inherit;
  text-transform: uppercase;
}
.sheet-rolltemplate-bladerunner-push .sheet-damage-buttons,
.sheet-rolltemplate-bladerunner .sheet-damage-buttons {
  grid-column: 1/-1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.25rem;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  text-transform: capitalize;
}
.sheet-rolltemplate-bladerunner-push .sheet-name,
.sheet-rolltemplate-bladerunner .sheet-name {
  background: linear-gradient(12deg, rgba(44, 39, 61, 0.2), rgba(27, 177, 177, 0.2));
}
.sheet-rolltemplate-bladerunner-push a,
.sheet-rolltemplate-bladerunner a {
  color: white;
}
.sheet-rolltemplate-bladerunner-push a[href^="~"], .sheet-rolltemplate-bladerunner-push a[href^="!"],
.sheet-rolltemplate-bladerunner a[href^="~"],
.sheet-rolltemplate-bladerunner a[href^="!"] {
  display: -ms-grid;
  display: grid;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  place-items: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -ms-grid-row-align: center;
  -ms-grid-column-align: center;
  place-self: center;
  background: var(--col-schematic);
  background: none;
  min-width: 35px;
  min-height: 30px;
  border: 2px solid var(--col-blue);
  font-size: 16px;
  line-height: 1;
  text-align: center;
  color: white;
  -webkit-filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
          filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
}
.sheet-rolltemplate-bladerunner-push a[href^="~"].fullfail, .sheet-rolltemplate-bladerunner-push a[href^="!"].fullfail,
.sheet-rolltemplate-bladerunner a[href^="~"].fullfail,
.sheet-rolltemplate-bladerunner a[href^="!"].fullfail {
  -webkit-box-shadow: 0 0 4px var(--col-red-glow), inset 0 0 4px var(--col-red-glow);
          box-shadow: 0 0 4px var(--col-red-glow), inset 0 0 4px var(--col-red-glow);
  color: var(--col-red-glow);
}
.sheet-rolltemplate-bladerunner-push .inlinerollresult.inlinerollresult,
.sheet-rolltemplate-bladerunner .inlinerollresult.inlinerollresult {
  display: -ms-grid;
  display: grid;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  place-items: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -ms-grid-row-align: center;
  -ms-grid-column-align: center;
  place-self: center;
  background: var(--col-schematic);
  background: none;
  min-width: 35px;
  min-height: 30px;
  border: 2px solid var(--col-blue);
  font-size: 16px;
  line-height: 1;
  text-align: center;
  color: white;
  -webkit-filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
          filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
}
.sheet-rolltemplate-bladerunner-push .inlinerollresult.inlinerollresult.fullfail,
.sheet-rolltemplate-bladerunner .inlinerollresult.inlinerollresult.fullfail {
  -webkit-box-shadow: 0 0 4px var(--col-red-glow), inset 0 0 4px var(--col-red-glow);
          box-shadow: 0 0 4px var(--col-red-glow), inset 0 0 4px var(--col-red-glow);
  color: var(--col-red-glow);
}
.sheet-rolltemplate-bladerunner-push .inlinerollresult.inlinerollresult[title*="computed value"], .sheet-rolltemplate-bladerunner-push .inlinerollresult.inlinerollresult[original-title*="computed value"],
.sheet-rolltemplate-bladerunner .inlinerollresult.inlinerollresult[title*="computed value"],
.sheet-rolltemplate-bladerunner .inlinerollresult.inlinerollresult[original-title*="computed value"] {
  pointer-events: none;
}
.sheet-rolltemplate-bladerunner-push .sheet-force-fumble .inlinerollresult,
.sheet-rolltemplate-bladerunner .sheet-force-fumble .inlinerollresult {
  -webkit-box-shadow: 0 0 4px var(--col-red-glow), inset 0 0 4px var(--col-red-glow);
          box-shadow: 0 0 4px var(--col-red-glow), inset 0 0 4px var(--col-red-glow);
  color: var(--col-red-glow);
}
.sheet-rolltemplate-bladerunner-push .sheet-successes,
.sheet-rolltemplate-bladerunner .sheet-successes {
  -ms-grid-row: 5;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  position: relative;
  display: -ms-grid;
  display: grid;
  grid-area: successes;
  height: 60px;
  width: 60px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: none;
  background: linear-gradient(12deg, rgba(44, 39, 61, 0.3), rgba(27, 177, 177, 0.3));
  border: 2px solid var(--col-alt);
  border-radius: 50%;
  -webkit-filter: drop-shadow(0 0 2px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow));
          filter: drop-shadow(0 0 2px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow));
}
.sheet-rolltemplate-bladerunner-push .sheet-successes span.inlinerollresult,
.sheet-rolltemplate-bladerunner .sheet-successes span.inlinerollresult {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background: none;
  border: none;
  font-family: var(--font-main);
  font-size: 4rem;
  color: var(--col-alt);
}
.sheet-rolltemplate-bladerunner-push .sheet-successes .fullcrit, .sheet-rolltemplate-bladerunner-push .sheet-successes .fullfail,
.sheet-rolltemplate-bladerunner .sheet-successes .fullcrit,
.sheet-rolltemplate-bladerunner .sheet-successes .fullfail {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 50%;
  border: none;
}
.sheet-rolltemplate-bladerunner-push .sheet-rolls,
.sheet-rolltemplate-bladerunner .sheet-rolls {
  -ms-grid-row: 5;
  -ms-grid-column: 3;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  gap: 1rem;
  grid-area: rolls;
}
.sheet-rolltemplate-bladerunner-push .sheet-rolls::before,
.sheet-rolltemplate-bladerunner .sheet-rolls::before {
  background: var(--dark-back-gradient);
  position: absolute;
  content: "";
  top: 0;
  bottom: 0;
  right: 0;
  left: -4rem;
}
.sheet-rolltemplate-bladerunner-push .sheet-rolls .inlinerollresult,
.sheet-rolltemplate-bladerunner .sheet-rolls .inlinerollresult {
  position: relative;
  -webkit-perspective: 1000px;
          perspective: 1000px;
}
.sheet-rolltemplate-bladerunner-push .sheet-rolls h3,
.sheet-rolltemplate-bladerunner .sheet-rolls h3 {
  display: -ms-grid;
  display: grid;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  place-items: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -ms-grid-row-align: center;
  -ms-grid-column-align: center;
  place-self: center;
  background: var(--col-schematic);
  background: none;
  min-width: 35px;
  min-height: 30px;
  border: 2px solid var(--col-blue);
  font-size: 16px;
  line-height: 1;
  text-align: center;
  color: white;
  -webkit-filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
          filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
  border: 0px;
}
.sheet-rolltemplate-bladerunner-push .sheet-rolls h3.fullfail,
.sheet-rolltemplate-bladerunner .sheet-rolls h3.fullfail {
  -webkit-box-shadow: 0 0 4px var(--col-red-glow), inset 0 0 4px var(--col-red-glow);
          box-shadow: 0 0 4px var(--col-red-glow), inset 0 0 4px var(--col-red-glow);
  color: var(--col-red-glow);
}
.sheet-rolltemplate-bladerunner-push .sheet-push,
.sheet-rolltemplate-bladerunner .sheet-push {
  -ms-grid-row: 7;
  -ms-grid-column: 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
  grid-area: push;
  border-bottom: 1px solid var(--col-blue);
  padding: 4px;
  color: var(--col-blue);
  font-size: 18px;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 2rem 100%, 0 calc(100% - 2rem));
          clip-path: polygon(0 0, 100% 0, 100% 100%, 2rem 100%, 0 calc(100% - 2rem));
}
.sheet-rolltemplate-bladerunner-push .sheet-push a,
.sheet-rolltemplate-bladerunner .sheet-push a {
  border: none;
  background: rgba(85, 157, 175, 0.2);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-left: 2rem;
  gap: 0.25rem;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.sheet-rolltemplate-bladerunner-push .sheet-push a::after,
.sheet-rolltemplate-bladerunner .sheet-push a::after {
  font-family: var(--font-icon);
  content: "arrow_circle_right";
  color: var(--col-blue);
  font-size: 20px;
}
.sheet-rolltemplate-bladerunner-push .sheet-push a:hover,
.sheet-rolltemplate-bladerunner .sheet-push a:hover {
  background: rgba(85, 157, 175, 0.4);
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table,
.sheet-rolltemplate-bladerunner .sheet-choice-table {
  display: -ms-grid;
  display: grid;
  place-content: center;
  place-items: center;
  -ms-grid-columns: auto 0.25rem auto 0.25rem auto;
  grid-template-columns: repeat(3, auto);
  -ms-grid-rows: auto 0.25rem auto 0.25rem auto;
  grid-template-rows: repeat(3, auto);
  grid-column: 1/-1;
  -ms-grid-row-span: 2;
  grid-row: span 2;
  min-height: 105px;
  gap: 0.25rem;
  border-left: 1rem solid var(--col-schematic-glow);
  color: white;
  position: relative;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table > *:nth-child(1), .sheet-rolltemplate-bladerunner .sheet-choice-table > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table > *:nth-child(2), .sheet-rolltemplate-bladerunner .sheet-choice-table > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table > *:nth-child(3), .sheet-rolltemplate-bladerunner .sheet-choice-table > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table > *:nth-child(4), .sheet-rolltemplate-bladerunner .sheet-choice-table > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table > *:nth-child(5), .sheet-rolltemplate-bladerunner .sheet-choice-table > *:nth-child(5) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table > *:nth-child(6), .sheet-rolltemplate-bladerunner .sheet-choice-table > *:nth-child(6) {
  -ms-grid-row: 3;
  -ms-grid-column: 5;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table > *:nth-child(7), .sheet-rolltemplate-bladerunner .sheet-choice-table > *:nth-child(7) {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table > *:nth-child(8), .sheet-rolltemplate-bladerunner .sheet-choice-table > *:nth-child(8) {
  -ms-grid-row: 5;
  -ms-grid-column: 3;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table > *:nth-child(9), .sheet-rolltemplate-bladerunner .sheet-choice-table > *:nth-child(9) {
  -ms-grid-row: 5;
  -ms-grid-column: 5;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-head-back,
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-side-back,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-head-back,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-side-back {
  position: absolute;
  width: 100%;
  height: 100%;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-head-back,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-head-back {
  grid-column: 2/-1;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
  background-image: var(--dark-back-gradient);
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-side-back,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-side-back {
  grid-row: 2/-1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  background-image: var(--veritcal-dark-back-gradient);
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3,
.sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 {
  -ms-grid-columns: (auto)[4];
  grid-template-columns: repeat(4, auto);
  -ms-grid-rows: (auto)[4];
  grid-template-rows: repeat(4, auto);
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(1), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(2), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(3), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(4), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(4) {
  -ms-grid-row: 1;
  -ms-grid-column: 4;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(5), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(5) {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(6), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(6) {
  -ms-grid-row: 2;
  -ms-grid-column: 2;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(7), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(7) {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(8), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(8) {
  -ms-grid-row: 2;
  -ms-grid-column: 4;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(9), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(9) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(10), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(10) {
  -ms-grid-row: 3;
  -ms-grid-column: 2;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(11), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(11) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(12), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(12) {
  -ms-grid-row: 3;
  -ms-grid-column: 4;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(13), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(13) {
  -ms-grid-row: 4;
  -ms-grid-column: 1;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(14), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(14) {
  -ms-grid-row: 4;
  -ms-grid-column: 2;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(15), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(15) {
  -ms-grid-row: 4;
  -ms-grid-column: 3;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table.sheet-grid-3 > *:nth-child(16), .sheet-rolltemplate-bladerunner .sheet-choice-table.sheet-grid-3 > *:nth-child(16) {
  -ms-grid-row: 4;
  -ms-grid-column: 4;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-toRoll,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-toRoll {
  -ms-grid-row-align: stretch;
  -ms-grid-column-align: stretch;
  place-self: stretch;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-toRoll > a,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-toRoll > a {
  border-color: var(--col-alt);
  -webkit-filter: drop-shadow(0 0 2px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow));
          filter: drop-shadow(0 0 2px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow));
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  text-align: center;
  height: 100%;
  display: -ms-grid;
  display: grid;
  place-items: center;
  font-size: 12px;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-corner-label,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-corner-label {
  -ms-grid-column: 1;
  grid-column: 1;
  -ms-grid-row: 1;
  grid-row: 1;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-corner-label > a,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-corner-label > a {
  border-color: var(--col-alt);
  -webkit-filter: drop-shadow(0 0 2px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow));
          filter: drop-shadow(0 0 2px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow));
  font-size: 12px;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-top-label, .sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-side-label,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-top-label,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-side-label {
  background: var(--col-schematic);
  border: none;
  display: -ms-grid;
  display: grid;
  place-items: center;
  -ms-grid-row-align: stretch !important;
  -ms-grid-column-align: stretch !important;
  place-self: stretch !important;
  font-size: 16px;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-top-label,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-top-label {
  -ms-grid-row: 1;
  grid-row: 1;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table .sheet-side-label,
.sheet-rolltemplate-bladerunner .sheet-choice-table .sheet-side-label {
  -ms-grid-column: 1;
  grid-column: 1;
  min-width: 35px;
}
.sheet-rolltemplate-bladerunner-push .sheet-choice-table::before,
.sheet-rolltemplate-bladerunner .sheet-choice-table::before {
  background: var(--dark-back-gradient);
  position: absolute;
  content: "Push matrix";
  font-family: var(--font-header);
  font-size: 18px;
  text-transform: uppercase;
  color: var(--col-tone);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  rotate: 90deg;
  top: 0;
  left: 2rem;
}
.sheet-rolltemplate-bladerunner-push .sheet-span-all,
.sheet-rolltemplate-bladerunner .sheet-span-all {
  grid-column: 1/-1;
}
.sheet-rolltemplate-bladerunner-push .sheet-effect,
.sheet-rolltemplate-bladerunner .sheet-effect {
  text-transform: capitalize;
  text-align: center;
}
.sheet-rolltemplate-bladerunner-push .sheet-description,
.sheet-rolltemplate-bladerunner .sheet-description {
  color: white;
  font-family: inherit;
}
.sheet-rolltemplate-bladerunner-push.sheet-rolltemplate-darkmode h1,
.sheet-rolltemplate-bladerunner.sheet-rolltemplate-darkmode h1 {
  color: var(--col-tone);
}
.sheet-rolltemplate-bladerunner-push.sheet-rolltemplate-darkmode h1 a,
.sheet-rolltemplate-bladerunner.sheet-rolltemplate-darkmode h1 a {
  color: var(--col-alt);
}
.sheet-rolltemplate-bladerunner-push.sheet-rolltemplate-darkmode h2,
.sheet-rolltemplate-bladerunner.sheet-rolltemplate-darkmode h2 {
  background: var(--col-deep);
}
.sheet-rolltemplate-bladerunner-push.sheet-rolltemplate-darkmode .sheet-choice-table::before,
.sheet-rolltemplate-bladerunner.sheet-rolltemplate-darkmode .sheet-choice-table::before {
  color: var(--col-blue);
}

.sheet-darkmode .ui-dialog .dialog .nav.nav-tabs a[data-tab=charsheet]:before,
.sheet-darkmode .ui-dialog .dialog .nav.nav-tabs a[data-tab=charsheet]:is(:focus, :hover):before {
  -webkit-filter: invert(0%);
          filter: invert(0%);
}
.sheet-darkmode .sheetform {
  background-color: unset;
}
.sheet-darkmode .charsheet .bladerunner {
  --col-background: rgb(50, 125, 138);
  background: radial-gradient(ellipse 400px 400% at right center, var(--col-background), transparent 20%), radial-gradient(ellipse 400px 400% at left center, var(--col-background), transparent 20%), -webkit-gradient(linear, left top, right top, from(var(--col-background)), color-stop(black), to(var(--col-background))), repeating-linear-gradient(to right, transparent, transparent 10px, var(--col-background) 10px, var(--col-background) 11px), repeating-linear-gradient(30deg, transparent, transparent 20px, var(--col-background) 20px, var(--col-background) 21px), repeating-linear-gradient(-30deg, transparent, transparent 20px, var(--col-background) 20px, var(--col-background) 21px), -webkit-gradient(linear, left top, left bottom, from(black), to(black));
  background: radial-gradient(ellipse 400px 400% at right center, var(--col-background), transparent 20%), radial-gradient(ellipse 400px 400% at left center, var(--col-background), transparent 20%), linear-gradient(to right, var(--col-background), black, var(--col-background)), repeating-linear-gradient(to right, transparent, transparent 10px, var(--col-background) 10px, var(--col-background) 11px), repeating-linear-gradient(30deg, transparent, transparent 20px, var(--col-background) 20px, var(--col-background) 21px), repeating-linear-gradient(-30deg, transparent, transparent 20px, var(--col-background) 20px, var(--col-background) 21px), linear-gradient(black 0%, black 100%);
  -webkit-box-shadow: 0 0 20px var(--col-deep), 0 0 12px var(--col-background), 0 0 2px var(--col-background);
          box-shadow: 0 0 20px var(--col-deep), 0 0 12px var(--col-background), 0 0 2px var(--col-background);
  background-size: cover, cover, cover, cover, cover, cover;
  background-blend-mode: lighten, lighten, multiply, lighten, lighten, lighten, normal;
  background-repeat: no-repeat;
}

.ui-dialog {
  --font-main: "Play", sans-serif;
  --font-title: "Saira Extra Condensed", sans-serif;
  --font-header: "Homenaje";
  --font-icon: "Material Symbols Outlined";
  --font-filled: "material icons";
  --col-deep: #071e29;
  --col-tone: rgb(174, 202, 201);
  --col-accent: rgb(183, 223, 167);
  --col-alt: rgb(235, 191, 95);
  --col-alt-glow: rgba(201, 236, 41, 0.7);
  --col-red: rgb(253, 128, 55);
  --col-red-glow: rgba(248, 14, 14, 0.7);
  --col-blue: rgb(88, 202, 255);
  --col-blue-glow: rgba(27, 87, 216, .7);
  --col-schematic: rgb(112, 148, 146);
  --col-schematic-glow: rgba(90, 141, 138, 0.5);
  --col-background: rgb(128, 160, 157);
  --selectedColor:var(--col-blue);
  --unselectedColor1:var(--col-background);
  --col-option2: rgba(133, 90, 90, 0.0);
  --img-bladerunner: url("https://s3.amazonaws.com/files.d20.io/images/304284738/jAqK_uR6cB2p2lCFKoDTOA/max.png?1663001456");
  --img-caution: repeating-linear-gradient(
      45deg,
      var(--col-option1, var(--col-schematic-glow)),
      var(--col-option1, var(--col-schematic-glow)) 10px,
      var(--col-option2, transparent) 10px,
      var(--col-option2, transparent) 20px
    );
}
.ui-dialog .dialog .nav.nav-tabs a[data-tab=charsheet],
.ui-dialog .dialog .nav.nav-tabs a[data-tab=charsheet]:is(:focus, :hover) {
  color: transparent;
  position: relative;
  width: 120px;
  text-decoration: none;
}
.ui-dialog .dialog .nav.nav-tabs a[data-tab=charsheet] > *,
.ui-dialog .dialog .nav.nav-tabs a[data-tab=charsheet]:is(:focus, :hover) > * {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: content;
}
.ui-dialog .dialog .nav.nav-tabs a[data-tab=charsheet]:before,
.ui-dialog .dialog .nav.nav-tabs a[data-tab=charsheet]:is(:focus, :hover):before {
  position: absolute;
  inset: 0;
  content: "";
  background-image: var(--img-bladerunner);
  background-size: 120px;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-filter: invert(100%);
          filter: invert(100%);
}
.ui-dialog .tab-content .charsheet .flex-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.ui-dialog .tab-content .charsheet .gap {
  gap: 5px;
}
.ui-dialog .tab-content .charsheet .capitalize {
  text-transform: capitalize;
}
.ui-dialog .tab-content .charsheet .adaptive {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto;
  grid-template-columns: auto;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
      grid-template-areas: "content";
  position: relative;
}
.ui-dialog .tab-content .charsheet .adaptive > * {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: content;
}
.ui-dialog .tab-content .charsheet .adaptive > span {
  opacity: 0;
  z-index: -10;
  text-transform: initial;
  border-radius: 0px;
}
.ui-dialog .tab-content .charsheet .adaptive--text {
  min-height: 4rem;
}
.ui-dialog .tab-content .charsheet .adaptive--text__span {
  white-space: pre-wrap;
  padding: 4px;
  border: 1px solid transparent;
}
.ui-dialog .tab-content .charsheet .adaptive--text__textarea {
  width: 100%;
  height: 100%;
  resize: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.ui-dialog .tab-content .charsheet .adaptive--text__textarea,
.ui-dialog .tab-content .charsheet .adaptive--input__input {
  position: absolute;
}
.ui-dialog .tab-content .charsheet .adaptive--input__input {
  width: 100%;
}
.ui-dialog .tab-content .charsheet .adaptive--input__span {
  padding: 2px;
  min-height: 1.5rem;
}
.ui-dialog .tab-content .charsheet .collapse-container {
  position: relative;
}
.ui-dialog .tab-content .charsheet .repitem:hover .collapse, .ui-dialog .tab-content .charsheet .repitem:hover .roll-container,
.ui-dialog .tab-content .charsheet .collapse-container:hover .collapse,
.ui-dialog .tab-content .charsheet .collapse-container:hover .roll-container {
  opacity: 1;
}
.ui-dialog .tab-content .charsheet .repitem .collapse,
.ui-dialog .tab-content .charsheet .collapse-container .collapse {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  opacity: 0;
  position: absolute;
  right: 0px;
  top: 0px;
  border: 0px solid black;
  border-radius: 0;
  color: var(--selectedColor);
  text-transform: none;
  background-color: transparent;
  display: inline;
  font-size: 16px;
  z-index: 100;
}
.ui-dialog .tab-content .charsheet .repitem .collapse:before,
.ui-dialog .tab-content .charsheet .collapse-container .collapse:before {
  content: "y";
  font-family: pictos;
}
.ui-dialog .tab-content .charsheet .repitem .collapse:checked,
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked {
  color: var(--unselectedColor1);
}
.ui-dialog .tab-content .charsheet .repitem .collapse:checked ~ .expanded,
.ui-dialog .tab-content .charsheet .repitem .collapse:checked ~ .collapse-container .expanded,
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked ~ .expanded,
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked ~ .collapse-container .expanded {
  display: none !important;
}
.ui-dialog .tab-content .charsheet .repitem .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
.ui-dialog .tab-content .charsheet .repitem .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + *,
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + * {
  display: none !important;
}
.ui-dialog .tab-content .charsheet .repitem .collapse:not(:checked) ~ .collapsed,
.ui-dialog .tab-content .charsheet .repitem .collapse:not(:checked) ~ .collapse-container .collapsed,
.ui-dialog .tab-content .charsheet .collapse-container .collapse:not(:checked) ~ .collapsed,
.ui-dialog .tab-content .charsheet .collapse-container .collapse:not(:checked) ~ .collapse-container .collapsed {
  display: none !important;
}
.ui-dialog .tab-content .charsheet .repitem .collapse:hover,
.ui-dialog .tab-content .charsheet .collapse-container .collapse:hover {
  color: var(--selectedColor);
}
.ui-dialog .tab-content .charsheet .repitem .collapse {
  right: -15px;
}
.ui-dialog .tab-content .charsheet .repcontainer.editmode .collapse {
  display: none;
}
.ui-dialog .tab-content .charsheet .section-control:not(:checked) + .section-display {
  display: none !important;
}
.ui-dialog .charsheet {
  padding: 0;
}
.ui-dialog .charsheet .fit-grid {
  width: 100%;
  -ms-grid-row-align: stretch;
  -ms-grid-column-align: stretch;
  place-self: stretch;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.ui-dialog .charsheet .center-text {
  text-align: center;
}
.ui-dialog .charsheet .uppercase {
  text-transform: uppercase;
}

.charsheet .bladerunner {
  background-image: radial-gradient(ellipse 400px 400% at right center, var(--col-background), transparent 10%), radial-gradient(ellipse 400px 400% at left center, var(--col-background), transparent 10%), -webkit-gradient(linear, left top, right top, from(var(--col-background)), color-stop(30%, var(--col-deep)), color-stop(70%, var(--col-deep)), to(var(--col-background))), repeating-linear-gradient(to right, transparent, transparent 10px, var(--col-background) 10px, var(--col-background) 11px), repeating-linear-gradient(30deg, transparent, transparent 20px, var(--col-background) 20px, var(--col-background) 21px), repeating-linear-gradient(-30deg, transparent, transparent 20px, var(--col-background) 20px, var(--col-background) 21px), -webkit-gradient(linear, left top, left bottom, from(var(--col-background)), to(var(--col-background)));
  background-image: radial-gradient(ellipse 400px 400% at right center, var(--col-background), transparent 10%), radial-gradient(ellipse 400px 400% at left center, var(--col-background), transparent 10%), linear-gradient(to right, var(--col-background), var(--col-deep) 30%, var(--col-deep) 70%, var(--col-background)), repeating-linear-gradient(to right, transparent, transparent 10px, var(--col-background) 10px, var(--col-background) 11px), repeating-linear-gradient(30deg, transparent, transparent 20px, var(--col-background) 20px, var(--col-background) 21px), repeating-linear-gradient(-30deg, transparent, transparent 20px, var(--col-background) 20px, var(--col-background) 21px), linear-gradient(var(--col-background), var(--col-background));
  background-size: cover, cover, cover, cover, cover, cover, cover;
  background-blend-mode: screen, screen, multiply, overlay, overlay, overlay, normal;
  background-repeat: no-repeat, repeat;
  background-position: 20% 10%;
  -webkit-box-shadow: inset 0 0 12px white, inset 0 0 6px white, inset 0 0 2px white;
          box-shadow: inset 0 0 12px white, inset 0 0 6px white, inset 0 0 2px white;
  padding: 2rem;
  outline: 2px solid var(--col-schematic);
  outline-offset: -1rem;
  position: relative;
  font-family: var(--font-main);
  z-index: 1;
  /* Chrome, Safari, Edge, Opera */
  /* Firefox */
}
.charsheet .bladerunner .tabs__container > *:nth-child(even) {
  position: relative;
  -webkit-animation: spawn-left 500ms ease-in-out;
          animation: spawn-left 500ms ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.charsheet .bladerunner .tabs__container > *:nth-child(odd) {
  position: relative;
  -webkit-animation: spawn-right 500ms ease-in-out;
          animation: spawn-right 500ms ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes spawn-left {
  0% {
    -webkit-transform: translateX(-200%);
            transform: translateX(-200%);
  }
  99% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}
@keyframes spawn-left {
  0% {
    -webkit-transform: translateX(-200%);
            transform: translateX(-200%);
  }
  99% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}
@-webkit-keyframes spawn-right {
  0% {
    -webkit-transform: translateX(200%);
            transform: translateX(200%);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes spawn-right {
  0% {
    -webkit-transform: translateX(200%);
            transform: translateX(200%);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
.charsheet .bladerunner nav {
  position: relative;
  z-index: 99;
}
.charsheet .bladerunner nav button, .charsheet .bladerunner .container__shifts button {
  background-color: #010302 !important;
}
.charsheet .bladerunner .inputRow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 5px;
  margin: 0;
}
.charsheet .bladerunner .inputRow h2 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.charsheet .bladerunner .inputRow input[type=text] {
  width: 100px;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 200px;
          flex: 1 1 200px;
  min-width: 100px;
}
.charsheet .bladerunner textarea {
  width: calc(100% - 1rem);
  margin: auto;
  resize: none;
  height: auto;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.charsheet .bladerunner textarea::-webkit-scrollbar {
  width: 5px;
}
.charsheet .bladerunner textarea::-webkit-scrollbar-track {
  background-color: var(--col-deep);
}
.charsheet .bladerunner textarea::-webkit-scrollbar-thumb {
  background-color: var(--col-tone);
}
.charsheet .bladerunner textarea:hover::-webkit-scrollbar-thumb {
  background-color: var(--col-alt);
  -webkit-box-shadow: 0 0 5px var(--col-deep);
          box-shadow: 0 0 5px var(--col-deep);
}
.charsheet .bladerunner ::-moz-selection {
  background: var(--col-alt-glow);
  color: var(--col-deep);
}
.charsheet .bladerunner ::selection {
  background: var(--col-alt-glow);
  color: var(--col-deep);
}
.charsheet .bladerunner label {
  margin: 0;
  padding: 0;
  width: auto;
}
.charsheet .bladerunner :where(input):focus {
  outline: none;
}
.charsheet .bladerunner input::-webkit-outer-spin-button,
.charsheet .bladerunner input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}
.charsheet .bladerunner input[type=number] {
  -moz-appearance: textfield;
  -webkit-appearance: textfield;
          appearance: textfield;
  text-align: center;
}
.charsheet .bladerunner textarea, .charsheet .bladerunner input[type=text], .charsheet .bladerunner input[type=number], .charsheet .bladerunner select {
  background: rgba(171, 186, 187, 0.2);
  border-color: var(--col-schematic);
  -webkit-box-shadow: 0 0 2px var(--col-schematic), 0 0 4px var(--col-schematic);
          box-shadow: 0 0 2px var(--col-schematic), 0 0 4px var(--col-schematic);
  border-radius: 0;
  color: var(--col-tone);
  outline: none;
}
.charsheet .bladerunner textarea:-moz-placeholder-shown, .charsheet .bladerunner input[type=text]:-moz-placeholder-shown, .charsheet .bladerunner input[type=number]:-moz-placeholder-shown, .charsheet .bladerunner select:-moz-placeholder-shown {
  background: var(--img-caution);
  text-transform: capitalize;
}
.charsheet .bladerunner textarea:-ms-input-placeholder, .charsheet .bladerunner input[type=text]:-ms-input-placeholder, .charsheet .bladerunner input[type=number]:-ms-input-placeholder, .charsheet .bladerunner select:-ms-input-placeholder {
  background: var(--img-caution);
  text-transform: capitalize;
}
.charsheet .bladerunner textarea:placeholder-shown, .charsheet .bladerunner input[type=text]:placeholder-shown, .charsheet .bladerunner input[type=number]:placeholder-shown, .charsheet .bladerunner select:placeholder-shown {
  background: var(--img-caution);
  text-transform: capitalize;
}
.charsheet .bladerunner textarea:placeholder-shown::-webkit-input-placeholder, .charsheet .bladerunner input[type=text]:placeholder-shown::-webkit-input-placeholder, .charsheet .bladerunner input[type=number]:placeholder-shown::-webkit-input-placeholder, .charsheet .bladerunner select:placeholder-shown::-webkit-input-placeholder {
  color: var(--col-red);
}
.charsheet .bladerunner textarea:placeholder-shown::-moz-placeholder, .charsheet .bladerunner input[type=text]:placeholder-shown::-moz-placeholder, .charsheet .bladerunner input[type=number]:placeholder-shown::-moz-placeholder, .charsheet .bladerunner select:placeholder-shown::-moz-placeholder {
  color: var(--col-red);
}
.charsheet .bladerunner textarea:placeholder-shown:-ms-input-placeholder, .charsheet .bladerunner input[type=text]:placeholder-shown:-ms-input-placeholder, .charsheet .bladerunner input[type=number]:placeholder-shown:-ms-input-placeholder, .charsheet .bladerunner select:placeholder-shown:-ms-input-placeholder {
  color: var(--col-red);
}
.charsheet .bladerunner textarea:placeholder-shown::-ms-input-placeholder, .charsheet .bladerunner input[type=text]:placeholder-shown::-ms-input-placeholder, .charsheet .bladerunner input[type=number]:placeholder-shown::-ms-input-placeholder, .charsheet .bladerunner select:placeholder-shown::-ms-input-placeholder {
  color: var(--col-red);
}
.charsheet .bladerunner textarea:-moz-placeholder-shown::placeholder, .charsheet .bladerunner input[type=text]:-moz-placeholder-shown::placeholder, .charsheet .bladerunner input[type=number]:-moz-placeholder-shown::placeholder, .charsheet .bladerunner select:-moz-placeholder-shown::placeholder {
  color: var(--col-red);
}
.charsheet .bladerunner textarea:-ms-input-placeholder::placeholder, .charsheet .bladerunner input[type=text]:-ms-input-placeholder::placeholder, .charsheet .bladerunner input[type=number]:-ms-input-placeholder::placeholder, .charsheet .bladerunner select:-ms-input-placeholder::placeholder {
  color: var(--col-red);
}
.charsheet .bladerunner textarea:placeholder-shown::placeholder, .charsheet .bladerunner input[type=text]:placeholder-shown::placeholder, .charsheet .bladerunner input[type=number]:placeholder-shown::placeholder, .charsheet .bladerunner select:placeholder-shown::placeholder {
  color: var(--col-red);
}
.charsheet .bladerunner textarea:hover, .charsheet .bladerunner textarea:focus-within, .charsheet .bladerunner input[type=text]:hover, .charsheet .bladerunner input[type=text]:focus-within, .charsheet .bladerunner input[type=number]:hover, .charsheet .bladerunner input[type=number]:focus-within, .charsheet .bladerunner select:hover, .charsheet .bladerunner select:focus-within {
  -webkit-animation: pulse 2s ease infinite;
          animation: pulse 2s ease infinite;
}
@-webkit-keyframes pulse {
  0% {
    background: rgba(171, 186, 187, 0.2);
  }
  50% {
    background: rgba(171, 186, 187, 0.4);
  }
  100% {
    background: rgba(171, 186, 187, 0.2);
  }
}
@keyframes pulse {
  0% {
    background: rgba(171, 186, 187, 0.2);
  }
  50% {
    background: rgba(171, 186, 187, 0.4);
  }
  100% {
    background: rgba(171, 186, 187, 0.2);
  }
}
.charsheet .bladerunner select {
  height: auto;
  width: 90px;
  margin: 0;
}
.charsheet .bladerunner select option {
  background: var(--col-background);
  color: var(--col-deep);
}
.charsheet .bladerunner select option:hover {
  background: var(--col-alt);
}
.charsheet .bladerunner .title_input.title_input.title_input:not(:-moz-placeholder-shown) {
  border: none;
  background: none;
  box-shadow: none;
  color: var(--col-alt);
  font-weight: bold;
  font-size: 16px;
}
.charsheet .bladerunner .title_input.title_input.title_input:not(:-ms-input-placeholder) {
  border: none;
  background: none;
  box-shadow: none;
  color: var(--col-alt);
  font-weight: bold;
  font-size: 16px;
}
.charsheet .bladerunner .title_input.title_input.title_input:not(:placeholder-shown) {
  border: none;
  background: none;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: var(--col-alt);
  font-weight: bold;
  font-size: 16px;
}
.charsheet .bladerunner h1 {
  color: var(--col-accent);
}
.charsheet .bladerunner h2 {
  background: var(--col-deep);
  padding: 0 1rem;
  font-family: var(--font-title);
  font-size: 1.5rem;
  font-weight: normal;
  color: var(--col-tone);
  text-transform: uppercase;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.charsheet .bladerunner h3 {
  font-family: var(--font-main);
  font-size: 1.25rem;
  font-weight: normal;
  line-height: 1;
  color: var(--col-accent);
  text-transform: uppercase;
  text-align: left;
  padding: 0 5px;
  margin: 5px;
}
.charsheet .bladerunner :where([class*=section]) {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 1rem;
  gap: 5px;
  background: linear-gradient(90deg, rgb(24, 74, 82), rgb(7, 17, 21) 60px, rgb(7, 17, 21) calc(100% - 60px), rgb(24, 74, 82));
  background-attachment: fixed;
  -webkit-box-shadow: -4px 4px 4px rgba(248, 0, 255, 0.1803921569), 0px 4px 4px rgba(255, 212, 0, 0.1803921569), 4px 4px 4px rgba(0, 194, 255, 0.1803921569);
          box-shadow: -4px 4px 4px rgba(248, 0, 255, 0.1803921569), 0px 4px 4px rgba(255, 212, 0, 0.1803921569), 4px 4px 4px rgba(0, 194, 255, 0.1803921569);
  border: 2px solid var(--col-schematic);
  outline: 1px solid var(--col-schematic);
  outline-offset: 1rem;
  -webkit-transition: all 400ms ease-in;
  transition: all 400ms ease-in;
}
.charsheet .bladerunner :where([class*=section]):hover {
  outline-offset: 2rem;
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.charsheet .bladerunner :where([class*=section])::before {
  position: absolute;
  inset: 0;
  content: "";
  -webkit-box-shadow: -10px 20px 20px rgba(10, 65, 117, 0.1);
          box-shadow: -10px 20px 20px rgba(10, 65, 117, 0.1);
  z-index: -1;
}
.charsheet .bladerunner button {
  cursor: pointer;
  -webkit-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
}
.charsheet .bladerunner button:hover {
  background: none;
  -webkit-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
  border-color: var(--col-red);
  color: var(--col-red);
  -webkit-filter: drop-shadow(0 0 4px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
          filter: drop-shadow(0 0 4px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
}
.charsheet .bladerunner button, .charsheet .bladerunner button[type=roll], .charsheet .bladerunner button[type=action], .charsheet .bladerunner .button {
  position: relative;
  background: none;
  border: 1px solid var(--col-alt);
  outline: none;
  padding: 0.5rem 1rem;
  margin: 0;
  -webkit-filter: drop-shadow(0 0 2px var(--col-alt-glow));
          filter: drop-shadow(0 0 2px var(--col-alt-glow));
  font-family: var(--font-main);
  font-size: 1rem;
  font-weight: normal;
  color: var(--col-alt);
  text-transform: uppercase;
}
.charsheet .bladerunner button::after, .charsheet .bladerunner button[type=roll]::after, .charsheet .bladerunner button[type=action]::after, .charsheet .bladerunner .button::after {
  content: "";
  position: absolute;
  background: rgba(44, 107, 99, 0.1);
  inset: 0;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 2rem 100%, 0 calc(100% - 2rem));
          clip-path: polygon(0 0, 100% 0, 100% 100%, 2rem 100%, 0 calc(100% - 2rem));
  -webkit-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
  z-index: -1;
}
.charsheet .bladerunner button[type=roll]::before, .charsheet .bladerunner button[type=roll][type=roll]::before, .charsheet .bladerunner button[type=action][type=roll]::before, .charsheet .bladerunner .button[type=roll]::before {
  content: none;
}
.charsheet .bladerunner button:active:not(.subtle-button), .charsheet .bladerunner button[type=roll]:active:not(.subtle-button), .charsheet .bladerunner button[type=action]:active:not(.subtle-button), .charsheet .bladerunner .button:active:not(.subtle-button) {
  background: var(--col-red-glow);
  -webkit-transition: background 50ms;
  transition: background 50ms;
}
.charsheet .bladerunner button.subtle-button {
  border: none;
  padding: 2px;
  color: var(--col-schematic);
  -webkit-filter: none;
          filter: none;
}
.charsheet .bladerunner input.grade, .charsheet .bladerunner .gradeMenu input {
  background: none;
  position: relative;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: -ms-grid;
  display: grid;
  place-content: center;
  height: 3rem;
  width: 3rem;
  margin: 4px;
  border: 2px solid var(--col-alt);
  border-radius: 100% !important;
  aspect-ratio: 1;
  font-size: 2rem;
  text-align: center;
  text-transform: uppercase;
  vertical-align: bottom;
  line-height: normal;
  color: var(--col-alt);
  -webkit-filter: drop-shadow(0 0 2px var(--col-alt-glow));
          filter: drop-shadow(0 0 2px var(--col-alt-glow));
}
.charsheet .bladerunner input.grade::after, .charsheet .bladerunner .gradeMenu input::after {
  content: attr(value);
  position: absolute;
  inset: 0;
}
.charsheet .bladerunner input.grade {
  line-height: 2;
}
.charsheet .bladerunner .attribute_wrapper {
  display: -ms-grid;
  display: grid;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -ms-grid-columns: [button-start] 1fr auto minmax(auto, 40px) [button-end];
  grid-template-columns: [button-start] 1fr auto minmax(auto, 40px) [button-end];
      grid-template-areas: "header select dice";
}
.charsheet .bladerunner .attribute_wrapper:first-child:not(.button-wrapper) {
  -ms-grid-rows: [button-start] 46px [button-end];
  grid-template-rows: [button-start] 46px [button-end];
}
.charsheet .bladerunner .attribute_wrapper.button-wrapper, .charsheet .bladerunner .attribute_wrapper:not(:first-child) {
  -ms-grid-rows: [button-start] 40px [button-end];
  grid-template-rows: [button-start] 40px [button-end];
}
.charsheet .bladerunner .attribute_wrapper > div {
  border: 0px;
}
.charsheet .bladerunner .attribute_wrapper:hover button {
  border-color: var(--col-alt);
  color: var(--col-alt);
  -webkit-filter: drop-shadow(0 0 4px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow));
          filter: drop-shadow(0 0 4px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow));
}
.charsheet .bladerunner .attribute_wrapper:hover button::after {
  background: var(--col-accent);
}
.charsheet .bladerunner .attribute_wrapper:hover h3 {
  color: var(--col-deep);
}
.charsheet .bladerunner .attribute_wrapper:hover:not(:first-child) .grade {
  color: var(--col-deep);
  border-color: var(--col-deep);
}
.charsheet .bladerunner .attribute_wrapper:active button {
  -webkit-filter: drop-shadow(0 0 4px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
          filter: drop-shadow(0 0 4px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
  color: white;
}
.charsheet .bladerunner .attribute_wrapper:active button::after {
  background: var(--col-red-glow) !important;
  -webkit-transition: background 50ms;
  transition: background 50ms;
}
.charsheet .bladerunner .attribute_wrapper button, .charsheet .bladerunner .attribute_wrapper .button {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  grid-area: button;
}
.charsheet .bladerunner .attribute_wrapper .attribute__value {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
  grid-area: select;
  -ms-grid-row-align: center;
      align-self: center;
}
.charsheet .bladerunner .attribute_wrapper .attribute__name {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-area: header;
  z-index: 10;
  place-self: stretch;
  padding: 5px 10px;
  margin: 0;
  overflow: hidden;
}
.charsheet .bladerunner .attribute_wrapper .attribute__name > span {
  height: 100%;
  overflow: hidden;
  display: inline;
}
.charsheet .bladerunner .attribute_wrapper .attribute__name, .charsheet .bladerunner .attribute_wrapper .attribute__dice {
  pointer-events: none;
}
.charsheet .bladerunner .attribute_wrapper .attribute__dice {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
  grid-area: dice;
  display: inline-block;
  -webkit-mask-image: linear-gradient(-60deg, var(--col-blue), transparent 80%);
          mask-image: linear-gradient(-60deg, var(--col-blue), transparent 80%);
  padding: 0 5px 5px;
  -ms-grid-row-align: end;
      align-self: end;
  border: none;
  font-size: 16px;
  text-align: right;
  color: var(--col-blue);
  text-shadow: 1px 1px 0px var(--col-blue-glow);
  z-index: 1;
}
.charsheet .bladerunner .attribute_wrapper .attribute__dice::first-letter {
  font-size: 0.75em;
}
.charsheet .bladerunner .attribute_wrapper:not(.button-wrapper):first-of-type {
  border: 2px solid black;
  -o-border-image: linear-gradient(190deg, var(--col-blue), transparent 70%) 1;
     border-image: linear-gradient(190deg, var(--col-blue), transparent 70%) 1;
  border-width: 2px 2px 0 2px;
  -webkit-filter: drop-shadow(0 0 4px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
          filter: drop-shadow(0 0 4px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
}
.charsheet .bladerunner .attribute_wrapper:not(.button-wrapper):first-of-type .attribute__name {
  text-transform: uppercase !important;
  color: var(--col-blue);
  text-shadow: none;
  text-shadow: 1px 1px var(--col-blue-glow);
}
.charsheet .bladerunner .attribute_wrapper .attribute {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.charsheet .bladerunner .attribute_wrapper .attribute .attribute__value {
  z-index: 2;
}
.charsheet .bladerunner .attribute_wrapper .attribute:hover .attribute__value::before, .charsheet .bladerunner .attribute_wrapper .attribute:hover .attribute__value::after {
  position: absolute;
  content: "";
  background: -webkit-gradient(linear, left bottom, left top, from(transparent), color-stop(var(--col-red)), to(transparent));
  background: linear-gradient(to top, transparent, var(--col-red), transparent);
  width: 2px;
  height: 200%;
  top: 50%;
  translate: 0 -50%;
  -webkit-filter: drop-shadow(0 0 2px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
          filter: drop-shadow(0 0 2px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
  z-index: 5;
}
.charsheet .bladerunner .attribute_wrapper .attribute:hover .attribute__value::before {
  left: 0;
}
.charsheet .bladerunner .attribute_wrapper .attribute:hover .attribute__value::after {
  right: 0;
}
.charsheet .bladerunner .attribute__value {
  position: relative;
}
.charsheet .bladerunner .attribute__value input[type=hidden][value=B] ~ .gradeMenu {
  left: calc(-100% - 1px);
}
.charsheet .bladerunner .attribute__value input[type=hidden][value=C] ~ .gradeMenu {
  left: calc(-200% - 1px);
}
.charsheet .bladerunner .attribute__value input[type=hidden][value=D] ~ .gradeMenu {
  left: calc(-300% - 1px);
}
.charsheet .bladerunner .attribute__value input[type=hidden][value="-"] ~ .gradeMenu {
  left: calc(-400% - 1px);
}
.charsheet .bladerunner .attribute__value .gradeMenu {
  position: absolute;
  left: 0px;
  top: 0px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  opacity: 0;
  pointer-events: none;
  border: 1px solid var(--col-blue);
  background: var(--col-deep);
  border-radius: 50px;
  -webkit-transform: scaleY(0) scaleX(1.2);
          transform: scaleY(0) scaleX(1.2);
  -webkit-filter: blur(12px) brightness(2) hue-rotate(-30deg);
          filter: blur(12px) brightness(2) hue-rotate(-30deg);
  -webkit-transition: all 200ms ease-out, opacity 0ms ease-in-out;
  transition: all 200ms ease-out, opacity 0ms ease-in-out;
  z-index: 99;
}
.charsheet .bladerunner .attribute__value .gradeMenu input {
  position: relative;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: -ms-grid;
  display: grid;
  place-content: center;
  border-color: var(--col-blue);
  color: var(--col-blue);
  -webkit-filter: drop-shadow(0 0 2px var(--col-blue-glow));
          filter: drop-shadow(0 0 2px var(--col-blue-glow));
}
.charsheet .bladerunner .attribute__value .gradeMenu input::after {
  content: attr(value);
  position: absolute;
  inset: 0;
}
.charsheet .bladerunner .attribute__value .gradeMenu input:hover {
  color: var(--col-red);
  border-color: var(--col-red);
  -webkit-filter: drop-shadow(0 0 4px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
          filter: drop-shadow(0 0 4px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
}
.charsheet .bladerunner .attribute__value .gradeMenu input:active {
  background: var(--col-red-glow);
}
.charsheet .bladerunner .attribute__value:hover .gradeMenu {
  -webkit-transform: scaleY(1);
          transform: scaleY(1);
  -webkit-filter: blur(0px) drop-shadow(0 0 4px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
          filter: blur(0px) drop-shadow(0 0 4px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
  opacity: 0.8;
  pointer-events: auto;
  -webkit-transition: all 200ms ease-out, opacity 0ms ease-in-out, -webkit-filter 400ms ease;
  transition: all 200ms ease-out, opacity 0ms ease-in-out, -webkit-filter 400ms ease;
  transition: all 200ms ease-out, opacity 0ms ease-in-out, filter 400ms ease;
  transition: all 200ms ease-out, opacity 0ms ease-in-out, filter 400ms ease, -webkit-filter 400ms ease;
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}
.charsheet .bladerunner .repcontrol-button {
  -ms-flex-item-align: start;
      -ms-grid-row-align: start;
      align-self: start;
}
.charsheet .bladerunner .repcontrol-button ~ .repcontrol {
  -ms-grid-column-align: end;
      justify-self: end;
  z-index: 100;
}
.charsheet .bladerunner .repcontrol-button ~ .repcontrol > .repcontrol_add {
  display: none !important;
}
.charsheet .bladerunner .repcontrol_move {
  display: none;
}
.charsheet .bladerunner .repcontrol-button--add {
  -ms-grid-column-align: start;
      justify-self: start;
  width: 15px;
  height: 15px;
  padding: 4px;
  font-size: 0;
  color: var(--col-alt);
  border: 1px solid var(--col-alt);
}
.charsheet .bladerunner .repcontrol-button--add::before {
  inset: 0;
  -ms-grid-row-align: center;
  -ms-grid-column-align: center;
  place-self: center;
  font-family: var(--font-icon);
  font-size: 12px;
  content: "add";
}
.charsheet .bladerunner .repcontrol {
  margin: 1rem 0;
}
.charsheet .bladerunner .repcontrol button, .charsheet .bladerunner .itemcontrol button {
  width: 15px;
  height: 15px;
  padding: 4px;
  font-size: 0;
  color: var(--col-alt);
  border: 1px solid var(--col-alt);
}
.charsheet .bladerunner .repcontrol button::before, .charsheet .bladerunner .itemcontrol button::before {
  inset: 0;
  -ms-grid-row-align: center;
  -ms-grid-column-align: center;
  place-self: center;
}
.charsheet .bladerunner .repcontrol button.repcontrol_add::before, .charsheet .bladerunner .itemcontrol button.repcontrol_add::before {
  font-family: var(--font-icon);
  font-size: 12px;
  content: "add";
}
.charsheet .bladerunner .repcontrol button.repcontrol_edit::before, .charsheet .bladerunner .itemcontrol button.repcontrol_edit::before {
  font-family: var(--font-icon);
  font-size: 12px;
  content: "edit";
}
.charsheet .bladerunner .repcontrol button #text, .charsheet .bladerunner .itemcontrol button #text {
  display: none;
}
.charsheet .bladerunner .repitem {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.charsheet .bladerunner .itemcontrol {
  border: 1px solid var(--col-blue);
}
.charsheet .bladerunner .repcontainer .repitem .itemcontrol {
  background: radial-gradient(transparent, var(--col-blue-glow));
  z-index: 99;
}
.charsheet .bladerunner .repcontainer .repitem .itemcontrol a.repcontrol_move {
  position: relative;
  float: left;
  width: 25px;
  aspect-ratio: 1;
  padding: 0;
  font-size: 0;
  color: var(--col-red);
  border: 2px solid var(--col-red);
  text-shadow: none;
  background: var(--col-red-glow);
}
.charsheet .bladerunner .repcontainer .repitem .itemcontrol a.repcontrol_move::before {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -ms-grid-row-align: center;
  -ms-grid-column-align: center;
  place-self: center;
  font-family: var(--font-icon);
  font-size: 18px;
  content: "open_with";
}
.charsheet .bladerunner .repcontainer .repitem .itemcontrol .repcontrol_del {
  -ms-grid-columns: auto auto;
  grid-template-columns: auto auto;
  border: 2px solid var(--col-red);
  background: var(--col-red-glow);
}
.charsheet .bladerunner .repcontainer .repitem .itemcontrol .repcontrol_del::before {
  font-family: var(--font-icon);
  font-size: 18px;
  color: var(--col-red);
  content: "remove";
}
.charsheet .bladerunner .repcontainer .repitem .itemcontrol > * {
  cursor: pointer;
}
.charsheet .bladerunner .repcontainer .repitem .itemcontrol > *:hover {
  color: var(--col-red) !important;
  border-color: var(--col-red) !important;
  -webkit-filter: drop-shadow(0 0 4px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
          filter: drop-shadow(0 0 4px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow));
}
.charsheet .bladerunner .repcontainer .repitem .itemcontrol > *:active {
  outline: none !important;
}
.charsheet .bladerunner .tabs {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 1rem 1fr;
  grid-template-columns: auto 1fr;
  grid-gap: 1rem;
  -ms-grid-rows: auto 1rem auto;
      grid-template-areas: "menu logo" "advantage logo";
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.charsheet .bladerunner .tabs .skill_toggle {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
  position: sticky;
  top: 4rem;
  grid-area: advantage;
  z-index: 99;
  background-color: #071115 !important;
}
.charsheet .bladerunner .tabs > img {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 3;
  grid-area: logo;
  justify-self: flex-end;
}
.charsheet .bladerunner .tabs .tabs--tabs__header {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: menu;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 1rem;
}
.charsheet .bladerunner .tabs .tabs--tabs__header button {
  padding: 0 2rem 0 1rem;
}
.charsheet .bladerunner .tabs .tabs--tabs__header button::before {
  display: inline-block;
  font-family: var(--font-icon);
  font-size: 12px;
  content: "apps";
  -webkit-transform: translateY(2px);
          transform: translateY(2px);
}
@media (max-width: 600px) {
  .charsheet .bladerunner .tabs .tabs--tabs__header button::before {
    display: none;
  }
}
.charsheet .bladerunner .tabs .tabs__body {
  grid-column: 1/-1;
}
@media (max-width: 740px) {
  .charsheet .bladerunner .tabs {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: auto 1rem auto 1rem auto;
        grid-template-areas: "logo" "menu" "advantage";
  }
  .charsheet .bladerunner .tabs .skill_toggle {
    top: 4rem;
  }
  .charsheet .bladerunner .tabs .skill_toggle::before {
    background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, var(--col-deep)), color-stop(70%, var(--col-deep)), to(transparent));
    background: linear-gradient(to right, transparent, var(--col-deep) 30%, var(--col-deep) 70%, transparent);
  }
  .charsheet .bladerunner .tabs .skill_toggle {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
  }
  .charsheet .bladerunner .tabs > img {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
  }
  .charsheet .bladerunner .tabs .tabs--tabs__header {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
}
.charsheet .bladerunner .logo-lapd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  text-transform: uppercase;
  color: var(--col-schematic);
  font-size: 20px;
}
.charsheet .bladerunner .logo-lapd::before {
  display: inline-block;
  content: "";
  height: 50px;
  width: 160px;
  margin: 5px;
  margin-bottom: 10px;
  background-image: url("https://i.imgur.com/yNsdOUr.png");
  background-repeat: no-repeat;
  background-size: contain;
}
@media (max-width: 760px) {
  .charsheet .bladerunner .logo-lapd {
    display: none;
  }
}
.charsheet .bladerunner .fill-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 2px;
  min-width: 212px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.charsheet .bladerunner .fill-left input[type=radio] {
  position: relative;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: -webkit-gradient(linear, right bottom, left top, from(var(--col-alt)), to(var(--col-alt-glow)));
  background: linear-gradient(to top left, var(--col-alt), var(--col-alt-glow));
  border: 1px solid var(--col-schematic-glow);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-shadow: 0 0 2px var(--col-alt-glow);
          box-shadow: 0 0 2px var(--col-alt-glow);
  min-width: 15px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 28px;
}
.charsheet .bladerunner .fill-left input[type=radio]:checked {
  background: var(--col-deep);
  border: 2px solid var(--col-alt);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  min-width: 25px;
  -webkit-box-flex: 2;
      -ms-flex: 2;
          flex: 2;
}
.charsheet .bladerunner .fill-left input[type=radio]:checked::before {
  position: absolute;
  display: -ms-grid;
  display: grid;
  place-items: center;
  content: attr(value);
  font-size: 16px;
  color: var(--col-alt);
  inset: 0;
}
.charsheet .bladerunner .fill-left input[type=radio]:checked ~ input[type=radio] {
  background: none;
  border-color: var(--col-schematic);
  -webkit-box-shadow: none;
          box-shadow: none;
}
.charsheet .bladerunner .fill-left input[type=radio]:checked ~ input[type=radio]:hover::before {
  color: var(--col-alt);
}
.charsheet .bladerunner .fill-left input[type=radio]:hover:not(:checked) {
  border-color: var(--col-accent) !important;
  border-width: 2px;
  color: var(--col-deep);
}
.charsheet .bladerunner .fill-left input[type=radio]:hover:not(:checked)::before {
  position: absolute;
  display: -ms-grid;
  display: grid;
  place-items: center;
  content: attr(value);
  font-size: 10px;
  font-weight: bold;
  color: var(--col-deep);
  inset: 0;
}
.charsheet .bladerunner .fill-left input[type=radio]:active, .charsheet .bladerunner .fill-left input[type=radio]:focus {
  outline: none;
}
.charsheet .bladerunner .fill-left input[type=radio].fill-left__radio--clearer:first-of-type {
  background: none;
  border: 1px solid var(--col-red-glow);
}
.charsheet .bladerunner .fill-left input[type=radio].fill-left__radio--clearer:first-of-type::before {
  position: absolute;
  display: -ms-grid;
  display: grid;
  place-items: center;
  content: attr(value);
  font-size: 16px;
  color: var(--col-red-glow);
  inset: 0;
}
.charsheet .bladerunner .fill-left input[type=radio].fill-left__radio--clearer:first-of-type:checked {
  background: var(--col-red-glow);
}
.charsheet .bladerunner .fill-left input[type=radio].fill-left__radio--clearer:first-of-type:checked::before {
  color: var(--col-tone);
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="0"] + .fill-left input:nth-child(2), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="0"] + .fill-left input:nth-child(2) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="1"] + .fill-left input:nth-child(3), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="1"] + .fill-left input:nth-child(3) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="2"] + .fill-left input:nth-child(4), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="2"] + .fill-left input:nth-child(4) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="3"] + .fill-left input:nth-child(5), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="3"] + .fill-left input:nth-child(5) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="4"] + .fill-left input:nth-child(6), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="4"] + .fill-left input:nth-child(6) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="5"] + .fill-left input:nth-child(7), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="5"] + .fill-left input:nth-child(7) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="6"] + .fill-left input:nth-child(8), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="6"] + .fill-left input:nth-child(8) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="7"] + .fill-left input:nth-child(9), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="7"] + .fill-left input:nth-child(9) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="8"] + .fill-left input:nth-child(10), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="8"] + .fill-left input:nth-child(10) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="9"] + .fill-left input:nth-child(11), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="9"] + .fill-left input:nth-child(11) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="10"] + .fill-left input:nth-child(12), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="10"] + .fill-left input:nth-child(12) ~ input {
  display: none;
}
.charsheet .bladerunner input.dynamic_fill[type=hidden][value="11"] + .fill-left input:nth-child(13), .charsheet .bladerunner input.dynamic_fill[type=hidden][value="11"] + .fill-left input:nth-child(13) ~ input {
  display: none;
}
.charsheet .bladerunner .skill_toggle {
  --spacer_left: 4rem;
  --width: calc(25% - 12px);
  --gap: 2px;
  position: relative;
  display: -ms-grid;
  display: grid;
  padding-left: var(--spacer_left);
  -ms-grid-columns: 1fr var(--gap) 1fr var(--gap) 1fr var(--gap) 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: var(--gap);
  justify-items: center;
}
.charsheet .bladerunner .skill_toggle::before {
  content: "casino";
  font-family: var(--font-icon);
  font-size: 28px;
  line-height: 1;
  padding-left: 2rem;
  color: var(--col-blue);
  text-shadow: 0 0 2px var(--col-blue-glow), 0 0 8px var(--col-blue-glow);
  position: absolute;
  inset: -2rem;
  top: -5px;
  bottom: -5px;
  background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, var(--col-deep)), color-stop(70%, var(--col-deep)), to(transparent));
  background: linear-gradient(to right, transparent, var(--col-deep) 30%, var(--col-deep) 70%, transparent);
  border: 0px solid var(--col-alt);
  z-index: -1;
}
@supports selector(:has(input[type=hidden][value="advantage"])::after) {
  .charsheet .bladerunner .skill_toggle::after {
    position: absolute;
    display: block;
    content: "";
    width: var(--width);
    height: 100%;
    top: 0;
    left: 0;
    background: -webkit-gradient(linear, right bottom, left top, from(var(--col-blue-glow)), to(transparent));
    background: linear-gradient(to top left, var(--col-blue-glow), transparent);
    border: 1px solid var(--col-blue-glow);
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    border-radius: 0px;
    -webkit-transition: left 200ms ease-in-out;
    transition: left 200ms ease-in-out;
    mix-blend-mode: lighten;
  }
}
.charsheet .bladerunner .skill_toggle:has(input[type=hidden][value=advantage])::after {
  left: var(--spacer_left);
}
.charsheet .bladerunner .skill_toggle:has(input[type=hidden][value=normal])::after {
  left: calc(var(--width) + var(--gap) + var(--spacer_left));
}
.charsheet .bladerunner .skill_toggle:has(input[type=hidden][value=disadvantage])::after {
  left: calc((var(--width) + var(--gap)) * 2 + var(--spacer_left));
}
.charsheet .bladerunner .skill_toggle:has(input[type=hidden][value=helping])::after {
  left: calc((var(--width) + var(--gap)) * 3 + var(--spacer_left));
}
.charsheet .bladerunner .skill_toggle input {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: none;
}
.charsheet .bladerunner .skill_toggle label {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: pointer;
  width: 100%;
  background: rgba(177, 125, 58, 0.1);
  padding: 0 5px;
  font-family: var(--font-main);
  font-size: 10px;
  text-align: center;
  color: var(--col-schematic);
  border: 2px solid var(--col-schematic);
  border-width: 2px 2px 0 2px;
  -o-border-image: linear-gradient(to bottom, var(--col-alt) 20%, transparent 20%) 1;
     border-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, var(--col-alt)), color-stop(20%, transparent)) 1;
     border-image: linear-gradient(to bottom, var(--col-alt) 20%, transparent 20%) 1;
  border-image-outset: 4px;
  -webkit-transition: background 200ms ease-in-out;
  transition: background 200ms ease-in-out;
}
.charsheet .bladerunner .skill_toggle label:hover {
  color: var(--col-alt);
  -webkit-filter: drop-shadow(0 0 2px var(--col-alt-glow));
          filter: drop-shadow(0 0 2px var(--col-alt-glow));
}
.charsheet .bladerunner .skill_toggle input[type=hidden][value=advantage] ~ label:nth-of-type(1),
.charsheet .bladerunner .skill_toggle input[type=hidden][value=disadvantage] ~ label:nth-of-type(3),
.charsheet .bladerunner .skill_toggle input[type=hidden][value=helping] ~ label:nth-of-type(4) {
  background: var(--col-red-glow);
  -webkit-transition: background 200ms ease-in-out 100ms;
  transition: background 200ms ease-in-out 100ms;
  color: var(--col-alt);
}
.charsheet .bladerunner .skill_toggle:hover::before {
  right: -100%;
  background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, var(--col-schematic-glow)), color-stop(70%, var(--col-schematic-glow)), to(transparent));
  background: linear-gradient(to right, transparent, var(--col-schematic-glow) 30%, var(--col-schematic-glow) 70%, transparent);
  -webkit-transition: all 300ms ease-out;
  transition: all 300ms ease-out;
  border-bottom-width: 2px;
}
.charsheet .bladerunner .skill_toggle:hover label {
  background: var(--col-deep);
}
.charsheet .bladerunner .critical_menu {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1rem;
  justify-items: center;
}
.charsheet .bladerunner .critical_menu button {
  border-radius: 0;
}
.charsheet .bladerunner .critical_menu button::before {
  display: inline-block;
  position: relative;
  content: "double_arrow";
  font-family: var(--font-icon);
  -webkit-transform: translateY(1px);
          transform: translateY(1px);
}
.charsheet .bladerunner .critical_menu::before {
  display: inline-block;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 30px;
  aspect-ratio: 1;
  border: 2px solid var(--col-blue);
  border-radius: 4px;
  content: "emergency_home";
  font-size: 2rem;
  font-family: var(--font-icon);
  font-weight: normal;
  color: var(--col-blue);
  text-align: center;
  line-height: 1.3em;
  -webkit-filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
          filter: drop-shadow(0 0 2px var(--col-blue-glow)) drop-shadow(0 0 8px var(--col-blue-glow));
}
.charsheet .bladerunner .br-checkbox {
  height: 2rem !important;
  width: 3rem !important;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: none;
  border: 2px solid var(--col-alt);
  -webkit-filter: drop-shadow(0 0 2px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow)) drop-shadow(0px 4px 1px var(--col-schematic));
          filter: drop-shadow(0 0 2px var(--col-alt-glow)) drop-shadow(0 0 8px var(--col-alt-glow)) drop-shadow(0px 4px 1px var(--col-schematic));
  -webkit-transition: background 100ms ease-out;
  transition: background 100ms ease-out;
}
.charsheet .bladerunner .br-checkbox:checked {
  background: var(--col-red);
  border-color: var(--col-red-glow);
  outline: 2px solid var(--col-alt);
  outline-offset: -4px;
  -webkit-filter: drop-shadow(0 0 2px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow)) drop-shadow(0px 4px 1px var(--col-accent));
          filter: drop-shadow(0 0 2px var(--col-red-glow)) drop-shadow(0 0 8px var(--col-red-glow)) drop-shadow(0px 4px 1px var(--col-accent));
}
.charsheet .bladerunner .span-all {
  grid-column: 1/-1;
}
.charsheet .bladerunner .repitem {
  display: -ms-grid;
  display: grid;
  gap: 5px;
}
.charsheet .bladerunner .repitem input {
  width: auto;
}