.fid {
    box-sizing: border-box;
    position: relative;
    color: black;
    width: 840px;
    max-width: 840px;
    word-break: keep-all;
}

.fid * {
    box-sizing: border-box;
}

.fid > div {
    background: #f0f0f0;
    background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/bg-sheet.png');
    background-position-y: -70px;
    background-repeat: repeat-y;
    padding: 5px;
}

.fid > div > div {
    margin: 10px;
}

.fid .box-item {
    background: #fff;
    margin: 0 0 10px 0;
}
.fid small {
    text-align: inherit;
}

.fid textarea {
    height: 40px;
    resize: vertical;
    border: none;
    border-bottom: 1px solid black;
    border-radius: 0;
    margin: 0 10px;
    margin-bottom: 5px;
    width: calc(100% - 20px);
}

.fid textarea::placeholder {
    color:#b3b3b3;
}

.fid input {
    color:black;
}

.fid input[type=number] {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    font: inherit;
    background: inherit;
    padding: 0;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid black;
    text-align: center;
}
.fid input[type=number]::-webkit-outer-spin-button,
.fid input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.fid input[type=text] {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    font: inherit;
    background: inherit;
    padding: 0;
    padding-left: 5px;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid black;
    width: 100%;
    display: inline-block;
}

.fid input[type="checkbox"] {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    width: 15px;
    height: 15px;
    padding: 0;
    border-radius: 0;
    border: 1px solid black;
    position: relative;
}

.fid input[type="checkbox"]:hover {
    background: rgba(0,0,0,.1);
}

.fid input[type="checkbox"]::after {
    content: '';
    display: block;
    position: absolute;
    left: 1px;
    color: black;
    line-height: 1;
}

.fid input[type="checkbox"]:checked::after {
    content: "✔";
}

.fid input[type=text]::placeholder {
    color:#b3b3b3;
}

.fid label {
    margin: 0;
    padding: 0;
    cursor: pointer;
    width: auto;
    display: inline-block;
    font-size: inherit;
    line-height: normal;
    vertical-align: middle;
}

.fid select {
    width: 140px;
    margin: 0;
    border-radius: 0;
    border: 1px solid;
}

.fid table {
    text-align: center;
}

.fid table input::placeholder {
    text-align: center;
}

.fid button {
    border: none;
    text-shadow: none;
    box-shadow: none;
}

.fid ul {
    margin-bottom: 0;
}

/* -----------------------------------------------
    button init
 ------------------------------------------------ */
.ui-dialog .charsheet .fid button[type=roll],
.ui-dialog .charsheet .fid button[type=compendium] {
    font-size: inherit;
}

.ui-dialog .charsheet .fid button[type=roll]:not(.btn-normal) {
    width: 23px;
    height: 20px;
    background:url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/ico-roll.png');
}
.ui-dialog .charsheet .fid button[type=roll]:not(.btn-normal):hover {
    background:url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/ico-roll-hover.png');
}

.character .tab-content .tab-shaman .shaman-scroll button.btn-text,
.character .skill #class-G-skill button.btn-text {
    background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/ico-roll-alt.png');
}
.character .tab-content .tab-shaman .shaman-scroll button.btn-text:hover,
.character .skill #class-G-skill button.btn-text:hover {
    background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/ico-roll-alt-hover.png');
}

.character .item-name:has(.roll-check:not(:checked)) ~ button.btn-dice,
.character .item-name:has(.roll-check:checked) ~ button.btn-text {
    display: block;
}
.character .item-name:has(.roll-check:not(:checked)) ~ button.btn-text,
.character .item-name:has(.roll-check:checked) ~ button.btn-dice {
    display: none;
}

.ui-dialog .charsheet .fid button[type=roll]::before,
.ui-dialog .charsheet .fid .own-stat button.btn-resist[type=roll]::before,
.ui-dialog .charsheet .fid button.btn-normal[type=roll]::before {
    content: "";
}
.ui-dialog .charsheet .fid button.btn-normal[type=roll] {
    padding: 2px 15px;
    font-weight: 700;
}

.ui-dialog .charsheet .fid button.btn-resist[type=roll] {
    width: 100%;
    margin: 0;
    text-align: center;
    border-radius: 0;
    background: #333;
    color: #fff;
    font-weight: bolder;
    padding: 5px 0;
    font-size: 14px;
}

.ui-dialog .charsheet .fid button.btn-resist[type=roll]:hover {
    color: #000;
    background: #ff8d00;
}


.ui-dialog .charsheet .fid .repcontainer.editmode .repitem .itemcontrol {
    position: absolute;
    z-index: 1;
}

.ui-dialog .charsheet .repcontrol_edit,
.ui-dialog .charsheet .repcontrol_add {
    background: #b3b3b3;
    color: #333;
    border-radius: 0;
    font-size: 10px;
}
.ui-dialog .charsheet .repcontrol_edit:hover,
.ui-dialog .charsheet .repcontrol_add:hover {
    background: #fff;
}

/* -----------------------------------------------
    FID class style
 ------------------------------------------------ */
.fid button.tool-tip {
    cursor: pointer;
    border-radius: 30px;
    border: none;
    background: #f0f0f0;
    color: black;
    font-weight: 900;
    padding: 0;
    width: 18px;
    height: 18px;
    line-height: normal;
}

.fid button.tool-tip:hover {
    background: #b3b3b3;
}

.fid .disable {
    pointer-events:none;
}

.fid input.non-input {
    border:none;
}

.fid .dn {
    display: none;
}

.fid .unique {
    background-color: #dcdcdc;
}

.fid .left,
.fid .right {
    display: inline-block;
    width: 49%;
    vertical-align: top;
}
.fid .left {
    float:left;
}
.fid .right {
    float: right;
}
.fid *:has(.left)::after,
.fid *:has(.right)::after {
    content: "";
    display: block;
    clear: both;
}

.fid .checkgroup {
    display: inline-block;
}

.fid .field-title-box {
    background: #333;
    padding: 7px;
    text-align: left;
    margin-bottom: 10px;
}

.fid .field-title-box.inline {
    display: inline-block;
    min-width: 50px;
    height: 35px;
    margin-bottom: 0;
    margin-right: -5px;
    line-height: 1.7;
    text-align: center;
}

.fid .item-title.field-title-box {
    margin: 0;
}

.fid .field-title {
    color: #ff8d00;
    text-align: left;
    font-weight: bolder;
}

.fid .field-input-box {
    display: inline-block;
}

.fid .char-name .field-input-box,
.fid .char-desc .field-input-box {
    width: 340px;
}
.fid .camefrom .field-input-box {
    width: 240px;
}
.fid .priest-info .field-input-box,
.fid .shaman-info .field-input-box {
    width: 740px;
}
.fid .priest-info .laws-row .field-input-box {
    width: 690px;
}
.fid .party .info .party-purpose .field-input-box,
.fid .party .info .party-rival .field-input-box {
    width: 620px;
}

.fid .font-white {
    color: white;
}

.fid .btn-orange {
    background: #ff8d00;
}
.fid .btn-orange:hover {
    background: #ff5e00;
    color: #fff9f9;
}
.fid .btn-gray {
    background: #f0f0f0;
}
.fid .btn-gray:hover {
    background: #b3b3b3;
}
.fid .btn-normal {
    border-radius: 0;
}

/* -----------------------------------------------
    SELECTOR
 ------------------------------------------------ */
.fid > .selector {
   padding-top: 20px; 
}

.fid > .selector .logo,
.fid > .selector .contents,
.fid > .selector .choose {
    width: 650px;
    margin: 0 auto;
    text-align: center;
}
.fid > .selector .logo img {
    width: 70px;
    height: auto;
}
.fid > .selector .logo h3 {
    color: transparent;
    background: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/title-eng.png') center center no-repeat;
}

.fid > .selector .contents {
    background: #fff;
    margin: 20px auto;
    padding: 20px;
}
.fid > .selector .contents h1 {
    margin-bottom: 10px;
    font-size: 42px;
    line-height: inherit;
    color: transparent;
    background: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/title-kor.png') center center no-repeat;
}
.fid > .selector .contents p {
    margin-top: 20px;
    margin-bottom: 0;
}
.fid > .selector .choose button {
    color: #fff;
    background: #333;
    padding: 10px 20px;
    width: 150px;
    margin-bottom: 30px;
}
.fid > .selector .choose button:first-child {
    margin-right: 10px;
}
.fid > .selector .choose button:hover {
    background-color: #ff8d00;
}
.fid > .selector .copyright {
    background: #b3b3b3;
    font-size: 10px;
    color: #444;
    text-align: center;
    padding: 10px;
}

/* -----------------------------------------------
    item-row
 ------------------------------------------------ */
.fid .item-title {
    font-weight: bolder;
    font-size:15px
}

.fid .item-row {
    position: relative;
    width: 100%;
    padding: 6px;
    background: #fff;
}

.fid .item-row:nth-child(even) {
    background: #f5f5f5;
}

.fid .repcontainer .repitem:nth-child(odd) .item-row {
    background: #fff;
}

.fid .repcontainer .repitem:nth-child(even) .item-row {
    background: #f5f5f5;
}


.fid .item-row > div,
.fid .item-row .item-check,
.fid .item-row .item-count {
    display: inline-block;
    vertical-align: middle;
}

