body {
  --bg-color: #111113;
  --fg-color: #b0b0b0;
  --border-color-default: #66666f;
  --border-color: var(--border-color-default);
  --border-style: solid;
  --border-color-input: var(--border-color-default);
  --border-color-highlight: #888890;
  --table-bg-color: #202027;
  --color-sps-sks: #22ff22;
  --color-crit: #ff2222;
  --color-dhit: #ff8800;
  --color-det: #0099ff;
  --color-tnc: #ffff00;
  --color-piety: #ff00ff;
  --stat-mix-primary: 65%;
  --stat-mix-primary-bg: 12%;
  --stat-mix-secondary: 15%;
  --stat-mix-secondary-bg: 6%;
  --materia-overcap-major: #ff0000;
  --materia-overcap: #dd7700;
  --standard-border-default: 1px var(--border-style) var(--border-color);
  --standard-border: var(--standard-border-default);
  --standard-border-part: var(--border-style) var(--border-color);
  --standard-border-input: 1px solid var(--border-color-input);
  --soft-border: 1px var(--standard-border-part);
  --thick-border: 1px var(--standard-border-part);
  --selected-outline: 3px solid var(--table-selected-outline-color);
  --stat-color: var(--fg-color);
  --modal-backdrop-color: #7c7cbb33;
  --error-border-color: #9c0000;
  --standard-border-radius: 5px;
  --optional-border-radius: 0;
  --action-col-width: 73px;
  --set-name-col-width: 300px;
  --item-name-col-width: 100%;
  --item-name-col-max-width: 300px;
  --item-table-max-width: 700px;
  --materia-melded-slot-blend-color: #cccccc;
  --scrollbar-fg: #666675;
  --scrollbar-bg: #444454;
  --stat-tiering-box-mix-color: #fff;
  --faint-border: 1px solid #60606680;
  --plain-link-color: #4f84ff;
  --plain-link-hover-color: #76cfff;
  --edge-padding: 4px;
  --stat-col-width: 40px;
  --chance-stat-col-width: 157px;
  --multi-stat-col-width: 120px;
  --multi-mit-stat-col-width: 170px;
  --hp-stat-col-width: 60px;
  --bottom-flex-basis: 60%;
  --modal-bottom-button-width: 70px;
  --materia-box-shadow-spread: 2px;
  --input-background-color: var(--bg-color);
  --relic-stat-input-background-color: var(--bg-color);
  --relic-stat-input-background-hover-color: #26263f;
  --loading-spinner-color: #fff;
  --button-active-background-color: #121446;
  --button-active-border-color: #ffffff;
  --table-bg-color-selected: #303345;
  --table-bg-color-hover: #3a4055;
  --table-selected-outline-color: #0ba3df;
  --action-input-hover-background-color: #ddf;
  --input-hover-background-color: #303649;
  --selection-border-opacity: 80%;
  --sim-color-mix-percent: 70%;
  --shadow-color: black;
  --transition-time: 0.3s;
  --input-transition-time: 0.1s;
  --tiering-color-mix: 2%;
  --abilities-row-height: 20px;
  --button-height: 20px;
  --issue-warning-color: #be5116;
  --issue-error-color: #9c0000;
  --toolbar-button-size: 40px;
  --toolbar-border-radius: 8px;
  --role-color-tank: #4848ff;
  --role-color-healer: #13a813;
  --role-color-dps: #ff0000;
  --perfect-tiering-box-shadow: 0 0 5px -1px inset color-mix(in srgb, var(--stat-color) 50%, var(--border-color));
  color: var(--fg-color);
  background-color: var(--bg-color);
  font-family: sans-serif;
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  width: 100%;
  position: fixed;
  overflow-y: hidden;
  margin: 0;
  scrollbar-color: var(--scrollbar-fg) var(--scrollbar-bg);
}
body.light-mode {
  --bg-color: #e7dcd9;
  --fg-color: #000000;
  --border-color: #a59083;
  --border-color-highlight: #150f0f;
  --table-bg-color: #fff8f1;
  --table-bg-color-selected: #fdebd3;
  --table-bg-color-hover: #f1d8b8;
  --input-hover-background-color: var(--table-bg-color-hover);
  --input-background-color: var(--table-bg-color);
  --materia-melded-slot-blend-color: #666666;
  --scrollbar-fg: #887461;
  --scrollbar-bg: #b7a691;
  --stat-tiering-box-mix-color: #000;
  --plain-link-color: #1a3072;
  --plain-link-hover-color: #2778a9;
  --action-input-hover-background-color: #833e1d;
  --table-selected-outline-color: #d28996;
  --relic-stat-input-background-color: #efab8a;
  --relic-stat-input-background-hover-color: #ffc2a5;
  --loading-spinner-color: #210;
  --button-active-background-color: #d27d32;
  --button-active-border-color: #734100;
  --sim-color-mix-percent: 50%;
  --shadow-color: #888;
  --tiering-color-mix: 5%;
  --modal-backdrop-color: #372a2733;
}
body.light-mode .melded-cell-extra-style {
  background-color: var(--stat-color);
}
body.light-mode .gear-sheets-table {
  --input-background-color: var(--bg-color);
}
@media screen and (max-width: 600px) {
  body {
    transform-origin: 0 0;
    --set-name-col-width: 150px;
  }
  body [col-id='mats'] {
    display: none;
  }
}
body div#dev-menu-area {
  margin: 5px;
  padding: 5px;
  border: 1px var(--standard-border-part);
}
body div#dev-menu-area button {
  margin: 10px;
}
body div#show-hide-menu-button-area {
  z-index: var(--zi-show-hide-menu-button);
  position: absolute;
  left: 5px;
  top: 5px;
  width: 29px;
  height: 29px;
}
body div#show-hide-menu-button-area button#show-hide-menu-button {
  width: 100%;
  height: 100%;
  font-size: 19px;
  display: flex;
  justify-content: center;
  align-items: center;
}
body div#help-button-area {
  z-index: var(--zi-show-hide-menu-button);
  position: absolute;
  right: 5px;
  top: 5px;
  width: 29px;
  height: 29px;
}
body div#help-button-area button#help-button {
  width: 100%;
  height: 100%;
  font-size: 19px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
