/* M7 Play Modes Styles - Strictly Matching Reference Images */

.m7-play-card {
    background-color: #f7f6f0;
    border-radius: 0.08rem;
    margin: 0.12rem 0;
    overflow: hidden;
    border: 1px solid #e1dac2;
    box-shadow: 0 0.02rem 0.06rem rgba(0, 0, 0, 0.05);
}

.m7-card-header {
    background-color: #ede59e;
    color: #000000;
    text-align: center;
    font-size: 0.18rem;
    font-weight: bold;
    padding: 0.06rem 0;
    border-top-left-radius: 0.08rem;
    border-top-right-radius: 0.08rem;
    border-bottom: 1px solid #dcd18c;
    letter-spacing: 0.01rem;
}

/* ===================================================
   1. 金牌五肖
   =================================================== */
.m7-jp5x-body {
    padding: 0.04rem;
}

.m7-jp5x-card-item {
    background-color: #ffffff;
    border: 1px solid #e5dfcb;
    border-radius: 0.06rem;
    margin: 0.06rem;
    padding: 0.08rem 0.10rem 0.02rem 0.10rem;
}

.m7-jp5x-subrow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.08rem;
}

.m7-jp5x-left-pill {
    background-color: #fef4cd;
    border: 1px solid #f6e69d;
    border-radius: 0.05rem;
    padding: 0.03rem 0.08rem;
    display: flex;
    align-items: center;
    font-size: 0.14rem;
    font-weight: bold;
    min-width: 1.1rem;
    justify-content: center;
}

.m7-jp5x-period {
    color: #cc0000;
    font-weight: bold;
    margin-right: 0.02rem;
}

.m7-jp5x-tag {
    color: #000000;
    font-weight: bold;
}

.m7-jp5x-mid-zodiacs {
    color: #cc0000;
    font-weight: bold;
    font-size: 0.15rem;
    flex: 1;
    text-align: center;
    letter-spacing: 0.02rem;
}

.m7-jp5x-mid-zodiacs .is-hit {
    background-color: #ffff00;
    color: #cc0000;
    font-weight: bold;
    border-radius: 2px;
    padding: 0 1px;
}

.m7-jp5x-right-status {
    min-width: 0.75rem;
    text-align: center;
    font-size: 0.14rem;
    font-weight: bold;
}

.m7-jp5x-right-status.is-undrawn {
    color: #777777;
    background-color: #fff9e6;
    border-radius: 0.04rem;
    padding: 0.03rem 0.08rem;
    display: inline-block;
    font-size: 0.13rem;
}

.m7-jp5x-right-status.is-miss {
    color: #888888;
}

.m7-jp5x-right-status.is-hit {
    background-color: #ffff00;
    color: #cc0000;
    font-weight: bold;
    border-radius: 0.04rem;
    padding: 0.03rem 0.08rem;
    display: inline-block;
}


/* ===================================================
   2. 十六码中特
   =================================================== */
.m7-sl-body {
    padding: 0.04rem;
}

.m7-sl-card-item {
    background-color: #ffffff;
    border: 1px solid #e5dfcb;
    border-radius: 0.06rem;
    margin: 0.06rem;
    padding: 0.08rem 0.10rem 0.04rem 0.10rem;
}

.m7-sl-period-pill {
    font-size: 0.15rem;
    text-align: center;
    margin-bottom: 0.06rem;
}

.m7-sl-period-pill span {
    background-color: #fef4cd;
    color: #cc0000;
    font-weight: bold;
    border-radius: 0.04rem;
    padding: 0.02rem 0.12rem;
    font-size: 0.14rem;
    display: inline-block;
}

.m7-sl-line {
    border-bottom: 1px solid #8e803a;
    padding: 0.05rem 0;
    margin-bottom: 0.04rem;
}

.m7-sl-line:last-child {
    margin-bottom: 0.04rem;
}

.m7-sl-nums-row {
    display: flex;
    justify-content: space-around;
    align-items: center;
    font-size: 0.15rem;
    font-weight: bold;
    color: #cc0000;
}

.m7-sl-num-item {
    padding: 0 0.03rem;
    border-radius: 0.02rem;
}

.m7-sl-num-item.is-hit {
    background-color: #ffff00;
    color: #cc0000;
    font-weight: bold;
}