.fid .skill .item-row .item-count {
    position: initial;
}

.fid .item-row .item-name {
    position: relative;
    width: 120px;
    vertical-align: top;
}
.fid .item-row .item-name .item-check input {
    border: 0;
    background: #dcdcdc;
    vertical-align: top;
}
.fid .item-row .item-name .item-check input::after {
    left: 2px;
    top: 1px;
}

.fid .item-row .item-name span {
    font-weight: bolder;
    vertical-align: top;
}

.fid .item-row:nth-child(even) {
    background: #f5f5f5;
}
.fid .item-row .item-desc {
    display: inline-block;
    width: 610px;
}
.fid .item-row .togglebox,
.scroll-content {
    padding-top: 5px;
}
.fid .item-row .togglebox p {
    font-size: 11px;
    color: #333;
    padding: 5px 0;
    margin: 0;
}
.fid .item-row .togglebox textarea {
    width: 100%;
    margin: 0;
}
.fid .item-row .togglebox .checkgroup {
    padding-bottom: 5px;
    font-size: 12px;
}
.fid .item-row .togglebox .checkgroup input {
    margin-right: 2px;
}
.fid .item-row .togglebox .checkgroup label {
    margin-right: 5px;
}
.fid .item-row .togglebox .checkgroup input:checked {
    background: #ff8d00;
}
.fid .items .item-row:nth-child(even) .togglebox textarea {
    background: #fff;
}

.fid .class-item,
.fid .equip-item,
.fid .common-skill {
    margin-bottom: 20px;
}

.fid .class-item .item-title input[name$="name"] {
    width: 100px;
    color: #ff8d00;
}
.fid .items .item-title button.tool-tip {
    float:right;
    margin-top: 2px;
}

.fid .class-item .item-row .item-name,
.fid .own-item .item-row .item-name,
.fid .equip-item .item-row .item-name {
    width: 100%;
}
.fid .class-item .item-row .item-name .item-check,
.fid .own-item .item-row .item-name .item-check,
.fid .equip-item .item-row .item-name .item-check {
    width: 60px;
}
.fid .item-row .item-count {
    position: absolute;
    left: 180px;
}


/* -----------------------------------------------
    HEADER
 ------------------------------------------------ */
.fid .header {
    position: relative;
    background: #fff;
}
.fid .header .class-header,
.fid .header .class-name,
.fid .header .class-desc {
    display: inline-block;
    padding: 0;
    margin: 0;
    background-color: transparent;
}

.fid .header .class-header {
    background: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/bg-sheet-title.png');
    padding: 10px;
    width: 620px;
    height: 65px;
    margin: 0;
}

.fid .header .class-name {
    position: relative;
}

.fid .header .class-name input {
    background-position: 5px 5px;
    background-repeat: no-repeat;
}

.fid .header .class-name select {
    position: absolute;
    left: 0;
    opacity: 0;
    z-index: 1;
    margin: 0;
    padding: 0;
    border: none;
    height: 100%;
}

.fid input#currentClass[value=""] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char0.png')}
.fid input#currentClass[value="a"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char1.png')}
.fid input#currentClass[value="b"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char2.png')}
.fid input#currentClass[value="c"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char3.png')}
.fid input#currentClass[value="d"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char4.png')}
.fid input#currentClass[value="e"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char5.png')}
.fid input#currentClass[value="f"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char6.png')}
.fid input#currentClass[value="g"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char7.png')}
.fid input#currentClass[value="h"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char8.png')}
.fid input#currentClass[value="i"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char9.png')}
.fid input#currentClass[value="j"] ~ .character .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-char10.png')}

.fid input#currentParty[value=""] ~ .party .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-pary0.png');}
.fid input#currentParty[value="a"] ~ .party .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-pary1.png');}
.fid input#currentParty[value="b"] ~ .party .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-pary2.png');}
.fid input#currentParty[value="c"] ~ .party .header .class-name input {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-pary3.png');}

.fid .header .class-desc {
    width: 420px;
    vertical-align: bottom;
}
.fid .header .class-desc input {
    font-style: italic;
}

.fid .header .class-name h1 {
    display: inline-block;
    width: 150px;
    line-height: inherit;
}

.fid .header .class-name h1 input {
    color: transparent;
}

.fid .header .header-buttons {
    position: absolute;
    text-align: right;
    top: 5px;
    right: 10px;
}
.fid .header .header-buttons button[name$="allReset"] {
    margin: 0 5px 5px 0;
    font-size: 11px;
}

/* -----------------------------------------------
    character profile
 ------------------------------------------------ */
.character .profile::after {
    content: "";
    display: block;
    clear: both;
}
.character .profile .class-stat .field-title-box {
    height: 40px;
    vertical-align: middle;
}
.character .profile .class-stat .field-title {
    vertical-align: middle;
    line-height: normal;
}
.character .profile .class-stat .class-box {
    display: inline-block;
    width: 140px;
    padding-left: 5px;
}
.character .profile .class-stat .class-box .checkgroup input[type="text"] {
    width: 50px;
    padding: 0;
    text-align: center;
}
.character .profile .class-stat .class-box .checkgroup button {
    padding: 2px 5px;
}
.character .profile .class-stat .class-box .checkgroup button:hover input[type="text"] {
    color: #fff9f9;
}
.character .profile .class-stat .class-box .checkgroup input[type="text"]::placeholder {
    color: black;
}
.character .profile .class-stat .class-box-1 {
    display: inline-block;
    vertical-align: middle;
}

.character .profile .class-stat .class-box-2 {
    width: 140px;
    vertical-align: middle;
}
.character .profile .class-stat .class-box-2 input[type="number"] {
    width: 30px;
    margin-right: 10px;
}

.character .profile .class-stat .class-box-3 {
    vertical-align: middle;
}
.character .profile .class-stat .class-box-4 {
    width: 80px;
    vertical-align: middle;
}

.character .profile .stat-box .stat-row {
    padding: 12px 7px;
}
.character .profile .stat-box .stat-row:nth-child(2) {
    padding: 0px 7px;
}

.character .logo {
    padding: 15px 10px;
}
.character .logo .img,
.character .logo .desc {
    display: inline-block;
    vertical-align: middle;
}
.character .logo .img {
    width: 140px;
}
.character .logo .desc {
    text-align: center;
    width: 230px;
}
.character .logo .desc h2 {
    font-size: 28px;
    margin-bottom: 10px;
    color: transparent;
    background: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/title-kor.png') center center / 80% no-repeat;
}
.character .logo .desc h4 {
    color: transparent;
    background: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/title-eng.png') center center no-repeat;
}
.character .logo .desc small {
    margin-bottom: 10px;
}
.character .logo .desc button.btn-normal {
    width: 150px;
}

.character .camefrom select {
    width: 100px;
}

.fid .own-stat {
    width: 397px;
}

.fid .own-stat > div {
    display: inline-block;
    width: 129px;
}
.fid .own-stat .own-stat-2 {
    margin-right: 1px;
}

/* -----------------------------------------------
    middle TABS
 ------------------------------------------------ */
.character > .tabs,
.party > .tabs {
    text-align: center;
    margin: 10px;
    padding: 10px;
    background-color: #333;
    background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/bg-tabs.png');
    background-repeat: no-repeat;
    background-position-x: 150px;
    position: relative;
}
.character > .tabs button[type="action"],
.party > .tabs button[type="action"] {
    background: none;
    color: transparent;
    font-size: 17px;
    vertical-align: middle;
    padding: 0 25px;
    background-position: center center;
    background-repeat: no-repeat;
}
.character > .tabs .tool-tip {
    display: none;
    position: absolute;
    top: 10px;
    right: 10px;
}
.character #nowTab2[value="status"] ~ .tabs {
    background-position-x: 60px;
}
.character #nowTab2[value="clock"] ~ .tabs,
.party #nowTab3[value="party-clock"] ~ .tabs {
    background-position-x: 150px;
}
.character #nowTab2[value="skill"] ~ .tabs {
    background-position-x: 260px;
}
.party #nowTab3[value="party-native"] ~ .tabs {
    background-position-x: 30px;
}
.party #nowTab3[value="party-common"] ~ .tabs {
    background-position-x: 320px;
}

.character #nowTab2[value="status"] ~ .tabs button[name$="status"],
.character #nowTab2[value="clock"] ~ .tabs button[name$="clock"],
.character #nowTab2[value="skill"] ~ .tabs button[name$="skill"],
.party #nowTab3[value="party-native"] ~ .tabs button[name$="native"],
.party #nowTab3[value="party-clock"] ~ .tabs button[name$="clock"],
.party #nowTab3[value="party-common"] ~ .tabs button[name$="common"] {
    font-size: 19px;
}