body div#help-button-area * {
  text-decoration: none;
}
body div#main-menu-area {
  text-align: center;
  padding-left: 40px;
  padding-right: 40px;
  background-color: var(--table-bg-color);
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  margin-bottom: 5px;
}
body div#main-menu-area a,
body div#main-menu-area a:link,
body div#main-menu-area a:visited,
body div#main-menu-area a:hover {
  color: var(--fg-color);
  font-size: 13.333px;
  box-sizing: border-box;
  padding: 8px 8px 12px 8px;
  margin: 0;
  text-decoration: none;
  display: inline-block;
  transition-duration: var(--input-transition-time);
  transition-property: color, background-color, border-color, outline-color;
}
body div#main-menu-area a:hover,
body div#main-menu-area a:link:hover,
body div#main-menu-area a:visited:hover,
body div#main-menu-area a:hover:hover {
  transition: none;
}
body div#main-menu-area a span,
body div#main-menu-area a:link span,
body div#main-menu-area a:visited span,
body div#main-menu-area a:hover span {
  white-space: nowrap;
}
body div#main-menu-area a:hover {
  background-color: var(--table-bg-color-selected);
}
body div#main-menu-area a.current-page {
  background-color: var(--input-hover-background-color);
}
body div#main-menu-area a:active {
  background-color: var(--button-active-background-color);
}
body div#content-area {
  position: relative;
  flex-grow: 1;
}
body div#content-area > *:only-child {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
body ::-webkit-scrollbar {
  background-color: var(--scrollbar-bg);
}
body ::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-fg);
}
* {
  touch-action: pan-x pan-y;
}
.shadow {
  box-shadow: var(--shadow-color) 0 3px 5px 0;
}
.shadow-big {
  box-shadow: var(--shadow-color) 0 4px 10px 0;
}
.standard-border-radius {
  border-radius: var(--standard-border-radius);
}
.standard-border {
  border: var(--standard-border);
}
.standard-border-input {
  border: var(--standard-border);
}
.standard-paragraph {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}
.header-area p,
.gear-sheet-editor-area p {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
  max-width: 600px;
}
.soft-border {
  border: var(--standard-border);
}
.standard-round-border {
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
}
.standard-round-border-input {
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
}
.borderless-button {
  padding: 0 4px 0 4px;
  margin-left: 2px;
  background: none;
  border: none;
}
.borderless-button:hover {
  color: var(--action-input-hover-background-color);
}
.borderless-button:hover svg {
  fill: var(--action-input-hover-background-color);
}
body {
  /* Sets table z order needs to be:
  Pinned header cols >

   */
  --zi-sets-table-normal-columns: 70;
  --zi-sets-table-selected-cell: 71;
  --zi-sets-table-pinned-columns: 80;
  --zi-sets-table-selected-highlights: 90;
  --zi-sets-table-dragging-row: 91;
  --zi-sets-table-header-row: 92;
  --zi-sets-table-header-row-pinned: 95;
  --zi-sets-table-buttons-area: 99;
  --zi-midbar: 100;
  --zi-show-hide-menu-button: 120;
  --zi-slot-materia-popup: 150;
  --zi-slot-materia-popup-cell: 180;
  --zi-tiering-expansion: 185;
  --zi-toolbar-popout: 186;
  --zi-loading-blocker: 190;
  --zi-privacy-link: 195;
  --zi-add-sim-dialog: 200;
  --zi-true-modal: 300;
}
.button-transition {
  transition-duration: var(--input-transition-time);
  transition-property: color, background-color, border-color, outline-color;
}
.no-transition {
  transition: none;
}
.button-auto-transition {
  transition-duration: var(--input-transition-time);
  transition-property: color, background-color, border-color, outline-color;
}
.button-auto-transition:hover {
  transition: none;
}
div#editor-area {
  text-align: center;
  overflow-y: scroll;
  flex-basis: 60%;
  flex-grow: 9999;
  min-height: 60%;
  max-height: 100%;
  border-top: 2px var(--standard-border-part);
  margin-top: 5px;
  padding-top: 8px;
  padding-bottom: 8px;
}
div#editor-area table {
  text-align: left;
}
div#main-page-padding {
  flex-grow: 9999999;
}
.table-item-selected-bg {
  background-color: var(--table-bg-color-selected);
}
.table-element-hover-active {
  background-color: var(--table-bg-color-hover);
  transition: none;
}
table {
  position: relative;
  border: none;
  border-spacing: 0;
}
table tbody,
table thead,
table tfoot {
  text-align: left;
}
table.hoverable > tr,
table.hoverable > * > tr {
  transition-duration: var(--input-transition-time);
  transition-property: color, background-color, border-color, outline-color;
}
table.hoverable > tr > td,
table.hoverable > * > tr > td,
table.hoverable > tr th.hoverable,
table.hoverable > * > tr th.hoverable {
  transition-duration: var(--input-transition-time);
  transition-property: color, background-color, border-color, outline-color;
}
table.hoverable > tr.special-row-hoverable > th,
table.hoverable > * > tr.special-row-hoverable > th {
  transition-duration: var(--input-transition-time);
  transition-property: color, background-color, border-color, outline-color;
}
table.hoverable > tr > .hoverable:hover,
table.hoverable > * > tr > .hoverable:hover {
  background-color: var(--table-bg-color-hover);
  transition: none;
}
table.hoverable > tr:not(:has(td.hoverable:hover)):hover,
table.hoverable > * > tr:not(:has(td.hoverable:hover)):hover {
  transition: none;
}
table.hoverable > tr:not(:has(td.hoverable:hover)):hover > td,
table.hoverable > * > tr:not(:has(td.hoverable:hover)):hover > td {
  background-color: var(--table-bg-color-hover);
  transition: none;
}
table.hoverable > tr:not(:has(td.hoverable:hover)):hover > th.hoverable:hover,
table.hoverable > * > tr:not(:has(td.hoverable:hover)):hover > th.hoverable:hover {
  background-color: var(--table-bg-color-hover);
  transition: none;
}
table.hoverable > tr:not(:has(td.hoverable:hover)):hover > th.hoverable:hover span.header-cell-gear,
table.hoverable > * > tr:not(:has(td.hoverable:hover)):hover > th.hoverable:hover span.header-cell-gear {
  color: var(--action-input-hover-background-color);
  opacity: unset;
}
table.hoverable > tr:not(:has(td.hoverable:hover)):hover.special-row-hoverable:hover,
table.hoverable > * > tr:not(:has(td.hoverable:hover)):hover.special-row-hoverable:hover {
  background-color: var(--table-bg-color-hover);
  transition: none;
}
table.hoverable > tr:not(:has(td.hoverable:hover)):hover.special-row-hoverable > *:hover,
table.hoverable > * > tr:not(:has(td.hoverable:hover)):hover.special-row-hoverable > *:hover {
  background-color: var(--table-bg-color-hover);
  transition: none;
}
table tr {
  /*border: 2px solid #666666;*/
  border: 3px var(--standard-border-part);
  scroll-margin: 30px;
  position: relative;
}
table tr > th,
table tr > td {
  background-color: var(--table-bg-color);
}
table tr th {
  border-top: var(--thick-border);
  border-bottom: var(--thick-border);
}
table tr th:first-child {
  border-left: var(--thick-border);
}
table tr th:last-child {
  border-right: var(--thick-border);
}
table tr th span.header-cell-detail {
  font-weight: normal;
  font-size: 60%;
  opacity: 60%;
  vertical-align: bottom;
  display: inline-block;
}
table tr th span.header-cell-gear {
  position: absolute;
  right: 2px;
  bottom: 0;
  font-size: 16px;
  opacity: 30%;
}
table tr:first-child {
  border-top: var(--standard-border);
}
table tr:first-child td {
  border-top: var(--thick-border);
}
table tr .selection-highlight {
  content: '';
  border-radius: 5px;
  opacity: var(--selection-border-opacity);
  position: absolute;
  --border-style: 2px solid var(--table-selected-outline-color);
  border: var(--border-style);
  left: var(--table-selection-left-pad, 0);
  right: var(--table-selection-right-pad, 0);
  top: 0;
  bottom: 0;
  pointer-events: none;
}
table tr td,
table tr th {
  position: relative;
}
table tr td[is-selected="true"],
table tr th[is-selected="true"] {
  background-color: var(--table-bg-color-selected);
}
table tr td[is-selected="true"] > *:first-child::before,
table tr th[is-selected="true"] > *:first-child::before {
  content: '';
  border-radius: 5px;
  opacity: var(--selection-border-opacity);
  position: absolute;
  --border-style: 2px solid var(--table-selected-outline-color);
  border: var(--border-style);
  left: var(--table-selection-left-pad, 0);
  right: var(--table-selection-right-pad, 0);
  top: 0;
  bottom: 0;
  pointer-events: none;
}
table tr[is-selected="true"] td,
table tr[is-selected="true"] th {
  background-color: var(--table-bg-color-selected);
  --materia-box-shadow-spread: 3px;
}
table tr[is-selected="true"] td > *:first-child::before,
table tr[is-selected="true"] th > *:first-child::before {
  content: '';
  border-radius: 5px;
  opacity: var(--selection-border-opacity);
  position: absolute;
  --border-style: 2px solid var(--table-selected-outline-color);
  border: var(--border-style);
  left: var(--table-selection-left-pad, 0);
  right: var(--table-selection-right-pad, 0);
  top: 0;
  bottom: 0;
  pointer-events: none;
  z-index: var(--zi-sets-table-selected-highlights);
  --table-selection-left-pad: -1px;
  border-left: unset;
  border-right: unset;
  border-radius: 0;
}
table tr[is-selected="true"] td:first-child > *:first-child::before,
table tr[is-selected="true"] th:first-child > *:first-child::before {
  left: 0;
  border-left: var(--border-style);
  border-radius: 5px 0 0 5px;
}
table tr[is-selected="true"] td:last-child > *:first-child::before,
table tr[is-selected="true"] th:last-child > *:first-child::before {
  border-right: var(--border-style);
  border-radius: 0 5px 5px 0;
}
table tr th,
table tr td {
  padding: 1px 3px 1px 3px;
}
table tr td {
  border-left: var(--standard-border);
  border-top: none;
  border-bottom: var(--thick-border);
  border-right: none;
  margin: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  scroll-margin: 20px;
}
table tr td:last-child {
  border-right: var(--standard-border);
}
table tr td[col-id="actions"] div {
  display: inline-flex;
}
table tr td[col-id="setname"] {
  border-left: none;
}
table tr td[col-id="setname"] > div {
  overflow: hidden;
  text-overflow: ellipsis;
}
table tr td[col-id="setname"] .gear-set-issue-icon {
  margin-right: 5px;
}
table tr td[col-id="setname"] .ffxiv-frameless-job-icon {
  padding-left: 2px;
  padding-right: 3px;
  display: inline;
  height: 1em;
  vertical-align: -0.125em;
  overflow: visible;
  transform: scale(1.2);
  filter: drop-shadow(0 2px 1px #0009) brightness(1.3);
}
table tr td[col-id="icon"] {
  padding: 0;
  margin: 0;
  border-right: none;
  box-sizing: content-box;
}
table tr td[col-id="icon"] img {
  display: block;
  aspect-ratio: 1;
}
table tr td[col-id="itemname"] {
  border-left: none;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
select {
  transition-duration: var(--input-transition-time);
  transition-property: color, background-color, border-color, outline-color;
  color: var(--fg-color);
  background-color: var(--input-background-color);
  border-radius: var(--standard-border-radius);
  border: var(--standard-border-input);
  font-size: 13.333px;
  height: var(--button-height);
  box-sizing: border-box;
}
select:hover {
  transition: none;
}
select:hover,
select:focus {
  background-color: var(--input-hover-background-color);
}
.button-font-style {
  font-size: 13.333px;
}
.like-a-button {
  color: var(--fg-color);
  background-color: var(--input-background-color);
  border-radius: var(--standard-border-radius);
  border: var(--standard-border-input);
  font-size: 13.333px;
  height: var(--button-height);
  box-sizing: border-box;
}
button {
  color: var(--fg-color);
  background-color: var(--input-background-color);
  border-radius: var(--standard-border-radius);
  border: var(--standard-border-input);
  font-size: 13.333px;
  height: var(--button-height);
  box-sizing: border-box;
  transition-duration: var(--input-transition-time);
  transition-property: color, background-color, border-color, outline-color;
}
button:hover {
  transition: none;
  background-color: var(--input-hover-background-color);
}
button:active {
  background-color: var(--button-active-background-color);
  border-color: var(--button-active-border-color);
}
.extra-stat-info {
  float: right;
  padding-right: 8px;
}
input[type="text"],
input[type="number"],
input[type="password"],
input[type="email"] {
  color: var(--fg-color);
  border-radius: var(--standard-border-radius);
  border-color: var(--border-color);
}
input[type="text"]:invalid,
input[type="number"]:invalid,
input[type="password"]:invalid,
input[type="email"]:invalid {
  border-color: var(--error-border-color);
}
textarea {
  color: var(--fg-color);
  background: var(--table-bg-color);
  border: var(--thick-border);
  border-radius: var(--standard-border-radius);
  width: min(600px, 90vw);
  height: 300px;
}
.title-editor {
  margin-bottom: 10px;
  width: 400px;
  font-size: 30px;
  text-align: center;
}
.gear-set-name-editor {
  margin-bottom: 10px;
  width: 400px;
  font-size: 30px;
  text-align: center;
}
.sim-name-editor {
  margin-bottom: 10px;
  width: 400px;
  font-size: 30px;
  text-align: center;
}
table.gear-plan-table {
  border-collapse: separate;
  border-spacing: 0;
}
table.gear-plan-table td {
  scroll-margin-top: 68px;
  scroll-margin-bottom: 30px;
  z-index: var(--zi-sets-table-normal-columns);
}
table.gear-plan-table td[is-selected="true"] {
  z-index: var(--zi-sets-table-selected-cell);
}
table.gear-plan-table tr {
  scroll-margin-top: 60px;
  scroll-margin-bottom: 40px;
  position: relative;
}
table.gear-plan-table tr:first-child {
  --sets-table-top-padding: 0;
  --sets-table-left-padding: 0;
  position: sticky;
  top: var(--sets-table-top-padding);
  border: var(--thick-border);
  z-index: var(--zi-sets-table-header-row);
  background-color: color-mix(in srgb, var(--table-bg-color) 60%, transparent);
}
table.gear-plan-table tr:first-child th {
  height: 54px;
  border-top: var(--thick-border);
  border-bottom: var(--thick-border);
  padding: 0 5px 0 5px;
}
table.gear-plan-table tr:first-child th:first-child {
  border-left: var(--thick-border);
  z-index: var(--zi-sets-table-header-row-pinned) !important;
}
table.gear-plan-table tr:first-child th:nth-child(2) {
  z-index: var(--zi-sets-table-header-row-pinned) !important;
}
table.gear-plan-table tr td:first-child {
  left: 0;
  width: var(--action-col-width);
  min-width: var(--action-col-width);
  max-width: var(--action-col-width);
  outline: inherit;
}
table.gear-plan-table tr td:first-child button {
  padding: 0 4px 0 4px;
  margin-left: 2px;
  background: none;
  border: none;
  font-size: 13.2px;
}
table.gear-plan-table tr td:first-child button:hover {
  color: var(--action-input-hover-background-color);
}
table.gear-plan-table tr td:first-child button:hover svg {
  fill: var(--action-input-hover-background-color);
}
table.gear-plan-table tr td:first-child button:hover {
  color: var(--action-input-hover-background-color);
}
table.gear-plan-table tr td:nth-child(2) {
  left: calc(var(--action-col-width));
  border-right: var(--standard-border);
  white-space: nowrap;
  width: var(--set-name-col-width);
  max-width: var(--set-name-col-width);
  min-width: var(--set-name-col-width);
}
table.gear-plan-table tr td:nth-child(3) {
  border-left: none;
}
table.gear-plan-table tr td.stat-col,
table.gear-plan-table tr th.stat-col {
  --cell-width: var(--stat-col-width);
  width: var(--cell-width);
  min-width: var(--cell-width);
  max-width: var(--cell-width);
}
table.gear-plan-table tr td.stat-col.chance-stat-col,
table.gear-plan-table tr th.stat-col.chance-stat-col {
  --cell-width: var(--chance-stat-col-width);
}
table.gear-plan-table tr td.stat-col.multiplier-stat-col,
table.gear-plan-table tr th.stat-col.multiplier-stat-col {
  --cell-width: var(--multi-stat-col-width);
}
table.gear-plan-table tr td.stat-col.multiplier-mit-stat-col,
table.gear-plan-table tr th.stat-col.multiplier-mit-stat-col {
  --cell-width: var(--multi-mit-stat-col-width);
}
table.gear-plan-table tr td.stat-col.stat-col-hp,
table.gear-plan-table tr th.stat-col.stat-col-hp {
  --cell-width: var(--hp-stat-col-width);
}
table.gear-plan-table tr td:first-child,
table.gear-plan-table tr th:first-child,
table.gear-plan-table tr td:nth-child(2),
table.gear-plan-table tr th:nth-child(2) {
  box-sizing: border-box;
  position: sticky;
  z-index: var(--zi-sets-table-pinned-columns) !important;
  --table-selection-right-pad: -1px;
}
table.gear-plan-table tr td:first-child,
table.gear-plan-table tr th:first-child {
  left: 0;
  width: var(--action-col-width);
  min-width: var(--action-col-width);
  max-width: var(--action-col-width);
}
table.gear-plan-table tr td:nth-child(2),
table.gear-plan-table tr th:nth-child(2) {
  left: calc(var(--action-col-width));
}
table.gear-plan-table tr td[col-id^="sim-col-"],
table.gear-plan-table tr th[col-id^="sim-col-"] {
  min-width: 70px;
}
table.gear-plan-table tr.dragging {
  z-index: var(--zi-sets-table-dragging-row);
  pointer-events: none;
}
table.gear-plan-table tr.dragging td {
  border-top: var(--standard-border) inset;
}
table.gear-plan-table.view-only {
  --chance-stat-col-width: 40px;
  --multi-stat-col-width: 40px;
  --multi-mit-stat-col-width: 40px;
}
table.gear-plan-table.view-only .stat-col {
  text-align: center;
}
table.gear-plan-table.view-only .extra-stat-info {
  display: none !important;
}
@media screen and (max-width: 800px) {
  table.gear-plan-table.view-only .stat-col-less-important {
    display: none;
  }
}
table.gear-plan-table.view-only.show-advanced-stats {
  --chance-stat-col-width: 110px;
  --multi-stat-col-width: 70px;
  --multi-mit-stat-col-width: 130px;
}
table.gear-plan-table.view-only.show-advanced-stats .stat-col-less-important {
  display: revert;
}
table.gear-plan-table.view-only.show-advanced-stats .extra-stat-info {
  display: unset !important;
}
table.gear-plan-table.view-only td[col-id="actions"] > div {
  display: none;
}
table.gear-plan-table.view-only div.set-name-desc-holder span {
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
}
table.gear-plan-table.view-only div.set-name-desc-holder span:last-child {
  opacity: 75%;
}
table.gear-plan-table.view-only div.chance-stat-display span,
table.gear-plan-table.view-only div.multiplier-stat-display span,
table.gear-plan-table.view-only div.multiplier-mit-stat-display span {
  display: block;
}
table.gear-plan-table.view-only div.chance-stat-display span:first-child,
table.gear-plan-table.view-only div.multiplier-stat-display span:first-child,
table.gear-plan-table.view-only div.multiplier-mit-stat-display span:first-child {
  text-align: center;
}
.text-deemphasise {
  opacity: 75%;
}
div.chance-stat-display span:last-child,
div.multiplier-stat-display span:last-child,
div.multiplier-mit-stat-display span:last-child {
  opacity: 75%;
}
.button-row > * {
  margin: 5px;
}
#content-area {
  text-align: center;
}
#new-sheet-form fieldset,
save-as-modal fieldset {
  text-align: center;
  display: inline-grid;
  border: none;
}
job-picker .job-picker-section {
  padding-top: 10px;
  display: grid;
  grid-template-columns: repeat(6, 40px);
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}
job-picker .job-picker-section.job-picker-section-tank {
  --role-color: var(--role-color-tank);
}
job-picker .job-picker-section.job-picker-section-healer {
  --role-color: var(--role-color-healer);
}
job-picker .job-picker-section.job-picker-section-melee,
job-picker .job-picker-section.job-picker-section-range,
job-picker .job-picker-section.job-picker-section-caster {
  --role-color: var(--role-color-dps);
}
job-picker .job-picker-section .job-picker-job-icon {
  flex-grow: 0;
  height: 40px;
  width: 40px;
  background: none;
  padding: 0;
  position: relative;
  z-index: 5;
  filter: saturate(50%);
}
job-picker .job-picker-section .job-picker-job-icon img {
  width: 100%;
  height: 100%;
  max-height: unset;
}
job-picker .job-picker-section .job-picker-job-icon:hover {
  filter: saturate(200%);
}
job-picker .job-picker-section .job-picker-job-icon:hover img {
  opacity: 100%;
}
job-picker .job-picker-section .job-picker-job-icon:active {
  border-color: #00000000;
  filter: brightness(80%);
}
job-picker .job-picker-section .job-picker-job-icon.selected {
  z-index: 2;
  filter: drop-shadow(0 0 10px var(--role-color)) saturate(200%);
}
job-picker .job-picker-section .job-picker-job-icon.selected:active {
  border-color: #00000000;
  filter: drop-shadow(0 0 10px var(--role-color)) saturate(200%) brightness(80%);
}
job-picker .job-picker-section .job-picker-job-icon.selected img {
  opacity: 100%;
}
#content-area > .my-sheets-section .named-section-content-area {
  width: 600px;
  scrollbar-gutter: stable;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table {
  overflow: auto;
  padding: 0;
  width: 100%;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table tr {
  height: 23px;
  max-height: 23px;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table tr:not(:has(th)) {
  cursor: pointer;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table tr.new-sheet-row {
  cursor: pointer;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table tr.dragging {
  z-index: 5;
  opacity: 0.75;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table tr:first-child th {
  position: sticky;
  top: 0;
  z-index: 1;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td {
  border: none;
  border-top: var(--standard-border);
  height: 23px;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetjob"] {
  width: 60px;
  text-align: right;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetjob"] img {
  height: 100%;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetjobicon"] {
  width: 30px;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetjobicon"] img {
  height: 100%;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table th {
  --thick-border: none;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .new-sheet-row:hover .svg-glyph {
  fill: var(--action-input-hover-background-color);
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .new-sheet-row th {
  font-weight: normal;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .new-sheet-row th i,
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .new-sheet-row th svg {
  padding-left: 8px;
  padding-right: 8px;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .search-row-outer {
  cursor: unset;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .search-row {
  display: flex;
  gap: 5px;
  width: 100%;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .search-row * {
  box-sizing: border-box;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .search-row input {
  width: 100%;
  padding-left: 5px;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .search-row button {
  aspect-ratio: 1;
  padding: 0;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table .searched .drag-handle {
  display: none;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetactions"] {
  width: 52px;
  max-height: 23px;
  height: 23px;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetactions"] .svg-glyph {
  font-size: 13.2px;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetactions"] i {
  font-size: 14px;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetactions"] > div {
  display: inline-block;
  height: 20px;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetactions"] button {
  padding: 0 4px 0 4px;
  margin-left: 2px;
  background: none;
  border: none;
  padding: 0;
  margin-left: 0;
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetactions"] button:hover {
  color: var(--action-input-hover-background-color);
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="sheetactions"] button:hover svg {
  fill: var(--action-input-hover-background-color);
}
#content-area > .my-sheets-section .named-section-content-area table.gear-sheets-table td[col-id="syncstatus"] {
  width: 50px;
  min-width: 50px;
  max-width: 50px;
}
#content-area > .bis-browser .named-section-content-area {
  width: 600px;
}
#content-area > .bis-browser .named-section-content-area .button-row {
  margin-bottom: 5px;
  display: flex;
}
#content-area > .bis-browser .named-section-content-area .button-row .up-button {
  background-color: var(--table-bg-color);
  flex-grow: 1;
  text-align: left;
  border-radius: 0;
  padding: 5px;
  box-sizing: content-box;
  margin: 0;
  cursor: pointer;
}
#content-area > .bis-browser .named-section-content-area .button-row .up-button:hover {
  background-color: var(--table-bg-color-hover);
}
#content-area > .bis-browser .named-section-content-area .button-row .up-button:disabled {
  visibility: hidden;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table {
  overflow: auto;
  padding: 0;
  width: 100%;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table tr {
  height: 23px;
  max-height: 23px;
  cursor: pointer;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table tr:first-child th {
  position: sticky;
  top: 0;
  z-index: 1;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td {
  border: none;
  border-top: var(--standard-border);
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="type"] {
  font-size: 30px;
  text-align: center;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="type"] img {
  width: 100%;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="name"] {
  padding-top: 10px;
  padding-bottom: 10px;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="name"] div.bis-sheet-name {
  font-weight: bold;
  font-size: 17px;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="name"] div.bis-sheet-description {
  font-size: 15px;
  opacity: 75%;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table th {
  --thick-border: none;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table .new-sheet-row:hover .svg-glyph {
  fill: var(--action-input-hover-background-color);
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table .new-sheet-row th {
  font-weight: normal;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table .new-sheet-row th i,
#content-area > .bis-browser .named-section-content-area table.bis-browser-table .new-sheet-row th svg {
  padding-left: 8px;
  padding-right: 8px;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="sheetactions"] {
  width: 50px;
  max-height: 23px;
  height: 23px;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="sheetactions"] .svg-glyph {
  font-size: 13.2px;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="sheetactions"] i {
  font-size: 14px;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="sheetactions"] > div {
  display: inline-block;
  height: 20px;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="sheetactions"] button {
  padding: 0 4px 0 4px;
  margin-left: 2px;
  background: none;
  border: none;
  padding: 0;
  margin-left: 0;
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="sheetactions"] button:hover {
  color: var(--action-input-hover-background-color);
}
#content-area > .bis-browser .named-section-content-area table.bis-browser-table td[col-id="sheetactions"] button:hover svg {
  fill: var(--action-input-hover-background-color);
}
gear-plan {
  position: relative;
  min-width: 120px;
  display: flex;
  flex-direction: column;
}
gear-plan.loading .hide-when-loading {
  display: none;
}
gear-plan .gear-sheet-table-area {
  /*flex-grow: 0;*/
  /*flex-shrink: 9999;*/
  flex-basis: content;
  min-height: 0;
  flex-shrink: 1;
  flex-grow: 1;
  max-height: 100%;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 0 auto;
  padding-bottom: 5px;
}
gear-plan .gear-sheet-table-area .gear-sheet-table-holder-outer {
  max-height: calc(100%);
  box-sizing: border-box;
  display: flex;
}
gear-plan .gear-sheet-table-area .gear-sheet-table-holder-outer .gear-sheet-table-holder {
  scrollbar-gutter: stable both-edges;
  scrollbar-width: thin;
  box-sizing: border-box;
  overflow: auto;
}
gear-plan .gear-sheet-buttons-area {
  left: 0;
  bottom: 0;
  position: sticky;
  z-index: var(--zi-sets-table-buttons-area);
  box-sizing: border-box;
  text-align: left;
  margin-right: -60px;
  width: min(100%, 100vw);
  background-color: color-mix(in srgb, var(--bg-color) 80%, transparent);
  border-top: var(--standard-border);
  margin-top: 0;
  padding: 2px 2px 0 2px;
}
gear-plan .gear-sheet-buttons-area > * {
  margin-bottom: 2px;
  margin-right: 10px;
  pointer-events: auto;
  box-sizing: border-box;
  display: inline-block;
  padding: 1px 4px 1px 4px;
  vertical-align: top;
}
gear-plan .gear-sheet-midbar-area {
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  z-index: var(--zi-midbar);
  border-top: var(--thick-border);
}
gear-plan .gear-sheet-midbar-area .gear-sheet-toolbar-holder {
  cursor: row-resize;
}
gear-plan .gear-sheet-midbar-area .gear-sheet-toolbar-holder > * > * {
  cursor: auto;
}
gear-plan.view-only {
  --bottom-flex-basis: 70%;
}
gear-plan .gear-sheet-editor-area {
  flex-basis: var(--bottom-flex-basis);
  flex-shrink: 1;
  flex-grow: 9999;
  height: 60%;
  max-height: 100%;
  border-top: 2px var(--standard-border-part);
  padding-left: var(--edge-padding);
  padding-right: var(--edge-padding);
}
#embed-top-level {
  overflow: auto;
  text-align: center;
  min-height: 100%;
}
#embed-top-level > * {
  min-height: 100%;
  box-sizing: border-box;
}
#embed-top-level set-totals-display {
  display: block;
}
#embed-top-level set-totals-display div.stat-total {
  background-color: var(--table-bg-color);
  margin-top: 5px;
  margin-bottom: 0;
  box-shadow: var(--shadow-color) 0 3px 5px 0;
}
#embed-top-level set-totals-display div.stat-total.stat-dhit {
  min-width: 52px;
}
#embed-top-level set-totals-display div.stat-total.stat-dhit div.stat-total-lower-right {
  display: none;
}
.gear-sheet-editor-area {
  text-align: center;
  overflow: auto;
  padding-top: 8px;
  padding-bottom: 8px;
}
.gear-sheet-editor-area table {
  text-align: left;
}
table.gear-items-table,
table.food-items-table {
  margin-left: auto;
  margin-right: auto;
  box-shadow: var(--shadow-color) 0 3px 5px 0;
  max-width: var(--item-table-max-width);
}
table.gear-items-table show-hide-button,
table.food-items-table show-hide-button {
  margin-left: 15px;
}
table.gear-items-table tr,
table.food-items-table tr,
table.gear-items-table td,
table.food-items-table td {
  height: 25px;
  box-sizing: border-box;
}
table.gear-items-table > tbody > * > td > img,
table.food-items-table > tbody > * > td > img {
  height: 100%;
}
table.gear-items-table [col-id='itemname'],
table.food-items-table [col-id='itemname'] {
  width: var(--item-name-col-width);
  max-width: var(--item-name-col-max-width);
  min-width: 100px;
}
table.gear-items-table [col-id='ilvl'],
table.food-items-table [col-id='ilvl'] {
  overflow: visible;
  text-align: center;
}
table.gear-items-table [col-id='icon'],
table.food-items-table [col-id='icon'] {
  width: 23px;
  max-width: 23px;
  min-width: 23px;
}
table.gear-items-table th[col-id='itemname'],
table.food-items-table th[col-id='itemname'] {
  min-width: max-content;
  margin-left: -73px;
  position: relative;
}
table.gear-items-table td[col-id='mats'],
table.food-items-table td[col-id='mats'],
table.gear-items-table td[col-id='wd'],
table.food-items-table td[col-id='wd'] {
  text-align: center;
}
table.gear-items-table tr:last-child td,
table.food-items-table tr:last-child td,
table.gear-items-table tr:last-child th,
table.food-items-table tr:last-child th {
  border-top: none;
}
table.gear-items-table input[type='number'],
table.food-items-table input[type='number'] {
  -moz-appearance: textfield;
}
table.gear-items-table input[type='number']::-webkit-inner-spin-button,
table.food-items-table input[type='number']::-webkit-inner-spin-button,
table.gear-items-table input[type='number']::-webkit-outer-spin-button,
table.food-items-table input[type='number']::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
table.gear-items-table.gear-items-edit-table tr .item-name-holder-editable,
table.food-items-table.gear-items-edit-table tr .item-name-holder-editable,
table.gear-items-table.food-items-edit-table tr .item-name-holder-editable,
table.food-items-table.food-items-edit-table tr .item-name-holder-editable,
table.gear-items-table.gear-items-edit-table tr .food-name-holder-editable,
table.food-items-table.gear-items-edit-table tr .food-name-holder-editable,
table.gear-items-table.food-items-edit-table tr .food-name-holder-editable,
table.food-items-table.food-items-edit-table tr .food-name-holder-editable {
  display: flex;
  flex-direction: row;
}
table.gear-items-table.gear-items-edit-table tr .item-name-holder-editable span,
table.food-items-table.gear-items-edit-table tr .item-name-holder-editable span,
table.gear-items-table.food-items-edit-table tr .item-name-holder-editable span,
table.food-items-table.food-items-edit-table tr .item-name-holder-editable span,
table.gear-items-table.gear-items-edit-table tr .food-name-holder-editable span,
table.food-items-table.gear-items-edit-table tr .food-name-holder-editable span,
table.gear-items-table.food-items-edit-table tr .food-name-holder-editable span,
table.food-items-table.food-items-edit-table tr .food-name-holder-editable span {
  flex-basis: 1px;
  flex-grow: 99;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 1px;
}
table.gear-items-table.gear-items-edit-table tr .item-name-holder-editable .remove-item-button,
table.food-items-table.gear-items-edit-table tr .item-name-holder-editable .remove-item-button,
table.gear-items-table.food-items-edit-table tr .item-name-holder-editable .remove-item-button,
table.food-items-table.food-items-edit-table tr .item-name-holder-editable .remove-item-button,
table.gear-items-table.gear-items-edit-table tr .food-name-holder-editable .remove-item-button,
table.food-items-table.gear-items-edit-table tr .food-name-holder-editable .remove-item-button,
table.gear-items-table.food-items-edit-table tr .food-name-holder-editable .remove-item-button,
table.food-items-table.food-items-edit-table tr .food-name-holder-editable .remove-item-button,
table.gear-items-table.gear-items-edit-table tr .item-name-holder-editable .remove-food-button,
table.food-items-table.gear-items-edit-table tr .item-name-holder-editable .remove-food-button,
table.gear-items-table.food-items-edit-table tr .item-name-holder-editable .remove-food-button,
table.food-items-table.food-items-edit-table tr .item-name-holder-editable .remove-food-button,
table.gear-items-table.gear-items-edit-table tr .food-name-holder-editable .remove-food-button,
table.food-items-table.gear-items-edit-table tr .food-name-holder-editable .remove-food-button,
table.gear-items-table.food-items-edit-table tr .food-name-holder-editable .remove-food-button,
table.food-items-table.food-items-edit-table tr .food-name-holder-editable .remove-food-button {
  display: none;
}
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button,
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button {
  display: block;
  padding: 0 4px 0 4px;
  margin-left: 2px;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  height: min-content;
  width: min-content;
}
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover,
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover {
  color: var(--action-input-hover-background-color);
}
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover svg,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover svg,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover svg,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover svg,
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover svg,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover svg,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover svg,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover svg {
  fill: var(--action-input-hover-background-color);
}
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button svg,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button svg,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button svg,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button svg,
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button svg,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button svg,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button svg,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button svg {
  fill: var(--fg-color);
}
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover,
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover {
  fill: var(--action-input-hover-background-color);
}
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover svg,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover svg,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover svg,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-item-button:hover svg,
table.gear-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover svg,
table.food-items-table.gear-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover svg,
table.gear-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover svg,
table.food-items-table.food-items-edit-table tr:hover[is-selected="true"] .remove-food-button:hover svg {
  fill: var(--action-input-hover-background-color);
}
.left-side-gear-table,
.right-side-gear-table {
  display: inline-block;
  flex-basis: var(--item-table-max-width);
  flex-shrink: 1;
}
.left-side-gear-table > table.gear-items-table,
.right-side-gear-table > table.gear-items-table {
  margin-bottom: 10px;
}
.left-side-gear-table > table.gear-items-table:last-child,
.right-side-gear-table > table.gear-items-table:last-child {
  margin-bottom: 0;
}
.gear-table-sides-holder {
  display: flex;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}
.flex-padding-item {
  flex-grow: 0.00001;
}
h1.js-warning {
  color: #ff0000;
  text-decoration: underline 2px double #ff0000;
}
table all-slot-materia-manager {
  max-width: 100%;
  display: inline-block;
  height: 23px;
}
table all-slot-materia-manager > span {
  vertical-align: middle;
  display: inline-block;
}
table all-slot-materia-manager.materia-slot-no-slots > span,
table all-slot-materia-manager.materia-slot-no-equip > span {
  opacity: 50%;
}
slot-materia-manager.editable:hover:not(:has(slot-materia-popup:hover)) {
  background-color: var(--input-hover-background-color);
}
slot-materia-manager {
  cursor: pointer;
}
slot-materia-manager slot-materia-popup {
  cursor: unset;
}
slot-materia-manager,
single-materia-view-only {
  border-radius: 20px;
  display: inline-block;
  position: relative;
  margin-right: 5px;
  height: fit-content;
  width: 95px;
  font-weight: normal;
  vertical-align: middle;
  box-sizing: border-box;
  --image-size: 18px;
}
slot-materia-manager div.materia-image-holder,
single-materia-view-only div.materia-image-holder {
  overflow: clip;
  width: var(--image-size);
  height: var(--image-size);
  padding: 0;
  margin: 0;
  border: 2px #3c623c solid;
  border-radius: 100%;
  display: inline-block;
  vertical-align: middle;
}
slot-materia-manager.materia-slot-overmeld div.materia-image-holder,
single-materia-view-only.materia-slot-overmeld div.materia-image-holder {
  border: 2px #397e86 solid;
}
slot-materia-manager img,
single-materia-view-only img {
  width: 100%;
  height: 100%;
  display: block;
}
slot-materia-manager.materia-slot-locked,
single-materia-view-only.materia-slot-locked {
  box-shadow: 0 0 2px 2px #777 inset;
}
slot-materia-manager.materia-manager-active,
single-materia-view-only.materia-manager-active {
  box-shadow: 0 0 2px 2px var(--table-selected-outline-color) inset;
}
slot-materia-manager > span,
single-materia-view-only > span {
  vertical-align: middle;
  display: inline-block;
}
slot-materia-manager > span:first-of-type,
single-materia-view-only > span:first-of-type {
  padding-left: 3px;
}
slot-materia-manager.materia-overcap > span,
single-materia-view-only.materia-overcap > span {
  color: var(--materia-overcap);
}
slot-materia-manager.materia-overcap-major > span,
single-materia-view-only.materia-overcap-major > span {
  color: var(--materia-overcap-major);
}
slot-materia-manager.materia-slot-full div.materia-image-holder,
single-materia-view-only.materia-slot-full div.materia-image-holder {
  background-color: #666;
}
slot-materia-popup {
  position: absolute;
  z-index: var(--zi-slot-materia-popup);
  left: 0;
  box-shadow: var(--shadow-color) 0 5px 10px 0;
}
slot-materia-popup > table {
  border-radius: 0 !important;
  padding: 0 !important;
}
slot-materia-popup th {
  border-top: var(--standard-border) !important;
  text-align: center;
}
slot-materia-popup td {
  width: fit-content !important;
  height: fit-content !important;
  padding: 0 !important;
  z-index: var(--zi-slot-materia-popup-cell);
}
slot-materia-popup td img {
  width: 40px;
  height: 40px;
  display: block;
}
slot-materia-popup td[is-selected="true"] {
  z-index: 181;
}
slot-materia-popup td:first-child {
  text-align: center;
  padding: 4px !important;
}
slot-materia-popup td:hover img {
  filter: brightness(1.4);
}
slot-materia-popup .materia-picker-remove {
  text-align: center;
  font-weight: bold;
}
slot-materia-popup .materia-picker-remove svg {
  fill: #831818;
}
slot-materia-popup .materia-picker-remove:hover svg {
  fill: red;
}
sim-result-display {
  display: inline-block;
  width: 100%;
}
td.sim-column-valid {
  color: color-mix(in srgb, currentColor var(--sim-color-mix-percent), color-mix(in hsl, #00ff00 var(--sim-result-relative, 50%), #ff0000));
}
td.sim-column-valid.sim-column-best {
  font-weight: bold;
}
add-sim-dialog .modal-content-area {
  display: flex;
  flex-direction: column;
}
add-sim-dialog form {
  display: contents;
}
add-sim-dialog .table-holder {
  background-color: var(--table-bg-color);
  border-radius: var(--optional-border-radius);
  flex-basis: 300px;
  overflow-y: auto;
}
add-sim-dialog .table-holder table {
  margin-left: 0;
  margin-right: 0;
  max-width: 100%;
  width: 100%;
}
add-sim-dialog .table-holder table td[col-id="sim-job-icon"] {
  width: 1px;
  height: 23px;
}
add-sim-dialog .table-holder table td[col-id="sim-job-icon"] img {
  height: 100%;
}
add-sim-dialog .add-sim-lower-area {
  flex-basis: 150px;
  display: flex;
  flex-direction: column;
  padding-top: 20px;
  min-width: 400px;
  min-height: 100px;
  max-width: min-content;
  white-space: pre-wrap;
  overflow-y: auto;
}
add-sim-dialog .add-sim-lower-area .add-sim-description {
  flex-grow: 1;
}
add-sim-dialog .add-sim-lower-area .add-sim-description.no-desc {
  opacity: 50%;
}
add-sim-dialog .add-sim-lower-area .sim-contact-info-holder {
  flex-basis: fit-content;
}
#sim-config-area-outer {
  margin: auto;
  width: fit-content;
}
#sim-config-area-outer > input,
#sim-config-area-outer > button {
  box-shadow: var(--shadow-color) 0 3px 5px 0;
}
#sim-config-area-outer .sim-name-editor {
  display: block;
  margin: auto auto 10px;
}
#sim-config-area-outer .sim-config-area-inner {
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: max-content;
  max-width: calc(100% - 10px);
  margin-left: auto;
  margin-right: auto;
}
#sim-config-area-outer .sim-config-area-inner > .named-section {
  max-height: calc(100% - 50px);
  max-width: calc(100% - 50px);
  background-color: var(--table-bg-color);
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  margin: 20px auto 20px auto;
  width: fit-content;
  height: fit-content;
  padding: 20px;
  border-radius: 10px;
  width: 100%;
  max-width: unset;
}
#sim-config-area-outer .sim-config-area-inner > .named-section .named-section-content-area {
  max-width: 100%;
  overflow: auto;
}
#sim-config-area-outer .sim-config-area-inner > .named-section .named-section-content-area {
  overflow: visible;
  overflow-x: clip;
}
#sim-config-area-outer .sim-config-area-inner > .named-section label[for='cycle-total-time'] {
  margin-right: 10px;
}
#sim-config-area-outer .sim-config-area-inner > * {
  margin-top: 10px;
}
#sim-config-area-outer .sim-config-area-inner .labeled-item label {
  display: block;
}
gear-set-editor div.gear-set-editor-button-area,
separator-editor div.gear-set-editor-button-area {
  width: 100%;
  text-align: center;
}
gear-set-editor div.gear-set-editor-button-area > *,
separator-editor div.gear-set-editor-button-area > * {
  box-shadow: var(--shadow-color) 0 3px 5px 0;
}
gear-set-editor div.gear-set-editor-button-area > .issues-button,
separator-editor div.gear-set-editor-button-area > .issues-button {
  min-width: 84px;
}
gear-set-editor > *,
separator-editor > * {
  margin-bottom: 10px;
}
import-set-area #set-import-textarea-holder,
import-sheet-area #set-import-textarea-holder {
  border-radius: var(--standard-border-radius);
  width: fit-content;
  height: fit-content;
  position: relative;
  margin: auto;
}
import-set-dialog .modal-content-area {
  width: min-content;
}
import-set-dialog #set-import-textarea-holder {
  position: relative;
}
import-set-dialog loading-blocker {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
import-set-dialog loading-blocker .loading-spinner {
  position: relative;
  top: calc(50% - 50px);
}
div.gear-sheet-toolbar-holder {
  min-height: 15px;
  position: relative;
  padding-left: 8px;
  padding-right: 8px;
  touch-action: pinch-zoom;
}
div.gear-sheet-toolbar-holder .drag-indicator {
  content: '≡';
  position: absolute;
  top: 0;
  bottom: 0;
  height: fit-content;
  margin: auto 0.25rem;
}
div.gear-sheet-toolbar-holder::before {
  content: '≡';
  position: absolute;
  top: 0;
  bottom: 0;
  height: fit-content;
  margin: auto 0.25rem;
  left: 0;
}
div.gear-sheet-toolbar-holder::after {
  content: '≡';
  position: absolute;
  top: 0;
  bottom: 0;
  height: fit-content;
  margin: auto 0.25rem;
  right: 0;
}
.load-bar-outer {
  border-style: solid;
  border-width: 1px;
  border-color: var(--border-color-highlight);
  border-radius: 4px;
}
.load-bar-inner {
  background-color: var(--border-color-highlight);
  border-radius: 3px;
}
.meld-solver-set {
  float: left;
  font-weight: bold;
  text-decoration: underline;
}
.meld-solver-area {
  white-space: pre-wrap;
}
.meld-solver-settings {
  float: left;
  display: flex;
  flex-direction: column;
  border-width: 1px;
  border-color: #00ff00;
}
.meld-solver-settings li {
  margin: 5px;
  list-style-type: none;
  float: left;
}
.meld-solver-settings li .meld-solver-target-gcd-input {
  max-width: 30px;
  border: var(--faint-border);
  float: left;
}
.meld-solver-settings li .meld-solver-target-gcd-input:disabled {
  border: var(--faint-border);
  opacity: 50%;
}
.meld-solver-settings li select.meld-solver-sim-dropdown {
  float: left;
  max-width: fit-content;
  width: 100%;
}
.meld-solver-settings li select.meld-solver-sim-dropdown option {
  padding: 5px;
}
.meld-solver-settings button {
  margin: 5px;
  border-width: 1px;
  border-color: #909090;
  float: left;
  height: 100%;
}
.gear-set-editor-toolbar {
  display: flex;
  flex-wrap: wrap-reverse;
  justify-content: center;
}
.gear-set-editor-toolbar > * {
  box-shadow: var(--shadow-color) 0 3px 5px 0;
}
.gear-set-editor-toolbar .toolbar-buttons-area {
  display: inline-flex;
  flex-direction: row;
  justify-content: space-between;
  margin-right: -3px;
  align-items: center;
  gap: 10px;
  position: relative;
}
.gear-set-editor-toolbar .toolbar-buttons-area .popout-area {
  position: absolute;
  top: calc(100% + 8px);
  background: var(--table-bg-color);
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  width: max-content;
  box-shadow: var(--shadow-color) 0 12px 10px 0;
  z-index: var(--zi-toolbar-popout);
}
.gear-set-editor-toolbar .toolbar-buttons-area .popout-area > * {
  position: sticky;
}
.gear-set-editor-toolbar .toolbar-buttons-area > button {
  height: var(--toolbar-button-size);
  border-radius: var(--toolbar-border-radius);
  display: flex;
  justify-content: center;
  padding: 2px;
  position: relative;
}
.gear-set-editor-toolbar .toolbar-buttons-area > button.big-text-btn {
  font-size: 30px;
  width: var(--toolbar-button-size);
  line-height: 0;
}
.gear-set-editor-toolbar .toolbar-buttons-area > button.popout-button {
  padding-left: 5px;
  padding-right: 5px;
}
.gear-set-editor-toolbar .toolbar-buttons-area > button.popout-button:active {
  border-color: #0000;
}
.gear-set-editor-toolbar .toolbar-buttons-area > button.popout-button[popout-active="true"] {
  background-color: var(--button-active-background-color);
}
.gear-set-editor-toolbar .toolbar-buttons-area > button svg {
  margin: auto;
  width: 100%;
  height: 100%;
}
set-view-toolbar {
  display: contents;
}
set-view-toolbar set-totals-display {
  border: none;
  pointer-events: none;
  background: none;
}
set-view-toolbar set-totals-display div.stat-total {
  box-shadow: var(--shadow-color) 0 3px 5px 0;
  background-color: var(--table-bg-color);
}
div.gear-set-editor-toolbar,
set-view-toolbar {
  width: fit-content;
  margin: auto;
  font-size: 13.333px;
}
div.gear-set-editor-toolbar > *,
set-view-toolbar > * {
  box-sizing: border-box;
  min-height: 50px;
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  display: inline-block;
  vertical-align: top;
  margin: 5px;
  background-color: var(--input-background-color);
}
@media screen and (width <= 530px) {
  div.gear-set-editor-toolbar > *,
  set-view-toolbar > * {
    margin-left: 2px;
    margin-right: 2px;
  }
}
div.gear-set-editor-toolbar div.ilvl-picker-area ilvl-range-picker,
set-view-toolbar div.ilvl-picker-area ilvl-range-picker {
  display: block;
  text-align: right;
  margin: 4px 0 4px 0;
}
div.gear-set-editor-toolbar div.ilvl-picker-area ilvl-range-picker span,
set-view-toolbar div.ilvl-picker-area ilvl-range-picker span {
  font-size: 13.333px;
  padding: 5px;
}
div.gear-set-editor-toolbar div.ilvl-picker-area ilvl-range-picker input,
set-view-toolbar div.ilvl-picker-area ilvl-range-picker input {
  border: var(--faint-border);
  padding: 0 0 0 0;
  width: 30px;
  text-align: center;
  margin-right: 2px;
}
div.gear-set-editor-toolbar materia-priority-picker,
set-view-toolbar materia-priority-picker {
  width: fit-content;
  text-align: left;
}
div.gear-set-editor-toolbar materia-priority-picker div.labeled-checkbox,
set-view-toolbar materia-priority-picker div.labeled-checkbox {
  float: right;
}
div.gear-set-editor-toolbar materia-priority-picker > span,
set-view-toolbar materia-priority-picker > span {
  display: inline-block;
}
div.gear-set-editor-toolbar materia-priority-picker > *,
set-view-toolbar materia-priority-picker > * {
  margin: 2px;
}
div.gear-set-editor-toolbar materia-priority-picker .labeled-checkbox,
set-view-toolbar materia-priority-picker .labeled-checkbox {
  display: inline-block;
}
div.gear-set-editor-toolbar materia-priority-picker .min-gcd-input,
set-view-toolbar materia-priority-picker .min-gcd-input {
  max-width: 30px;
  border: var(--faint-border);
}
div.gear-set-editor-toolbar materia-priority-picker materia-drag-order,
set-view-toolbar materia-priority-picker materia-drag-order {
  display: inline-block;
}
div.gear-set-editor-toolbar materia-priority-picker materia-drag-order materia-dragger,
set-view-toolbar materia-priority-picker materia-drag-order materia-dragger {
  display: inline-block;
  cursor: grab;
  user-select: none;
}
div.gear-set-editor-toolbar materia-priority-picker materia-drag-order materia-dragger:hover .materia-dragger-inner,
set-view-toolbar materia-priority-picker materia-drag-order materia-dragger:hover .materia-dragger-inner {
  border-color: var(--border-color-highlight);
}
div.gear-set-editor-toolbar materia-priority-picker materia-drag-order materia-dragger .materia-dragger-inner,
set-view-toolbar materia-priority-picker materia-drag-order materia-dragger .materia-dragger-inner {
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  font-size: 12.5px;
  position: relative;
  pointer-events: none;
  padding: 4px;
  width: 25px;
  text-align: center;
}
div.gear-set-editor-toolbar materia-priority-picker materia-drag-order materia-dragger .materia-dragger-inner span,
set-view-toolbar materia-priority-picker materia-drag-order materia-dragger .materia-dragger-inner span {
  margin: auto -5px auto -5px;
}
div.gear-set-editor-toolbar materia-priority-picker .meld-solver-tips,
set-view-toolbar materia-priority-picker .meld-solver-tips {
  width: 200px;
  padding: 5px;
}
@media screen and (width <= 530px) {
  div.gear-set-editor-toolbar div.stat-tier-display,
  set-view-toolbar div.stat-tier-display {
    border: none;
    height: unset;
    min-height: unset;
    padding: 0;
    margin: 0;
  }
  div.gear-set-editor-toolbar div.stat-tier-display .single-stat-tier-display,
  set-view-toolbar div.stat-tier-display .single-stat-tier-display {
    min-width: 50px;
    --inner-padding: 0px;
    height: auto;
  }
  div.gear-set-editor-toolbar div.stat-tier-display .single-stat-tier-display .single-stat-tier-display-upper-short,
  set-view-toolbar div.stat-tier-display .single-stat-tier-display .single-stat-tier-display-upper-short {
    display: block;
  }
  div.gear-set-editor-toolbar div.stat-tier-display .single-stat-tier-display .single-stat-tier-display-upper-long,
  set-view-toolbar div.stat-tier-display .single-stat-tier-display .single-stat-tier-display-upper-long {
    display: none;
  }
  div.gear-set-editor-toolbar div.stat-tier-display .single-stat-tier-display .single-stat-tier-display-lower-right,
  set-view-toolbar div.stat-tier-display .single-stat-tier-display .single-stat-tier-display-lower-right {
    width: unset;
    display: block;
  }
}
div.gear-set-editor-toolbar .single-stat-tier-display,
set-view-toolbar .single-stat-tier-display {
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  position: relative;
  padding: 2px;
  margin: 5px 2px 5px 2px;
  display: inline-block;
  width: fit-content;
  min-width: 52px;
  transition: box-shadow var(--transition-time) linear;
  border-color: color-mix(in srgb, var(--stat-color) 20%, var(--border-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--tiering-color-mix), var(--table-bg-color));
  --inner-padding: 0px;
}
div.gear-set-editor-toolbar .single-stat-tier-display.stat-tiering-clickable,
set-view-toolbar .single-stat-tier-display.stat-tiering-clickable {
  cursor: pointer;
}
div.gear-set-editor-toolbar .single-stat-tier-display.stat-tiering-unclickable,
set-view-toolbar .single-stat-tier-display.stat-tiering-unclickable {
  cursor: default;
}
div.gear-set-editor-toolbar .single-stat-tier-display .single-stat-tier-display-upper,
set-view-toolbar .single-stat-tier-display .single-stat-tier-display-upper {
  transition: all var(--transition-time) linear;
}
div.gear-set-editor-toolbar .single-stat-tier-display .single-stat-tier-display-upper.single-stat-tier-display-upper-short,
set-view-toolbar .single-stat-tier-display .single-stat-tier-display-upper.single-stat-tier-display-upper-short {
  display: none;
}
div.gear-set-editor-toolbar .single-stat-tier-display .single-stat-tier-display-upper.single-stat-tier-display-upper-long,
set-view-toolbar .single-stat-tier-display .single-stat-tier-display-upper.single-stat-tier-display-upper-long {
  display: block;
}
div.gear-set-editor-toolbar .single-stat-tier-display .number-format-perfect > div.single-stat-tier-display-upper,
set-view-toolbar .single-stat-tier-display .number-format-perfect > div.single-stat-tier-display-upper {
  color: color-mix(in srgb, var(--stat-color) 30%, var(--stat-tiering-box-mix-color));
}
div.gear-set-editor-toolbar .single-stat-tier-display .number-format-perfect > div.single-stat-tier-display-lower-left,
set-view-toolbar .single-stat-tier-display .number-format-perfect > div.single-stat-tier-display-lower-left {
  color: color-mix(in srgb, var(--stat-color) 70%, var(--stat-tiering-box-mix-color));
  line-height: 0;
}
div.gear-set-editor-toolbar .single-stat-tier-display.stat-tiering-perfect,
set-view-toolbar .single-stat-tier-display.stat-tiering-perfect {
  box-shadow: var(--perfect-tiering-box-shadow);
}
div.gear-set-editor-toolbar .single-stat-tier-display.stat-tiering-perfect > div.single-stat-tier-display-upper,
set-view-toolbar .single-stat-tier-display.stat-tiering-perfect > div.single-stat-tier-display-upper {
  color: color-mix(in srgb, var(--stat-color) 30%, var(--stat-tiering-box-mix-color));
}
div.gear-set-editor-toolbar .single-stat-tier-display.stat-tiering-perfect > div.single-stat-tier-display-lower-left,
set-view-toolbar .single-stat-tier-display.stat-tiering-perfect > div.single-stat-tier-display-lower-left {
  color: color-mix(in srgb, var(--stat-color) 70%, var(--stat-tiering-box-mix-color));
  line-height: 0;
}
div.gear-set-editor-toolbar .single-stat-tier-display div.single-stat-tier-display-lower-left,
set-view-toolbar .single-stat-tier-display div.single-stat-tier-display-lower-left {
  display: inline-block;
  padding-left: var(--inner-padding);
  padding-right: var(--inner-padding);
  width: 49%;
}
div.gear-set-editor-toolbar .single-stat-tier-display div.single-stat-tier-display-lower-right,
set-view-toolbar .single-stat-tier-display div.single-stat-tier-display-lower-right {
  display: inline-block;
  padding-left: var(--inner-padding);
  padding-right: var(--inner-padding);
  width: 49%;
}
div.gear-set-editor-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion,
set-view-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion {
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  z-index: var(--zi-tiering-expansion);
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 130%;
  border-color: color-mix(in srgb, var(--stat-color) 20%, var(--border-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--tiering-color-mix), var(--table-bg-color));
  overflow: hidden;
}
div.gear-set-editor-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-expansion-item,
set-view-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-expansion-item {
  margin-top: 10px;
  margin-bottom: 10px;
}
div.gear-set-editor-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-expansion-item.stat-tiering-perfect > div.single-stat-tier-display-upper,
set-view-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-expansion-item.stat-tiering-perfect > div.single-stat-tier-display-upper {
  color: color-mix(in srgb, var(--stat-color) 30%, var(--stat-tiering-box-mix-color));
}
div.gear-set-editor-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-expansion-item.stat-tiering-perfect > div.single-stat-tier-display-lower-left,
set-view-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-expansion-item.stat-tiering-perfect > div.single-stat-tier-display-lower-left {
  color: color-mix(in srgb, var(--stat-color) 70%, var(--stat-tiering-box-mix-color));
  line-height: 0;
}
div.gear-set-editor-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-separator-holder,
set-view-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-separator-holder {
  position: relative;
}
div.gear-set-editor-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-separator-holder .single-stat-tier-display-separator-inner,
set-view-toolbar .single-stat-tier-display div.single-stat-tier-display-expansion .single-stat-tier-display-separator-holder .single-stat-tier-display-separator-inner {
  height: 10px;
  left: 0;
  right: 0;
  z-index: -1;
  top: -5px;
  background-color: var(--bg-color);
}
set-totals-display div.stat-total {
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  padding: 2px;
  margin: 5px 2px 5px 2px;
  display: inline-block;
  width: fit-content;
  min-width: 50px;
  border-color: color-mix(in srgb, var(--stat-color) 20%, var(--border-color));
  --inner-padding: 3px;
}
set-totals-display div.stat-total div.single-stat-tier-display-upper {
  display: block;
}
set-totals-display div.stat-total div.stat-total-lower-left {
  display: inline-block;
  padding-left: var(--inner-padding);
  padding-right: var(--inner-padding);
}
set-totals-display div.stat-total div.stat-total-lower-right {
  display: inline-block;
  padding-left: var(--inner-padding);
  padding-right: var(--inner-padding);
}
set-totals-display div.stat-total.stat-total-wide {
  min-width: 90px;
}
set-totals-display div.stat-total.stat-total-narrow {
  min-width: 52px;
}
div.labeled-checkbox label {
  user-select: none;
}
.show-hide-parent .show-hide-button {
  display: none;
}
@media screen and (width <= 800px) {
  .show-hide-parent:not(.showing) > * {
    display: none;
  }
  .show-hide-parent .level-sync-info {
    display: inline-block;
  }
  .show-hide-parent .show-hide-button {
    display: revert;
  }
}
input.gear-items-table-relic-stat-input,
select.gear-items-table-relic-stat-input {
  border: none;
  padding: 0 0 0 0;
  background: var(--relic-stat-input-background-color);
  box-sizing: border-box;
  width: 100%;
  text-align: center;
  font-size: 13px;
  height: calc(100% - 4px);
}
input.gear-items-table-relic-stat-input.relic-validation-failed,
select.gear-items-table-relic-stat-input.relic-validation-failed {
  box-shadow: 1px 1px 2px red inset, -1px -1px 2px #ff6000 inset;
}
input.gear-items-table-relic-stat-input:hover,
select.gear-items-table-relic-stat-input:hover,
input.gear-items-table-relic-stat-input:active,
select.gear-items-table-relic-stat-input:active,
input.gear-items-table-relic-stat-input:focus,
select.gear-items-table-relic-stat-input:focus {
  background: var(--relic-stat-input-background-hover-color);
}
select.gear-items-table-relic-stat-input {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}
body:has(> .backdrop-active) > *:not(.backdrop-active) {
  filter: saturate(20%) blur(2px);
}
.special-row-holder > * {
  float: right;
}
.special-row-holder > *:first-child {
  float: unset;
}
show-hide-button {
  transition: transform 0.2s;
  transform: rotate(0);
}
show-hide-button.hidden {
  transform: rotate(90deg);
}
.modal-dialog {
  position: absolute;
  margin: 0;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--zi-true-modal);
  display: flex;
  background-color: var(--modal-backdrop-color);
}
.modal-dialog .modal-inner {
  max-height: 95vh;
  max-width: 95vw;
  display: flex;
  flex-direction: column;
}
.modal-dialog .modal-inner .modal-header {
  margin-top: 10px;
  margin-left: 40px;
  margin-right: 40px;
}
.modal-dialog .modal-inner .modal-content-area {
  overflow: auto;
  margin-bottom: 10px;
  padding: 5px;
}
.modal-dialog .modal-inner .modal-close-button {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 30px;
  padding: 0 4px 0 4px;
  margin-left: 2px;
  background: none;
  border: none;
}
.modal-dialog .modal-inner .modal-close-button:hover {
  color: var(--action-input-hover-background-color);
}
.modal-dialog .modal-inner .modal-close-button:hover svg {
  fill: var(--action-input-hover-background-color);
}
.modal-dialog > div {
  margin: auto;
  position: relative;
  background-color: var(--table-bg-color);
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  border-radius: var(10px);
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  text-align: center;
  padding: 10px;
}
.modal-dialog > div input[type='text'] {
  width: 300px;
}
.modal-dialog div.lower-button-area > button {
  display: inline-block;
  margin: 5px 5px 5px 5px;
  min-width: var(--modal-bottom-button-width);
}
rename-dialog {
  position: absolute;
  margin: 0;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--zi-true-modal);
  display: flex;
  background-color: var(--modal-backdrop-color);
}
rename-dialog .modal-inner {
  max-height: 95vh;
  max-width: 95vw;
  display: flex;
  flex-direction: column;
}
rename-dialog .modal-inner .modal-header {
  margin-top: 10px;
  margin-left: 40px;
  margin-right: 40px;
}
rename-dialog .modal-inner .modal-content-area {
  overflow: auto;
  margin-bottom: 10px;
  padding: 5px;
}
rename-dialog .modal-inner .modal-close-button {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 30px;
  padding: 0 4px 0 4px;
  margin-left: 2px;
  background: none;
  border: none;
}
rename-dialog .modal-inner .modal-close-button:hover {
  color: var(--action-input-hover-background-color);
}
rename-dialog .modal-inner .modal-close-button:hover svg {
  fill: var(--action-input-hover-background-color);
}
rename-dialog > div {
  margin: auto;
  position: relative;
  background-color: var(--table-bg-color);
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  border-radius: var(10px);
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  text-align: center;
  padding: 10px;
}
rename-dialog > div input[type='text'] {
  width: 300px;
}
rename-dialog div.lower-button-area > button {
  display: inline-block;
  margin: 5px 5px 5px 5px;
  min-width: var(--modal-bottom-button-width);
}
rename-dialog textarea {
  margin: 10px;
  resize: none;
}
rename-dialog .modal-inner > * {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
rename-dialog form {
  width: min-content;
}
shortlink-modal {
  position: absolute;
  margin: 0;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--zi-true-modal);
  display: flex;
  background-color: var(--modal-backdrop-color);
}
shortlink-modal .modal-inner {
  max-height: 95vh;
  max-width: 95vw;
  display: flex;
  flex-direction: column;
}
shortlink-modal .modal-inner .modal-header {
  margin-top: 10px;
  margin-left: 40px;
  margin-right: 40px;
}
shortlink-modal .modal-inner .modal-content-area {
  overflow: auto;
  margin-bottom: 10px;
  padding: 5px;
}
shortlink-modal .modal-inner .modal-close-button {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 30px;
  padding: 0 4px 0 4px;
  margin-left: 2px;
  background: none;
  border: none;
}
shortlink-modal .modal-inner .modal-close-button:hover {
  color: var(--action-input-hover-background-color);
}
shortlink-modal .modal-inner .modal-close-button:hover svg {
  fill: var(--action-input-hover-background-color);
}
shortlink-modal > div {
  margin: auto;
  position: relative;
  background-color: var(--table-bg-color);
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  border-radius: var(10px);
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  text-align: center;
  padding: 10px;
}
shortlink-modal > div input[type='text'] {
  width: 300px;
}
shortlink-modal div.lower-button-area > button {
  display: inline-block;
  margin: 5px 5px 5px 5px;
  min-width: var(--modal-bottom-button-width);
}
food-stat-bonus {
  display: flex;
  flex-direction: row;
  --slash-padding: 3px;
}
food-stat-bonus > * {
  flex-basis: 50%;
  flex-grow: 0;
  flex-shrink: 0;
  display: block;
}
food-stat-bonus .food-effective {
  text-align: right;
  padding-right: 4px;
  flex-shrink: 1;
}
food-stat-bonus .food-cap {
  text-align: left;
  flex-basis: calc(50% + 10px);
  flex-shrink: 1;
  font-weight: normal;
}
food-stat-bonus.food-undercapped .food-cap {
  opacity: 50%;
}
food-stat-bonus.food-undercapped .food-cap::before {
  content: '/';
  padding-left: var(--slash-padding);
  padding-right: var(--slash-padding);
}
food-stat-bonus.food-capped .food-cap {
  opacity: 50%;
  text-align: center;
}
table.food-items-table .food-stat-col {
  --food-stat-col-width: 80px;
  min-width: var(--food-stat-col-width);
  max-width: var(--food-stat-col-width);
  width: var(--food-stat-col-width);
  box-sizing: content-box;
}
table.food-items-table [col-id='itemname'] {
  width: var(--item-name-col-width);
  min-width: 100px;
  max-width: var(--item-name-col-max-width);
}
table.food-items-table [col-id='itemname'] div {
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}
table.food-items-table [col-id='icon'] {
  height: unset;
}
table.food-items-table [col-id='icon'] img {
  height: 27px;
}
table.food-items-table .food-stat-narrow {
  display: none;
}
@media screen and (width <= 900px) {
  table.food-items-table .food-stat-col {
    --food-stat-col-width: 40px;
  }
  table.food-items-table food-stat-bonus {
    flex-direction: column;
  }
  table.food-items-table food-stat-bonus > * {
    text-align: left;
  }
}
.round-table tbody tr:first-child {
  border-top-left-radius: var(--standard-border-radius);
  border-top-right-radius: var(--standard-border-radius);
}
.round-table tbody tr:first-child td:first-child,
.round-table tbody tr:first-child th:first-child {
  border-top-left-radius: var(--standard-border-radius);
}
.round-table tbody tr:first-child td:last-child,
.round-table tbody tr:first-child th:last-child {
  border-top-right-radius: var(--standard-border-radius);
}
.round-table tbody tr:last-child {
  border-bottom-left-radius: var(--standard-border-radius);
  border-bottom-right-radius: var(--standard-border-radius);
}
.round-table tbody tr:last-child td:first-child,
.round-table tbody tr:last-child th:first-child {
  border-bottom-left-radius: var(--standard-border-radius);
}
.round-table tbody tr:last-child td:last-child,
.round-table tbody tr:last-child th:last-child {
  border-bottom-right-radius: var(--standard-border-radius);
}
gear-set-viewer {
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 90px;
  display: block;
  --standard-border-radius: 10px;
  --item-table-max-width: 600px;
}
gear-set-viewer > h1 {
  margin-top: 0;
}
gear-set-viewer > h1 svg {
  padding-left: 10px;
}
gear-set-viewer > * {
  margin-bottom: 10px;
}
gear-set-viewer materia-totals-display,
gear-set-viewer .gear-items-view-table,
gear-set-viewer .food-view-table {
  box-shadow: var(--shadow-color) 0 3px 5px 0;
}
gear-set-viewer slot-materia-manager {
  cursor: default;
}
gear-set-viewer materia-totals-display {
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  background-color: var(--table-bg-color);
  padding: 10px;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  max-width: var(--item-table-max-width);
  min-height: 22px;
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  --materia-total-cols: auto;
}
@media screen and (width <= 600px) {
  gear-set-viewer materia-totals-display {
    --materia-total-cols: 2;
  }
}
gear-set-viewer materia-totals-display .materia-totals-label {
  flex-basis: min-content;
  flex-grow: 0;
  margin: auto;
}
gear-set-viewer materia-totals-display .materia-totals-inner {
  flex-basis: max-content;
  flex-grow: 1;
  columns: auto;
  column-width: 150px;
  column-gap: 3px;
  column-fill: balance;
}
gear-set-viewer materia-totals-display .materia-totals-inner:has(:nth-last-child(4):first-child) {
  --materia-total-cols: 2;
}
gear-set-viewer materia-totals-display materia-count-display {
  display: block;
  padding: 3px;
}
gear-set-viewer materia-totals-display materia-count-display .materia-count-quantity {
  text-align: right;
  width: 30px;
  display: inline-block;
  margin-right: 3px;
}
gear-set-viewer materia-totals-display materia-count-display single-materia-view-only {
  width: fit-content;
}
gear-set-viewer table tr:last-child td,
gear-set-viewer table tr:last-child th {
  border-top: none;
}
gear-set-viewer .gear-items-view-table,
gear-set-viewer .food-view-table {
  background-color: var(--table-bg-color);
  border: var(--standard-border);
  border-spacing: 5px;
  border-radius: var(--standard-border-radius);
  overflow: hidden;
}
gear-set-viewer .gear-items-view-table > *,
gear-set-viewer .food-view-table > * {
  --standard-border: none;
  --thick-border: none;
  background: none;
}
gear-set-viewer .gear-items-view-table td,
gear-set-viewer .food-view-table td,
gear-set-viewer .gear-items-view-table th,
gear-set-viewer .food-view-table th {
  border-style: none;
  background: none;
}
gear-set-viewer .gear-items-view-table .stat-cell,
gear-set-viewer .food-view-table .stat-cell {
  border-radius: 5px;
}
gear-set-viewer .gear-items-view-table .gear-items-view-item-header,
gear-set-viewer .food-view-table .gear-items-view-item-header {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
}
gear-set-viewer .gear-items-view-table .gear-items-view-item-header > *,
gear-set-viewer .food-view-table .gear-items-view-item-header > * {
  display: inline-block;
}
gear-set-viewer .gear-items-view-table .gear-items-view-item-header > button,
gear-set-viewer .food-view-table .gear-items-view-item-header > button {
  --input-background-color: var(--bg-color);
}
gear-set-viewer .gear-items-view-table .gear-items-view-item-header > button input,
gear-set-viewer .food-view-table .gear-items-view-item-header > button input,
gear-set-viewer .gear-items-view-table .gear-items-view-item-header > button textarea,
gear-set-viewer .food-view-table .gear-items-view-item-header > button textarea {
  background-color: var(--bg-color);
}
gear-set-viewer .gear-items-view-table .item-name-holder-view,
gear-set-viewer .food-view-table .item-name-holder-view {
  text-overflow: ellipsis;
  overflow: hidden;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
gear-set-viewer .gear-items-view-table .item-name-holder-view > span,
gear-set-viewer .food-view-table .item-name-holder-view > span {
  vertical-align: middle;
}
gear-set-viewer .food-view-table td.food-stat-col {
  --standard-border: 1px var(--border-style) color-mix(in srgb, var(--stat-color) 10%, var(--border-color));
  border: var(--standard-border);
  border-top: var(--standard-border) !important;
  border-radius: 5px;
}
gear-set-viewer .food-view-table td.food-stat-col.primary {
  --standard-border: 1px var(--border-style) color-mix(in srgb, var(--stat-color) 50%, var(--border-color));
}
.stat-cell {
  text-align: center;
  text-overflow: clip;
}
.stat-cell span {
  padding: 0 1px 0 0;
}
.color-stat-column.primary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary-bg), var(--table-bg-color));
}
.color-stat-column.secondary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary-bg), var(--table-bg-color));
}
.stat-crit {
  --stat-color: var(--color-crit);
}
.stat-crit.primary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary-bg), var(--table-bg-color));
}
.stat-crit.secondary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary-bg), var(--table-bg-color));
}
.stat-dhit {
  --stat-color: var(--color-dhit);
}
.stat-dhit.primary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary-bg), var(--table-bg-color));
}
.stat-dhit.secondary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary-bg), var(--table-bg-color));
}
.stat-determination {
  --stat-color: var(--color-det);
}
.stat-determination.primary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary-bg), var(--table-bg-color));
}
.stat-determination.secondary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary-bg), var(--table-bg-color));
}
.stat-tenacity {
  --stat-color: var(--color-tnc);
}
.stat-tenacity.primary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary-bg), var(--table-bg-color));
}
.stat-tenacity.secondary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary-bg), var(--table-bg-color));
}
.stat-spellspeed,
.stat-skillspeed {
  --stat-color: var(--color-sps-sks);
}
.stat-spellspeed.primary,
.stat-skillspeed.primary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary-bg), var(--table-bg-color));
}
.stat-spellspeed.secondary,
.stat-skillspeed.secondary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary-bg), var(--table-bg-color));
}
.stat-piety {
  --stat-color: var(--color-piety);
}
.stat-piety.primary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-primary-bg), var(--table-bg-color));
}
.stat-piety.secondary {
  color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary), var(--fg-color));
  background-color: color-mix(in srgb, var(--stat-color) var(--stat-mix-secondary-bg), var(--table-bg-color));
}
td.stat-melded,
td.stat-melded-overcapped,
td.stat-melded-overcapped-major,
td.stat-synced-down {
  box-shadow: 0 0 2px var(--materia-box-shadow-spread) color-mix(in srgb, color-mix(in srgb, var(--stat-color) 40%, var(--materia-melded-slot-blend-color)), transparent 35%) inset;
  --selection-border-opacity: 30%;
}
td.stat-zero {
  color: color-mix(in srgb, var(--table-bg-color) 75%, var(--fg-color));
}
td.primary {
  font-weight: bold;
}
loading-blocker {
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: var(--zi-loading-blocker);
}
loading-blocker.with-bg {
  background-color: var(--modal-backdrop-color);
}
loading-blocker div.loading-spinner {
  margin: auto;
  width: 100px;
  height: 100px;
  padding-left: 10px;
  box-sizing: border-box;
}
loading-blocker div.loading-spinner div {
  transform-origin: 40px 40px;
  animation: spin-anim-control linear infinite;
}
loading-blocker div.loading-spinner div::after {
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  left: 37px;
  width: 6px;
  height: 18px;
  border-radius: 20%;
  background: var(--loading-spinner-color);
}
@keyframes spin-anim-control {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
div#welcome-message {
  width: 840px;
  max-width: 100%;
  box-sizing: border-box;
  border-radius: 10px;
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  background-color: var(--table-bg-color);
  --input-background-color: var(--bg-color);
  max-width: calc(100% - 50px);
  margin: 20px auto 20px auto;
  padding: 10px 50px 0;
  height: 100%;
}
div#welcome-message input,
div#welcome-message textarea {
  background-color: var(--bg-color);
}
div#welcome-message button {
  display: block;
  margin: 5px auto 20px auto;
  font-size: 30px;
  height: fit-content;
}
div#welcome-message h1 {
  text-align: center;
  margin: auto;
}
div#welcome-message li {
  margin-top: 4px;
  margin-bottom: 4px;
}
div#welcome-message a:link,
div#welcome-message a:visited,
div#welcome-message a:active {
  color: var(--plain-link-color);
}
div#welcome-message a:hover {
  color: var(--plain-link-hover-color);
}
a:link,
a:visited,
a:active {
  color: var(--fg-color);
}
a:hover {
  color: var(--fg-color);
}
div.vertical-spacer {
  height: 10px;
}
span.like-a-button {
  display: inline-block;
  padding: var(--button-padding);
  vertical-align: top;
}
div.like-a-button > span {
  line-height: 0;
  display: block;
  position: relative;
  top: 50%;
}
.drag-handle {
  cursor: grab;
  touch-action: none;
}
buff-settings-area {
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
}
buff-settings-area table {
  border: none;
  border-collapse: separate;
  border-spacing: 0 8px;
}
buff-settings-area table tr {
  background-color: transparent;
}
buff-settings-area table tr td {
  border: none;
  border-top: var(--standard-border);
}
buff-settings-area table tr td:last-child {
  border-right: none;
}
buff-settings-area table tr:last-child {
  border-bottom: none;
}
.count-sim-results-area {
  width: 100%;
}
.count-sim-results-area > table {
  margin: auto;
  box-shadow: var(--shadow-color) 0 4px 10px 0;
}
.count-sim-results-area > table tbody tr:first-child {
  border-top-left-radius: var(--standard-border-radius);
  border-top-right-radius: var(--standard-border-radius);
}
.count-sim-results-area > table tbody tr:first-child td:first-child,
.count-sim-results-area > table tbody tr:first-child th:first-child {
  border-top-left-radius: var(--standard-border-radius);
}
.count-sim-results-area > table tbody tr:first-child td:last-child,
.count-sim-results-area > table tbody tr:first-child th:last-child {
  border-top-right-radius: var(--standard-border-radius);
}
.count-sim-results-area > table tbody tr:last-child {
  border-bottom-left-radius: var(--standard-border-radius);
  border-bottom-right-radius: var(--standard-border-radius);
}
.count-sim-results-area > table tbody tr:last-child td:first-child,
.count-sim-results-area > table tbody tr:last-child th:first-child {
  border-bottom-left-radius: var(--standard-border-radius);
}
.count-sim-results-area > table tbody tr:last-child td:last-child,
.count-sim-results-area > table tbody tr:last-child th:last-child {
  border-bottom-right-radius: var(--standard-border-radius);
}
.count-sim-results-area .main-results-table {
  margin-bottom: 20px;
}
.count-sim-results-area .main-results-table td {
  padding-left: 15px;
  padding-right: 15px;
}
.count-sim-results-area .main-results-table td[col-id='value'] {
  text-align: right;
}
div.weapon-ilvl-bypass-setting div {
  float: right;
  margin-right: 5px;
}
div.weapon-ilvl-bypass-setting div label {
  font-weight: normal;
}
fieldset {
  border: none;
}
.export-modal-dialog fieldset {
  text-align: left;
}
.export-modal-dialog .labeled-radio-button {
  display: inline-block;
  padding-right: 10px;
  padding-bottom: 8px;
}
.export-modal-dialog > div {
  width: min-content;
}
sheet-export-modal textarea,
set-export-modal textarea {
  height: 200px;
}
sheet-export-modal sim-export-chooser,
set-export-modal sim-export-chooser {
  width: fit-content;
  display: block;
  margin: auto;
}
sheet-export-modal sim-export-chooser .sim-export-chooser-inner,
set-export-modal sim-export-chooser .sim-export-chooser-inner {
  max-height: 300px;
  overflow-y: auto;
  text-align: left;
}
.ffxiv-frameless-job-icon {
  aspect-ratio: 1;
}
.ffxiv-job-icon {
  display: block;
  aspect-ratio: 1;
  box-sizing: border-box;
  border-radius: 20%;
  border: 4px ridge #c47b00;
  overflow: hidden;
  font-size: 40%;
  text-align: center;
  color: white;
  background: linear-gradient(var(--role-color), color-mix(in srgb, var(--role-color) 50%, #000));
}
.ffxiv-job-icon::before {
  margin: auto;
  display: block;
  position: relative;
  translate: 0 -50%;
  top: 50%;
  content: var(--job-name);
}
.ffxiv-job-icon.ffxiv-role-tank {
  --role-color: var(--role-color-tank);
}
.ffxiv-job-icon.ffxiv-role-healer {
  --role-color: var(--role-color-healer);
}
.ffxiv-job-icon.ffxiv-role-dps {
  --role-color: var(--role-color-dps);
}
.ffxiv-job-icon.loaded {
  border-radius: unset;
  background: unset;
  border: none;
}
.ffxiv-job-icon:not(.loaded) {
  filter: saturate(40%);
}
.svg-glyph {
  height: 1em;
  width: 1em;
  display: inline;
  vertical-align: -0.125em;
  fill: var(--fg-color);
}
.svg-glyph.svg-line {
  fill: none;
  stroke: var(--fg-color);
}
*:focus-visible {
  outline: initial;
  box-shadow: 0 0 2px 2px var(--table-selected-outline-color);
}
.relic-stat-excluded {
  width: 100%;
  height: 100%;
}
body.modern {
  --border-color: #00000000;
  --border-style: none;
  --table-extra-padding: 10px;
  --optional-border-radius: 10px;
  --perfect-tiering-box-shadow: none;
  --border-color-input: #0000;
  --tiering-color-mix: 5%;
}
body.modern input {
  border: none !important;
}
body.modern table {
  border-radius: 10px;
  padding: var(--table-extra-padding);
  background-color: var(--table-bg-color);
}
body.modern table.gear-plan-table {
  border-radius: 0;
  --table-extra-padding: 0px;
}
body.modern table.gear-plan-table tr td[col-id="actions"] button {
  opacity: 10%;
}
body.modern table.gear-plan-table tr:hover td[col-id="actions"] button,
body.modern table.gear-plan-table tr[is-selected="true"] td[col-id="actions"] button,
body.modern table.gear-plan-table tr.dragging td[col-id="actions"] button {
  opacity: 80%;
}
body.modern table.gear-items-table > tbody > tr:first-child > th {
  border-top-left-radius: var(--standard-border-radius);
  border-top-right-radius: var(--standard-border-radius);
}
body.modern table.gear-items-table > tbody > tr > th[col-id] {
  font-size: small;
  text-align: center;
}
body.modern table.gear-items-table > tbody > tr > th[col-id][col-id='itemname'] {
  text-align: left;
}
body.modern table.gear-items-table > tbody > tr > * {
  padding-left: 5px;
  padding-right: 5px;
}
body.modern.light-mode {
  --bg-color: #e5dad7;
  --input-hover-background-color: #ddb581;
}
body.modern:not(.light-mode) {
  --table-bg-color: #24242c;
  --input-background-color: var(--table-bg-color);
}
body.modern .gear-sheet-midbar-area {
  background-color: var(--input-background-color);
}
body.modern .gear-sheet-midbar-area button,
body.modern .gear-sheet-midbar-area select {
  --input-background-color: var(--bg-color);
}
body.modern gear-set-editor table all-slot-materia-manager {
  padding-top: 5px;
}
body.modern materia-dragger:hover {
  --stat-mix-secondary-bg: 20%;
}
body.modern .modal-dialog .modal-inner {
  background-color: var(--bg-color);
}
body.modern div#main-menu-area {
  background: none;
  box-shadow: none;
}
body.modern div#main-menu-area div#main-menu-area-inner {
  box-shadow: var(--shadow-color) 0 3px 5px 0;
  width: fit-content;
  display: flex;
  align-items: normal;
  margin-left: auto;
  margin-right: auto;
  background-color: var(--table-bg-color);
  --mmai-border-radius: 10px;
  border-bottom-left-radius: var(--mmai-border-radius);
  border-bottom-right-radius: var(--mmai-border-radius);
  padding-left: var(--mmai-border-radius);
  padding-right: var(--mmai-border-radius);
}
@media (width < 525px) {
  body.modern div#main-menu-area div#main-menu-area-inner a span {
    display: none;
  }
  body.modern div#main-menu-area div#main-menu-area-inner .svg-glyph {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