/* ===================================================
   3. 连准八肖
   =================================================== */
.m7-lz8x-body {
    padding: 0.04rem;
}

.m7-lz8x-card-item {
    background-color: #ffffff;
    border: 1px solid #e5dfcb;
    border-radius: 0.06rem;
    margin: 0.06rem;
    padding: 0.08rem 0.10rem 0.02rem 0.10rem;
}

.m7-lz8x-top-row {
    text-align: center;
    margin-bottom: 0.08rem;
    font-size: 0.15rem;
}

.m7-lz8x-top-label {
    font-weight: bold;
    color: #000000;
    margin-right: 0.06rem;
}

.m7-lz8x-top-nums {
    font-weight: bold;
    color: #cc0000;
    letter-spacing: 0.02rem;
}

.m7-lz8x-subrow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.08rem;
}

.m7-lz8x-left-pill {
    background-color: #fef4cd;
    border: 1px solid #f6e69d;
    border-radius: 0.05rem;
    padding: 0.03rem 0.08rem;
    display: flex;
    align-items: center;
    font-size: 0.14rem;
    font-weight: bold;
    min-width: 1.1rem;
    justify-content: center;
}

.m7-lz8x-period {
    color: #cc0000;
    font-weight: bold;
    margin-right: 0.02rem;
}

.m7-lz8x-tag {
    color: #000000;
    font-weight: bold;
}

.m7-lz8x-mid-zodiacs {
    color: #cc0000;
    font-weight: bold;
    font-size: 0.15rem;
    flex: 1;
    text-align: center;
    letter-spacing: 0.02rem;
}

.m7-lz8x-mid-zodiacs .is-hit {
    background-color: #ffff00;
    color: #cc0000;
    font-weight: bold;
    border-radius: 2px;
    padding: 0 1px;
}

.m7-lz8x-right-status {
    min-width: 0.75rem;
    text-align: center;
    font-size: 0.14rem;
    font-weight: bold;
}

.m7-lz8x-right-status.is-undrawn {
    color: #777777;
    background-color: #fff9e6;
    border-radius: 0.04rem;
    padding: 0.03rem 0.08rem;
    display: inline-block;
    font-size: 0.13rem;
}

.m7-lz8x-right-status.is-miss {
    color: #888888;
}

.m7-lz8x-right-status.is-hit {
    background-color: #ffff00;
    color: #cc0000;
    font-weight: bold;
    border-radius: 0.04rem;
    padding: 0.03rem 0.08rem;
    display: inline-block;
}

/* ===================================================
   4. 通用子标题 / 单选玩法 (单笔双笔、天肖地肖、阴阳肖)
   =================================================== */
.m7-card-subinfo {
    text-align: center;
    font-size: 0.13rem;
    font-weight: bold;
    color: #cc0000;
    padding: 0.08rem 0.05rem;
    background-color: #ffffff;
    border-bottom: 1px solid #e5dfcb;
}

.m7-card-body {
    padding: 0.04rem;
}

.m7-single-card-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #ffffff;
    border: 1px solid #e5dfcb;
    border-radius: 0.06rem;
    margin: 0.06rem;
    padding: 0.08rem 0.10rem;
}

.m7-single-left-pill {
    background-color: #fef4cd;
    border: 1px solid #f6e69d;
    border-radius: 0.05rem;
    padding: 0.03rem 0.12rem;
    font-size: 0.14rem;
    font-weight: bold;
    color: #cc0000;
    min-width: 0.95rem;
    text-align: center;
}

.m7-single-mid-val {
    color: #cc0000;
    font-weight: bold;
    font-size: 0.15rem;
    flex: 1;
    text-align: center;
}

.m7-single-right-status {
    min-width: 0.65rem;
    text-align: center;
    font-size: 0.14rem;
    font-weight: bold;
}

.m7-single-right-status.is-undrawn {
    color: #777777;
    background-color: #fff9e6;
    border-radius: 0.04rem;
    padding: 0.03rem 0.10rem;
    display: inline-block;
    font-size: 0.13rem;
}

.m7-single-right-status.is-miss {
    color: #888888;
}

