/* rag.css */

/* ── 데이터/스텟 ── */
.container__data {
    float: left;
    width: 150px;
    padding: 4px;
}

.container__stats {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

.container__statbox {
    width: calc(50% - 6px);
    margin: 3px 0;
}

/* 스텟 순서 정렬 */
.container__statbox:nth-child(1)  { order: 1; }   /* STR */
.container__statbox:nth-child(2)  { order: 3; }   /* AGI */
.container__statbox:nth-child(3)  { order: 5; }   /* VIT */
.container__statbox:nth-child(4)  { order: 7; }   /* INT */
.container__statbox:nth-child(5)  { order: 9; }   /* DEX */
.container__statbox:nth-child(6)  { order: 11; }  /* LUK */
.container__statbox:nth-child(7)  { order: 2; }   /* POW */
.container__statbox:nth-child(8)  { order: 4; }   /* STA */
.container__statbox:nth-child(9)  { order: 6; }   /* WIS */
.container__statbox:nth-child(10) { order: 8; }   /* SPL */
.container__statbox:nth-child(11) { order: 10; }  /* CON */
.container__statbox:nth-child(12) { order: 12; }  /* CRT */

.container__statname {
    width: 44%;
    display: inline-block;
    font-weight: bold;
    color: rgb(49, 74, 107);
    margin-left: 5px;
}

.container__statvalue {
    display: inline-block;
    width: 38%;
    font-size: 11px;
    text-align: right;
    padding-right: 1px;
    border: 1px solid rgb(198, 198, 198);
    background-color: rgba(247, 247, 247);
}

/* ── 아이템 박스 ── */
.frontitem { border-collapse: separate; }

.itembox {
    width: 24px;
    height: 28px;
}

.iteminfo {
    padding-top: 10px;
    height: 172px;
    display: flex;
    justify-content: space-between;
    background-position: center;
    background-repeat: no-repeat;
}

.itemgrade {
    position: absolute;
    margin-top: -12px;
}

.itembottom {
    margin-top: -12px;
    height: 10px;
    width: 24px;
    background-color: rgba(182, 199, 234, 0.5);
    border-radius: 100%;
    display: block;
}

.charimg {
    width: 80px;
    height: 100px;
    display: block;
    margin: auto;
}

.itemdesc {
    position: absolute;
    display: none;
    margin-top: -40px;
    margin-left: 30px;
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    padding: 5px;
    z-index: 10;
}

/* ── 에피소드 박스 ── */
.episodebox {
    display: block;
    padding-top: 10px;
    height: 172px;
    text-align: center;
}

.episodebox img {
    padding-right: 5px;
}