.character > .tabs button[name$="status"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-char1.png');}
.character > .tabs button[name$="clock"],
.party > .tabs button[name$="clock"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-clock.png');}
.character > .tabs button[name$="skill"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-char2.png');}
.party > .tabs button[name$="native"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-party1.png');}
.party > .tabs button[name$="common"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-party2.png');}

.character #nowTab2[value="status"] ~ .tabs button[name$="status"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-char1-on.png');}
.character #nowTab2[value="clock"] ~ .tabs button[name$="clock"],
.party #nowTab3[value="party-clock"] ~ .tabs button[name$="clock"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-clock-on.png');}
.character #nowTab2[value="skill"] ~ .tabs button[name$="skill"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-char2-on.png');}
.party #nowTab3[value="party-native"] ~ .tabs button[name$="native"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-party1-on.png');}
.party #nowTab3[value="party-common"] ~ .tabs button[name$="common"] {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/text-tab-party2-on.png');}

.character .status,
.character .clock,
.character .skill,
.party .party-native,
.party .party-clock,
.party .party-common {
    background: #dcdcdc;
    margin-top: -10px;
    padding: 10px;
}

.character .status .char-xp .field-title-box,
.party .party-xp .field-title-box {
    padding: 0;
    float: left;
}
.character .status .char-xp .field-title-box button,
.party .party-xp .field-title-box button {
    width: 80px;
    height: 35px;
    background: transparent;
}
.party .party-xp .field-title-box button {
    padding-right: 11px;
}
.character .status .char-xp .field-title-box button:hover,
.party .party-xp .field-title-box button:hover {
    background: #ff8d00;
    color: black
}
.character .status .char-xp .field-title-box button::before,
.party .party-xp .field-title-box button::before {
    content:"XP";
    display: block;
    text-align: center;
}
.character .status .char-xp .field-title-box button:hover::before,
.party .party-xp .field-title-box button:hover::before {
    content:"XP 초기화";
}
.character .status .char-xp .checkgroup {
    width: 710px;
    margin-left:5px;
}

.party .party-xp .checkgroup {
    width: 737px;
    margin-left: -2px;
}

.character .status .char-xp .checkgroup input[type="radio"],
.party .party-xp .checkgroup input[type="radio"] {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    float: left;
    width: 71px;
    height: 35px;
    border: 1px solid black;
    border-left: 0;
}

.party .party-xp .checkgroup input[type="radio"] {
    width: 61.4px;
}
.character .status .char-xp .checkgroup input[type="radio"]:hover,
.party .party-xp .checkgroup input[type="radio"]:hover {
    background-color: #dcdcdc;
}
.character .status .char-xp .checkgroup input[type="radio"][value="10"]:hover {
    background-color: #b3b3b3;
}
.character .status .char-xp .checkgroup input[type="hidden"][value="1"] ~ input[type="radio"].xp-1,
.character .status .char-xp .checkgroup input[type="hidden"][value="2"] ~ input[type="radio"].xp-2,
.character .status .char-xp .checkgroup input[type="hidden"][value="3"] ~ input[type="radio"].xp-3,
.character .status .char-xp .checkgroup input[type="hidden"][value="4"] ~ input[type="radio"].xp-4,
.character .status .char-xp .checkgroup input[type="hidden"][value="5"] ~ input[type="radio"].xp-5,
.character .status .char-xp .checkgroup input[type="hidden"][value="6"] ~ input[type="radio"].xp-6,
.character .status .char-xp .checkgroup input[type="hidden"][value="7"] ~ input[type="radio"].xp-7,
.character .status .char-xp .checkgroup input[type="hidden"][value="8"] ~ input[type="radio"].xp-8,
.character .status .char-xp .checkgroup input[type="hidden"][value="9"] ~ input[type="radio"].xp-9,
.character .status .char-xp .checkgroup input[type="hidden"][value="10"] ~ input[type="radio"].xp-10,
.party .party-xp .checkgroup input[type="hidden"][value="1"] ~ input[type="radio"].xp-1,
.party .party-xp .checkgroup input[type="hidden"][value="2"] ~ input[type="radio"].xp-2,
.party .party-xp .checkgroup input[type="hidden"][value="3"] ~ input[type="radio"].xp-3,
.party .party-xp .checkgroup input[type="hidden"][value="4"] ~ input[type="radio"].xp-4,
.party .party-xp .checkgroup input[type="hidden"][value="5"] ~ input[type="radio"].xp-5,
.party .party-xp .checkgroup input[type="hidden"][value="6"] ~ input[type="radio"].xp-6,
.party .party-xp .checkgroup input[type="hidden"][value="7"] ~ input[type="radio"].xp-7,
.party .party-xp .checkgroup input[type="hidden"][value="8"] ~ input[type="radio"].xp-8,
.party .party-xp .checkgroup input[type="hidden"][value="9"] ~ input[type="radio"].xp-9,
.party .party-xp .checkgroup input[type="hidden"][value="10"] ~ input[type="radio"].xp-10,
.party .party-xp .checkgroup input[type="hidden"][value="11"] ~ input[type="radio"].xp-11,
.party .party-xp .checkgroup input[type="hidden"][value="12"] ~ input[type="radio"].xp-12 {
    background: #ff8d00;
}
.character .status .char-xp .checkgroup input[type="hidden"][value="10"] ~ input[type="radio"][value="10"] {
    background: #ff5e00;
}

.character .status .char-xp .xp-row:last-child,
.party .party-xp .xp-row:last-child {
    padding: 10px;
}
.character .status .char-xp p {
    font-weight: bolder;
}
.character .status .char-xp span,
.party .party-xp .xp-row:last-child span {
    margin-right: 10px;
    font-size: 12px;
}
.character .status .char-xp label,
.party .party-xp label {
    border: 1px solid black;
    padding: 5px 10px;
    margin-top: -10px;
    float: right;
}
.character .status .char-xp label:hover,
.party .party-xp label:hover {
    background: #f0f0f0;
}
.character .status .char-xp textarea,
.party .party-xp textarea {
    margin: 10px 0 5px;
    width: 100%;
}
.character .status .char-xp::after,
.party .party-xp::after {
    content:"";
    display: block;
    clear: both;
}

.character .status .inside input[type="text"] {
    width: 250px;
}
.character .status .inside label {
    display: inline-block;
    width: auto;
}
.character .status .inside .inside-row {
    margin-bottom: 5px;
    padding: 5px;
}
.character .status .inside .inside-row:last-child {
    margin-bottom: 10px;
}
.character .status .inside .inside-row span {
    font-weight: bolder;
    margin-right: 5px;
    padding-left: 5px;
}
.character .status .inside .inside-row input[type="text"] {
    width: 310px;
    margin-right: 5px;
}
.character .status .inside .inside-row input[type="checkbox"] {
    background: #333;
}
.character .status .inside .inside-row input[type="checkbox"]::after {
    color: #fff;
}

.character .status .inside > .inside-row:nth-child(5):has(input[type="text"]:placeholder-shown) span,
.character .status .inside > .inside-row:nth-child(6):has(input[type="text"]:placeholder-shown) span {
    color: lightgray;
}

.character .status .trauma .checkgroup {
    width: 310px;
    margin-left: 5px;
    text-align: center;
}

.character .status .trauma .checkgroup input {
    margin-right: 5px;
}
.character .status .trauma .checkgroup input:hover {
    background: #b3b3b3;
}

.character .status .trauma.field-title-box,
.character .status .damage .field-title-box,
.character .status .stress .field-title-box {
    margin: 0;
}

.character .status .trick .font-white,
.character .status .stress .font-white {
    margin-left: 10px;
}

.character .status .stress::before {
    content: "";
    display: block;
    clear: both;
}

.character .status .trick input[type="number"],
.character .status .stress input[type="number"] {
    width: 30px;
    border-bottom-color: #fff;
    margin: 0 5px;
}

.character .status .trick .field-title-box {
    vertical-align: middle;
}
.character .status .trick .checkgroup {
    margin-left: 5px;
    width: 195px;
    text-align: center;
}

.character .status .damage .field-title-box button,
.character .status .stress .field-title-box button {
    float:right;
    margin-top: -3px;
}
.character .status .stress .field-title-box button {
    margin-top: -2px;
}

.character .status .damage table tr,
.character .status .damage table td {
    border-bottom: 5px solid #dcdcdc;
}
.character .status .damage table td {
    border-right: 4px solid #dcdcdc;
    padding: 5px 7px;
}
.character .status .damage table tr:first-child td {
    padding: 11px 0;
}
.character .status .damage table td.step,
.character .status .damage table td.result {
    background: #b3b3b3;
}
.character .status .damage table tr:last-child td {
    border-bottom: 0;
}
.character .status .damage table td:last-child {
    border-right: 0;
}
.character .status .damage table td input[type="text"] {
    padding: 0;
}

.character .status .damage table .equip-checker {
    display: inline-block;
    margin: 0 10px;
}

.party .party-skill {
    margin-bottom: 10px;
}

/* -----------------------------------------------
    STRESS, TRICK
 ------------------------------------------------ */
.character .status .stress .checkgroup {
    width: 480px;
    text-align: center;
}

.character .profile .class-box-2 .checkgroup input[type="checkbox"],
.character .status .stress .checkgroup input[type="checkbox"],
.character .status .trick .checkgroup input[type="checkbox"] {
    appearance: none;
    border: none;
    width: 16px;
    height: 16px;
    margin-right: 5px;
    box-sizing: content-box;
    background: #b3b3b3;
}

.character .profile .class-box-2 .checkgroup input[type="checkbox"]::after,
.character .status .stress .checkgroup input[type="checkbox"]::after,
.character .status .trick .checkgroup input[type="checkbox"]::after {
    color: #fff;
    left: 2px;
    top: 1px;
}

.character .profile .class-box-2 input[type="hidden"][value="1"] ~ .checkgroup input.mana1,
.character .profile .class-box-2 input[type="hidden"][value="2"] ~ .checkgroup input.mana2,
.character .profile .class-box-2 input[type="hidden"][value="3"] ~ .checkgroup input.mana3,
.character .profile .class-box-2 input[type="hidden"][value="4"] ~ .checkgroup input.mana4,
.character .status .stress input[type="hidden"][value="1"] ~ .checkgroup input.stress1,
.character .status .stress input[type="hidden"][value="2"] ~ .checkgroup input.stress2,
.character .status .stress input[type="hidden"][value="3"] ~ .checkgroup input.stress3,
.character .status .stress input[type="hidden"][value="4"] ~ .checkgroup input.stress4,
.character .status .stress input[type="hidden"][value="5"] ~ .checkgroup input.stress5,
.character .status .stress input[type="hidden"][value="6"] ~ .checkgroup input.stress6,
.character .status .stress input[type="hidden"][value="7"] ~ .checkgroup input.stress7,
.character .status .stress input[type="hidden"][value="8"] ~ .checkgroup input.stress8,
.character .status .stress input[type="hidden"][value="9"] ~ .checkgroup input.stress9,
.character .status .stress input[type="hidden"][value="10"] ~ .checkgroup input.stress10,
.character .status .stress input[type="hidden"][value="11"] ~ .checkgroup input.stress11,
.character .status .stress input[type="hidden"][value="12"] ~ .checkgroup input.stress12,
.character .status .stress input[type="hidden"][value="13"] ~ .checkgroup input.stress13,
.character .status .trick .field-title-box:has(input[type="hidden"][value="1"]) ~ .checkgroup input.trick1,
.character .status .trick .field-title-box:has(input[type="hidden"][value="2"]) ~ .checkgroup input.trick2,
.character .status .trick .field-title-box:has(input[type="hidden"][value="3"]) ~ .checkgroup input.trick3,
.character .status .trick .field-title-box:has(input[type="hidden"][value="4"]) ~ .checkgroup input.trick4,
.character .status .trick .field-title-box:has(input[type="hidden"][value="5"]) ~ .checkgroup input.trick5,
.character .status .trick .field-title-box:has(input[type="hidden"][value="6"]) ~ .checkgroup input.trick6 {
    background: #ff8d00;
    border: none;
}


/* -----------------------------------------------
    character FOOTER
 ------------------------------------------------ */

.character .footer .asset .field-input-box {
    width: 740px;
    padding-right: 10px;
    text-align: right;
}
.character .footer .asset .field-input-box > div {
    display: inline-block;
    width: 200px;
}
.character .footer .asset .field-input-box > div input {
    max-width: 140px;
    text-align: right;
}


/* -----------------------------------------------
    CLOCK
 ------------------------------------------------ */
.clock .clock-instance {
    width: 390px;
    padding: 10px;
    display: inline-block;
}

.clock .clock-instance.clock-bard,
.clock .clock-instance.clock-shaman {
    width: 100%;
    background: #fff;
}
.clock .clock-bard.box-item,
.clock .clock-shaman.box-item {
    background: transparent;
}

.clock .clock-instance.clock-bard .clock-name span:last-child,
.clock .clock-instance.clock-shaman .clock-name span:last-child {
    float: right;
    font-size: 10px;
}

.clock .clock-instance textarea {
    margin: 0;
    width: 100%;
    min-height: 75px;
}

.clock .clock-instance .clock-name h3 {
    display: inline;
}

.clock .clock-set {
    width: 100px;
    display: inline-block;
    position: relative;
}

.clock .clock-set select {
    width: 70px;
}

.clock .clock-set button[type="roll"] {
    margin: 0;
}

.clock .clock-info {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 105px);
}

.clock .clock-set .clock-img {
    background-repeat: no-repeat;
    background-size: contain;
    width: 80px;
    height: 80px;
    margin: 0 auto 6px;
    position: relative;
    padding: 5px;
}

.clock .clock-set .clock-img input {
    opacity: 0;
    position: absolute;
}

/*4*/
.clock .clock-set input[name*="type"][value="4"] ~ .clock-img input {width: 35px;height: 35px;}
.clock .clock-set input[name*="type"][value="4"] ~ .clock-img input[value="1"] {left: 40px;}
.clock .clock-set input[name*="type"][value="4"] ~ .clock-img input[value="2"] {left: 40px;top: 40px;}
.clock .clock-set input[name*="type"][value="4"] ~ .clock-img input[value="3"] {top: 40px;}

/*6*/
.clock .clock-set input[name*="type"][value="6"] ~ .clock-img input {width: 25px;height: 25px;}
.clock .clock-set input[name*="type"][value="6"] ~ .clock-img input[value="1"] {left: 40px;}
.clock .clock-set input[name*="type"][value="6"] ~ .clock-img input[value="2"] {left: 54px;top: 27px;}
.clock .clock-set input[name*="type"][value="6"] ~ .clock-img input[value="3"] {left: 40px;top: 50px;}
.clock .clock-set input[name*="type"][value="6"] ~ .clock-img input[value="4"] {left: 15px;top: 50px;}
.clock .clock-set input[name*="type"][value="6"] ~ .clock-img input[value="5"] {top: 27px;left: 2px;}
.clock .clock-set input[name*="type"][value="6"] ~ .clock-img input[value="6"] {left: 15px;}

/*8*/
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input {width: 21px;height: 21px;}
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[value="1"] {left: 40px;top: 4px;}
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[value="2"] {left: 55px;top: 19px;}
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[value="3"] {left: 55px;top: 40px;}
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[value="4"] {left: 40px;top: 55px;}
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[value="5"] {left: 19px;top: 55px;}
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[value="6"] {left: 4px;top: 40px;}
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[value="7"] {left: 4px;top: 19px;}
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[value="8"] {left: 19px;top: 4px;}

/*10*/
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input {width: 19px;height: 19px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="1"] {left: 39px;top: 3px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="2"] {left: 54px;top: 13px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="3"] {left: 60px;top: 30px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="4"] {left: 54px;top: 48px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="5"] {left: 39px;top: 58px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="6"] {top: 58px;left: 22px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="7"] {top: 48px;left: 7px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="8"] {top: 30px;left: 1px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="9"] {top: 13px;left: 7px;}
.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input[value="10"] {left: 22px;top: 3px;}

/*12*/
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input {width: 18px;height: 18px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="1"] {left: 39px;top: 2px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="2"] {left: 53px;top: 9px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="3"] {left: 61px;top: 23px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="4"] {left: 61px;top: 39px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="5"] {left: 53px;top: 53px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="6"] {left: 39px;top: 61px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="7"] {top: 61px;left: 23px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="8"] {top: 53px;left: 9px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="9"] {top: 39px;left: 1px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="10"] {top: 23px;left: 1px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="11"] {top: 9px;left: 9px;}
.clock .clock-set input[name*="type"][value="12"] ~ .clock-img input[value="12"] {top: 2px;left: 23px;}

/* 4 */
.clock .clock-set input[name*="type"][value="4"] ~ input[name*="step"][value="0"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/4-0.png');}
.clock .clock-set input[name*="type"][value="4"] ~ input[name*="step"][value="1"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/4-1.png');}
.clock .clock-set input[name*="type"][value="4"] ~ input[name*="step"][value="2"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/4-2.png');}
.clock .clock-set input[name*="type"][value="4"] ~ input[name*="step"][value="3"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/4-3.png');}
.clock .clock-set input[name*="type"][value="4"] ~ input[name*="step"][value="4"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/4-4.png');}

/* 6 */
.clock .clock-set input[name*="type"][value="6"] ~ input[name*="step"][value="0"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/6-0.png');}
.clock .clock-set input[name*="type"][value="6"] ~ input[name*="step"][value="1"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/6-1.png');}
.clock .clock-set input[name*="type"][value="6"] ~ input[name*="step"][value="2"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/6-2.png');}
.clock .clock-set input[name*="type"][value="6"] ~ input[name*="step"][value="3"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/6-3.png');}
.clock .clock-set input[name*="type"][value="6"] ~ input[name*="step"][value="4"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/6-4.png');}
.clock .clock-set input[name*="type"][value="6"] ~ input[name*="step"][value="5"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/6-5.png');}
.clock .clock-set input[name*="type"][value="6"] ~ input[name*="step"][value="6"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/6-6.png');}

/* 8 */
.clock .clock-set input[name*="type"][value="8"] ~ input[name*="step"][value="0"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/8-0.png');}
.clock .clock-set input[name*="type"][value="8"] ~ input[name*="step"][value="1"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/8-1.png');}
.clock .clock-set input[name*="type"][value="8"] ~ input[name*="step"][value="2"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/8-2.png');}
.clock .clock-set input[name*="type"][value="8"] ~ input[name*="step"][value="3"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/8-3.png');}
.clock .clock-set input[name*="type"][value="8"] ~ input[name*="step"][value="4"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/8-4.png');}
.clock .clock-set input[name*="type"][value="8"] ~ input[name*="step"][value="5"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/8-5.png');}
.clock .clock-set input[name*="type"][value="8"] ~ input[name*="step"][value="6"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/8-6.png');}
.clock .clock-set input[name*="type"][value="8"] ~ input[name*="step"][value="7"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/8-7.png');}
.clock .clock-set input[name*="type"][value="8"] ~ input[name*="step"][value="8"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/8-8.png');}

/* 10 */
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="0"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-0.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="1"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-1.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="2"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-2.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="3"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-3.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="4"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-4.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="5"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-5.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="6"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-6.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="7"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-7.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="8"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-8.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="9"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-9.png');}
.clock .clock-set input[name*="type"][value="10"] ~ input[name*="step"][value="10"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/10-10.png');}

/* 12 */
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="0"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-0.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="1"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-1.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="2"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-2.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="3"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-3.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="4"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-4.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="5"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-5.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="6"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-6.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="7"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-7.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="8"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-8.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="9"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-9.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="10"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-10.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="11"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-11.png');}
.clock .clock-set input[name*="type"][value="12"] ~ input[name*="step"][value="12"] ~ .clock-img {background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/clock/12-12.png');}

.clock .clock-set .clock-img ~ input[value="0"] {
    background: #b3b3b3;
    color: #fff;
    border: none;
    appearance: none;
    position: absolute;
    top: 65px;
    padding: 2px;
    width: 16px;
    height: 16px;
    font-size: 10px;
    border-radius: 20px;
    text-align: center;
}

.clock .clock-set .clock-img ~ input[value="0"]::after {
    display: inline-block;
    content: "X";
    cursor: pointer;
}

.clock .clock-set input[name*="type"] ~ input[name*="step"][value="0"] ~ input[type="radio"][value="0"] {
    display: none;
}

.clock .clock-set input[name*="type"] ~ input[name*="step"]:not([value="0"]) ~ input[type="radio"][value="0"] {
    display: block;
}

.clock .clock-set .clock-img .clock-6 {
    display: none;
}

.clock .clock-set input[name*="type"][value="6"] ~ .clock-img input[class$="clock-6"] {
    display: inline;
}

.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[class$="clock-6"],
.clock .clock-set input[name*="type"][value="8"] ~ .clock-img input[class$="clock-8"] {
    display: inline;
}

.clock .clock-set input[name*="type"][value="10"] ~ .clock-img input:not([class$="clock-12"]) {
    display: inline;
}

.clock .clock-set input[name*="type"][value="12"] ~ .clock-img * {
    display: inline;
}

.party .party-reputation-clock button[type="roll"] {
    float: right;
    margin: 0;
}

/* -----------------------------------------------
    TOGGLE and TOGGLEBOX
 ------------------------------------------------ */
input[type=checkbox].toggle {
    position: relative;
}

input[type=checkbox].toggle::after {
    content: "▾";
    font-size: 20px;
    display: block;
    position: absolute;
    left: 0;
    top: -1px;
    font-weight: bolder;
}

input[type=checkbox].toggle ~ .togglebox {
    display: none;
}
input[type=checkbox]:checked.toggle::after {
    content: "▴";
}

input[type=checkbox]:checked.toggle ~ .togglebox {
    display: block;
}

/* -----------------------------------------------
    item-tag
 ------------------------------------------------ */
.item-row .item-tag,
.item-row input.toggle,
.item-row button[type="roll"] {
    position: absolute;
    right: 0;
}

.item-row button[type="roll"] {
    top: 5px;
}

.item-row input.toggle {
    top: 6px;
    right: 30px;
    border: none;
    width: 18px;
    height: 18px;
    background: transparent;
}

.item-row .item-tag {
    top: 6px;
    border-radius: 30px;
    width: 18px;
    height: 18px;
    background: #333;
    right: 53px;
    font-size: 14px;
    text-align: center;
    line-height: 1.3;
}
.togglebox:has(input.input-tag:placeholder-shown) ~ .item-tag {
    color: #fff;
}
.togglebox:has(input.input-tag:not(:placeholder-shown)) ~ .item-tag {
    color: #ff8d00;
}

/* -----------------------------------------------
    tag - TUNE
 ------------------------------------------------ */
.fid .items .item-row .input-tag {
    width: 320px;
    background: #f5f5f5;
    padding: 5px;
}

.fid .items .item-row:not(:has(.item-tune)) .input-tag {
    width: 100%;
}

.fid .items .item-row:nth-child(even) .input-tag {
    background: #fff;
}

.fid .items .item-row .item-tune {
    display: inline-block;
}
.fid .items .item-row .item-tune .tunechecker::after {
    content: "조율";
    display: inline-block;
    cursor: pointer;
    margin-left: 15px;
    line-height: 1.2;
}
.fid .items .item-row .item-tune .tunechecker:hover::after {
    color: #ff3300;
}
.fid .items .item-row .item-tune .tunechecker:checked {
    background: #ff8d00;
}

.fid .items .item-row:has(.tunechecker:checked) .item-name span,
.fid .items .item-row:has(.tunechecker:checked) .item-name span input {
    color: #ff8d00;
}
.fid .items .item-row:has(.tunechecker:checked + .tunechecker:checked) .item-name span,
.fid .items .item-row:has(.tunechecker:checked + .tunechecker:checked) .item-name span input {
    color: #ff3300;
}

/* -----------------------------------------------
    SELECTOR toggle
 ------------------------------------------------ */
.character, .party {display: none;}
input#nowTab1[value="character"] ~ .character,
input#nowTab1[value="party"] ~ .party {display: block;}
input#nowTab1[value="character"] ~ .selector,
input#nowTab1[value="party"] ~ .selector {display: none;}


/* -----------------------------------------------
    TABS toggle
 ------------------------------------------------ */
.character .status,
.character .clock,
.character .skill {display: none;}
input#nowTab2[value="status"] ~ .status,
input#nowTab2[value="clock"] ~ .clock,
input#nowTab2[value="skill"] ~ .skill {display: block;}

/* -----------------------------------------------
    top TABS toggle
 ------------------------------------------------ */
.character .top-tabs .tab-priest,
.character .top-tabs .tab-shaman,
.character .top-tabs .tab-common {
    display: inline-block;
    line-height: normal;
}

.character .top-tabs .tab-priest label,
.character .top-tabs .tab-shaman label,
.character .top-tabs .tab-common label {
    padding: 5px 10px;
}

.character .top-tabs .tab-priest label:hover,
.character .top-tabs .tab-shaman label:hover,
.character .top-tabs .tab-common label:hover {
    background: #ff5e00;
    color: #fff9f9;
}

.character .top-tabs .tab-priest,
.character .top-tabs .tab-shaman {
    display: none;
}

.character .tab-content {
    display: none;
    position: absolute;
    right: 0;
    top: 90px;
    z-index: 1;
    margin: 0;
    padding: 0 10px 10px;
    background-color: #f0f0f0;
    box-shadow: 0 0 15px 0 rgb(0 0 0 / 50%);
}

.character .tab-content .tab-priest,
.character .tab-content .tab-shaman,
.character .tab-content .tab-common {
    padding-top: 10px;
}

.character .header:has(.top-tabs input[name$="tab"]:checked) ~ .tab-content {
    display: block;
    width: 100%;
}

.character .header:has(.top-tabs input[name="attr_only-priest-tab"]:checked) ~ .tab-content .tab-priest,
.character .header:has(.top-tabs input[name="attr_only-shaman-tab"]:checked) ~ .tab-content .tab-shaman,
.character .header:has(.top-tabs input[name="attr_common-tab"]:checked) ~ .tab-content .tab-common {
    display: block;
}

/* -----------------------------------------------
    top TABS
 ------------------------------------------------ */
.character .tab-content .priest-info .god-name,
.character .tab-content .shaman-info .shaman-info-row:first-child {
    background-color: #333;
}

.character .tab-content .priest-info .god-name .field-input-box input,
.character .tab-content .shaman-info .shaman-info-row:first-child .field-input-box input {
    text-align: center;
    border-bottom-color: #ff8d00;
    color: #ff8d00;
    font-size: 17px;
}
.character .tab-content .priest-info .god-name .field-input-box input::placeholder,
.character .tab-content .shaman-info .shaman-info-row:first-child .field-input-box input::placeholder {
    text-align: center;
    color: #b3b3b3;
}
.character .tab-content .priest-info .god-category,
.character .tab-content .priest-info .god-category .content .field-title-box,
.character .tab-content .priest-info .god-category .content textarea {
    text-align: center;
}
.character .tab-content .priest-info .god-category .content {
    display: inline-block;
    width: 230px;
}
.character .tab-content .shaman-info .checkgroup {
    margin: 0 5px 0 10px;
}
.character .tab-content .shaman-info-row.left .checkgroup {
    width: 220px;
    text-align: center;
    margin-right: 0;
}
.character .tab-content .shaman-info .pollution-types {
    display: inline-block;
    font-size: 12px;
}
.character .tab-content .shaman-info .pollution-types label {
    margin-right: 2px;
}
.character .tab-content .shaman-info .pollution-types input[id$="1"]:checked ~ label[for$="1"],
.character .tab-content .shaman-info .pollution-types input[id$="2"]:checked ~ label[for$="2"],
.character .tab-content .shaman-info .pollution-types input[id$="3"]:checked ~ label[for$="3"],
.character .tab-content .shaman-info .pollution-types input[id$="4"]:checked ~ label[for$="4"],
.character .tab-content .shaman-info .pollution-types input[id$="5"]:checked ~ label[for$="5"],
.character .tab-content .shaman-info .pollution-types input[id$="6"]:checked ~ label[for$="6"],
.character .tab-content .shaman-info .pollution-types input[id$="7"]:checked ~ label[for$="7"] {
    background: #333;
    color: #fff;
}

.fid .item-row.common .togglebox,
.fid .item-row.upgrade .togglebox,
.fid .item-row.skill .togglebox {
    padding-left: 125px;
    max-width: 750px;
}
.fid .item-row.shaman .togglebox {
    padding-left: 155px;
    max-width: 730px;
}

/* -----------------------------------------------
    item-row EACH (common...)
 ------------------------------------------------ */
.fid .item-row.common .item-name span,
.fid .item-row.shaman .item-name span,
.fid .item-row.priest .item-name span,
.fid .item-row.upgrade .item-name span,
.fid .item-row.skill .item-name span {
    max-width: 100px;
    display: inline-block;
}

.fid .item-row .item-name .roll-check {
    position: absolute;
    left: 125px;
}

.fid .item-row .item-name:has(.roll-check) ~ .item-desc {
    padding-left: 30px;
}


/* -----------------------------------------------
 ------------------------------------------------ */

.character .class-stat .class-box-2,
.character .class-stat .class-box-3,
.character .class-stat .class-box-4,
.character .skill #class-A-skill,
.character .skill #class-B-skill,
.character .skill #class-C-skill,
.character .skill #class-D-skill,
.character .skill #class-E-skill,
.character .skill #class-F-skill,
.character .skill #class-G-skill,
.character .skill #class-H-skill,
.character .skill #class-I-skill,
.character .skill #class-J-skill,
.character .items #class-A-item,
.character .items #class-B-item,
.character .items #class-C-item,
.character .items #class-D-item,
.character .items #class-E-item,
.character .items #class-F-item,
.character .items #class-G-item,
.character .items #class-H-item,
.character .items #class-I-item,
.character .items #class-J-item,
.character .clock .clock-bard,
.character .clock .clock-shaman {
    display: none;
}

.character .equip-item #special-item-B-1,
.character .equip-item #special-item-B-2,
.character .equip-item .only-sniper {
    display: inline-block;
}

/* 전사 */
input#currentClass[value="a"] ~ .character .skill #class-A-skill,
input#currentClass[value="a"] ~ .character .items #class-A-item {
    display: block;
}
input#currentClass[value="a"] ~ .character .equip-item #special-item-B-2 {
    display: none;
}

/* 야만전사 */
input#currentClass[value="b"] ~ .character .skill #class-B-skill,
input#currentClass[value="b"] ~ .character .items #class-B-item {
    display: block;
}

/* 도적 */
input#currentClass[value="c"] ~ .character .skill #class-C-skill,
input#currentClass[value="c"] ~ .character .items #class-C-item {
    display: block;
}
input#currentClass[value="c"] ~ .character .equip-item #special-item-B-1 {
    display: none;
}


/* 사냥꾼 */
input#currentClass[value="d"] ~ .character .skill #class-D-skill,
input#currentClass[value="d"] ~ .character .items #class-D-item {
    display: block;
}
input#currentClass[value="d"] ~ .character .equip-item .only-sniper {
    display: none;
}

/* 음유시인 */
input#currentClass[value="e"] ~ .character .skill #class-E-skill,
input#currentClass[value="e"] ~ .character .items #class-E-item,
input#currentClass[value="e"] ~ .character .clock .clock-bard {
    display: block;
}

/* 드루이드 */
input#currentClass[value="f"] ~ .character .skill #class-F-skill,
input#currentClass[value="f"] ~ .character .items #class-F-item {
    display: block;
}

/* 마법사 */
input#currentClass[value="g"] ~ .character .skill #class-G-skill,
input#currentClass[value="g"] ~ .character .items #class-G-item {
    display: block;
}
input#currentClass[value="g"] ~ .character .class-stat .class-box-2,
input#currentClass[value="g"] ~ .character .class-stat .class-box-2 p {
    display: inline-block;
}
input#currentClass[value="g"] ~ .character .class-stat .class-box-1 {
    display: none;
}
input#currentClass[value="g"] ~ .character > .tabs .tool-tip {
    display: block;
}

/* 사제 */
input#currentClass[value="h"] ~ .character .skill #class-H-skill,
input#currentClass[value="h"] ~ .character .items #class-H-item {
    display: block;
}
input#currentClass[value="h"] ~ .character .top-tabs .tab-priest,
input#currentClass[value="h"] ~ .character .class-stat .class-box-3 {
    display: inline-block;
}
input#currentClass[value="h"] ~ .character .class-stat .class-box-1,
input#currentClass[value="h"] ~ .character .equip-item #special-item-B-2 {
    display: none;
}

/* 주술사 */
input#currentClass[value="i"] ~ .character .skill #class-I-skill,
input#currentClass[value="i"] ~ .character .items #class-I-item,
input#currentClass[value="i"] ~ .character .clock .clock-shaman {
    display: block;
}
input#currentClass[value="i"] ~ .character .top-tabs .tab-shaman,
input#currentClass[value="i"] ~ .character .class-stat .class-box-4 {
    display: inline-block;
}
input#currentClass[value="i"] ~ .character .class-stat .class-box-1 {
    display: none;
}

/* 마도학자 */
input#currentClass[value="j"] ~ .character .skill #class-J-skill,
input#currentClass[value="j"] ~ .character .items #class-J-item {
    display: block;
}

/* -----------------------------------------------
    own-item
 ------------------------------------------------ */
.character .items .own-item .item-row .item-name {
    display: none;
}
.character .items .own-item .item-row .item-name span {
    display: none;
}
.character .items .own-item .repcontrol {
    background-color: #f0f0f0;
}

/* -----------------------------------------------
    weight
 ------------------------------------------------ */
.character .items .item-row:has(.item-weight-selector) .item-check input {
    display: none;
}
.character .items .item-row:has(.item-weight-selector) .item-name .item-check {
    display: none;
}
.character .items .item-row .item-weight-selector{
    width: 220px;
}
.character .items .item-row .item-weight-selector input[type="radio"],
.character .items .item-row .item-count-selector input[type="radio"],
.character .items .item-row .item-tune-selector input[type="radio"] {
    appearance: none;
    border: none;
    background-color: #b3b3b3;
}
.character .items .item-row .item-weight-selector input[type="radio"]:hover,
.character .items .item-row .item-count-selector input[type="radio"]:hover,
.character .items .item-row .item-tune-selector input[type="radio"]:hover {
    background: #ff5e00;
}
.character .items .item-row .item-weight-selector input[type="radio"]::after,
.character .items .item-row .item-count-selector input[type="radio"]::after,
.character .items .item-row .item-tune-selector input[type="radio"]::after {
    display: inline-block;
    content: "";
    cursor: pointer;
    color: #fff;
    font-size: 11px;
    padding: 2px 5px;
}

.character .items .item-row .item-weight-selector input[type="radio"][value="0"]::after {
    content: "0";
}
.character .items .item-row .item-weight-selector input[type="radio"][value="1"]::after {
    content: "1";
}
.character .items .item-row .item-weight-selector input[type="radio"][value="2"]::after {
    content: "2";
}
.character .items .item-row .item-weight-selector input[type="radio"][value="3"]::after {
    content: "3";
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="null"]) ~ .item-name {
    width: auto;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])){
    display: none;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-name .item-check {
    display: inline-block;
}

.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="0"]) ~ .item-name span{
    font-style: italic;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="0"]) ~ .item-name .item-check input[name$="Z"] {
    display: inline-block;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="1"]) ~ .item-name .item-check input[name$="A"] {
    display: inline-block;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="2"]) ~ .item-name .item-check input[name$="A"],