.m7-single-right-status.is-hit {
    background-color: #ffff00;
    color: #cc0000;
    font-weight: bold;
    border-radius: 0.04rem;
    padding: 0.03rem 0.10rem;
    display: inline-block;
}


/* ===================================================
   5. 平特三肖 & 平特一肖
   =================================================== */
.m7-pt-card-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #ffffff;
    border: 1px solid #e5dfcb;
    border-radius: 0.06rem;
    margin: 0.06rem;
    padding: 0.08rem 0.10rem;
}

.m7-pt-left-pill {
    background-color: #fef4cd;
    border: 1px solid #f6e69d;
    border-radius: 0.05rem;
    padding: 0.03rem 0.08rem;
    font-size: 0.14rem;
    font-weight: bold;
    min-width: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.m7-pt-period {
    color: #cc0000;
    font-weight: bold;
    margin-right: 0.01rem;
}

.m7-pt-label {
    color: #000000;
    font-weight: bold;
}

.m7-pt-mid-zodiacs {
    color: #cc0000;
    font-weight: bold;
    font-size: 0.15rem;
    flex: 1;
    text-align: center;
    letter-spacing: 0.02rem;
}

.m7-pt-mid-zodiacs .is-hit {
    background-color: #ffff00;
    color: #cc0000;
    font-weight: bold;
    border-radius: 2px;
    padding: 0 1px;
}

.m7-pt-right-status {
    min-width: 0.65rem;
    text-align: center;
    font-size: 0.14rem;
    font-weight: bold;
}

.m7-pt-right-status.is-undrawn {
    color: #777777;
    background-color: #fff9e6;
    border-radius: 0.04rem;
    padding: 0.03rem 0.10rem;
    display: inline-block;
    font-size: 0.13rem;
}

.m7-pt-right-status.is-miss {
    color: #888888;
}

.m7-pt-right-status.is-hit {
    background-color: #ffff00;
    color: #cc0000;
    font-weight: bold;
    border-radius: 0.04rem;
    padding: 0.03rem 0.10rem;
    display: inline-block;
}


/* ===================================================
   6. 白边黑中
   =================================================== */
.m7-bbhz-body {
    padding: 0.04rem;
}

.m7-bbhz-card-item {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    border-bottom: 1px solid #8e803a;
    margin: 0.04rem 0.06rem;
    padding: 0.08rem 0.06rem;
}

.m7-bbhz-card-item:last-child {
    border-bottom: none;
}

.m7-bbhz-left-pill {
    background-color: #fef4cd;
    border: 1px solid #f6e69d;
    border-radius: 0.05rem;
    padding: 0.03rem 0.12rem;
    font-size: 0.14rem;
    font-weight: bold;
    color: #cc0000;
    min-width: 0.95rem;
    text-align: center;
    margin-right: 0.10rem;
}

.m7-bbhz-mid-text {
    color: #cc0000;
    font-weight: bold;
    font-size: 0.15rem;
    flex: 1;
    text-align: center;
}

.m7-bbhz-side {
    color: #cc0000;
    font-weight: bold;
}

.m7-bbhz-side.is-hit {
    background-color: #ffff00;
    color: #cc0000;
    padding: 0 2px;
    border-radius: 2px;
}

.m7-bbhz-def {
    color: #cc0000;
    font-weight: bold;
}

.m7-bbhz-zodiac.is-hit {
    background-color: #ffff00;
    color: #cc0000;
    padding: 0 2px;
    border-radius: 2px;
}

/* ===================================================
   7. 单行波/尾/头/平码 (两波中特、灭庄五尾、平码1尾、三头中特)
   =================================================== */
.m7-line-body {
    padding: 0.04rem;
}

.m7-line-card-item {
    background-color: #fef8d3;
    border: 1px solid #e2d294;
    border-radius: 0.05rem;
    margin: 0.06rem;
    padding: 0.06rem 0.10rem;
    text-align: center;
    font-size: 0.14rem;
    font-weight: bold;
    color: #222222;
}

.m7-line-period {
    color: #cc0000;
    font-weight: bold;
    margin: 0 0.01rem;
}

.m7-line-item-hit {
    background-color: #ffff00;
    color: #cc0000;
    font-weight: bold;
    padding: 0 2px;
    border-radius: 2px;
}