body.modern div#main-menu-area div#main-menu-area-inner .svg-glyph {
  scale: 1.5;
  padding-left: 5px;
  padding-right: 5px;
}
body.modern div#main-menu-area div#main-menu-area-inner .svg-glyph:only-child {
  padding-left: 0;
  padding-right: 0;
}
body.modern div#main-menu-area div#main-menu-area-inner .svg-glyph.svg-bigger {
  scale: 2;
}
body.modern .gear-sheet-table-holder-outer {
  padding: 10px 5px;
  border-radius: 10px;
  margin: 5px;
  background-color: var(--table-bg-color);
  box-shadow: var(--shadow-color) 0 3px 5px 0;
}
body.modern .gear-sheet-table-area {
  margin-bottom: 5px;
}
body.modern button#show-hide-menu-button,
body.modern button#help-button {
  box-shadow: var(--shadow-color) 0 3px 5px 0;
}
body.modern .gear-sheet-buttons-area > * {
  height: 25px;
  padding-left: 10px;
  padding-right: 10px;
}
body.modern slot-materia-popup {
  border-radius: 10px;
  overflow: hidden;
}
body.modern div.gear-set-editor-toolbar > * {
  box-shadow: none;
  padding-left: 5px;
  padding-right: 5px;
}
body.modern set-view-toolbar set-totals-display div.stat-total {
  background-color: color-mix(in srgb, var(--stat-color) 6%, var(--table-bg-color));
  padding-left: 6px;
  padding-right: 6px;
  margin-left: 4px;
  margin-right: 4px;
  box-sizing: content-box;
}
body.modern .gear-set-editor-toolbar .single-stat-tier-display {
  background-color: color-mix(in srgb, var(--stat-color) 5%, var(--table-bg-color));
  box-sizing: border-box;
  padding: 4px;
  height: var(--toolbar-button-size);
  border-radius: var(--toolbar-border-radius);
}
body.modern .gear-set-editor-toolbar .single-stat-tier-display.stat-tiering-perfect {
  background-color: color-mix(in srgb, var(--stat-color) 13%, var(--table-bg-color));
}
body.modern .gear-set-editor-toolbar .toolbar-buttons-area .popout-area {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
bool-toggle {
  display: block;
  user-select: none;
  box-sizing: border-box;
  --bool-toggle-inset: 10px;
  --border-radius: 15px;
  margin: 20px;
  width: 200px;
  height: 60px;
  --bool-toggle-bg-color: var(--input-background-color);
  --bool-toggle-slider-bg-color: var(--bg-color);
}
bool-toggle input {
  display: none;
}
bool-toggle .bool-toggle-label {
  display: block;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  background-color: var(--bool-toggle-bg-color);
  border-radius: calc(var(--border-radius) + var(--bool-toggle-inset));
  border: var(--standard-border);
}
bool-toggle .bool-toggle-inner {
  position: relative;
  left: var(--bool-toggle-inset);
  top: var(--bool-toggle-inset);
  width: calc(100% - 2 * var(--bool-toggle-inset));
  height: calc(100% - 2 * var(--bool-toggle-inset));
  box-sizing: border-box;
}
bool-toggle .bool-toggle-slider {
  width: calc(50% - var(--bool-toggle-inset));
  height: 100%;
  position: absolute;
  left: 0;
  transition: left 0.2s ease;
  border-radius: var(--border-radius);
  box-sizing: border-box;
  background-color: var(--bool-toggle-slider-bg-color);
  border: var(--standard-border);
}
bool-toggle .bool-toggle-left,
bool-toggle .bool-toggle-right {
  position: absolute;
  text-align: center;
  width: calc(50% - var(--bool-toggle-inset));
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
}
bool-toggle .bool-toggle-left {
  left: 0;
}
bool-toggle .bool-toggle-right {
  right: 0;
}
bool-toggle:has(input:checked) .bool-toggle-slider {
  left: calc(50% + var(--bool-toggle-inset));
}
bool-toggle:hover {
  --bool-toggle-bg-color: var(--input-hover-background-color);
}
bool-toggle:active {
  --bool-toggle-bg-color: var(--button-active-background-color);
}
svg.gear-set-warning-icon {
  fill: var(--issue-warning-color);
  margin-right: 5px;
}
svg.gear-set-error-icon {
  fill: var(--issue-error-color);
  margin-right: 5px;
}
gear-set-issues-modal.has-issues .modal-content-area {
  text-align: left;
}
gear-set-issues-modal .modal-inner {
  width: 400px;
}
gear-set-issues-modal .modal-inner .modal-content-area .gear-set-issue-block {
  display: flex;
  margin: 25px;
}
gear-set-issues-modal .modal-inner .modal-content-area .gear-set-issue-block > span {
  flex-basis: fit-content;
}
gear-set-issues-modal .modal-inner .modal-content-area .gear-set-issue-block > svg {
  margin-right: 10px;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}
.named-section {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}
.named-section > h3 {
  margin-top: 0;
  margin-bottom: 18px;
}
.named-section-standard {
  max-height: calc(100% - 50px);
  max-width: calc(100% - 50px);
  background-color: var(--table-bg-color);
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  margin: 20px auto 20px auto;
  width: fit-content;
  height: fit-content;
  padding: 20px;
  border-radius: 10px;
}
.named-section-standard .named-section-content-area {
  max-width: 100%;
  overflow: auto;
}
.invert-input-colors {
  --input-background-color: var(--bg-color);
}
.invert-input-colors input,
.invert-input-colors textarea {
  background-color: var(--bg-color);
}
#content-area > .named-section {
  max-height: calc(100% - 50px);
  width: fit-content;
  height: fit-content;
  padding: 20px;
  border-radius: 10px;
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  background-color: var(--table-bg-color);
  --input-background-color: var(--bg-color);
  max-width: calc(100% - 50px);
  margin: 20px auto 20px auto;
}
#content-area > .named-section .named-section-content-area {
  max-width: 100%;
  overflow: auto;
}
#content-area > .named-section input,
#content-area > .named-section textarea {
  background-color: var(--bg-color);
}
.top-level-widget {
  border-radius: 10px;
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  background-color: var(--table-bg-color);
  --input-background-color: var(--bg-color);
  max-width: calc(100% - 50px);
  margin: 20px auto 20px auto;
}
.top-level-widget input,
.top-level-widget textarea {
  background-color: var(--bg-color);
}
.sim-basic-result-table {
  box-shadow: var(--shadow-color) 0 4px 10px 0;
}
.sim-basic-result-table tbody tr:first-child {
  border-top-left-radius: var(--standard-border-radius);
  border-top-right-radius: var(--standard-border-radius);
}
.sim-basic-result-table tbody tr:first-child td:first-child,
.sim-basic-result-table tbody tr:first-child th:first-child {
  border-top-left-radius: var(--standard-border-radius);
}
.sim-basic-result-table tbody tr:first-child td:last-child,
.sim-basic-result-table tbody tr:first-child th:last-child {
  border-top-right-radius: var(--standard-border-radius);
}
.sim-basic-result-table tbody tr:last-child {
  border-bottom-left-radius: var(--standard-border-radius);
  border-bottom-right-radius: var(--standard-border-radius);
}
.sim-basic-result-table tbody tr:last-child td:first-child,
.sim-basic-result-table tbody tr:last-child th:first-child {
  border-bottom-left-radius: var(--standard-border-radius);
}
.sim-basic-result-table tbody tr:last-child td:last-child,
.sim-basic-result-table tbody tr:last-child th:last-child {
  border-bottom-right-radius: var(--standard-border-radius);
}
alt-items-modal .modal-content-area {
  width: min-content;
  max-width: 100%;
}
alt-items-modal table {
  width: max-content;
}
alt-items-modal table tr td,
alt-items-modal table tr th {
  padding-left: 15px;
  padding-right: 15px;
}
alt-items-modal table tr *[col-id="icon"] {
  height: 25px;
  width: 23px;
  min-width: 23px;
  max-width: 23px;
  padding-right: 0;
  box-sizing: content-box;
}
alt-items-modal table tr *[col-id="icon"] img {
  height: 100%;
}
alt-items-modal table tr *[col-id="itemname"] {
  padding-left: 0;
}
.formula-top-level {
  max-height: calc(100% - 50px);
  max-width: calc(100% - 50px);
  background-color: var(--table-bg-color);
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  margin: 20px auto 20px auto;
  width: fit-content;
  height: fit-content;
  padding: 20px;
  border-radius: 10px;
  --input-background-color: var(--bg-color);
}
.formula-top-level .named-section-content-area {
  max-width: 100%;
  overflow: auto;
}
.formula-top-level input,
.formula-top-level textarea {
  background-color: var(--bg-color);
}
math-area .formula-selector-area button {
  margin: 3px;
}
math-area .formula-selector-area button.active {
  background-color: var(--input-hover-background-color);
}
math-area .settings-area .generic-settings-area .vertical-labeled-input,
math-area .settings-area .specific-settings-area .vertical-labeled-input {
  padding: 10px;
  display: inline-block;
}
math-area .settings-area .generic-settings-area .vertical-labeled-input input,
math-area .settings-area .specific-settings-area .vertical-labeled-input input {
  width: 100px;
}
math-area .settings-area .generic-settings-area .vertical-labeled-input > *,
math-area .settings-area .specific-settings-area .vertical-labeled-input > * {
  display: block;
}
button[disabled] {
  pointer-events: none;
  opacity: 50%;
}
settings-modal .modal-content-area {
  padding: 15px;
}
settings-modal .modal-content-area > * {
  display: block;
}
settings-modal .modal-content-area #language-picker {
  width: 100%;
}
input {
  background: var(--input-background-color);
}
button.narrow-button {
  width: min-content;
  height: fit-content;
}
body {
  --default-gauge-color: #00000033;
}
.gauge-outer {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 100%;
  box-sizing: border-box;
}
.gauge-outer.sim-gauge {
  padding: 2px 0 2px 0;
}
.gauge-outer.gauge-narrow {
  width: 60px;
}
gauge-bar {
  display: inline-block;
  overflow: hidden;
  width: 120px;
  border-radius: 20px;
  background-color: var(--default-gauge-color);
  height: calc(100% - 3px);
  border: 1px solid black;
}
gauge-bar.sim-gauge {
  padding: 2px 0 2px 0;
}
gauge-bar .gauge-bar-inner {
  height: 100%;
}
.icon-gauge-holder {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 2px 0;
  box-sizing: border-box;
}
.icon-gauge-holder > span:empty {
  height: 100%;
  width: 16px;
  display: inline-block;
  overflow: hidden;
  flex-basis: 16px;
  flex-shrink: 0;
  flex-grow: 0;
}
.icon-gauge-holder > span:not(:empty) {
  flex-grow: 1;
}
.shape-diamond {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.shape-circle {
  clip-path: circle();
}
.shape-rightchevron {
  clip-path: polygon(75% 12%, 100% 50%, 75% 88%, 0% 88%, 25% 50%, 0% 12%);
  margin-right: -2px;
}
.whm-gauge {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.whm-gauge-default {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: var(--default-gauge-color);
}
.whm-gauge-blue {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #02d9c3;
}
.whm-gauge-red {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #ff0033;
}
.sch-gauge {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.sch-gauge-default {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: var(--default-gauge-color);
}
.sch-gauge-active {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #0FFF33;
}
.mnk-chakra-gauge {
  clip-path: circle();
}
.mnk-chakra-gauge-default {
  clip-path: circle();
  background-color: var(--default-gauge-color);
}
.mnk-chakra-gauge-red {
  clip-path: circle();
  background-color: #f32908;
}
.mnk-chakra-gauge-orange {
  clip-path: circle();
  background-color: #f37208;
}
.mnk-chakra-gauge-number {
  min-width: 50px;
}
.mnk-beastfury-gauge {
  clip-path: circle();
}
.mnk-beastfury-gauge-default {
  clip-path: circle();
  background-color: var(--default-gauge-color);
}
.mnk-beastfury-gauge-opo {
  clip-path: circle();
  background-color: #f796c6;
}
.mnk-beastfury-gauge-raptor {
  clip-path: circle();
  background-color: #cd9bff;
}
.mnk-beastfury-gauge-coeurl {
  clip-path: circle();
  background-color: #83ffaa;
}
.mnk-nadi-gauge {
  clip-path: circle();
}
.mnk-nadi-gauge-default {
  clip-path: circle();
  background-color: var(--default-gauge-color);
}
.mnk-nadi-gauge-lunar {
  clip-path: circle();
  background-color: #bd86ff;
}
.mnk-nadi-gauge-solar {
  clip-path: circle();
  background-color: #ffffff;
}
td[col-id="nadi"] {
  padding-left: 12px;
  padding-right: 12px;
}
.mnk-beastchakra-gauge {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.mnk-beastchakra-gauge-default {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: var(--default-gauge-color);
}
.mnk-beastchakra-gauge-opo {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #f786bd;
}
.mnk-beastchakra-gauge-raptor {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #ad79d6;
}
.mnk-beastchakra-gauge-coeurl {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #65b291;
}
.blm-element {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.blm-element-default {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: var(--default-gauge-color);
}
.blm-element-fire {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #ff4a65;
}
.blm-element-ice {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #3bb0ff;
}
.blm-polyglot {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.blm-polyglot-default {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: var(--default-gauge-color);
}
.blm-polyglot-full {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #e06796;
}
.blm-paradox {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.blm-paradox-default {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: var(--default-gauge-color);
}
.blm-paradox-full {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background: #ff4a65 linear-gradient(180deg, #ff4a65 0%, #fec4ff 50%, #3bb0ff 100%);
}
.blm-umbralhearts {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.blm-umbralhearts-default {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: var(--default-gauge-color);
}
.blm-umbralhearts-full {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #ffffff;
}
.blm-astralsoul {
  clip-path: polygon(75% 12%, 100% 50%, 75% 88%, 0% 88%, 25% 50%, 0% 12%);
  margin-right: -2px;
}
.blm-astralsoul-default {
  clip-path: polygon(75% 12%, 100% 50%, 75% 88%, 0% 88%, 25% 50%, 0% 12%);
  margin-right: -2px;
  background-color: var(--default-gauge-color);
}
.blm-astralsoul-full {
  clip-path: polygon(75% 12%, 100% 50%, 75% 88%, 0% 88%, 25% 50%, 0% 12%);
  margin-right: -2px;
  background-color: #ffc27a;
}
.vpr-rattling-gauge {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.vpr-rattling-gauge-default {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: var(--default-gauge-color);
}
.vpr-rattling-gauge-full {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #84100F;
}
.sam-meditation-gauge {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
}
.sam-meditation-gauge-default {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: var(--default-gauge-color);
}
.sam-meditation-gauge-full {
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 50% 100%, 0% 50%);
  background-color: #ff6723;
}
.gnb-cartridge {
  clip-path: circle();
}
.gnb-cartridge-default {
  clip-path: circle();
  background-color: var(--default-gauge-color);
}
.gnb-cartridge-red {
  clip-path: circle();
  background-color: #f32908;
}
.gnb-cartridge-orange {
  clip-path: circle();
  background-color: #f37208;
}
.sim-gauge.two-digit {
  --gauge-text-width: 19px;
}
.sim-gauge.three-digit {
  --gauge-text-width: 28px;
}
.sim-gauge.four-digit {
  --gauge-text-width: 37px;
}
.sim-gauge.five-digit {
  --gauge-text-width: 46px;
}
.gauge-text-label {
  min-width: var(--gauge-text-width, auto);
}
expandable-text p {
  margin-top: 0;
}
expandable-text.truncated .truncatable-text-area-inner {
  -webkit-line-clamp: var(--truncatable-line-clamp);
  overflow: hidden;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  mask-image: linear-gradient(180deg, black 90%, transparent 100%);
}
expandable-text.truncated .truncation-expand-button {
  display: unset;
}
expandable-text .truncation-expand-button {
  display: none;
  margin-bottom: 10px;
}
.set-description-holder {
  --truncatable-line-clamp: 6;
  margin-bottom: 16px;
}
.set-description-holder button {
  box-shadow: var(--shadow-color) 0 3px 5px 0;
  border-radius: 5px;
}
.cycle-sim-results {
  display: grid;
  grid-gap: 20px;
  padding: 20px 5px 20px 5px;
}
.cycle-sim-results .cycle-sim-table-holder {
  background-color: var(--table-bg-color);
  border-radius: var(--standard-border-radius);
  border: var(--standard-border);
  box-shadow: var(--shadow-color) 0 4px 10px 0;
  width: fit-content;
  margin: auto;
  padding: 10px;
  height: 100%;
  box-sizing: border-box;
}
.cycle-sim-results .cycle-sim-table-holder table {
  background: none;
  padding: 0;
}
.cycle-sim-results.cycle-sim-results-full {
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  max-width: max-content;
  margin: auto;
}
.cycle-sim-results.cycle-sim-results-full.cycle-sim-results-multirotation {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto 1fr;
}
.cycle-sim-results.cycle-sim-results-full.cycle-sim-results-multirotation .cycle-sim-abilities-holder {
  grid-column-end: span 2;
  min-height: 100px;
}
@media screen and (max-width: 625px) {
  .cycle-sim-results.cycle-sim-results-full.cycle-sim-results-multirotation {
    grid-template-columns: 100%;
    grid-template-rows: auto auto 1fr;
  }
  .cycle-sim-results.cycle-sim-results-full.cycle-sim-results-multirotation .cycle-sim-abilities-holder {
    grid-column-end: span 1;
    min-height: 100px;
  }
}
.cycle-sim-results.cycle-sim-results-full.cycle-sim-results-onerotation {
  grid-template-rows: auto 1fr;
  grid-template-columns: 100%;
}
.cycle-sim-results.cycle-sim-results-full.cycle-sim-results-onerotation .cycle-sim-abilities-holder {
  grid-column-end: span 1;
}
.cycle-sim-results.cycle-sim-results-full .cycle-sim-abilities-holder {
  max-width: 100%;
  overflow: auto;
}
.cycle-sim-results.cycle-sim-results-full .cycle-sim-abilities-holder .scroll-table-holder {
  overflow-x: auto;
  min-height: 100%;
  height: 100px;
}
.cycle-sim-results.cycle-sim-results-full .cycle-sim-rotations-holder {
  min-height: 0;
}
.cycle-sim-results.cycle-sim-results-full .cycle-sim-rotations-holder .scroll-table-holder {
  min-height: 100%;
  max-height: 150px;
}
.cycle-sim-results.cycle-sim-results-full .cycle-sim-rotations-holder td {
  cursor: pointer;
}
.cycle-sim-results.cycle-sim-results-full .cycle-sim-rotations-holder th {
  text-align: center;
}
.cycle-sim-results.cycle-sim-results-full .cycle-sim-rotations-holder td[col-id="dps"] {
  min-width: 85px;
  text-align: right;
}
.cycle-sim-results.cycle-sim-results-full .cycle-sim-main-holder > table > * > tr > td {
  width: 150px;
}
.cycle-sim-results.cycle-sim-results-full .scroll-table-holder {
  overflow-y: auto;
  min-height: 0;
  scrollbar-gutter: stable;
}
.cycle-sim-results.cycle-sim-results-full .scroll-table-holder > table > * > tr > th {
  position: sticky;
  top: 0;
  z-index: var(--zi-sets-table-header-row);
  background: color-mix(in srgb, var(--table-bg-color) 80%, transparent);
}
.row-overlay-link {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.validating-form {
  position: relative;
}
.validating-form .validation-message-holder {
  display: none;
  position: absolute;
  width: 100%;
  height: min-content;
  box-sizing: border-box;
  translate: 0 -100%;
  background-color: color-mix(in srgb, var(--bg-color) 90%, transparent);
  box-shadow: var(--issue-error-color) 0 0 5px 2px;
  border-radius: var(--standard-border-radius);
  padding: 10px;
}
.validating-form .validation-message-holder.failed {
  display: block;
  color: var(--fg-color);
}
.validating-form .validation-message-close {
  float: right;
}
div.sync-tools {
  cursor: initial;
  font-weight: normal;
}
div.sync-tools > * {
  margin-right: 5px;
}
body:not([data-accountstate='logged-in-verified']) .require-account-state-verified {
  display: none;
}
body:not([data-accountstate='logged-in-unverified']) .require-account-state-unverified {
  display: none;
}
body:not([data-accountstate='not-logged-in']) .require-account-state-logged-out {
  display: none;
}
body:not([data-accountstate='not-loaded']) .require-account-state-not-loaded {
  display: none;
}
button.async-action-button {
  position: relative;
}
button.async-action-button .loading-pane {
  display: none;
  position: absolute;
  inset: 0;
}
button.async-action-button.in-progress {
  color: transparent;
  cursor: wait;
}
button.async-action-button.in-progress .loading-pane {
  display: block;
  color: var(--fg-color);
}
.switch-nitro-color {
  background-color: var(--bg-color) !important;
  color: var(--fg-color) !important;
}
.switch-nitro-color * {
  color: var(--fg-color) !important;
}
div#nitropay-ccpa-modal {
  background-color: var(--bg-color) !important;
  color: var(--fg-color) !important;
}
div#nitropay-ccpa-modal * {
  color: var(--fg-color) !important;
}
div#ncmp__tool div.ncmp__banner-web {
  background-color: var(--bg-color) !important;
  color: var(--fg-color) !important;
}
div#ncmp__tool div.ncmp__banner-web * {
  color: var(--fg-color) !important;
}
body:not(.light-mode) div#nitropay-ccpa-modal img {
  filter: invert();
}
body:not(.light-mode) div#ncmp__modal div.ncmp__modal-web {
  filter: invert() hue-rotate(180deg);
}
.extra-information-link:not(:empty) {
  display: block;
}
.extra-information-link:empty {
  display: none;
}
.extra-information-link button {
  all: inherit;
  cursor: pointer;
  text-decoration: underline;
  margin: auto;
}
#fallback-privacy-area {
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: var(--table-bg-color);
  padding: 2px 4px 2px 2px;
  border-top-right-radius: 6px;
  z-index: var(--zi-privacy-link);
}
#fallback-privacy-area > * {
  display: inline-block !important;
}
#fallback-privacy-area span.extra-information-link:empty,
#fallback-privacy-area div.extra-information-link:empty {
  display: none !important;
}
#fallback-privacy-area span.extra-information-link.extra-information-link::before,
#fallback-privacy-area div.extra-information-link.extra-information-link::before {
  content: ' - ';
  padding-left: 5px;
}
custom-item-popup table td input[type="text"],
custom-food-popup table td input[type="text"],
custom-item-popup table td input[type="number"],
custom-food-popup table td input[type="number"],
custom-item-popup table td select,
custom-food-popup table td select {
  box-sizing: border-box;
  max-width: 100%;
  border: 2px solid transparent;
  padding: 0 0 0 0;
  background: var(--relic-stat-input-background-color);
  text-align: center;
}
custom-item-popup table td input[type="text"]input,
custom-food-popup table td input[type="text"]input,
custom-item-popup table td input[type="number"]input,
custom-food-popup table td input[type="number"]input,
custom-item-popup table td selectinput,
custom-food-popup table td selectinput {
  width: unset !important;
}
custom-item-popup table td input[type="text"]:hover,
custom-food-popup table td input[type="text"]:hover,
custom-item-popup table td input[type="number"]:hover,
custom-food-popup table td input[type="number"]:hover,
custom-item-popup table td select:hover,
custom-food-popup table td select:hover,
custom-item-popup table td input[type="text"]:active,
custom-food-popup table td input[type="text"]:active,
custom-item-popup table td input[type="number"]:active,
custom-food-popup table td input[type="number"]:active,
custom-item-popup table td select:active,
custom-food-popup table td select:active,
custom-item-popup table td input[type="text"]:focus,
custom-food-popup table td input[type="text"]:focus,
custom-item-popup table td input[type="number"]:focus,
custom-food-popup table td input[type="number"]:focus,
custom-item-popup table td select:focus,
custom-food-popup table td select:focus {
  background: var(--relic-stat-input-background-hover-color);
}
custom-item-popup table td select,
custom-food-popup table td select {
  width: 100%;
}
custom-item-popup .notes-area,
custom-food-popup .notes-area {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
sim-result-detail-display {
  margin: auto;
  display: block;
  width: fit-content;
}
.gear-sheet-editor-area sim-result-detail-display {
  width: 100%;
  height: 100%;
}
meld-solver-result-dialog .meld-solver-result {
  --img-col-width: 40px;
  --bonus-col-width: 1fr;
  --count-col-width: 50px;
  --arrow-col-width: 60px;
  display: grid;
  grid-template-columns: var(--img-col-width) var(--bonus-col-width) var(--count-col-width) var(--arrow-col-width) var(--img-col-width) var(--bonus-col-width) var(--count-col-width);
  gap: 15px 5px;
}
meld-solver-result-dialog .meld-solver-result span.arrow {
  margin: 10px;
  font-size: xx-large;
}
meld-solver-result-dialog .meld-solver-result .meld-results-arrow {
  grid-column: 4;
  grid-row: 1/-1;
}
meld-solver-result-dialog .meld-solver-result .meld-solver-result-set-sim {
  color: color-mix(in srgb, currentColor var(--sim-color-mix-percent), color-mix(in hsl, #00ff00 var(--sim-result-relative, 50%), #ff0000));
}
meld-solver-result-dialog .meld-solver-result .sim-best {
  font-weight: bold;
}
meld-solver-result-dialog .meld-solver-result .cols-left {
  grid-column: 1 / span 3;
}
meld-solver-result-dialog .meld-solver-result .cols-right {
  grid-column: 5 / span 3;
}
meld-solver-result-dialog .meld-solver-result .cols-middle {
  grid-column: 4;
}
meld-solver-result-dialog .meld-solver-result .solve-result-mat-entry-holder {
  display: grid;
  grid-template-columns: subgrid;
  grid-template-rows: subgrid;
}
meld-solver-result-dialog .meld-solver-result .solve-result-mat-entry-holder .meld-solver-result-materia-entry {
  display: contents;
  --image-size: 25px;
}
meld-solver-result-dialog .meld-solver-result .solve-result-mat-entry-holder .meld-solver-result-materia-entry .meld-solver-result-image {
  grid-column: 1;
  overflow: clip;
  width: var(--image-size);
  height: var(--image-size);
  margin-right: 3%;
  border-radius: 100%;
  text-align: right;
  margin-left: auto;
}
meld-solver-result-dialog .meld-solver-result .solve-result-mat-entry-holder .meld-solver-result-materia-entry .meld-solver-result-image img {
  height: 100%;
  display: block;
  aspect-ratio: 1;
}
meld-solver-result-dialog .meld-solver-result .solve-result-mat-entry-holder .meld-solver-result-materia-entry .meld-solver-result-materia-entry-stat {
  text-align: left;
  grid-column: 2;
}
meld-solver-result-dialog .meld-solver-result .solve-result-mat-entry-holder .meld-solver-result-materia-entry .meld-solver-result-materia-entry-count {
  margin-left: 5%;
  text-align: left;
  grid-column: 3;
}
meld-solver-result-dialog .meld-solver-result-materia-entry-delta {
  text-align: center;
}
meld-solver-result-dialog .meld-solver-result-materia-entry-zero {
  color: var(--border-color-default);
}
meld-solver-result-dialog .meld-solver-result-materia-entry-diff {
  background-color: var(--scrollbar-bg);
}
meld-solver-area .modal-inner,
meld-solver-result-dialog .modal-inner {
  width: 500px;
  max-width: 95vw;
}
img.item-icon {
  border-radius: 10%;
}
img.item-icon.loaded {
  border-radius: unset;
  background: unset;
}
img.item-rarity-normal,
img.item-rarity-unknown {
  background: radial-gradient(#7a7b70, #4b4d4a);
}
img.item-rarity-green {
  background: linear-gradient(#494842, #29d281);
}
img.item-rarity-blue {
  background: radial-gradient(circle at 35% 35%, #63a0c9, #203c8b 50%);
}
img.item-rarity-relic {
  background: radial-gradient(#7550a7, #693971);
}
.abilities-used-table .ability-cell {
  height: 100%;
  max-height: var(--abilities-row-height);
  display: flex;
  align-items: center;
}
.abilities-used-table .ability-cell .ffxiv-ability-icon {
  height: 100%;
  display: block;
  aspect-ratio: 1;
}
.abilities-used-table .ability-cell .ability-name {
  overflow-x: hidden;
  text-overflow: ellipsis;
  line-height: initial;
  flex-shrink: 1;
  flex-grow: 1;
}
.abilities-used-table .ability-cell.ability-ogcd::before {
  content: '⤷';
  transform: scale(1.5);
  font-weight: bold;
  margin-right: 2px;
}
.abilities-used-table .ability-cell.ability-autoattack::before {
  content: '🗘';
  transform: scale(1.2) rotate(50deg);
}
.abilities-used-table .ability-cell.ability-item span {
  width: 100px;
}
.abilities-used-table th {
  text-align: center;
}
.abilities-used-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1px;
  height: var(--abilities-row-height);
}
.abilities-used-table td[col-id='time'] {
  text-align: right;
}
.abilities-used-table td[col-id='buffs'] {
  padding-top: 0;
}
.abilities-used-table td[col-id='buffs'] .active-buffs-list {
  height: 100%;
  width: 100%;
  display: inline-flex;
  align-items: center;
  max-height: var(--abilities-row-height);
}
.abilities-used-table td[col-id='buffs'] .active-buffs-list img {
  height: 100%;
  flex-shrink: 0;
  padding-right: 2px;
  aspect-ratio: 0.75;
}
.abilities-used-table td[col-id='buffs'] .active-buffs-list span {
  flex-shrink: 1;
  display: block;
  min-width: 1px;
  overflow-x: hidden;
  text-overflow: ellipsis;
  line-height: var(--abilities-row-height);
}
.abilities-used-table td[col-id='time'],
.abilities-used-table th[col-id='time'] {
  min-width: 65px;
  width: 75px;
  max-width: 75px;
}
.abilities-used-table td[col-id='ability'],
.abilities-used-table th[col-id='ability'] {
  min-width: 150px;
  max-width: 400px;
}
.abilities-used-table td[col-id='unbuffed-pot'],
.abilities-used-table th[col-id='unbuffed-pot'] {
  width: 40px;
  max-width: 40px;
  text-align: right;
}
.abilities-used-table td .split-aligned-value,
.abilities-used-table th .split-aligned-value {
  display: flex;
  padding-right: 10px;
}
.abilities-used-table td .split-aligned-value :first-child,
.abilities-used-table th .split-aligned-value :first-child {
  flex-grow: 1;
}
.abilities-used-table td .split-aligned-value :last-child,
.abilities-used-table th .split-aligned-value :last-child {
  display: inline-block;
  width: 0;
  flex-basis: 0;
}
.abilities-used-table td .extra-indicator,
.abilities-used-table th .extra-indicator {
  width: 0;
  display: inline-block;
}
.abilities-used-table td[col-id='expected-damage'],
.abilities-used-table th[col-id='expected-damage'] {
  width: 100px;
  max-width: 100px;
  text-align: right;
  padding-right: 10px;
}
.abilities-used-table td[col-id='buffs'],
.abilities-used-table th[col-id='buffs'] {
  width: 400px;
  max-width: 400px;
}
sheet-info-modal .modal-content-area table {
  max-width: 600px;
  width: 100%;
}
sheet-info-modal .modal-content-area table td {
  width: 50%;
}
sheet-info-modal .modal-content-area table td[col-id='key'] {
  text-align: right;
  padding-right: 10px;
}
account-modal .modal-content-area {
  max-width: 350px;
  min-width: 220px;
  width: calc(100vw - 50px);
}
account-modal .modal-content-area button {
  margin: 3px;
}
account-modal .modal-content-area form input:not([type="checkbox"]) {
  display: block;
  margin-bottom: 5px;
  width: 100%;
  box-sizing: border-box;
}
account-modal .modal-content-area form input:not([type="checkbox"])::placeholder {
  color: var(--fg-color);
  opacity: 0.8;
}
account-modal .modal-content-area h3.divider {
  width: 100%;
  text-align: center;
  position: relative;
}
account-modal .modal-content-area .failed {
  color: var(--issue-error-color);
}
account-modal .modal-content-area input.failed {
  color: var(--fg-color);
  box-shadow: 1px 1px 2px red inset, -1px -1px 2px #ff6000 inset;
}
account-modal .modal-content-area .labeled-checkbox {
  display: block;
}
account-modal .modal-content-area .labeled-checkbox input {
  width: unset;
  display: inline;
}
account-modal loading-blocker .loading-spinner {
  position: relative;
  top: calc(50% - 50px);
}
/*# sourceMappingURL=style.css.map */