.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="2"]) ~ .item-name .item-check input[name$="B"] {
    display: inline-block;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="3"]) ~ .item-name .item-check input[name$="A"],
.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="3"]) ~ .item-name .item-check input[name$="B"],
.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="3"]) ~ .item-name .item-check input[name$="C"] {
    display: inline-block;
}

/* -----------------------------------------------
    own-item COUNT
 ------------------------------------------------ */
.character .items .item-row:has(.item-count-selector) .item-count {
    display: none;
}

.character .items .item-row:has(.item-count-selector) .item-count input {
    display: none;
}

.character .items .item-row .item-count-selector {
    width: 300px;
    display: none;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector {
    display: inline-block;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"]:not([value="null"])) {
    display: none;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"][value="1"]) ~ .item-name span,
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"][value="2"]) ~ .item-name span,
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"][value="3"]) ~ .item-name span {
    width: 190px;
}

.character .items .item-row .item-count-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count {
    display: inline-block;
    left: 265px;
}

.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="null"]) ~ .item-count-selector:has(input[type="hidden"][value="null"]) ~ .item-count {
    display: inline-block;
}

.character .items .item-row .item-count-selector input[type="radio"][value="0"]::after {
    content: "제한없음";
}
.character .items .item-row .item-count-selector input[type="radio"][value="1"]::after {
    content: "1회";
}
.character .items .item-row .item-count-selector input[type="radio"][value="2"]::after {
    content: "2회";
}
.character .items .item-row .item-count-selector input[type="radio"][value="3"]::after {
    content: "3회";
}

.character .items .item-row .item-weight-selector:has(input[type="hidden"][value="null"]) ~ .item-count-selector:has(input[type="hidden"][value="null"]) ~ .item-name .item-check {
    display: none;
}

.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"][value="null"]) ~ .item-name .item-check {
    display: none;
}

.character .items .item-row .item-count-selector:has(input[type="hidden"]:not([value="null"])){
    display: none;
}

.character .items .item-row .item-count-selector:has(input[type="hidden"][value="0"]) ~ .item-count {
    display: none;
}
.character .items .item-row .item-count-selector:has(input[type="hidden"][value="1"]) ~ .item-count input[name$="A"] {
    display: inline-block;
}
.character .items .item-row .item-count-selector:has(input[type="hidden"][value="2"]) ~ .item-count input[name$="A"],
.character .items .item-row .item-count-selector:has(input[type="hidden"][value="2"]) ~ .item-count input[name$="B"] {
    display: inline-block;
}
.character .items .item-row .item-count-selector:has(input[type="hidden"][value="3"]) ~ .item-count input[name$="A"],
.character .items .item-row .item-count-selector:has(input[type="hidden"][value="3"]) ~ .item-count input[name$="B"],
.character .items .item-row .item-count-selector:has(input[type="hidden"][value="3"]) ~ .item-count input[name$="C"] {
    display: inline-block;
}

/* -----------------------------------------------
    own-item TUNE
 ------------------------------------------------ */
.character .items .item-row:has(.item-tune-selector) .item-tune,
.character .items .item-row:has(.item-tune-selector) .item-tune input[name$="B"] {
    display: none;
}
.character .items .item-row .item-tune-selector {
    width: 300px;
    display: none;
}
.character .items .item-row .item-tune-selector input[type="radio"][value="1"]::after {
    content: "1";
}
.character .items .item-row .item-tune-selector input[type="radio"][value="2"]::after {
    content: "2";
}
.character .items .item-tune-selector:has(input[type="hidden"]:not([value="null"])) ~ .togglebox .item-tune {
    display: inline-block;
}
.character .items .item-tune-selector:has(input[type="hidden"][value="2"]) ~ .togglebox .input-tag {
    width: 290px;
}
.character .items .item-tune-selector:has(input[type="hidden"][value="2"]) ~ .togglebox .input-tag ~ .item-tune input[name$="A"] {
    margin-right: 30px;
}
.character .items .item-tune-selector:has(input[type="hidden"][value="2"]) ~ .togglebox .input-tag ~ .item-tune input[name$="B"] {
    display: inline-block;
}

.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-tune-selector:has(input[type="hidden"][value="null"]) {
    display: inline-block;
}

.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-tune-selector:has(input[type="hidden"]:not([value="null"])),
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-tune-selector:has(input[type="hidden"][value="null"]) ~ .item-name .item-check,
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-tune-selector:has(input[type="hidden"][value="null"]) ~ .item-count {
    display: none;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-tune-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-name,
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-tune-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-name span {
    display: inline-block;
}
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-count-selector:has(input[type="hidden"][value="0"]) ~ .item-tune-selector:has(input[type="hidden"]:not([value="null"])) ~ .item-name span {
    width: 250px;
}

/* -----------------------------------------------
    own-item COMMON
 ------------------------------------------------ */
.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"]))
~ .item-count-selector:has(input[type="hidden"]:not([value="null"]))
~ .item-tune-selector {
    display: inline-block;
}

.character .items .item-row .item-weight-selector ~ .item-count-selector ~ .item-tune-selector ~ .item-name .item-check {
    display: none;
}

.character .items .item-row .item-weight-selector:has(input[type="hidden"]:not([value="null"]))
~ .item-count-selector:has(input[type="hidden"]:not([value="null"]))
~ .item-tune-selector:has(input[type="hidden"]:not([value="null"]))
~ .item-name .item-check {
    display: inline-block;
}

/* -----------------------------------------------
    party
------------------------------------------------ */
.party .header {
    position: relative;
}
.party .header::after {
    content: "";
    display: block;
    clear: both;
}

.party .header .party-type input {
    width: 450px;
}

.party .party-class {
    float: right;
    text-align: center;
    width: 80px;
    padding: 10px;
}

.party .party-class span {
    display: block;
    font-size: 11px;
}
.party .party-class input {
    text-align: center;
    padding: 0;
    font-weight: bolder;
    font-size: 20px;
}
.party .party-class input::placeholder {
    text-align: center;
}

.party .info .left,
.party .info .right {
    width: inherit;
}
.party .info .party-reputation,
.party .info .party-reputation-clock {
    display: inline-block;
    vertical-align: top;
}
.party .info .party-reputation,
.party .info .party-purpose,
.party .info .party-rival {
    width: 680px;
}
.party .info .party-reputation-clock .clock-instance {
    width: inherit;
}
.party .info .party-reputation .party-reputation-selector {
    float: right;
}
.party .info .party-reputation .party-reputation-selector label {
    color: #b3b3b3;
    padding: 0 5px;
    margin-left: 5px;
}
.party .info .party-reputation .party-reputation-selector label:hover {
    background: #444;
}

.party .info .party-reputation .party-reputation-selector input[id$="1"]:checked ~ label[for$="1"],
.party .info .party-reputation .party-reputation-selector input[id$="2"]:checked ~ label[for$="2"],
.party .info .party-reputation .party-reputation-selector input[id$="3"]:checked ~ label[for$="3"],
.party .info .party-reputation .party-reputation-selector input[id$="4"]:checked ~ label[for$="4"],
.party .info .party-reputation .party-reputation-selector input[id$="5"]:checked ~ label[for$="5"],
.party .info .party-reputation .party-reputation-selector input[id$="6"]:checked ~ label[for$="6"],
.party .info .party-reputation .party-reputation-selector input[id$="7"]:checked ~ label[for$="7"] {
    background: #ff8d00;
    color: #fff;
}

/* -----------------------------------------------
    party on/off
 ------------------------------------------------ */
.party .party-rival,
.party .party-native #party-A,
.party .party-native #party-A-skill,
.party .party-native #party-B,
.party .party-native #party-B-skill,
.party .party-native #party-C,
.party .party-native #party-C-skill,
.party .party-common #bro-common,
.party .party-xp .party-a-xp,
.party .party-xp .party-b-xp,
.party .party-xp .party-c-xp {
    display: none;
}

input#currentParty[value="a"] ~ .party .party-rival,
input#currentParty[value="a"] ~ .party .party-native #party-A,
input#currentParty[value="a"] ~ .party .party-native #party-A-skill {
    display: block;
}
input#currentParty[value="b"] ~ .party .party-native #party-B,
input#currentParty[value="b"] ~ .party .party-native #party-B-skill {
    display: block;
}

input#currentParty[value="c"] ~ .party .party-native #party-C,
input#currentParty[value="c"] ~ .party .party-native #party-C-skill,
input#currentParty[value="c"] ~ .party .party-common #bro-common {
    display: block;
}

input#currentParty[value="a"] ~ .party .party-xp .party-a-xp,
input#currentParty[value="b"] ~ .party .party-xp .party-b-xp,
input#currentParty[value="c"] ~ .party .party-xp .party-c-xp {
    display: inline;
}

/* -----------------------------------------------
    party TABS toggle
 ------------------------------------------------ */
.party-native, .party-clock, .party-common {display: none;}
input#nowTab3[value="party-native"] ~ .party-native,
input#nowTab3[value="party-clock"] ~ .party-clock,
input#nowTab3[value="party-common"] ~ .party-common {display: block;}

/* -----------------------------------------------
    party repeat
 ------------------------------------------------ */
.party .item-row .item-name span:has(input[name$="name-repeat"]) {
    width: 100px;
    display: inline-block;
}

/* -----------------------------------------------
    FOOTER
 ------------------------------------------------ */
.fid .footer .copyright {
    background: #333;
    padding: 10px;
    color: #b3b3b3;
    text-align: center;
    font-size: 9px;
}
.sheet-rolltemplate-text-roll *,
.sheet-rolltemplate-dice-roll * {
    box-sizing: border-box;
}

.sheet-rolltemplate-text-roll .sheet-header,
.sheet-rolltemplate-dice-roll .sheet-header {
    background: #333;
    color: #ff8d00;
    padding: 5px 10px;
    font-weight: 900;
    background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/bg-rolltemplate-title.png');
    background-position: center right;
    background-repeat: no-repeat;
}

.sheet-rolltemplate-text-roll .sheet-header span.sheet-type,
.sheet-rolltemplate-dice-roll .sheet-header span.sheet-type {
    font-size: 10px;
    display: block;
    color:#fff;
    font-weight: normal;
}

.sheet-rolltemplate-text-roll .sheet-body,
.sheet-rolltemplate-dice-roll .sheet-body {
    background: #f0f0f0;
    padding-top: 10px;
}

.sheet-rolltemplate-text-roll .sheet-body:not(:has(.sheet-result)),
.sheet-rolltemplate-dice-roll .sheet-body:not(:has(.sheet-result)) {
    padding-bottom: 0.1px; /* NEED BUG FIX */
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-row,
.sheet-rolltemplate-dice-roll .sheet-body .sheet-row {
    margin: 0 10px 10px;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-row .sheet-row-title,
.sheet-rolltemplate-dice-roll .sheet-body .sheet-row .sheet-row-title,
.sheet-rolltemplate-text-roll .sheet-body .sheet-row .sheet-row-text,
.sheet-rolltemplate-dice-roll .sheet-body .sheet-row .sheet-row-text,
.sheet-rolltemplate-text-roll .sheet-body .sheet-row .sheet-row-max-title,
.sheet-rolltemplate-dice-roll .sheet-body .sheet-row .sheet-row-max-title,
.sheet-rolltemplate-text-roll .sheet-body .sheet-row .sheet-row-max,
.sheet-rolltemplate-dice-roll .sheet-body .sheet-row .sheet-row-max {
    display: inline-block;
    padding: 5px;
    text-align: center;
    vertical-align: middle;
    background: #fff;
    width: 100%;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-row .sheet-row-title,
.sheet-rolltemplate-dice-roll .sheet-body .sheet-row .sheet-row-title {
    background: #333;
    color: #ff8d00;
    font-weight: bolder;
    width: 40px;
    max-width: 40px;
    float:left;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-row .sheet-row-text,
.sheet-rolltemplate-dice-roll .sheet-body .sheet-row .sheet-row-text {
    width: calc(100% - 40px);
    clear: both;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-row .sheet-row-max-title,
.sheet-rolltemplate-dice-roll .sheet-body .sheet-row .sheet-row-max-title {
    display: block;
    background: #333;
    color: #ff8d00;
    font-weight: bolder;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-row .sheet-row-max,
.sheet-rolltemplate-dice-roll .sheet-body .sheet-row .sheet-row-max {
    display: block;

}

.sheet-rolltemplate-text-roll .sheet-body > .sheet-result,
.sheet-rolltemplate-dice-roll .sheet-body > .sheet-result {
    background: #333;
    color: #ff8d00;
    text-align: center;
    font-weight: 700;
    font-size: 17px;
}

.sheet-rolltemplate-text-roll .sheet-result .sheet-result-perpect,
.sheet-rolltemplate-dice-roll .sheet-result .sheet-result-perpect {
    background: #ff8d00;
    color: #000;
}

/* ---- only text roll ---- */
.sheet-rolltemplate-text-roll .sheet-body .sheet-clock {
    margin-bottom: 10px;
    text-align: center;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-clock img {
    max-width: 80px;
    max-height: 80px;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-count .sheet-row-max {
    background: #ff8d00;
    color: #fff;
    vertical-align: middle;
    font-size: 11px;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-count .sheet-row-max::after {
    content: "";
    display: block;
    clear: both;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-count .sheet-row-max .sheet-count-left {
    float: left;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-count .sheet-row-max .sheet-count-right {
    float: right;
    text-align: right;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-count .sheet-row-max .sheet-count-cent {
    display: inline-block;
    margin: 0 auto;
    color: #000;
    text-align: center;
    font-weight: 700;
    font-size: 17px;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-count .sheet-row-max .sheet-count-cent span {
    color: #f0f0f0;
    font-weight: normal;
    margin: 0 5px;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-list ul {
    text-align: left;
    font-size: 11px;
    margin: 0 0 0 20px;
    list-style-type: square;
}

.sheet-rolltemplate-text-roll .sheet-body .sheet-ele {
    padding: 1px 5px;
    background: #ff8d00;
}

/* ---- only dice roll ---- */
.sheet-rolltemplate-dice-roll .sheet-header:has(.sheet-special) {
    padding-top: 20px;
    background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/bg-rolltemplate-title-special.png');
}

.sheet-rolltemplate-dice-roll .sheet-header:has(.sheet-special) ~ .sheet-body {
    background-color: #333;
}

.sheet-rolltemplate-dice-roll .sheet-header:has(.sheet-special) ~ .sheet-body .sheet-row {
    margin-bottom: 0;
}

.sheet-rolltemplate-dice-roll .sheet-header:has(.sheet-special) ~ .sheet-body:not(:has(.sheet-result)) .sheet-lucky-memo,
.sheet-rolltemplate-dice-roll .sheet-header:has(.sheet-special) ~ .sheet-body:not(:has(.sheet-result)) .sheet-dice {
    margin-bottom: 10px;
}

.sheet-rolltemplate-dice-roll .sheet-body .sheet-shaman-stress .sheet-row-max {
    background: #333;
    font-size: 11px;
    color: #fff;
    vertical-align: middle;
}

.sheet-rolltemplate-dice-roll .sheet-body .sheet-shaman-stress .sheet-row-max::after {
    content: "";
    display: block;
    clear: both;
}

.sheet-rolltemplate-dice-roll .sheet-body .sheet-shaman-stress .sheet-stress-left {
    float: left;
}

.sheet-rolltemplate-dice-roll .sheet-body .sheet-shaman-stress .sheet-stress-right {
    float:right;
    font-size: 17px;
    font-weight: 700;
    color: #ff8d00;
}

.sheet-rolltemplate-dice-roll .sheet-dice span:not(.sheet-zero-dice) {
    background-repeat: no-repeat;
    text-align: center;
    font-weight: 700;
    line-height: normal;
    display: inline-block;
    width: 23px;
    height: 20px;
}

.sheet-rolltemplate-dice-roll .sheet-dice span.sheet-dice-1,
.sheet-rolltemplate-dice-roll .sheet-dice span.sheet-dice-2,
.sheet-rolltemplate-dice-roll .sheet-dice span.sheet-dice-3 {
    background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/ico-dice-bad.png');
    color: #fff;
}

.sheet-rolltemplate-dice-roll .sheet-dice span.sheet-dice-4,
.sheet-rolltemplate-dice-roll .sheet-dice span.sheet-dice-5 {
    background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/ico-dice-cool.png');
}

.sheet-rolltemplate-dice-roll .sheet-dice span.sheet-dice-6 {
    background-image: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/forgedInDungeon/asset/ico-dice-perpect.png');
}

.sheet-rolltemplate-dice-roll .sheet-dice ~ .sheet-result span{
    display: none;
    padding: 10px 0;
}

.sheet-rolltemplate-dice-roll .sheet-dice ~ .sheet-result .sheet-shaman-alter {
    padding: 10px;
}

.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-1) ~ .sheet-result span.sheet-result-bad,
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-2) ~ .sheet-result span.sheet-result-bad,
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-3) ~ .sheet-result span.sheet-result-bad {
    display: block;
}

.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-4) ~ .sheet-result span.sheet-result-cool,
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-5) ~ .sheet-result span.sheet-result-cool {
    display: block;
}
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-4) ~ .sheet-result span:not([class$="cool"]),
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-5) ~ .sheet-result span:not([class$="cool"]) {
    display: none;
}


.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-6) ~ .sheet-result span.sheet-result-great {
    display: block;
}
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-6) ~ .sheet-result span:not([class$="great"]) {
    display: none;
}


.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-6 ~ span.sheet-dice-6) ~ .sheet-result span.sheet-result-perpect {
    display: block;
}
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-6 ~ span.sheet-dice-6) ~ .sheet-result span:not([class$="perpect"]) {
    display: none;
}

.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-6 ~ span.sheet-dice-6) ~ .sheet-result.sheet-priest .sheet-type2 ~ span.sheet-result-great,
.sheet-rolltemplate-dice-roll .sheet-result.sheet-priest span.sheet-result-warn {
    display: block;
}
.sheet-rolltemplate-dice-roll .sheet-dice:not(:has(span)) {
    display: none;
}
.sheet-rolltemplate-dice-roll .sheet-result.sheet-priest span.sheet-result-warn {
    font-size: 12px;
    color: red;
}
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-dice-6 ~ span.sheet-dice-6) ~ .sheet-result.sheet-preist .sheet-type2 ~ span:not([class$="great"]) {
    display: none;
}

/* ---- zero dice : 2D6kl1 roll ---- */
.sheet-rolltemplate-dice-roll .sheet-dice span.sheet-zero-dice {
    display: block;
    font-size: 10px;
    color: #b3b3b3;
}

.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice) ~ .sheet-result span.sheet-result-bad,
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice) ~ .sheet-result span.sheet-result-cool,
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice) ~ .sheet-result span.sheet-result-great {
    display: block;
}
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice) ~ .sheet-result span.sheet-result-perpect {
    display: none;
}

.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-6) ~ .sheet-result span:not([class$="great"]) {
    display: none;
}
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-6) ~ .sheet-result span[class$="great"] {
    display: block;
}

.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-4) ~ .sheet-result span:not([class$="cool"]),
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-5) ~ .sheet-result span:not([class$="cool"]) {
    display: none;
}
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-4) ~ .sheet-result span[class$="cool"],
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-5) ~ .sheet-result span[class$="cool"] {
    display: block;
}

.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-1) ~ .sheet-result span:not([class$="bad"]),
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-2) ~ .sheet-result span:not([class$="bad"]),
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-3) ~ .sheet-result span:not([class$="bad"]) {
    display: none;
}
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-1) ~ .sheet-result span[class$="bad"],
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-2) ~ .sheet-result span[class$="bad"],
.sheet-rolltemplate-dice-roll .sheet-dice:has(span.sheet-zero-dice ~ span.sheet-dice-3) ~ .sheet-result span[class$="bad"] {
    display: block;
}