:root {
    --lottery-primary: #fbbb3f;
    --lottery-primary-deep: #f7b844;
    --lottery-accent: #ff2f1a;
    --lottery-accent-end: #ff6b00;
    --lottery-btn-text: #333;
    --lottery-bg: #f6f6f6;
    --lottery-text: #222;
    --lottery-muted: #999;
    --lottery-card: #fff;
    --lottery-radius: 10px;
    --lottery-tab-h: 50px;
    --lottery-max: 500px;
    --lottery-nav-h: 46px;
}

* { box-sizing: border-box; }
html, body {
    margin: 0;
    padding: 0;
    background: #ececec;
    color: var(--lottery-text);
    font-family: "Microsoft YaHei", "微软雅黑", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", sans-serif;
    -webkit-tap-highlight-color: transparent;
}
/* 覆盖 frontend.css 的 body padding-top:50px，避免顶栏空白条 */
html.lottery-h5-html,
html body.lottery-h5,
html body:has(.lottery-app),
body.lottery-h5 {
    padding: 0 !important;
    padding-top: 0 !important;
    margin: 0 !important;
    margin-top: 0 !important;
    background: #f5f5f5;
}
body.lottery-h5 .lottery-app {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* 宽屏两侧与首页一致为灰底，金色只留在中间内容区顶栏 */
body.lottery-h5 .lottery-app:has(> .mall-user-page) {
    background: #f5f5f5;
}
body.lottery-h5 .lottery-app:has(> .mall-user-page) > .mall-user-page {
    background: #f5f5f5;
}
body.lottery-h5 .lottery-app > .lottery-header:first-child,
body.lottery-h5 .lottery-app > .lottery-page-title:first-child,
body.lottery-h5 .lottery-app > .mall-user-page:first-child {
    margin-top: 0 !important;
}
/* 无底栏二级页 */
body.lottery-h5.no-tabbar .lottery-app,
.lottery-app.no-tabbar {
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
}
a { color: inherit; text-decoration: none; }
a:hover, a:focus { text-decoration: none; color: inherit; }
img { max-width: 100%; }

.lottery-app {
    max-width: var(--lottery-max);
    margin: 0 auto;
    min-height: 100vh;
    background: var(--lottery-bg);
    position: relative;
    padding-bottom: calc(var(--lottery-tab-h) + env(safe-area-inset-bottom, 0px) + 8px);
    overflow-x: hidden;
}

/* ========== 首页顶栏：背景图 + 搜索 ========== */
/* 首页：顶部背景图从页头起铺开，延续到菜单区（仅顶区，避免 PNG 底部黑过渡盖住灰底） */
body.lottery-h5:has(.home-top-wrap),
body.lottery-h5 .lottery-app:has(.home-top-wrap) {
    background: #f5f5f5 !important;
}
.home-top-wrap {
    position: relative;
    z-index: 1;
    /* 背景图下半段是透明的，垫一层同色黄，避免图标和轮播之间透出白底 */
    background: #fff url(/assets/img/mall-home/img_lucky_home_top_bg.8a26c6fc.png) center top / 100% auto no-repeat;
    padding-bottom: 8px;
}
.lottery-header.home-top {
    position: sticky;
    top: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    height: 44px;
    padding: 0 12px;
    background: transparent;
    box-shadow: none;
}
/* 吸顶后补上同色底，避免内容透出 */
.lottery-header.home-top.is-stuck {
    background: #f7b844 url(/assets/img/mall-home/img_lucky_home_top_bg.8a26c6fc.png) center top / 100% auto no-repeat;
}
.home-top-wrap .lottery-search,
.home-search-entry {
    background: #fff;
    text-decoration: none;
    color: inherit;
}
.home-search-entry .home-search-placeholder {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    color: #bbb;
    line-height: 34px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.home-search-entry .search-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}
.home-search-layer {
    position: fixed;
    inset: 0;
    z-index: 300;
    background: #f5f5f5;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}
.clamp2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}
.home-top-wrap .trust-bar.trip {
    background: transparent;
    margin: 0;
    color: rgba(51,51,51,.85);
}
.home-top-wrap .home-icon-grid {
    margin: 8px 10px 0;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.lottery-search {
    flex: 1;
    display: flex;
    align-items: center;
    background: #f2f3f5;
    border-radius: 18px;
    padding: 0 12px;
    height: 32px;
    min-width: 0;
    width: 100%;
}
.lottery-search input {
    border: 0;
    outline: none;
    background: transparent;
    width: 100%;
    font-size: 13px;
    height: 32px;
    color: #333;
}
.lottery-search .fa { color: #bbb; margin-right: 6px; font-size: 13px; }
.lottery-search.search-with-btn {
    padding-right: 4px;
    height: 34px;
}
.lottery-search.search-with-btn input { height: 34px; }
.search-submit {
    flex-shrink: 0;
    border: 0;
    background: linear-gradient(90deg, #f8d68f, #f5bf55);
    color: #493818;
    font-size: 13px;
    font-weight: 600;
    height: 28px;
    padding: 0 12px;
    border-radius: 14px;
    margin-left: 4px;
}

/* ========== 内页金黄顶栏 ========== */
.lottery-header:not(.home-top),
.lottery-page-title {
    position: sticky;
    top: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    height: var(--lottery-nav-h);
    padding: 0 12px;
    background: var(--lottery-primary) !important;
    color: #000 !important;
    font-size: 17px;
    font-weight: 400;
    box-shadow: none;
    border: 0;
}
.lottery-header:not(.home-top) { position: sticky; }
.lottery-header:not(.home-top) a,
.lottery-header:not(.home-top) .fa {
    color: #000 !important;
}
.lottery-header:not(.home-top) > div {
    color: #000;
    font-weight: 400;
}
.lottery-page-title { text-align: center; font-weight: 400; color: #000 !important; }

/* 二级页顶栏：金底黑字常规字重 */
.lottery-header.page-nav-dark {
    background: #fbbb3f !important;
    color: #000 !important;
}
.lottery-header.page-nav-dark .hdr-title,
.lottery-header.page-nav-dark > div {
    color: #000 !important;
    font-weight: 400 !important;
}
.lottery-header.page-nav-dark a,
.lottery-header.page-nav-dark .fa,
.lottery-header.page-nav-dark .hdr-search-btn,
.lottery-header.page-nav-dark .hdr-manage {
    color: #000 !important;
}
.hdr-title {
    font-weight: 400 !important;
    color: #000 !important;
}

/* ========== 轮播 ========== */
.lottery-banner {
    margin: 10px 10px 0;
    border-radius: var(--lottery-radius);
    overflow: hidden;
    background: #ddd;
}
.lottery-banner.full-bleed {
    margin: 0;
    border-radius: 0;
}
.lottery-banner .carousel-inner > .item > img {
    width: 100%;
    height: 150px;
    object-fit: cover;
}
.lottery-banner .carousel-indicators { bottom: 8px; }
.lottery-banner .carousel-indicators li {
    width: 6px;
    height: 6px;
    margin: 0 3px;
    border: 0;
    border-radius: 50%;
    background: rgba(200,200,200,.9);
}
.lottery-banner .carousel-indicators .active {
    width: 6px;
    height: 6px;
    margin: 0 3px;
    background: #fbbb3f;
}
/* 详情轮播：外框最高 280px，图片按原比例完整居中 */
.detail-banner {
    position: relative;
    width: 100%;
    height: 280px;
    max-height: 280px;
    overflow: hidden;
    background: #f2f2f2;
    margin: 0;
}
.detail-banner-track {
    position: relative;
    width: 100%;
    height: 100%;
}
.detail-banner-item {
    display: none;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
}
.detail-banner-item.active {
    display: flex;
}
.detail-banner-item img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 280px;
    object-fit: contain;
    object-position: center;
    display: block;
}
.detail-banner-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
    z-index: 2;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: center;
    gap: 6px;
}
.detail-banner-dots li {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(200,200,200,.95);
    cursor: pointer;
}
.detail-banner-dots li.active { background: #fbbb3f; }

/* ========== 信任条 + 分类宫格 + 双栏 Banner ========== */
.trust-bar.trip {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    padding: 8px 14px;
    background: #fff;
    color: #666;
    font-size: 12px;
    line-height: 20px;
}
.trust-bar.trip .item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.trust-bar.trip .trip-img {
    width: 17px;
    height: 17px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 1px 2px rgba(255, 77, 24, 0.22));
}

.home-icon-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 12px 4px 6px;
    background: #fff;
}
.home-icon-grid a {
    width: 20%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 6px 0 10px;
    color: #333;
}
.home-icon-grid .gi {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #fff;
    margin-bottom: 5px;
}
.home-icon-grid .gi.c1 { background: linear-gradient(135deg, #ff9a36, #ff2f1a); }
.home-icon-grid .gi.c2 { background: linear-gradient(135deg, #7ec8ff, #3a8dff); }
.home-icon-grid .gi.c3 { background: linear-gradient(135deg, #f8d68f, #f5bf55); color: #493818; }
.home-icon-grid .gi.c4 { background: linear-gradient(135deg, #b8f2a0, #5ecf4a); }
.home-icon-grid .gi.c5 { background: linear-gradient(135deg, #ffb0d0, #ff5a9e); }
.home-icon-grid .gi.img {
    background: transparent;
    padding: 0;
    overflow: hidden;
}
.home-icon-grid .gi.img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 12px;
}
.home-icon-grid span {
    font-size: 12px;
    color: #555;
    text-align: center;
    line-height: 1.2;
    max-width: 92%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.home-promo-row {
    display: flex;
    align-items: stretch;
    gap: 8px;
    margin: 8px 10px 0;
    height: 100px;
}
.home-promo-row .promo-left {
    flex: 2 1 0;
    min-width: 0;
    height: 110px;
    border-radius: 8px;
    overflow: hidden;
    background: #eee;
}
.home-promo-row .promo-left img,
.home-carousel,
.home-carousel-item,
.home-carousel-item a {
    width: 100%;
    height: 100%;
    display: block;
}
.home-carousel {
    position: relative;
    overflow: hidden;
}
.home-carousel-item { display: none; }
.home-carousel-item.active { display: block; }
.home-carousel-item img,
.home-promo-row .promo-right img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.home-carousel-dots {
    position: absolute;
    left: 8px;
    right: auto;
    bottom: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: left;
    z-index: 2;
}
.home-carousel-dots li {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 3px 0 0;
    border-radius: 50%;
    background: rgba(255,255,255,.55);
    cursor: pointer;
}
.home-carousel-dots li.active { background: #ff3b30; }
.home-promo-row .promo-right {
    flex: 1 1 0;
    min-width: 0;
    height: 110px;
    border-radius: 8px;
    overflow: hidden;
}

/* ========== 最新揭晓横滑 ========== */
.home-announce {
    margin: 8px 10px 0;
    padding: 0 0 10px;
    border-radius: 10px;
    overflow: hidden;
    background: #fff url(/assets/img/mall-home/img_lucky_home_newest_bg.png) center top / 100% auto no-repeat;
}
.home-announce-head.section-header,
.home-soon-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px 8px;
}
.home-announce-head.section-header {
    min-height: 44px;
    margin-bottom: 2px;
    background: transparent;
    align-items: center;
}
.home-announce-title {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    min-height: 22px;
}
.home-announce-title strong {
    color: #141414;
    font-size: 16px;
    font-weight: 900;
}
.home-announce-title span {
    color: #ad5a22;
    font-size: 11px;
    font-weight: 400;
}
.home-announce .home-announce-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 22px;
    line-height: 22px;
    padding: 0 10px;
    border-radius: 11px;
    background: #fff2e9;
    color: #999;
    font-size: 12px;
    font-weight: 800;
    margin-left: auto;
    align-self: center;
}
.announce-scroll,
.soon-scroll {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 0 12px 4px;
    -webkit-overflow-scrolling: touch;
}
.announce-scroll::-webkit-scrollbar,
.soon-scroll::-webkit-scrollbar { display: none; }
.announce-card {
    flex: 0 0 110px;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.announce-thumb-wrap {
    position: relative;
    background: #fff;
    padding: 8px 8px 6px;
}
.announce-card .thumb {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 4px;
    object-fit: cover;
    background: #f3f3f3;
    display: block;
}
.announce-card .period-badge {
    position: absolute;
    left: 8px;
    bottom: 6px;
    padding: 1px 6px;
    border-radius: 2px;
    background: #f8d48a;
    color: #333;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
}
.announce-foot {
    background: #f5e8d3;
    padding: 6px 4px 8px;
    text-align: center;
}
.announce-card .cd-label {
    font-size: 11px;
    color: #999;
    margin: 0 0 4px;
    line-height: 1;
}
.announce-card .cd-boxes {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}
.announce-card .cd-boxes i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 18px;
    padding: 0 3px;
    border-radius: 4px;
    background: linear-gradient(#ffa06a, #f8cc85);
    color: #4a3720;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
}
.announce-card .cd-boxes em {
    font-style: normal;
    color: #5a4030;
    font-weight: 700;
    font-size: 11px;
}
.announce-card .winner {
    font-size: 12px;
    color: #666;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 4px;
}
.home-announce-title small {
    font-size: 11px;
    font-weight: 400;
    color: #999;
    margin-left: 4px;
}

/* 首页立即换取弹窗（对标 jjgsc） */
.ex-join-mask {
    position: fixed;
    inset: 0;
    z-index: 260;
    background: rgba(0,0,0,.5);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 22px;
    box-sizing: border-box;
}
.ex-join-dialog {
    position: relative;
    width: 100%;
    max-width: 340px;
    background: #fff;
    border-radius: 12px;
    padding: 18px 16px 16px;
}
.ex-join-close {
    position: absolute;
    top: 8px;
    right: 10px;
    border: 0;
    background: transparent;
    color: #bbb;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    padding: 0 4px;
}
.ex-join-goods {
    display: flex;
    gap: 10px;
    padding-right: 18px;
}
.ex-join-goods img {
    width: 72px;
    height: 72px;
    border-radius: 6px;
    object-fit: cover;
    background: #f3f3f3;
    flex-shrink: 0;
}
.ex-join-name {
    margin: 0;
    font-size: 14px;
    color: #222;
    font-weight: 600;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ex-join-remain {
    margin: 8px 0 0;
    font-size: 13px;
    color: #999;
}
.ex-join-remain em {
    font-style: normal;
    color: #f0a020;
    font-weight: 700;
}
.ex-join-balance-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 14px;
    padding: 12px 0;
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
}
.ex-join-balance {
    font-size: 14px;
    color: #666;
}
.ex-join-balance em {
    font-style: normal;
    color: #f0a020;
    font-weight: 700;
    margin-left: 4px;
}
.ex-join-stepper {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.ex-join-stepper button {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 6px;
    background: #ffe6b8;
    color: #c58a16;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}
.ex-join-stepper span,
.ex-join-stepper .ex-join-qty {
    min-width: 36px;
    max-width: 64px;
    height: 28px;
    box-sizing: border-box;
    margin: 0;
    padding: 0 4px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    -moz-appearance: textfield;
    appearance: textfield;
}
.ex-join-stepper .ex-join-qty::-webkit-outer-spin-button,
.ex-join-stepper .ex-join-qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.ex-join-earn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    padding: 0 12px;
    border-radius: 6px;
    background: linear-gradient(90deg, #ffd56a, #fbbb3f);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.ex-join-auto {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    font-size: 13px;
    color: #888;
    cursor: pointer;
}
.ex-join-auto input { display: none; }
.ex-join-auto .fa {
    color: #ddd;
    font-size: 18px;
}
.ex-join-auto input:checked + .fa { color: #f0a020; }
.ex-join-confirm {
    display: block;
    width: 100%;
    margin-top: 14px;
    height: 44px;
    border: 0;
    border-radius: 22px;
    background: linear-gradient(90deg, #ffd56a 0%, #fbbb3f 100%);
    color: #333;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}
.ex-join-confirm.disabled,
.ex-join-confirm:disabled {
    background: #cfcfcf;
    color: #fff;
    cursor: not-allowed;
}
.join-pill.btn-home-join {
    border: 0;
    cursor: pointer;
}

/* ========== 即将揭晓（列表） ========== */
.home-soon {
    margin: 12px 10px 0;
    padding: 8px 0 4px;
    border-radius: 10px;
    overflow: hidden;
    background: #fff url(/assets/img/mall-home/img_lucky_home_soon_bg.800fb5a1.png) center top / 100% 100% no-repeat;
}
.home-soon-title {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: #222;
}
.home-soon-title span {
    font-size: 12px;
    font-weight: 400;
    color: #999;
}
.home-soon-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px 8px;
    background: transparent;
}
.home-soon .home-announce-more {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 10px;
    border-radius: 11px;
    background: rgba(255,255,255,.75);
    color: #666;
    font-size: 12px;
    font-weight: 400;
}
.soon-scroll {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 0 12px 12px;
    -webkit-overflow-scrolling: touch;
}
.soon-scroll::-webkit-scrollbar { display: none; }
.soon-hcard {
    flex: 0 0 260px;
    display: flex;
    gap: 10px;
    align-items: center;
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    padding: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,.03);
}
.soon-hcard .thumb {
    width: 72px;
    height: 72px;
    border-radius: 8px;
    object-fit: cover;
  
    flex-shrink: 0;
}
.soon-hcard .body { flex: 1; min-width: 0; }
.soon-hcard .name {
    font-size: 13px;
    font-weight: 600;
    color: #222;
    height: 36px;
    line-height: 1.35;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 8px;
}
.soon-hcard .goods-progress {
    height: 4px;
    background: #f3f3f3;
    margin-bottom: 6px;
}
.soon-hcard .goods-progress > i {
    background: #fbbb3f;
    animation: none;
}
.soon-hcard .meta {
    font-size: 12px;
    color: #888;
}
.soon-hcard .meta em {
    color: var(--lottery-accent);
    font-style: normal;
    font-weight: 700;
}

/* ========== 分类横向 Tab ========== */
.shop-menu-tabs {
    margin: 10px 0 0;
    background: #fff;
    border-bottom: 1px solid #f0f0f0;
    position: sticky;
    top: 44px;
    z-index: 90;
}
.shop-menu-inner {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 6px;
}
.shop-menu-inner::-webkit-scrollbar { display: none; }
.shop-menu-inner a {
    flex: 0 0 auto;
    padding: 14px 12px;
    font-size: 14px;
    color: #666;
    position: relative;
    white-space: nowrap;
}
.shop-menu-inner a.active {
    color: #222;
    font-weight: 400;
}
.shop-menu-inner a.active:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 2px;
    width: 24px;
    height: 10px;
    margin-left: -12px;
    background: url(/assets/img/mall-home/icon_lucky_home_tab_indicator.png) center / 24px 10px no-repeat;
}

/* ========== 公告 ========== */
.home-notice {
    display: flex;
    align-items: center;
    margin: 10px 10px 0;
    padding: 8px 12px;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}
.home-notice .notice-tag {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 700;
    color: #493818;
    background: linear-gradient(90deg, #f8d68f, #f5bf55);
    border-radius: 4px;
    padding: 2px 6px;
    margin-right: 10px;
}
.home-notice .notice-marquee {
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
}
.home-notice .notice-track {
    display: inline-block;
    padding-left: 100%;
    animation: noticeScroll 22s linear infinite;
}
.home-notice .notice-item {
    font-size: 13px;
    color: #666;
    margin-right: 48px;
}
@keyframes noticeScroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

/* ========== 最新获得者 ========== */
.home-winners {
    margin: 12px 0 4px;
}
.home-winners-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 12px 8px;
}
.home-winners-title {
    font-size: 15px;
    font-weight: 600;
    color: #222;
}
.home-winners-more {
    font-size: 12px;
    color: var(--lottery-muted);
}
.winner-scroll {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 0 12px 6px;
    -webkit-overflow-scrolling: touch;
}
.winner-scroll::-webkit-scrollbar { display: none; }
.winner-card {
    flex: 0 0 210px;
    display: flex;
    gap: 10px;
    align-items: center;
    background: #fff;
    border-radius: 10px;
    padding: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.winner-card img {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    object-fit: cover;
    background: #eee;
    flex-shrink: 0;
}
.winner-info { min-width: 0; }
.winner-name {
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.winner-goods {
    font-size: 12px;
    color: #666;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.winner-meta {
    font-size: 11px;
    color: var(--lottery-muted);
    margin-top: 2px;
}

/* ========== Tab ========== */
.lottery-tabs {
    display: flex;
    margin: 12px 10px 8px;
    background: #fff;
    border-radius: var(--lottery-radius);
    overflow: hidden;
}
.lottery-tabs a {
    flex: 1;
    text-align: center;
    padding: 12px 0;
    font-size: 14px;
    color: #888;
    position: relative;
}
.lottery-tabs a.active {
    color: #222;
    font-weight: 600;
}
.lottery-tabs a.active:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 4px;
    width: 28px;
    height: 2px;
    margin-left: -14px;
    border-radius: 1px;
    background: #333;
}

/* ========== 商品网格 ========== */
.lottery-goods {
    display: flex;
    flex-wrap: wrap;
    padding: 0 6px 8px;
}
.goods-card {
    width: 50%;
    padding: 4px;
}
.goods-card-inner {
    background: var(--lottery-card);
    border-radius: var(--lottery-radius);
    overflow: hidden;
    height: 100%;
    display: block;
}
.goods-card-inner .thumb {
    width: 100%;
    /* height: 178px; */
    object-fit: cover;
    display: block;
}
.goods-card-inner .info {
    padding: 8px 10px 12px;
}
.goods-card-inner .name {
    font-size: 13px;
    line-height: 1.35;
    height: 36px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0 0 6px;
    color: #222;
}
.goods-card-inner .price {
    color: var(--lottery-accent);
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 8px;
}
.goods-card-inner .price small {
    font-size: 11px;
    font-weight: 400;
    color: var(--lottery-muted);
    margin-left: 2px;
}

/* 能量进度条（对标红橙流光） */
.goods-progress {
    height: 6px;
    background: #edf0f3;
    border-radius: 999px;
    overflow: hidden;
    margin-bottom: 6px;
    box-shadow: inset 0 1px 3px rgba(134, 45, 20, 0.12);
}
.goods-progress > i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background-color: #f4bb4e;
    
    background-size: 200% 100%;
    animation: energy-flow 1.5s linear infinite, energy-pulse 2s ease-in-out infinite;
}
@keyframes energy-flow {
    0% { background-position: 200% 50%; }
    100% { background-position: 0% 50%; }
}
@keyframes energy-pulse {
    0%, 100% { filter: brightness(1) saturate(1); }
    50% { filter: brightness(1.12) saturate(1.15); }
}
@media (prefers-reduced-motion: reduce) {
    .goods-progress > i { animation: none; background-position: 50% 50%; filter: none; }
}

.goods-meta {
    font-size: 11px;
    color: var(--lottery-muted);
    display: flex;
    justify-content: flex-start;
}
.goods-meta .remain { 
    margin: 3px 0 0 10px;
    font-size: 13px;
   
    color: #333;
}
.shop-goods .goods-foot .price {
    font-size: 15px;
}
.shop-goods .goods-foot .price small { display: none; }
.goods-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 8px;
}
.goods-foot .price {
    color: var(--lottery-accent);
    font-size: 15px;
    font-weight: 700;
    margin: 0;
}
.goods-foot .price small {
    font-size: 11px;
    font-weight: 400;
    color: var(--lottery-muted);
}
.join-pill {
    display: inline-block;
    min-width: 48px;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    color: #493818;
    background: linear-gradient(90deg, #f8d68f, #f5bf55);
    border-radius: 14px;
    padding: 5px 10px;
}
.shop-goods { padding-top: 4px; }

.lottery-empty {
    width: 100%;
    text-align: center;
    padding: 48px 16px;
    color: var(--lottery-muted);
    font-size: 14px;
}

/* ========== 底部菜单（5 栏对标） ========== */
.lottery-tabbar {
    position: fixed;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--lottery-max);
    height: calc(var(--lottery-tab-h) + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: #fff;
    border-top: 1px solid #eee;
    display: flex;
    z-index: 200;
}
.lottery-tabbar a {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: #333;
    line-height: 1.2;
    padding-top: 4px;
}
.lottery-tabbar a img {
    width: 24px;
    height: 24px;
    margin-bottom: 2px;
    display: block;
}
.lottery-tabbar a .tab-icon-wrap {
    position: relative;
    display: inline-flex;
    width: 24px;
    height: 24px;
    margin-bottom: 2px;
}
.lottery-tabbar a .tab-icon-wrap img {
    margin-bottom: 0;
}
.lottery-tabbar a .tab-badge {
    position: absolute;
    top: -5px;
    right: -10px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 8px;
    background: #ff4d4f;
    color: #fff;
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    text-align: center;
    box-sizing: border-box;
}
.lottery-tabbar a .tab-label {
    font-size: 11px;
    color: #333;
    font-weight: 400;
}
.lottery-tabbar a.active .tab-label {
    color: #333;
    font-weight: 500;
}

/* ========== 内页通用 ========== */
.lottery-panel {
    margin: 10px;
    background: #fff;
    border-radius: var(--lottery-radius);
    padding: 14px;
}
.lottery-panel .row-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #f5f5f5;
    font-size: 14px;
}
.lottery-panel .row-item:last-child { border-bottom: 0; }
.lottery-panel .row-item .muted { color: var(--lottery-muted); }

.btn-lottery {
    display: block;
    width: 100%;
    background: linear-gradient(90deg, #f8d68f, #f5bf55);
    color: var(--lottery-btn-text) !important;
    border: 1px solid #fbbb3f;
    border-radius: 22px;
    padding: 11px;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    margin-top: 12px;
}
.btn-lottery-outline {
    display: block;
    width: 100%;
    background: #fff;
    color: #c48a10 !important;
    border: 1px solid #fbbb3f;
    border-radius: 22px;
    padding: 10px;
    text-align: center;
    font-size: 15px;
    margin-top: 12px;
}
.btn-lottery.danger {
    background: linear-gradient(90deg, #ff2f1a, #ff6b00);
    border-color: #ff2f1a;
    color: #fff !important;
}

.wallet-balance {
    text-align: center;
    padding: 28px 16px;
}
.wallet-balance .num {
    font-size: 36px;
    font-weight: 700;
    color: var(--lottery-accent);
}
.wallet-balance .label {
    color: var(--lottery-muted);
    font-size: 13px;
    margin-top: 4px;
}

/* ========== 我的积分（对标 jjgsc userDraw） ========== */
.wallet-pts-hdr.page-nav-dark { background: #fbbb3f; }
.wallet-pts-page {
    background: #fff;
    min-height: calc(100vh - 44px);
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
}
.wallet-pts-hero {
    background: #fbbb3f;
    padding: 8px 16px 28px;
    text-align: center;
}
.wallet-pts-num {
    font-size: 42px;
    font-weight: 700;
    color: #222;
    line-height: 1.2;
    letter-spacing: 1px;
}
.wallet-pts-tabs {
    display: flex;
    align-items: stretch;
    background: #fff;
    border-bottom: 1px solid #f0f0f0;
}
.wallet-pts-tabs a {
    flex: 1;
    text-align: center;
    padding: 12px 0 10px;
    font-size: 14px;
    color: #666;
    position: relative;
}
.wallet-pts-tabs a.active {
    color: #222;
    font-weight: 700;
}
.wallet-pts-tabs a.active::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 28px;
    height: 3px;
    margin-left: -14px;
    background: #222;
    border-radius: 2px;
}
.wallet-pts-list { background: #fff; }
.wallet-pts-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid #f5f5f5;
}
.wallet-pts-meta { min-width: 0; flex: 1; }
.wallet-pts-title {
    font-size: 14px;
    color: #333;
    line-height: 1.4;
    word-break: break-all;
}
.wallet-pts-time {
    margin-top: 4px;
    font-size: 12px;
    color: #bbb;
}
.wallet-pts-amt {
    flex-shrink: 0;
    font-size: 16px;
    font-weight: 600;
    color: #666;
}
.wallet-pts-amt.earn { color: #f5a623; }
.wallet-pts-foot {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    background: linear-gradient(180deg, rgba(255,255,255,0), #fff 28%);
    max-width: var(--lottery-max);
    margin: 0 auto;
}
.wallet-pts-cta {
    display: block;
    height: 44px;
    line-height: 44px;
    text-align: center;
    background: #fbbb3f;
    color: #222 !important;
    border-radius: 22px;
    font-size: 15px;
    font-weight: 600;
}
.wallet-how-mask {
    position: fixed;
    inset: 0;
    z-index: 400;
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.wallet-how-dialog {
    width: 100%;
    max-width: 300px;
    background: #fff;
    border-radius: 12px;
    padding: 22px 18px 16px;
}
.wallet-how-dialog h3 {
    margin: 0 0 14px;
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    color: #333;
}
.wallet-how-body {
    font-size: 13px;
    color: #666;
    line-height: 1.7;
}
.wallet-how-body p { margin: 0 0 8px; }
.wallet-how-btn {
    display: block;
    width: 100%;
    margin-top: 16px;
    height: 42px;
    border: 0;
    border-radius: 21px;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    background: linear-gradient(90deg, #ff8a1a, #fbbb3f);
}

/* ========== 积分赠送 ========== */
.gift-pts-page {
    background: #f5f5f5;
    min-height: calc(100vh - 44px);
    padding: 12px 12px 40px;
}
.gift-pts-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
}
.gift-pts-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 14px;
    border-bottom: 1px solid #f3f3f3;
}
.gift-pts-label {
    flex-shrink: 0;
    font-size: 14px;
    color: #333;
}
.gift-pts-row input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: none;
    text-align: right;
    font-size: 14px;
    background: transparent;
    color: #333;
}
.gift-pts-amount input {
    text-align: left;
    font-size: 15px;
}
.gift-pts-balance {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    font-size: 13px;
    color: #666;
}
.gift-pts-balance a {
    color: #3478f6 !important;
    font-size: 13px;
}
.gift-pts-tip {
    margin: 12px 4px 18px;
    font-size: 12px;
    color: #999;
    line-height: 1.5;
}
.gift-pts-submit {
    display: block;
    width: 100%;
    height: 44px;
    border: 0;
    border-radius: 8px;
    background: #fbbb3f;
    color: #222;
    font-size: 15px;
    font-weight: 600;
}
.gift-pts-submit:disabled { opacity: .6; }

/* 编辑资料底部按钮 */
.profile-bottom-actions {
    display: flex;
    gap: 12px;
    padding: 24px 14px 40px;
}
.profile-btn-save,
.profile-btn-logout {
    flex: 1;
    height: 44px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    background: #fff;
    color: #333;
    border: 1px solid #e5e5e5;
}
.profile-btn-save { border-color: #fbbb3f; color: #c88700; }
.profile-btn-logout { border-color: #ddd; }

/* ========== 中奖弹窗 ========== */
.win-mask {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0,0,0,.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.win-dialog {
    width: 100%;
    max-width: 320px;
    background: #fff;
    border-radius: 14px;
    padding: 22px 18px 16px;
    box-shadow: 0 12px 40px rgba(0,0,0,.2);
    animation: winPop .25s ease;
}
@keyframes winPop {
    from { transform: scale(.92); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}
.win-dialog-title {
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    color: var(--lottery-accent);
    margin-bottom: 12px;
}
.win-dialog-body {
    font-size: 14px;
    line-height: 1.7;
    color: #444;
    text-align: center;
    white-space: pre-wrap;
    margin-bottom: 18px;
}
.win-dialog-actions { margin-top: 4px; }
.win-dialog-mute {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0 0 12px;
    font-size: 13px;
    color: #888;
    cursor: pointer;
    user-select: none;
}
.win-dialog-mute input { margin: 0; }

/* 顶栏最右侧语言切换；已有右侧按钮时向左让开（用 .has-lang-switch，避免被后续更高优先级规则盖掉） */
.h5-lang-switch {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 6;
}
.auth-topbar .h5-lang-switch { top: 14px; right: 10px; transform: none; }
.mall-user-top { position: relative; }
.mall-user-top .h5-lang-switch {
    top: 12px;
    right: 12px;
    transform: none;
}
.mall-user-top.has-lang-switch .mall-user-profile {
    padding-right: 40px;
}
.lottery-header.has-lang-switch .hdr-search-btn,
.lottery-header.has-lang-switch .hdr-manage,
.lottery-header.has-lang-switch .hdr-right-link,
.lottery-header.page-nav-dark.has-lang-switch .hdr-search-btn,
.lottery-header.page-nav-dark.has-lang-switch .hdr-manage,
.lottery-header.share-nav.has-lang-switch .hdr-right-link {
    right: 46px;
}
.cat-search-hdr .h5-lang-switch,
.cat-result-hdr .h5-lang-switch {
    position: static;
    transform: none;
    flex-shrink: 0;
    margin-left: 4px;
}
.lottery-header.home-top.has-lang-switch { padding-right: 46px; }
.h5-lang-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 4px;
    color: #333;
    text-decoration: none;
}
.h5-lang-icon {
    width: 22px;
    height: 22px;
    object-fit: cover;
    border-radius: 50%;
    display: block;
}
.h5-lang-name {
    font-size: 12px;
    line-height: 1;
    max-width: 64px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.h5-lang-menu {
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    min-width: 108px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    padding: 4px 0;
    z-index: 20;
    display: none;
}
.h5-lang-menu.open { display: block; }
.h5-lang-menu a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    color: #333 !important;
    text-decoration: none;
    white-space: nowrap;
}
.h5-lang-menu a.active,
.h5-lang-menu a:active { background: #fff8e8; }

.mine-tip-mute {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 10px 0 0;
    font-size: 13px;
    color: #888;
    cursor: pointer;
}

/* ========== 详情 ========== */
.detail-price-box {
    margin: 0;
    background: #f6f6f6;
    padding-bottom: 2px;
}
.detail-price-item {
    background: #fbbb3f;
    padding: 12px 14px 36px;
}
.detail-price-item .price-top {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin-bottom: 10px;
    color: #333;
}
.detail-price-item .price-num {
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
}
.detail-price-item .price-unit {
    font-size: 14px;
    font-weight: 600;
}
.detail-progre .detail-progress-bar {
    height: 10px;
    border-radius: 5px;
    background: #fff;
    overflow: hidden;
}
.detail-progre .detail-progress-bar > i {
    display: block;
    height: 100%;
    background: #555;
    border-radius: 5px;
}
.detail-progre-text {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
}
.detail-progre-text .col {
    flex: 1;
    text-align: center;
    color: #333;
}
.detail-progre-text .col:first-child { text-align: left; }
.detail-progre-text .col:last-child { text-align: right; }
.detail-progre-text .col b {
    display: block;
    font-size: 13px;

    line-height: 1.2;
    color: #333;
}
.detail-progre-text .col span {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    color: rgba(51,51,51,.75);
}
.detail-title-card {
    margin: -22px 10px 0;
    position: relative;
    z-index: 3;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(51,51,51,.08);
    padding: 12px;
}
.detail-title-row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #f0f0f0;
}
.detail-title {
    flex: 1;
    min-width: 0;
    font-size: 15px;
    font-weight: 600;
    margin: 0;
    line-height: 1.45;
    color: #222;
}
.detail-title .period-tag {
    color: #f7b844;
    font-style: normal;
    font-weight: 700;
    margin-right: 2px;
}
.wish-icon-btn {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border: 0;
    padding: 0;
    border-radius: 50%;
    /* background: #fbbb3f; */
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.wish-icon-btn.active {
    /* background: linear-gradient(135deg, #ffc85a 0%, #ff9f18 100%);
    box-shadow: 0 3px 8px rgba(255,157,24,.24); */
}
.wish-heart-icon {
    width: 30px;
    height: 30px;
    object-fit: contain;
    display: block;
}
/* 详情收藏提示：对标参考站深色 toast */
.detail-tip-toast {
    position: fixed;
    left: 50%;
    top: 46%;
    transform: translate(-50%, -50%) scale(.96);
    z-index: 300;
    min-width: 120px;
    max-width: 80%;
    padding: 12px 18px;
    border-radius: 6px;
    background: rgba(0, 0, 0, .72);
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
.detail-tip-toast.show {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
}
.detail-play-boll {
    position: fixed;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--lottery-max);
    z-index: 120;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
    background: #f6f6f6;
    border-top: 1px solid #eee;
    box-sizing: border-box;
}
body.lottery-h5.no-tabbar .lottery-app:has(.detail-play-boll) {
    padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
}
body.lottery-h5:not(.no-tabbar) .detail-play-boll {
    bottom: calc(var(--lottery-tab-h) + env(safe-area-inset-bottom, 0px));
}
.detail-play-boll .play,
.detail-play-boll .addCar {
    flex: 1;
    height: 40px;
    border: 0;
    border-radius: 20px;
    font-size: 15px;
    /* font-weight: 600; */
    color: #fff;
}
.detail-play-boll .play {
    background: #fbbb3f;
    color: #333;
}
.detail-play-boll .addCar {
    background: #464646 !important;
    color: #fff !important;
}
.got-winner-card {
    position: relative;
    margin: 10px 0 12px;
    padding: 22px 14px 16px;
    min-height: 200px;
    border-radius: 12px;
    overflow: hidden;
    background: url(/assets/img/mall-home/bg_lucky_goodss_details1.png) no-repeat center center;
    background-size: 100% 100%;
    color: #fff;
    box-shadow: 0 4px 14px rgba(255, 140, 40, .28);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.got-winner-card:before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 12% 20%, rgba(255,255,255,.18) 0 2px, transparent 3px),
        radial-gradient(circle at 80% 30%, rgba(255,255,255,.12) 0 1.5px, transparent 2px);
    pointer-events: none;
}
.got-ribbon {
    position: absolute;
    left: -28px;
    top: 10px;
    width: 110px;
    text-align: center;
    transform: rotate(-42deg);
    background: #e74c3c;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 22px;
    box-shadow: 0 2px 6px rgba(0,0,0,.15);
    z-index: 2;
}
.got-body {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding-left: 8px;
}
.got-avatar-link {
    display: block;
    flex-shrink: 0;
    line-height: 0;
}
.got-avatar {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    object-fit: cover;
   
    display: block;
   
}
.got-name a {
    color: inherit;
    text-decoration: none;
}
.got-info { min-width: 0; flex: 1; }
.got-name {
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.got-name span { font-weight: 500; opacity: .95; }
.got-line {
    font-size: 12px;
    line-height: 1.55;
    opacity: .95;
}
.got-foot {
    position: relative;
    z-index: 1;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,.45);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.got-code {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 2px;
    min-width: 0;
}
.got-code span {
    display: inline;
    font-size: 13px;
    opacity: .95;
    white-space: nowrap;
}
.got-code em {
    font-style: normal;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: .5px;
    line-height: 1.2;
}
.got-calc-btn {
    flex-shrink: 0;
    padding: 7px 14px;
    border-radius: 20px;
    background: #e74c3c;
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
}
.got-countdown-card {
    margin: 10px 0 12px;
    padding: 16px 12px;
    border-radius: 12px;
    background: linear-gradient(135deg, #fff7e6, #ffe8b8);
    text-align: center;
}
.got-countdown-card .cd-label {
    font-size: 13px;
    color: #999;
    margin-bottom: 8px;
}
.got-countdown-card .cd-boxes {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.got-countdown-card .cd-boxes i {
    min-width: 28px;
    height: 26px;
    padding: 0 6px;
    border-radius: 4px;
    background: #fbbb3f;
    color: #333;
    font-style: normal;
    font-weight: 700;
    font-size: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-variant-numeric: tabular-nums;
}
.got-countdown-card .cd-boxes em {
    font-style: normal;
    color: #fbbb3f;
    font-weight: 700;
}
.detail-play-boll .play.next-period-bar {
    background: #f5c15b;
    color: #333;
    font-weight: 700;
}
.detail-play-boll .play.full {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
.detail-cart-link {
    position: relative;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.detail-cart-link img { width: 26px; height: 26px; }
.detail-cart-link em {
    position: absolute;
    top: -2px;
    right: -4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 8px;
    background: #ff2f1a;
    color: #fff;
    font-size: 10px;
    font-style: normal;
    line-height: 16px;
    text-align: center;
}
.join-modal-mask {
    position: fixed;
    inset: 0;
    z-index: 220;
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.join-modal {
    width: 100%;
    max-width: var(--lottery-max);
    background: #fff;
    border-radius: 14px 14px 0 0;
    padding: 14px 14px calc(14px + env(safe-area-inset-bottom, 0px));
}
.join-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 10px;
}
.join-modal-head a {
    font-size: 26px;
    color: #999;
    line-height: 1;
    padding: 0 4px;
}

/* 积分不足弹窗（对标 jjgsc） */
.short-points-mask {
    position: fixed;
    inset: 0;
    z-index: 240;
    background: rgba(0, 0, 0, .55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 20px;
    box-sizing: border-box;
}
.short-points-dialog {
    width: 100%;
    max-width: 320px;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .28);
}
.short-points-hero {
    position: relative;
    padding: 18px 18px 22px;
    background:
        radial-gradient(circle at 18% 120%, rgba(255, 255, 255, .08) 0, transparent 42%),
        radial-gradient(circle at 88% -10%, rgba(255, 255, 255, .1) 0, transparent 36%),
        linear-gradient(160deg, #3a4a5c 0%, #2c3a4a 55%, #243040 100%);
    color: #fff;
}
.short-points-tag {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    font-size: 11px;
    letter-spacing: .02em;
}
.short-points-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .55);
    background: transparent;
    color: #fff;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}
.short-points-title {
    margin: 16px 0 6px;
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    letter-spacing: .04em;
}
.short-points-sub {
    margin: 0;
    text-align: center;
    font-size: 12px;
    color: rgba(255, 255, 255, .72);
    line-height: 1.5;
}
.short-points-body {
    padding: 16px 16px 14px;
}
.short-points-goods {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}
.short-points-goods img {
    width: 72px;
    height: 72px;
    border-radius: 8px;
    object-fit: cover;
    background: #f3f3f3;
    flex-shrink: 0;
}
.short-points-goods-meta { flex: 1; min-width: 0; }
.short-points-chip {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 3px;
    background: #fff3df;
    color: #e8a020;
    font-size: 11px;
    margin-bottom: 4px;
}
.short-points-name {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    color: #222;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.short-points-stock {
    margin: 6px 0 0;
    font-size: 12px;
    color: #999;
}
.short-points-stock em {
    font-style: normal;
    color: #f0a020;
    font-weight: 700;
    margin: 0 2px;
}
.short-points-alert {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-top: 14px;
    padding: 12px;
    border-radius: 10px;
    background: #fff8ee;
}
.short-points-ico {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #ffe4b8;
    color: #f0a020;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 15px;
}
.short-points-alert strong {
    display: block;
    font-size: 14px;
    color: #5a4630;
    margin-bottom: 4px;
}
.short-points-alert p {
    margin: 0;
    font-size: 12px;
    color: #999;
    line-height: 1.5;
}
.short-points-alert em {
    font-style: normal;
    color: #f0a020;
    font-weight: 700;
}
.short-points-earn {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 16px;
    height: 44px;
    border-radius: 22px;
    background: linear-gradient(90deg, #ffd56a 0%, #fbbb3f 50%, #f5a623 100%);
    color: #333;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
}
.short-points-earn .fa { margin-left: 4px; }
.short-points-later {
    display: block;
    width: 100%;
    margin-top: 10px;
    border: 0;
    background: transparent;
    color: #bbb;
    font-size: 13px;
    padding: 6px 0 2px;
    cursor: pointer;
}
.illustrate {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 14px 0 6px;
    padding-top: 0;
    border-top: 0;
    font-size: 12px;
    color: #666;
}
.illustrate .item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.illustrate .item .fa { color: #e8c08e; font-size: 13px; }
.illustrate .trust-check {
    width: 14px;
    height: 14px;
    color: #e8c08e;
    flex-shrink: 0;
    display: block;
}
.illustrate .item b { color: #ff6b00; font-weight: 700; }
.delivery-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 10px 0;
    padding: 14px 12px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(51,51,51,.06);
    font-size: 14px;
    color: #333;
    font-weight: 500;
}
.delivery-link .fa { color: #bbb; font-size: 16px; }
.detail-extra-panel { margin-top: 0; }
.share-stats {
    display: flex;
    margin-top: 14px;
    padding: 12px 0;
    border-top: 1px solid #f5f5f5;
    border-bottom: 1px solid #f5f5f5;
}
.share-stat {
    flex: 1;
    text-align: center;
}
.share-stat .num {
    font-size: 20px;
    font-weight: 700;
    color: #333;
    line-height: 1.2;
}
.share-stat .num.remain { color: var(--lottery-accent); }
.share-stat .label {
    font-size: 11px;
    color: var(--lottery-muted);
    margin-top: 4px;
}
.join-record-link {
    display: block;
    text-align: center;
    margin-top: 12px;
    font-size: 13px;
    color: #666;
}
.join-rec-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid #f0f0f0;
    color: inherit;
    text-decoration: none;
}
.join-rec-row:last-of-type {
    border-bottom: 0;
}
.join-rec-avatar {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    flex-shrink: 0;
}
.join-rec-body {
    flex: 1;
    min-width: 0;
}
.join-rec-name {
    font-size: 14px;
    color: #333;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.join-rec-name b {
    font-weight: 600;
}
.join-rec-name span {
    color: #999;
    font-weight: 400;
    margin-left: 2px;
}
.join-rec-time {
    margin-top: 4px;
    font-size: 12px;
    color: #999;
}
.join-rec-points {
    margin-top: 4px;
    font-size: 12px;
    color: #999;
}
.join-rec-points em {
    font-style: normal;
    color: #ff8a2b;
    font-weight: 600;
}
.join-rec-arrow {
    flex-shrink: 0;
    color: #ccc;
    font-size: 18px;
}
.period-join-item {
    padding: 12px 0;
    border-bottom: 1px solid #f5f5f5;
}
.period-join-item:last-child { border-bottom: 0; }
.period-join-head {
    display: flex;
    align-items: center;
    gap: 10px;
}
.period-join-head img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    flex-shrink: 0;
}
.period-join-info { flex: 1; min-width: 0; }
.period-join-info .name {
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.period-join-codes {
    margin-top: 10px;
    padding: 10px;
    background: #fafafa;
    border-radius: 8px;
}
.share-quick {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.share-quick button {
    min-width: 44px;
    height: 34px;
    padding: 0 12px;
    border: 1px solid #f0d18a;
    border-radius: 17px;
    background: #fff;
    color: #666;
    font-size: 13px;
}
.share-quick button.active,
.share-quick button:active {
    border-color: #fbbb3f;
    color: #493818;
    background: #fff8e8;
}
.share-quick button.all {
    min-width: auto;
    padding: 0 14px;
    font-weight: 600;
}
.join-actions {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}
.join-actions .btn-lottery,
.join-actions .btn-lottery-outline {
    flex: 1;
    margin-top: 0;
}
.detail-bottom-bar {
    position: sticky;
    bottom: calc(var(--lottery-tab-h) + env(safe-area-inset-bottom, 0px));
    z-index: 90;
    display: flex;
    gap: 10px;
    padding: 10px 12px;
    background: #fff;
    border-top: 1px solid #f0f0f0;
    margin: 0;
    border-radius: 0;
}
.detail-bottom-bar .btn-lottery,
.detail-bottom-bar .btn-lottery-outline {
    margin: 0;
    flex: 1;
}

/* ========== 分类页 ========== */
.category-layout {
    display: flex;
    min-height: 0;
    margin-top: 0;
    background: #fff;
    align-items: flex-start;
}
.category-side {
    width: 88px;
    flex-shrink: 0;
    background: #f6f6f6;
    overflow-y: auto;
    min-height: 0;
    align-self: stretch;
}
.category-side a {
    display: block;
    padding: 14px 8px;
    text-align: center;
    font-size: 12px;
    color: #666;
    border-left: 3px solid transparent;
    line-height: 1.3;
}
.category-side a.active {
    background: #fff;
    color: #222;
    font-weight: 600;
    border-left-color: var(--lottery-primary);
}
.category-main {
    flex: 1;
    min-width: 0;
    padding: 0 !important;
    background: #fff;
    overflow-y: visible;
}

/* ========== 最新揭晓列表 ========== */
.lottery-reveal-list { padding: 8px 10px; }
.reveal-card {
    display: flex;
    gap: 12px;
    background: #fff;
    border-radius: var(--lottery-radius);
    padding: 12px;
    margin-bottom: 10px;
}
.reveal-card .thumb {
    width: 88px;
    height: 88px;
    border-radius: 8px;
    object-fit: cover;
    background: #eee;
    flex-shrink: 0;
}
.reveal-card .body { flex: 1; min-width: 0; }
.reveal-card .name {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.reveal-card .meta {
    font-size: 12px;
    color: #888;
    line-height: 1.6;
}
.reveal-card .winner {
    margin-top: 6px;
    font-size: 12px;
    color: #333;
}
.reveal-card .winner em {
    color: var(--lottery-accent);
    font-style: normal;
    font-weight: 700;
}
.reveal-card .code {
    color: var(--lottery-accent);
    font-weight: 700;
    letter-spacing: .5px;
}
.reveal-card .winner-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}
.reveal-card .winner-row .av {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    flex-shrink: 0;
}
.detail-period-tag {
    font-size: 12px;
    color: #888;
    margin: -2px 0 8px;
}
.detail-section-title {
    font-weight: 600;
    margin-bottom: 10px;
    font-size: 14px;
}
.detail-section-title.row-between {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.detail-content {
    font-size: 14px;
    line-height: 1.7;
    color: #444;
    white-space: pre-wrap;
}
.last-winner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.share-stepper {
    display: flex;
    align-items: center;
    gap: 0;
    border: 1px solid #eee;
    border-radius: 6px;
    overflow: hidden;
}
.share-stepper button {
    width: 32px;
    height: 30px;
    border: 0;
    background: #f7f7f7;
    color: #333;
    font-size: 16px;
}
.share-stepper input {
    width: 52px;
    height: 30px;
    border: 0;
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
    text-align: center;
    font-size: 14px;
}
.pay-num {
    color: var(--lottery-accent);
    font-weight: 700;
}
.period-join-item.compact { padding: 10px 0; }

/* ========== 心愿单 ========== */
.wish-item {
    display: flex;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid #f5f5f5;
}
.wish-item:last-child { border-bottom: 0; }
.wish-item .thumb {
    width: 72px;
    height: 72px;
    border-radius: 8px;
    object-fit: cover;
    background: #eee;
    flex-shrink: 0;
}
.wish-item .body { flex: 1; min-width: 0; }
.wish-item .name {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 4px;
}
.wish-item .meta { font-size: 12px; color: #888; }
.wish-item .price {
    margin-top: 6px;
    color: var(--lottery-accent);
    font-weight: 700;
    font-size: 15px;
}
.wish-item .ops {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
}
.wish-item .btn-del {
    color: #bbb;
    font-size: 12px;
}

/* ========== 个人中心（对标 mall-user） ========== */
.mall-user-page {
    background: #f5f5f5;
    min-height: 60vh;
    padding: 0 0 8px;
    margin: 0;
}
.mall-user-top {
    background: #fbbb3f;
    padding: 16px 15px 18px;
    margin: 0;
    border-radius: 0;
}
.mall-user-profile {
    display: flex;
    align-items: center;
    gap: 12px;
}
.mall-user-profile .avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
   
}
.mall-user-profile .profile-meta { flex: 1; min-width: 0; }
.mall-user-profile .uname {
    font-size: 17px;
    font-weight: 700;
    color: #333;
}
.mall-user-profile .uid {
    margin-top: 4px;
    font-size: 12px;
    color: rgba(51,51,51,.65);
}
.mall-user-profile .card-link {
    flex-shrink: 0;
    font-size: 12px;
    color: #333;
    white-space: nowrap;
}
.quick-panel {
    display: flex;
    justify-content: space-around;
    margin-top: 18px;
}
.quick-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    color: #333;
    font-size: 12px;
}
.quick-item .quick-ico {
    width: 25px;
    height: 25px;
    object-fit: contain;
    display: block;
}
.mall-user-main {
    margin-top: 10px;
    position: relative;
    z-index: 2;
    padding-bottom: 8px;
}
.points-card,
.order-card,
.more-card {
    width: calc(100% - 30px);
    margin: 0 15px 12px;
    padding: 10px 10px 12px;
    border-radius: 8px;
    background: #fff;
    box-sizing: border-box;
}
.points-card { margin-top: 0; }
.points-head, .section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 32px;
    padding: 0 4px 6px;
}
.points-title, .section-head h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: #333;
}
.section-head .fa { color: #bbb; font-size: 16px; }
.section-head.static { justify-content: flex-start; }
.points-body {
    display: flex;
    align-items: stretch;
    padding: 4px 0 10px;
}
.account-value {
    flex: 1;
    text-align: center;
    position: relative;
}
.account-value + .account-value:before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    bottom: 8px;
    width: 1px;
    background: #f0f0f0;
}
.account-value strong {
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: #222;
    line-height: 1.3;
}
.account-value span {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #999;
}
.points-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-top: 4px;
}
.points-actions a {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    font-size: 11px;
    padding: 7px 4px;
    border-radius: 16px;
    white-space: nowrap;
    box-sizing: border-box;
}
.points-actions a img {
    width: 23px;
    height: 23px;
    object-fit: contain;
    flex-shrink: 0;
}
.points-actions a .fa {
    font-size: 11px;
    margin-left: 0;
    opacity: .7;
}
.points-actions .text-action {
    flex: 1.05;
    background: #fff7e8;
    color: #333;
    font-weight: 500;
}
.points-actions .solid-action {
    color: #fff;
    background: linear-gradient(135deg, #ff2d1f 0%, #ff8614 100%);
}
.points-actions .solid-action .fa { color: #fff; opacity: .9; }
.points-actions .outline-action {
    color: #ff5b16;
    border: 1px solid #ff6a22;
    background: #fffaf6;
}
.invite-card {
    display: block;
    width: calc(100% - 30px);
    margin: 0 15px 12px;
    border-radius: 10px;
    overflow: hidden;
}
.invite-card img {
    width: 100%;
    height: auto;
    display: block;
}
.order-grid {
    display: flex;
    justify-content: space-between;
    padding: 4px 2px 2px;
}
.order-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #333;
}
.target-order-icon { width: 25px; height: 25px; object-fit: contain; }
.more-grid {
    display: flex;
    flex-wrap: wrap;
    padding: 4px 0 2px;
}
.more-item {
    width: 25%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 8px 0;
    font-size: 12px;
    color: #333;
}
.more-item img {
    width: 28px;
    height: 28px;
    object-fit: contain;
    border-radius: 6px;
}
.mine-logout-row {
    text-align: center;
    padding: 8px 0 16px;
}
.mine-logout-row a { font-size: 13px; color: #999; }
.mine-tip-mask {
    position: fixed;
    inset: 0;
    z-index: 200;
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.mine-tip-dialog {
    width: 100%;
    max-width: 320px;
    background: #fff;
    border-radius: 12px;
    padding: 20px 16px 16px;
    text-align: center;
}
.mine-tip-title { font-size: 16px; font-weight: 700; color: #333; }
.mine-tip-body {
    margin-top: 10px;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
    white-space: pre-wrap;
    text-align: left;
}
.mine-menu .row-item i.fa {
    width: 22px;
    color: #c48a10;
    margin-right: 8px;
    text-align: center;
}

/* 夺宝码 */
.code-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.code-chip {
    font-size: 12px;
    font-family: Consolas, Monaco, monospace;
    letter-spacing: .5px;
    background: #f5f5f5;
    color: #333;
    border-radius: 6px;
    padding: 6px 8px;
}
.code-chip.win {
    background: #ffe8e6;
    color: #ff2f1a;
    font-weight: 700;
    border: 1px solid #f5b7b1;
}
.join-code-preview {
    font-size: 12px;
    color: var(--lottery-muted);
    margin-top: 4px;
}

/* 邀请 */
.invite-panel .invite-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}
.invite-panel .invite-more {
    font-size: 12px;
    color: var(--lottery-muted);
}
.invite-stats {
    display: flex;
    background: #fafafa;
    border-radius: 10px;
    padding: 12px 4px;
    margin-bottom: 12px;
}
.invite-stat { flex: 1; text-align: center; }
.invite-stat .num {
    font-size: 18px;
    font-weight: 700;
    color: var(--lottery-accent);
    line-height: 1.2;
}
.invite-stat .label {
    font-size: 11px;
    color: var(--lottery-muted);
    margin-top: 4px;
}
.invite-qr-box {
    text-align: center;
    padding: 8px 0 4px;
}
.invite-qr {
    width: 168px;
    height: 168px;
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 8px;
    padding: 6px;
    object-fit: contain;
}
.invite-code {
    font-weight: 700;
    letter-spacing: 1px;
    font-family: Consolas, Monaco, monospace;
}
.invite-link-box {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #f5f5f5;
}
.invite-link {
    word-break: break-all;
    font-size: 12px;
    background: #f7f7f7;
    padding: 10px;
    border-radius: 8px;
    color: #444;
    line-height: 1.5;
    user-select: all;
}
.invite-actions {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}
.invite-actions .btn-lottery,
.invite-actions .btn-lottery-outline { flex: 1; }
.invite-user-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid #f5f5f5;
}
.invite-user-row:last-child { border-bottom: 0; }
.invite-user-row img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    flex-shrink: 0;
}
.invite-user-info { flex: 1; min-width: 0; }
.invite-user-info .name {
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.invite-user-reward { text-align: right; flex-shrink: 0; }
.invite-user-reward .plus {
    color: #27ae60;
    font-weight: 700;
    font-size: 14px;
}
.invite-toast {
    position: fixed;
    left: 50%;
    bottom: 90px;
    transform: translateX(-50%) translateY(8px);
    background: rgba(0,0,0,.78);
    color: #fff;
    font-size: 13px;
    padding: 10px 18px;
    border-radius: 20px;
    z-index: 10000;
    opacity: 0;
    transition: opacity .2s, transform .2s;
    pointer-events: none;
}
.invite-toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* ========== 详情 Tab / 历史幸运 / 走势 ========== */
.hdr-back {
    position: absolute;
    left: 10px;
    padding: 0 6px;
    font-size: 22px;
    line-height: 1;
}
.hdr-title { flex: 1; text-align: center; }
.detail-tabs {
    display: flex;
    background: #fff;
    margin: 10px 10px 0;
    border-radius: 10px 10px 0 0;
    border-bottom: 1px solid #f0f0f0;
    overflow-x: auto;
}
.detail-tabs::-webkit-scrollbar { display: none; }
.detail-tabs a {
    flex: 1;
    text-align: center;
    padding: 12px 6px;
    font-size: 13px;
    color: #888;
    white-space: nowrap;
    position: relative;
}
.detail-tabs a.active {
    color: #222;
    font-weight: 600;
}
.detail-tabs a.active:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 4px;
    width: 24px;
    height: 2px;
    margin-left: -12px;
    background: #333;
}
.detail-tab-panel {
    margin-top: 0;
    border-radius: 0 0 10px 10px;
}
.winner-history-row {
    display: block;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
}
.winner-history-row:last-child { border-bottom: 0; }
.winner-history-row .wh-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}
.winner-history-row .wh-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    background: #ffe3a3;
    color: #333;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
}
.winner-history-row .wh-time {
    font-size: 12px;
    color: #999;
}
.winner-history-row .wh-body {
    display: flex;
    align-items: center;
    gap: 10px;
}
.winner-history-row .wh-thumb {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    object-fit: cover;
    background: #f5f5f5;
    flex-shrink: 0;
}
.winner-history-row .wh-info { flex: 1; min-width: 0; }
.winner-history-row .wh-name {
    font-size: 14px;
    color: #333;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.winner-history-row .wh-name b { font-weight: 700; }
.winner-history-row .wh-name span {
    color: #999;
    font-weight: 400;
    margin-left: 2px;
}
.winner-history-row .wh-line {
    font-size: 12px;
    color: #999;
    margin-top: 2px;
}
.winner-history-row .wh-line em {
    color: #f7b844;
    font-style: normal;
    font-weight: 700;
}
.winner-history-row .wh-arrow {
    color: #ccc;
    font-size: 18px;
    flex-shrink: 0;
}
.trend-page { padding-bottom: 8px; background: #f5f5f5; min-height: 60vh; }
.trend-jjg .trend-goods {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    padding: 12px;
    background: #fff;
    border-radius: 0;
}
.trend-goods {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 10px;
    padding: 12px;
    background: #fff;
    border-radius: 10px;
}
.trend-goods img {
    width: 64px;
    height: 64px;
    border-radius: 6px;
    object-fit: cover;
    background: #f5f5f5;
    flex-shrink: 0;
}
.trend-goods-meta .name {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.trend-goods-meta .muted { font-size: 12px; color: #999; }
.trend-need {
    font-size: 13px;
    color: #666;
}
.trend-need em {
    font-style: normal;
    color: #c88700;
    font-weight: 700;
}
.trend-prev {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: #fff;
    border-top: 1px solid #f3f3f3;
    font-size: 12px;
    color: #666;
}
.trend-prev-user {
    min-width: 0;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.trend-prev-user em {
    font-style: normal;
    color: #f4bb4e;
    font-weight: 700;
    margin-left: 4px;
}
.trend-chart-panel {
    margin: 0;
    border-radius: 0;
    padding: 12px 8px 8px;
}
.trend-chart-wrap {
    position: relative;
    width: 100%;
}
.trend-chart-panel canvas {
    width: 100%;
    height: auto;
    display: block;
    cursor: crosshair;
}
.trend-tip {
    position: absolute;
    z-index: 5;
    min-width: 88px;
    padding: 8px 10px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 14px rgba(0,0,0,.14);
    font-size: 12px;
    color: #666;
    line-height: 1.45;
    pointer-events: none;
    white-space: nowrap;
}
.trend-tip strong {
    display: block;
    color: #333;
    font-size: 14px;
    margin-bottom: 2px;
}
.trend-axis-tip {
    margin-top: 6px;
    font-size: 11px;
    color: #bbb;
    text-align: center;
}
.trend-table-panel {
    margin: 0 0 12px;
    border-radius: 0;
    padding: 0;
    overflow-x: auto;
}
.trend-table-head,
.trend-table-row {
    display: grid;
    grid-template-columns: 72px 1.2fr 1fr 48px;
    gap: 6px;
    align-items: center;
    padding: 10px 12px;
    font-size: 12px;
}
.trend-table-6 {
    grid-template-columns: 0.7fr 1fr 1.35fr 1fr 1fr 0.7fr;
    gap: 0;
    font-size: 11px;
    min-width: 100%;
    width: 100%;
    box-sizing: border-box;
}
.trend-table-6 > span {
    text-align: center;
    padding: 0 2px;
    min-width: 0;
}
.trend-table-head {
    background: #fbbb3f;
   
    font-size: 12px;
}
.trend-table-head.trend-table-6 > span {
    font-weight: 600;
}
.trend-table-row {
    border-top: 1px solid #f0f0f0;
    color: #333;
    background: #fff;
}
.trend-table-row:nth-child(even) { background: #fafafa; }
.trend-table-row .code { color: #666; word-break: break-all; }
.trend-table-6 > span:nth-child(2),
.trend-table-row .nick {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.trend-table-row .pos {
    color: #f4bb4e;
    font-weight: 700;
}
.trend-table-row .tail {
    color: #ff9f18;
    font-weight: 700;
    text-align: right;
}

/* ========== 分类页 ========== */
.cat-header { position: relative; }
.hdr-search-btn {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: #fff !important;
    padding: 4px 6px;
}
.cat-search-panel {
    padding: 8px 10px;
    background: #fff;
    border-bottom: 1px solid #f0f0f0;
}
.cat-sort-tabs {
    display: flex;
    background: #fff;
    border-bottom: 1px solid #f0f0f0;
    position: sticky;
    top: var(--lottery-nav-h);
    z-index: 5;
    margin: 0;
    overflow: visible;
}
.cat-sort-tabs a {
    flex: 1;
    text-align: center;
    padding: 12px 0 14px;
    font-size: 13px;
    color: #666;
    position: relative;
    font-weight: 400;
}
.cat-sort-tabs a.active {
    color: #fbbb3f !important;
    font-weight: 400;
}
.cat-sort-tabs a.active::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: 50%;
    bottom: 3px;
    width: 24px;
    height: 3px;
    margin-left: -12px;
    border-radius: 2px;
    background: #fbbb3f !important;
}
.cat-sort-tabs a.sort-price {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}
.cat-sort-tabs .sort-arrows {
    display: inline-flex;
    flex-direction: column;
    line-height: 0.7;
    margin-left: 2px;
    color: #ccc;
    font-size: 10px;
}
.cat-sort-tabs .sort-arrows.on .cur {
    color: #fbbb3f;
}
.cat-sort-tabs .sort-arrows i { display: block; }
.category-layout {
    display: flex;
    align-items: stretch;
    min-height: auto;
    margin: 0;
    background: #fff;
}
.category-main {
    flex: 1;
    min-width: 0;
    padding: 0;
    background: #fff;
    overflow: visible;
}
.cat-goods-rows { padding: 0; background: #fff; margin: 0; }
.cat-goods-row {
    display: flex;
    gap: 10px;
    padding: 10px;
    border-bottom: 1px solid #f0f0f0;
    margin: 0;
}
.cat-goods-row .thumb-wrap { flex-shrink: 0; }
.cat-goods-row .thumb {
    width: 96px;
    height: 96px;
    border-radius: 8px;
    object-fit: cover;
    display: block;
}
.cat-goods-row .body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.cat-goods-row .name.clamp2 {
    font-size: 13px;
    font-weight: 500;
    color: #222;
    line-height: 1.4;
    max-height: 36px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 8px;
}
.cat-goods-row .goods-progress {
    margin-top: auto;
    margin-bottom: 8px;
    height: 4px;
}
.cat-goods-row .price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cat-goods-row .price {
    color: var(--lottery-accent);
    font-weight: 700;
    font-size: 16px;
}
.cat-goods-row .add-cart-btn {
    width: 30px;
    height: 30px;
    border: 0;
    padding: 0;
    background: transparent;
    flex-shrink: 0;
}
.cat-goods-row .add-cart-btn img {
    width: 30px;
    height: 30px;
    display: block;
}
.cat-goods-row .add-cart-btn:disabled {
    opacity: .35;
}

/* 分类热门搜索 / 搜索结果（对标 jjgsc） */
.lottery-header.cat-search-hdr,
.lottery-header.cat-result-hdr {
    justify-content: flex-start !important;
    gap: 8px;
    padding: 0 10px !important;
}
.cat-search-hdr {
    display: flex;
    align-items: center;
    gap: 8px;
}
.cat-search-hdr .cat-hot-search-form {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.cat-search-hdr .cat-hot-search-form.result { flex: 1; min-width: 0; }
.cat-hot-search-box {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 12px;
    border-radius: 16px;
    background: #fff;
    min-width: 0;
}
.cat-hot-search-box .fa { color: #bbb; font-size: 13px; }
.cat-hot-search-box input {
    flex: 1;
    border: 0;
    outline: none;
    height: 32px;
    background: transparent;
    font-size: 14px;
    color: #333;
    min-width: 0;
}
.cat-hot-cancel {
    flex-shrink: 0;
    color: #333;
    font-size: 15px;
    text-decoration: none;
}
.cat-result-hdr .hdr-back,
.cat-result-hdr .hdr-search-btn {
    position: static !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    flex-shrink: 0;
    padding: 4px 4px;
    font-size: 20px;
    line-height: 1;
}
.cat-result-hdr .hdr-search-btn {
    font-size: 16px;
    color: #333 !important;
}
.cat-result-hdr .hdr-grid-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    color: #333 !important;
}
.cat-result-hdr .hdr-grid-btn svg {
    display: block;
    width: 20px;
    height: 20px;
}
.cat-hot-page {
    min-height: calc(100vh - 50px);
    background: #f5f5f5;
    padding-top: 0;
}
.cat-hot-card {
    background: #fff;
    border-radius: 12px 12px 0 0;
    margin-top: 0;
    padding: 16px 14px 24px;
    min-height: calc(100vh - 50px);
}
.cat-hot-title {
    margin: 0 0 12px;
    font-size: 15px;
    color: #666;
    font-weight: 600;
    padding-bottom: 12px;
    border-bottom: 1px solid #f0f0f0;
}
.cat-hot-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.cat-hot-tags a {
    display: inline-flex;
    align-items: center;
    height: 30px;
    padding: 0 14px;
    border-radius: 15px;
    background: #f3f3f3;
    color: #555;
    font-size: 13px;
    text-decoration: none;
}
.cat-result-tabs {
    display: flex;
    height: 40px;
    background: #fff;
    border-bottom: 1px solid #f0f0f0;
}
.cat-result-tabs a {
    position: relative;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    color: #666;
    font-size: 14px;
    text-decoration: none;
}
.cat-result-tabs a.active {
    color: #f0a020;
    font-weight: 600;
}
.cat-result-tabs a.active::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 28px;
    height: 2px;
    background: #f0a020;
    transform: translateX(-50%);
}
.cat-result-tabs .sort-arrows {
    display: inline-flex;
    flex-direction: column;
    line-height: .7;
    font-size: 10px;
    color: #ccc;
    margin-left: 2px;
}
.cat-result-tabs .sort-arrows.on .cur { color: #f0a020; }
.cat-result-count {
    padding: 8px 12px;
    font-size: 14px;
    color: #555;
    background: #f7f7f7;
}
.cat-result-list {
    background: #fff;
    padding-bottom: 72px;
}
.cat-result-row {
    display: flex;
    gap: 10px;
    padding: 12px;
    border-bottom: 1px solid #f5f5f5;
    position: relative;
}
.cat-result-row .thumb-wrap { flex-shrink: 0; }
.cat-result-row .thumb {
    width: 88px;
    height: 88px;
    border-radius: 6px;
    object-fit: cover;
    background: #f3f3f3;
    display: block;
}
.cat-result-row .body {
    flex: 1;
    min-width: 0;
    padding-right: 36px;
}
.cat-result-row .name {
    margin: 0;
    font-size: 14px;
    color: #222;
    line-height: 1.35;
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cat-result-row .price {
    margin-top: 6px;
    font-size: 15px;
    font-weight: 700;
    color: #f33;
}
.cat-result-row .goods-progress {
    margin: 8px 0 6px;
}
.cat-result-row .stat-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 4px;
    font-size: 11px;
    color: #999;
}
.cat-result-row .stat-row > span {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    line-height: 1.25;
}
.cat-result-row .stat-row .total {
    align-items: center;
    text-align: center;
}
.cat-result-row .stat-row .remain {
    align-items: flex-end;
    text-align: right;
}
.cat-result-row .stat-row em {
    font-style: normal;
    font-weight: 700;
    font-size: 13px;
    color: #999;
    margin-bottom: 2px;
}
.cat-result-row .stat-row .sold em,
.cat-result-row .stat-row .remain em {
    color: #f4bb4e;
}
.cat-result-row .stat-row i {
    font-style: normal;
    font-size: 11px;
    color: #999;
    font-weight: 400;
}
.cat-result-row .add-cart-btn {
    position: absolute;
    right: 12px;
    bottom: 14px;
    width: 32px;
    height: 32px;
    border: 0;
    padding: 0;
    background: transparent;
}
.cat-result-row .add-cart-btn img {
    width: 32px;
    height: 32px;
    display: block;
}
.cat-result-foot {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 30;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    background: #fff;
    box-shadow: 0 -2px 10px rgba(0,0,0,.06);
}
.btn-add-all-wish {
    display: block;
    width: 100%;
    height: 44px;
    border: 0;
    border-radius: 22px;
    background: #fbbb3f;
    color: #333;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

/* ========== 最新揭晓页 ========== */
.lottery-tab-hdr .hdr-back { display: none !important; }
.lottery-cat-tabs {
    background: #fff;
    border-bottom: 0;
    position: sticky;
    top: var(--lottery-nav-h);
    z-index: 5;
}
.pending-card.is-finished .name { display: none; }
.pending-card.is-finished .fin-meta { margin-top: 8px; }
.lottery-cat-inner {
    display: flex;
    overflow-x: auto;
    padding: 0 6px;
    -webkit-overflow-scrolling: touch;
}
.lottery-cat-inner::-webkit-scrollbar { display: none; }
.lottery-cat-inner a {
    flex: 0 0 auto;
    padding: 12px 12px;
    font-size: 13px;
    color: #666;
    white-space: nowrap;
    position: relative;
}
.lottery-cat-inner a.active {
    color: #222;
    font-weight: 700;
}
.lottery-cat-inner a.active:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 2px;
    width: 24px;
    height: 10px;
    margin-left: -12px;
    background: url(/assets/img/mall-home/icon_lucky_home_tab_indicator.png) center / 24px 10px no-repeat;
}
.lottery-pending-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding: 10px 10px 16px;
    background: #f5f5f5;
}
.pending-card {
    width: auto;
    margin: 0;
    background: #fff;
    border-radius: 10px;
    padding: 10px 10px 12px;
    text-align: center;
    box-sizing: border-box;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
    display: flex;
    flex-direction: column;
    color: inherit;
    text-decoration: none;
    min-width: 0;
}
.pending-card .thumb-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
}
.pending-card .thumb {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.pending-card .period-badge {
    position: absolute;
    left: 0;
    bottom: 0;
    top: auto;
    z-index: 2;
    display: inline-block;
    margin: 0;
    padding: 2px 8px;
    border-radius: 0 8px 0 0;
    background: #f8d9a0;
    font-size: 11px;
    font-weight: 600;
    line-height: 18px;
    color: #333;
    box-shadow: none;
}
.pending-card .name {
    font-size: 13px;
    color: #222;
    font-weight: 500;
    min-height: 36px;
    height: auto;
    max-height: 36px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 10px 0 6px;
    text-align: left;
    line-height: 1.35;
    flex-shrink: 0;
}
.pending-card .cd-label {
    font-size: 13px;
    color: #999;
    font-weight: 400;
    margin: 0 0 2px;
    line-height: 1.2;
}
.pending-card .cd-boxes {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin: 0 auto;
    padding: 0;
    padding-top: 10px;
    border-radius: 0;
    border: 0;
    max-width: none;
}
.pending-card .cd-boxes i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 34px;
    padding: 0 4px;
    border-radius: 6px;
    background: linear-gradient(to bottom, #f8d68f, #f5bf55) !important;
    color: #333;
    font-size: 15px;
    font-style: normal;
 
    font-variant-numeric: tabular-nums;
    font-family: Arial, Helvetica, sans-serif;
    box-shadow: none;
}
.pending-card .cd-boxes i.cd-ms {
    min-width: 36px;
}
.pending-card .cd-boxes em {
    font-style: normal;
    color: #333;
    font-weight: 600;
    font-size: 14px;
    margin: 0 4px;
    line-height: 1;
}
.pending-card.is-finished .fin-meta {
    text-align: left;
    padding: 0;
    flex: 1;
    min-height: 0;
}
.pending-card .fin-user {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #333;
    margin-bottom: 4px;
    overflow: hidden;
}
.pending-card .fin-nick {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
    color: #333;
}
.pending-card .fin-avatar-wrap {
    position: relative;
    flex: 0 0 22px;
    width: 28px;
    height: 28px;
}
.pending-card .fin-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    display: block;
    flex-shrink: 0;
}
.pending-card .fin-line {
    font-size: 11px;
    color: #999;
    line-height: 1.5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pending-card .fin-btn {
    margin-top: 8px;
    height: 32px;
    line-height: 32px;
    border-radius: 6px;
    background: linear-gradient(to bottom, #f8d68f, #f5bf55) !important;
    color: #000;
    font-size: 13px;
    
    text-align: center;
    flex-shrink: 0;
}

/* ========== 心愿单对标 ========== */
.wish-header { position: relative; }
.hdr-manage {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    color: #fff !important;
}
.wish-list {
    padding: 10px;
    padding-bottom: calc(88px + var(--lottery-tab-h) + env(safe-area-inset-bottom, 0px));
}
.wish-card {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    background: #fff;
    border-radius: 12px;
    padding: 12px;
    margin-bottom: 10px;
    position: relative;
}
.wish-check {
    position: relative;
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    margin-top: 28px;
}
.wish-check input {
    position: absolute;
    opacity: 0;
    inset: 0;
    margin: 0;
    cursor: pointer;
}
.wish-check i {
    display: flex;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid #ddd;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: transparent;
    background: #fff;
}
.wish-check input:checked + i {
    background: #fbbb3f;
    border-color: #fbbb3f;
    color: #fff;
}
.wish-check.all {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: auto;
    margin: 0;
    font-size: 13px;
    color: #333;
}
.wish-thumb img {
    width: 78px;
    height: 78px;
    border-radius: 8px;
    object-fit: cover;
    background: #eee;
    display: block;
}
.wish-body { flex: 1; min-width: 0; }
.wish-body .period-badge {
    display: inline-block;
    font-size: 11px;
    color: #f0a020;
    border: 1px solid #f0a020;
    border-radius: 4px;
    padding: 1px 6px;
    margin-bottom: 4px;
}
.wish-body .name {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
    max-height: 36px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.wish-meta-row {
    display: flex;
    justify-content: space-between;
    margin-top: 6px;
    font-size: 12px;
}
.wish-meta-row .total-need { color: var(--lottery-accent); font-weight: 700; }
.wish-meta-row .remain-need { color: #f0a020; }
.wish-step-row { margin-top: 8px; }
.wish-stepper {
    display: inline-flex;
    align-items: center;
    border: 1px solid #f0d18a;
    border-radius: 16px;
    overflow: hidden;
}
.wish-stepper button {
    width: 30px;
    height: 28px;
    border: 0;
    background: #fff8e6;
    color: #c48a10;
    font-size: 16px;
}
.wish-stepper input {
    width: 48px;
    height: 28px;
    border: 0;
    text-align: center;
    font-size: 13px;
    color: #333;
}
.wish-quick {
    display: flex;
    gap: 6px;
    margin-top: 8px;
    flex-wrap: wrap;
}
.wish-quick button {
    border: 1px solid #f0d18a;
    background: #fff;
    color: #c48a10;
    border-radius: 12px;
    font-size: 11px;
    padding: 3px 8px;
}
.wish-del {
    position: absolute;
    right: 10px;
    top: 10px;
    color: #bbb;
    font-size: 16px;
}
.wish-footer-dock {
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(var(--lottery-tab-h) + env(safe-area-inset-bottom, 0px));
    z-index: 90;
    background: #fff;
    box-shadow: 0 -2px 10px rgba(0,0,0,.04);
}
.wish-tip {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 8px 12px 0;
    font-size: 12px;
    color: #999;
    background: #fff;
}
.wish-tip .fa-info-circle { color: #f0a020; margin-right: 4px; }
.wish-tip-text { flex: 1; min-width: 0; }
.wish-tip-help {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    border-radius: 50%;
    border: 1px solid #cfcfcf;
    color: #999;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
}
.wish-help-mask {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    box-sizing: border-box;
}
.wish-help-dialog {
    width: 100%;
    max-width: 300px;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    text-align: center;
}
.wish-help-dialog h3 {
    margin: 0;
    padding: 22px 20px 10px;
    font-size: 17px;
    font-weight: 700;
    color: #333;
}
.wish-help-dialog p {
    margin: 0;
    padding: 0 22px 22px;
    font-size: 14px;
    color: #666;
    line-height: 1.7;
}
.wish-help-dialog .wish-help-ok {
    display: block;
    width: 100%;
    height: 46px;
    border: 0;
    border-top: 0;
    background: linear-gradient(90deg, #ff8c42 0%, #ffc34d 100%);
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}
.wish-checkout-pro {
    position: relative;
    bottom: auto;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 10px 12px;
    background: #fff;
    border-top: 1px solid #f0f0f0;
    border-radius: 0;
    box-shadow: none;
}
.wish-sum { flex: 1; min-width: 0; text-align: right; }
.wish-sum .bal {
    display: inline-block;
    font-size: 11px;
    color: #8a6a20;
    background: #fff8e6;
    border-radius: 10px;
    padding: 1px 8px;
    margin-bottom: 2px;
}
.wish-sum .total { font-size: 13px; color: #333; }
.wish-sum .total em {
    color: var(--lottery-accent);
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
}
.btn-exchange {
    flex-shrink: 0;
    background: linear-gradient(90deg, #ffb347, #fbbb3f);
    color: #333 !important;
    font-weight: 700;
    font-size: 14px;
    border-radius: 22px;
    padding: 10px 14px;
    white-space: nowrap;
}

/* ========== 个人名片 ========== */
.info-user-page { background: #f5f5f5; min-height: 100vh; padding-bottom: 20px; }
.info-user-top {
    background: linear-gradient(180deg, #f7b844 0%, #f4bb4e 100%);
    padding: 0 0 18px;
}
.info-user-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 46px;
    position: relative;
}
.info-user-nav h1 {
    margin: 0;
    font-size: 17px;
    color: #333;
    font-weight: 600;
}
.info-user-back {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #333 !important;
    font-size: 22px;
    padding: 4px 8px;
}
.info-user-profile {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 16px 2px;
}
.info-user-profile .avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
   
}
.info-user-profile .uname {
    font-size: 16px;
    font-weight: 600;
    color: #333;
}
.info-user-profile .uid { display: none; }
.info-user-tabs {
    display: flex;
    background: #fff;
    border-bottom: 1px solid #f0f0f0;
}
.info-user-tabs a {
    flex: 1;
    text-align: center;
    padding: 13px 0 12px;
    font-size: 14px;
    color: #888;
    position: relative;
    text-decoration: none;
}
.info-user-tabs a.active {
    color: #222;
    font-weight: 700;
}
.info-user-tabs a.active:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 28px;
    height: 3px;
    margin-left: -14px;
    border-radius: 2px;
    background: #333;
}
.info-user-privacy {
    text-align: center;
    font-size: 12px;
    color: #e74c3c;
    padding: 14px 12px 8px;
    line-height: 1.5;
}
.info-user-list {
    margin: 0;
    background: transparent;
    border-radius: 0;
    min-height: 200px;
    padding: 10px 12px 12px;
}
.ucard-item {
    position: relative;
    display: flex;
    gap: 10px;
    padding: 12px;
    margin-bottom: 10px;
    background: #fff;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 4px rgba(0,0,0,.03);
    overflow: hidden;
}
.ucard-item .thumb {
    width: 78px;
    height: 78px;
    border-radius: 6px;
    object-fit: cover;
    background: #f3f3f3;
    flex-shrink: 0;
}
.ucard-item .body { flex: 1; min-width: 0; padding-right: 8px; }
.ucard-item .name {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 500;
    color: #555;
    line-height: 1.35;
}
.ucard-item .name em {
    font-style: normal;
    color: #f0a020;
    font-weight: 600;
    margin-right: 2px;
}
.ucard-item .points {
    margin: 0 0 6px;
    font-size: 13px;
    color: #e74c3c;
    font-weight: 600;
}
.ucard-item .line {
    margin: 0 0 3px;
    font-size: 12px;
    color: #999;
    line-height: 1.45;
}
.ucard-item .line b { font-weight: 600; color: #666; }
.ucard-item .line b.need { color: #e74c3c; }
.ucard-item .line .code { color: #f0a020; font-weight: 600; }
.ucard-item .line.muted { color: #aaa; }
.ucard-progress {
    height: 6px;
    border-radius: 3px;
    background: #f0f0f0;
    overflow: hidden;
    margin: 0 0 6px;
}
.ucard-progress i {
    display: block;
    height: 100%;
    border-radius: 3px;
    background: linear-gradient(90deg, #ffd36a, #f4bb4e);
}
.ucard-stats {
    display: flex;
    justify-content: space-between;
    gap: 4px;
    font-size: 11px;
    color: #999;
}
.ucard-stamp {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: 2px solid rgba(244, 187, 78, .55);
    color: rgba(240, 160, 32, .7);
    font-size: 13px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transform: rotate(-18deg);
    background: rgba(255, 248, 230, .35);
    box-shadow: inset 0 0 0 3px rgba(244, 187, 78, .2);
    pointer-events: none;
    letter-spacing: 1px;
}
.ucard-stamp::before {
    content: "";
    position: absolute;
    inset: 4px;
    border-radius: 50%;
    border: 1px dashed rgba(244, 187, 78, .45);
}
.profile-record-card {
    display: flex;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid #f3f3f3;
}
.profile-record-card:last-child { border-bottom: 0; }
.profile-record-card .thumb {
    width: 64px;
    height: 64px;
    border-radius: 8px;
    object-fit: cover;
    background: #eee;
    flex-shrink: 0;
}
.profile-record-card .body { flex: 1; min-width: 0; }
.profile-record-card .name {
    font-size: 13px;
    font-weight: 600;
    color: #555;
    line-height: 1.35;
    max-height: 36px;
    overflow: hidden;
}
.profile-record-card .meta {
    margin-top: 4px;
    font-size: 11px;
    color: #999;
}
.points-profile-empty {
    text-align: center;
    padding: 36px 12px;
    color: #999;
    font-size: 13px;
}
.points-profile-empty img {
    width: 120px;
    max-width: 50%;
    display: block;
    margin: 0 auto 10px;
    opacity: .9;
}

/* ========== 收藏列表 ========== */
.lottery-header.page-nav-dark .hdr-manage {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    font-weight: 400;
    color: #000 !important;
}
.lottery-header.page-nav-dark.has-lang-switch .hdr-manage,
.lottery-header.page-nav-dark.has-lang-switch .hdr-search-btn {
    right: 46px;
}
.lottery-header.has-lang-switch .hdr-right-link {
    right: 46px;
}
.collect-page { min-height: 50vh; }
.collect-list { padding: 10px 10px 12px; }
.collect-card {
    display: flex;
    align-items: stretch;
    gap: 0;
    margin-bottom: 10px;
}
.collect-check {
    display: none;
    width: 28px;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    margin-right: 6px;
}
.collect-page.is-editing .collect-check { display: flex; }
.collect-page.is-editing .collect-stats .btn-mini { display: none; }
.collect-check input { display: none; }
.collect-check i {
    width: 20px;
    height: 20px;
    border: 1.5px solid #ccc;
    border-radius: 50%;
    box-sizing: border-box;
    position: relative;
}
.collect-check input:checked + i {
    border-color: #fbbb3f;
    background: #fbbb3f;
}
.collect-check input:checked + i:after {
    content: "";
    position: absolute;
    left: 6px;
    top: 3px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.collect-card-main {
    flex: 1;
    min-width: 0;
    display: flex;
    gap: 10px;
    padding: 10px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.collect-card .thumb-wrap { flex-shrink: 0; }
.collect-card .thumb {
    width: 86px;
    height: 86px;
    border-radius: 8px;
    object-fit: cover;
    background: #eee;
    display: block;
}
.collect-card .body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.collect-card .name {
    font-size: 13px;
    font-weight: 400;
    color: #222;
    line-height: 1.35;
    max-height: 36px;
    overflow: hidden;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    word-break: break-word;
}
.collect-card .price {
    color: #ff2f1a;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 6px;
}
.collect-progress {
    height: 6px;
    border-radius: 3px;
    background: #f0f0f0;
    overflow: hidden;
}
.collect-progress > i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #ffc85a, #fbbb3f);
}
.collect-stats {
    display: flex;
    align-items: center;
    margin-top: 6px;
    gap: 4px;
}
.collect-stats .col {
    flex: 1;
    text-align: center;
    min-width: 0;
}
.collect-stats .col b {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: #333;
    line-height: 1.2;
}
.collect-stats .col b.remain { color: #ff9f18; }
.collect-stats .col span {
    display: block;
    font-size: 11px;
    color: #999;
    margin-top: 1px;
}
.collect-stats .btn-mini {
    flex-shrink: 0;
    background: #fbbb3f;
    color: #333;
    font-size: 12px;
    font-weight: 400;
    border-radius: 14px;
    padding: 5px 10px;
    white-space: nowrap;
}
.collect-stats .btn-mini.ghost {
    background: #f2f2f2;
    color: #888;
}
.collect-bar {
    position: fixed;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--lottery-max);
    z-index: 110;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
    background: #fff;
    box-sizing: border-box;
    box-shadow: 0 -2px 10px rgba(0,0,0,.04);
}
.collect-bar.normal { justify-content: center; background: transparent; box-shadow: none; }
.collect-bar .btn-wish-all {
    width: 100%;
    height: 44px;
    border: 0;
    border-radius: 22px;
    background: #fbbb3f;
    color: #333;
    font-size: 16px;
    font-weight: 400;
}
.collect-bar.edit { justify-content: space-between; }
.collect-bar .btn-check-all {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: #fbbb3f;
    color: #fff;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: .45;
}
.collect-bar .btn-check-all.on { opacity: 1; }
.collect-bar .btn-unfav-batch {
    flex: 1;
    height: 40px;
    border: 0;
    border-radius: 20px;
    background: #fbbb3f;
    color: #fff;
    font-size: 15px;
}
.subpage-body {
    margin: 0;
    padding: 16px 12px 20px;
    background: #fff;
    min-height: 40vh;
}
.subpage-body.invite-panel {
    margin: 0;
    border-radius: 0;
}
.joins-list {
    padding: 0;
    background: #fff;
}
.joins-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border-bottom: 1px solid #f5f5f5;
}
.joins-row .joins-main { flex: 1; min-width: 0; }
.joins-row .name { font-size: 14px; font-weight: 600; color: #333; }
.joins-row .meta { font-size: 12px; color: #999; margin-top: 4px; }
.joins-row .code { font-size: 12px; color: #e74c3c; margin-top: 4px; }
.joins-row .joins-side { text-align: right; flex-shrink: 0; }
.joins-row .amount { color: #e74c3c; font-weight: 600; }
.joins-row .status { font-size: 11px; color: #999; margin-top: 4px; }
.pager-wrap { text-align: center; padding: 12px 0; }
.hdr-back {
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    padding: 4px 8px;
    font-size: 22px;
    line-height: 1;
}
/* page-nav-dark 保持 sticky，与 win/collect 一致，避免顶缝 */

/* ========== 文章 ========== */
.article-page { padding: 12px 14px 24px; background: #fff; min-height: 60vh; }
.article-body { font-size: 14px; color: #333; line-height: 1.7; }
.article-body p { margin: 0 0 12px; }

/* ========== 编辑资料 ========== */
.mall-user-profile .avatar-link { display: block; flex-shrink: 0; }
.mall-user-profile .avatar-link .avatar { display: block; }
.mall-user-profile a.uname { color: #333; font-weight: 700; }
.profile-edit-page { background: #f5f5f5; min-height: 60vh; padding-bottom: 24px; }
.profile-avatar-box {
    background: #fff;
    text-align: center;
    padding: 24px 12px 18px;
    margin-bottom: 10px;
}
.profile-avatar-box .avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
}
.profile-avatar-box .btn-change-avatar {
    margin-top: 10px;
    border: 0;
    background: transparent;
    color: #f7b844;
    font-size: 13px;
}
.profile-form { background: #fff; }
.profile-form .row-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 14px;
    border-bottom: 1px solid #f5f5f5;
    font-size: 14px;
}
.profile-form .row-item input[type="text"],
.profile-form .row-item input[type="date"] {
    border: 0;
    outline: none;
    text-align: right;
    flex: 1;
    min-width: 0;
    color: #333;
    background: transparent;
}
.profile-form .gender-group {
    display: flex;
    gap: 12px;
    color: #666;
    font-size: 13px;
}
.profile-form .gender-group label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* ========== 登录/注册/找回（对标截图） ========== */
.auth-shell {
    min-height: 100vh;
    background: #fff;
    padding-bottom: 40px;
}
.auth-topbar {
    position: relative;
    height: 150px;
    background: #fbbb3f;
    color: #333;
}
.auth-topbar .auth-back,
.auth-topbar .auth-top-link {
    position: absolute;
    top: 12px;
    z-index: 2;
    color: #333 !important;
    text-decoration: none;
    font-size: 15px;
    line-height: 28px;
}
.auth-topbar .auth-back {
    left: 10px;
    font-size: 26px;
    padding: 0 8px;
}
.auth-topbar .auth-top-link {
    right: 14px;
}
.auth-topbar.has-lang-switch .auth-top-link {
    right: 48px;
}
.auth-topbar .auth-top-link.placeholder {
    visibility: hidden;
}
.auth-topbar .auth-top-title {
    position: absolute;
    left: 0;
    right: 0;
    top: 14px;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    color: #333;
}
.auth-card-wrap {
    margin-top: -78px;
    padding: 0 16px;
    position: relative;
    z-index: 3;
}
.auth-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    padding: 8px 18px 22px;
}
.auth-invite-bar {
    margin: 10px 0 4px;
    padding: 8px 10px;
    background: #fff8e8;
    color: #c88a00;
    border-radius: 6px;
    font-size: 12px;
}
.auth-card-form .auth-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    border-bottom: 1px solid #eee;
    position: relative;
}
.auth-card-form .auth-label {
    width: 52px;
    flex-shrink: 0;
    font-size: 14px;
    color: #666;
    margin: 0;
    font-weight: 400;
}
.auth-card-form .auth-line-input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: none;
    height: 48px;
    font-size: 14px;
    color: #333;
    background: transparent;
    padding: 0;
}
.auth-card-form .auth-line-input::placeholder {
    color: #bbb;
}
.auth-row-msg {
    min-height: 18px;
    font-size: 12px;
    color: #e74c3c;
    line-height: 18px;
    padding: 2px 0 0 62px;
}
.auth-code-btn {
    flex-shrink: 0;
    border: 0;
    background: #ffe3a3;
    color: #333;
    height: 30px;
    padding: 0 12px;
    border-radius: 15px;
    font-size: 12px;
    line-height: 30px;
    white-space: nowrap;
}
.auth-code-btn.disabled {
    opacity: 0.7;
}
.auth-eye {
    flex-shrink: 0;
    border: 0;
    background: transparent;
    color: #999;
    width: 32px;
    height: 32px;
    padding: 0;
    font-size: 16px;
}
.auth-captcha-img {
    height: 34px;
    border-radius: 4px;
    cursor: pointer;
}
.auth-agree-line {
    margin: 14px 0 18px;
    font-size: 13px;
    color: #666;
}
.auth-agree-line label {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 0;
    font-weight: 400;
}
.auth-agree-line input[type="checkbox"] {
    margin-top: 2px;
    accent-color: #fbbb3f;
}
.auth-agree-line a {
    color: #d19a2a;
}
.auth-main-btn {
    width: 100%;
    height: 44px;
    border: 0;
    border-radius: 22px;
    background: #fbbb3f;
    color: #333;
    font-size: 16px;
}
.auth-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 16px;
    padding: 18px 8px 0;
    font-size: 14px;
}
.auth-card-footer .auth-footer-left,
.auth-card-footer .auth-footer-right {
    display: inline-flex;
    align-items: center;
    gap: 14px;
}
.auth-card-footer a {
    color: #333;
    text-decoration: none;
}

/* 找回密码沿用卡片样式 */
.auth-page { background: #fff; min-height: 70vh; }
.auth-body { padding: 28px 22px 40px; }
.auth-brand {
    font-size: 22px;
    font-weight: 700;
    color: #222;
    margin-bottom: 24px;
}
.auth-form .auth-field { margin-bottom: 14px; }
.auth-form .auth-input {
    width: 100%;
    height: 46px;
    border: 0;
    border-bottom: 1px solid #eee;
    outline: none;
    font-size: 15px;
    background: transparent;
    box-sizing: border-box;
}
.auth-form .auth-captcha {
    display: flex;
    align-items: center;
    gap: 8px;
}
.auth-form .btn-send-code {
    flex-shrink: 0;
    border: 0;
    background: #fbbb3f;
    color: #333;
    height: 36px;
    padding: 0 12px;
    border-radius: 18px;
    font-size: 12px;
    line-height: 36px;
    white-space: nowrap;
    display: inline-block;
    text-decoration: none;
}
.auth-btn {
    width: 100%;
    height: 46px;
    border: 0;
    border-radius: 23px;
    background: #fbbb3f;
    color: #333;
    font-size: 16px;
}
.auth-links {
    text-align: center;
    margin-top: 16px;
    font-size: 13px;
    color: #888;
}
.auth-links a { color: #f7b844; }
.auth-tabs {
    display: flex;
    gap: 18px;
    margin-bottom: 16px;
}
.auth-tabs .tab {
    font-size: 14px;
    color: #999;
    padding-bottom: 6px;
    border-bottom: 2px solid transparent;
}
.auth-tabs .tab.active {
    color: #333;
    border-bottom-color: #fbbb3f;
}
.profile-form .muted {
    font-style: normal;
    color: #999;
    font-size: 13px;
}

/* ========== 收货地址 ========== */
.addr-page {
    background: #f5f5f5;
    min-height: 60vh;
    padding: 10px 12px 24px;
}
.addr-empty {
    text-align: center;
    padding: 60px 0 20px;
    color: #999;
    font-size: 13px;
}
.addr-empty img {
    width: 120px;
    opacity: 0.85;
    margin-bottom: 8px;
}
.addr-card {
    background: #fff;
    border-radius: 10px;
    padding: 14px 14px 10px;
    margin-bottom: 10px;
}
.addr-top {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 6px;
}
.addr-name {
    font-size: 15px;
    font-weight: 600;
    color: #222;
}
.addr-mobile {
    font-size: 14px;
    color: #666;
}
.addr-default-tag {
    font-style: normal;
    font-size: 11px;
    color: #fff;
    background: #fbbb3f;
    border-radius: 3px;
    padding: 1px 6px;
    line-height: 16px;
}
.addr-text {
    font-size: 13px;
    color: #666;
    line-height: 1.5;
}
.addr-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid #f3f3f3;
}
.addr-default-set {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    font-size: 13px;
    color: #666;
    font-weight: 400;
}
.addr-default-set input {
    accent-color: #fbbb3f;
}
.addr-btns {
    display: flex;
    gap: 16px;
}
.addr-btns a {
    font-size: 13px;
    color: #666;
}
.addr-edit-page {
    background: #f5f5f5;
    min-height: 60vh;
    padding-bottom: 24px;
}
.addr-edit-page .profile-form {
    margin-top: 10px;
}
.addr-region-link {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    color: #333;
    text-decoration: none;
    font-size: 14px;
}
.addr-region-link em {
    font-style: normal;
    color: #999;
    text-align: right;
}
.addr-region-link em:not(:empty) {
    color: #333;
}
.addr-detail-row {
    align-items: flex-start !important;
}
.addr-detail-row textarea {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: none;
    resize: none;
    text-align: right;
    font-size: 14px;
    color: #333;
    background: transparent;
    padding: 0;
    margin: 0;
    line-height: 1.5;
}
.addr-switch {
    position: relative;
    width: 44px;
    height: 24px;
    margin: 0;
}
.addr-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}
.addr-switch i {
    position: absolute;
    inset: 0;
    background: #ddd;
    border-radius: 12px;
    transition: .2s;
}
.addr-switch i::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    left: 2px;
    top: 2px;
    background: #fff;
    border-radius: 50%;
    transition: .2s;
}
.addr-switch input:checked + i {
    background: #fbbb3f;
}
.addr-switch input:checked + i::after {
    transform: translateX(20px);
}
.addr-region-mask {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 1000;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.addr-region-panel {
    width: 100%;
    max-width: 500px;
    background: #fff;
    border-radius: 12px 12px 0 0;
    max-height: 70vh;
    display: flex;
    flex-direction: column;
}
.addr-region-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 15px;
}
.addr-region-head a {
    color: #f7b844;
    font-size: 14px;
}
.addr-region-tabs {
    display: flex;
    gap: 16px;
    padding: 10px 14px 0;
    border-bottom: 1px solid #f5f5f5;
}
.addr-region-tabs a {
    font-size: 13px;
    color: #999;
    padding-bottom: 8px;
    border-bottom: 2px solid transparent;
}
.addr-region-tabs a.active {
    color: #333;
    border-bottom-color: #fbbb3f;
}
.addr-region-list {
    overflow-y: auto;
    max-height: 50vh;
    padding: 6px 0 20px;
}
.addr-region-list a {
    display: block;
    padding: 12px 16px;
    font-size: 14px;
    color: #333;
}
.addr-region-list a.active {
    color: #f7b844;
}

/* ========== 介绍页 drawExplain（对标 jjgsc） ========== */
.explain-page {
    background: #fff5f3;
    min-height: 60vh;
    padding: 12px 12px 28px;
    box-sizing: border-box;
}
.explain-banner-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 14px rgba(255, 120, 70, 0.12);
    margin-bottom: 18px;
}
.explain-banner-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 20px 16px 18px;
    background: linear-gradient(125deg, #ff7a45 0%, #ff5e6a 55%, #ff8a4c 100%);
    color: #fff;
    position: relative;
}
.explain-banner-top::after {
    content: '';
    position: absolute;
    right: -20px;
    top: -24px;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: rgba(255,255,255,.12);
}
.explain-banner-text {
    position: relative;
    z-index: 1;
    flex: 1;
    min-width: 0;
}
.explain-banner-text h1 {
    margin: 0;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 0.5px;
    line-height: 1.25;
}
.explain-banner-text p {
    margin: 8px 0 0;
    font-size: 13px;
    opacity: 0.92;
}
.explain-banner-illu {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
}
.explain-banner-body {
    padding: 14px 16px 16px;
    font-size: 13px;
    color: #555;
    line-height: 1.75;
    background: #fff;
}
.explain-banner-body strong {
    color: #ff6a2c;
    font-weight: 700;
}
.explain-block-title {
    font-size: 14px;
    font-weight: 700;
    color: #444;
    margin: 0 4px 8px;
}
.explain-benefit-card {
    position: relative;
    background: #fff;
    border-radius: 16px;
    padding: 16px 16px 18px;
    margin-bottom: 16px;
    box-shadow: 0 3px 12px rgba(0,0,0,.04);
}
.explain-gift-ico {
    position: absolute;
    top: 10px;
    right: 12px;
    opacity: 0.95;
}
.explain-benefit-card h2 {
    margin: 0 48px 8px 0;
    font-size: 17px;
    font-weight: 800;
    color: #222;
}
.explain-benefit-card .explain-desc {
    margin: 0 0 14px;
    font-size: 13px;
    color: #777;
    line-height: 1.6;
}
.explain-timeline {
    list-style: none;
    margin: 0;
    padding: 0 0 0 2px;
}
.explain-timeline li {
    position: relative;
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 0 0 14px 0;
    font-size: 13px;
    color: #444;
    line-height: 1.55;
}
.explain-timeline li:last-child {
    padding-bottom: 0;
}
.explain-timeline li:not(:last-child)::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 22px;
    bottom: 0;
    width: 2px;
    background: #ffd0b5;
}
.explain-timeline em {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ff8a3d, #ff6b2c);
    color: #fff;
    font-style: normal;
    font-size: 12px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(255,107,44,.28);
}
.explain-foot {
    text-align: center;
    font-size: 12px;
    color: #aaa;
    padding: 4px 8px 0;
    line-height: 1.5;
}

/* ========== 购物新体验 / 购买赠送积分 ========== */
.shop-earn-nav {
    background: #ff7a2f !important;
}
.shop-earn-nav .hdr-title,
.shop-earn-nav .hdr-back,
.shop-earn-nav .hdr-back .fa {
    color: #111 !important;
}
.shop-earn-page {
    min-height: calc(100vh - 46px);
    background: #fff5e8;
    padding-bottom: 24px;
}
.shop-earn-banner {
    display: block;
    width: 100%;
    line-height: 0;
    background: #ff7a2f;
}
.shop-earn-banner img {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: top;
}
.shop-earn-list {
    padding: 0 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff5e8;
}
.shop-earn-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(255, 122, 47, .08);
}
.shop-earn-card .thumb {
    width: 96px;
    height: 96px;
    border-radius: 8px;
    overflow: hidden;
    background: #f7f7f7;
    flex-shrink: 0;
}
.shop-earn-card .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.shop-earn-card .body {
    flex: 1;
    min-width: 0;
}
.shop-earn-card .name {
    display: block;
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 700;
    color: #222;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-decoration: none;
}
.shop-earn-card .gift-tag {
    display: inline-block;
    margin-bottom: 6px;
    padding: 2px 10px;
    border-radius: 12px;
    background: linear-gradient(90deg, #f8d28b, #ef8f3b);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
}
.shop-earn-card .price {
    color: #ff7a2f;
    font-size: 18px;
    font-weight: 800;
}
.shop-earn-card .tags {
    margin-top: 4px;
    display: flex;
    gap: 6px;
}
.shop-earn-card .tag {
    font-size: 11px;
    line-height: 1.5;
    padding: 0 5px;
    border-radius: 3px;
    border: 1px solid currentColor;
}
.shop-earn-card .tag-custom { color: #3b82f6; }
.shop-earn-card .tag-ship { color: #ff7a2f; }
.shop-earn-card .btn-buy {
    flex-shrink: 0;
    align-self: center;
    padding: 4px 8px;
    border-radius: 20px;
    background: #fbbb3f94;
    color: #666;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(255, 154, 46, .28);
    white-space: nowrap;
    text-decoration: none;
}
.shop-earn-toast {
    position: fixed;
    left: 50%;
    bottom: 20%;
    transform: translateX(-50%) translateY(10px);
    z-index: 9999;
    padding: 10px 18px;
    border-radius: 8px;
    background: rgba(0,0,0,.78);
    color: #fff;
    font-size: 13px;
    opacity: 0;
    transition: .25s ease;
    pointer-events: none;
}
.shop-earn-toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* ========== 定制商品详情 / 确认订单 / 支付 ========== */
.mall-detail-page { padding-bottom: 72px; background: #f5f5f5; min-height: calc(100vh - 46px); }
.mall-detail-gallery { background: #fff; }
.mall-detail-gallery img { width: 100%; display: block; aspect-ratio: 1; object-fit: cover; }
.mall-detail-pricebar {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 14px; background: linear-gradient(90deg, #ffd76a, #f7b844);
}
.mall-detail-pricebar strong { font-size: 26px; color: #222; font-weight: 800; }
.mall-detail-pricebar .gift {
    padding: 3px 10px; border-radius: 14px; background: #555; color: #fff; font-size: 12px; font-weight: 600;
}
.mall-detail-info { margin: 10px 12px; padding: 14px; background: #fff; border-radius: 12px; }
.mall-detail-info h1 { margin: 8px 0 10px; font-size: 18px; font-weight: 800; color: #222; }
.mall-detail-info .tags { display: flex; gap: 6px; }
.mall-detail-info .guarantee { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 14px; }
.mall-detail-info .guarantee li { font-size: 12px; color: #888; }
.mall-detail-info .guarantee i { color: #f7b844; margin-right: 3px; }
.mall-detail-tabs {
    display: flex; gap: 24px; margin: 0 12px; padding: 0 4px;
    border-bottom: 1px solid #eee; background: #fff; border-radius: 12px 12px 0 0;
}
.mall-detail-tabs a {
    padding: 12px 4px 10px; font-size: 14px; color: #666; position: relative; text-decoration: none;
}
.mall-detail-tabs a.active { color: #222; font-weight: 700; }
.mall-detail-tabs a.active::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
    background: #f7b844; border-radius: 2px;
}
.mall-detail-panel { margin: 0 12px 12px; padding: 12px; background: #fff; border-radius: 0 0 12px 12px; }
.mall-detail-panel .rich img { max-width: 100%; height: auto; }
.mall-detail-panel .empty { color: #aaa; text-align: center; padding: 20px 0; }
.mall-detail-panel .notice-text { font-size: 13px; color: #555; line-height: 1.7; }
.mall-detail-foot {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    background: #fff; box-shadow: 0 -2px 10px rgba(0,0,0,.06);
}
.btn-mall-buy, .btn-mall-pay, .btn-order {
    display: block; width: 100%; text-align: center; border: 0;
    padding: 13px 16px; border-radius: 24px;
    background: linear-gradient(180deg, #ffd76a, #f5b820);
    color: #5a3a00; font-size: 16px; font-weight: 800;
}
.mall-confirm-page { padding: 12px 12px 90px; background: #f5f5f5; min-height: calc(100vh - 46px); }
.mall-addr-card, .mall-confirm-goods, .mall-confirm-remark, .mall-confirm-notice {
    background: #fff; border-radius: 12px; margin-bottom: 10px; padding: 12px;
}
.addr-empty, .addr-add-link {
    display: flex; align-items: center; justify-content: space-between;
    color: #ff7a2f; font-size: 14px; text-decoration: none; padding: 6px 0;
}
.addr-item {
    display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f2f2f2;
}
.addr-item:last-of-type { border-bottom: 0; }
.addr-item input { margin-top: 4px; accent-color: #f7b844; }
.addr-item .line1 { font-size: 14px; color: #222; margin-bottom: 4px; }
.addr-item .line2 { font-size: 12px; color: #888; line-height: 1.4; }
.addr-item.active .line1 b { color: #ff7a2f; }
.mall-confirm-goods { display: flex; gap: 10px; align-items: flex-start; }
.mall-confirm-goods .thumb { width: 72px; height: 72px; border-radius: 8px; object-fit: cover; }
.mall-confirm-goods .meta { flex: 1; min-width: 0; }
.mall-confirm-goods .name { font-size: 14px; font-weight: 700; color: #222; margin-bottom: 6px; }
.mall-confirm-goods .gift-tag {
    display: inline-block; margin-bottom: 6px; padding: 2px 8px; border-radius: 12px;
    background: linear-gradient(90deg, #ff8a2b, #ff6a00); color: #fff; font-size: 11px; font-weight: 700;
}
.mall-confirm-goods .price { color: #e53935; font-size: 16px; font-weight: 800; }
.qty-box { display: flex; align-items: center; gap: 4px; margin-top: 28px; }
.qty-box button {
    width: 28px; height: 28px; border: 0; border-radius: 6px;
    background: #ffe4c4; color: #b85c00; font-size: 16px; font-weight: 700;
}
.qty-box input {
    width: 36px; height: 28px; text-align: center; border: 1px solid #eee; border-radius: 6px; font-size: 14px;
}
.mall-confirm-remark { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 14px; }
.mall-confirm-remark input { flex: 1; border: 0; text-align: right; color: #333; outline: none; }
.mall-confirm-notice h3 { margin: 0 0 8px; font-size: 15px; }
.mall-confirm-notice .txt { font-size: 12px; color: #666; line-height: 1.7; }
.mall-confirm-foot {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    background: #fff; box-shadow: 0 -2px 10px rgba(0,0,0,.06);
}
.mall-confirm-foot .sum { flex: 1; font-size: 13px; color: #444; }
.mall-confirm-foot .sum em { color: #e53935; font-style: normal; font-weight: 800; font-size: 16px; }
.mall-confirm-foot .btn-order { width: auto; padding: 12px 22px; white-space: nowrap; }
.mall-pay-page { padding: 20px 14px 90px; background: #f5f5f5; min-height: calc(100vh - 46px); }
.mall-pay-amount { text-align: center; font-size: 32px; font-weight: 800; color: #222; margin-top: 10px; }
.mall-pay-sub { text-align: center; font-size: 12px; color: #999; margin: 8px 0 20px; }
.mall-pay-methods { background: #fff; border-radius: 12px; overflow: hidden; }
.pay-item {
    display: flex; align-items: center; gap: 12px; padding: 16px 14px;
    border-bottom: 1px solid #f2f2f2; position: relative;
}
.pay-item:last-child { border-bottom: 0; }
.pay-item input { display: none; }
.pay-item .ico {
    width: 36px; height: 36px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 800;
}
.pay-item .ico.balance { background: #e53935; }
.pay-item .ico.usdt { background: #26a17b; font-size: 14px; }
.pay-item .txt { flex: 1; font-size: 15px; color: #222; }
.pay-item .checked { color: #ddd; font-size: 20px; }
.pay-item.active .checked { color: #f7b844; }
.mall-pay-foot {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); background: #fff;
}

/* ========== 推广费（对标 jjgsc userCommission） ========== */
.lottery-header .hdr-right-link {
    position: absolute; right: 12px; top: 0; height: var(--lottery-nav-h);
    line-height: var(--lottery-nav-h); font-size: 14px; color: #000 !important;
    text-decoration: none; font-weight: 400;
}
.commission-page { padding: 12px 12px 28px; background: #f5f5f5; min-height: calc(100vh - 46px); }
.commission-card {
    background: #fff; border-radius: 12px; overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.commission-card .secure-bar {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    height: 28px; background: #fff8e8; color: #c9a227; font-size: 12px;
}
.commission-card .secure-bar .fa { color: #e6b422; }
.commission-card .bal-wrap { text-align: center; padding: 28px 16px 18px; }
.commission-card .bal-num { font-size: 34px; font-weight: 700; color: #222; letter-spacing: .5px; }
.commission-card .bal-label { margin-top: 6px; font-size: 13px; color: #999; }
.commission-card .bal-actions {
    display: flex; gap: 12px; padding: 0 18px 20px;
}
.commission-card .bal-actions button {
    flex: 1; height: 40px; border-radius: 22px; font-size: 15px; font-weight: 500;
}
.commission-card .btn-outline {
    border: 1px solid #ddd; background: #fff; color: #333;
}
.commission-card .btn-solid {
    border: 0; background: #fbbb3f; color: #fff;
}
.commission-sec-title {
    margin: 16px 2px 8px; font-size: 14px; color: #666; font-weight: 500;
}
.commission-panel {
    background: #fff; border-radius: 12px; padding: 4px 14px 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,.03);
}
.commission-empty { text-align: center; color: #bbb; padding: 36px 0; font-size: 13px; }
.commission-row {
    display: flex; justify-content: space-between; gap: 10px;
    padding: 14px 0; border-bottom: 1px solid #f2f2f2;
}
.commission-row:last-child { border-bottom: 0; }
.commission-row .name { font-size: 14px; color: #222; font-weight: 500; }
.commission-row .time { font-size: 12px; color: #999; margin-top: 4px; }
.commission-row .right { text-align: right; flex-shrink: 0; }
.commission-row .amt { font-size: 15px; font-weight: 700; color: #222; }
.commission-row .amt.plus { color: #e74c3c; }
.commission-row .amt.minus { color: #222; }
.commission-row .st { font-size: 12px; margin-top: 4px; color: #999; }
.commission-row .st-pending { color: #f0a020; }
.commission-row .st-approved { color: #2e7d32; }
.commission-row .st-rejected { color: #999; }
.commission-mask {
    position: fixed; inset: 0; z-index: 80; background: rgba(0,0,0,.45);
    display: flex; align-items: flex-end; justify-content: center;
}
.commission-sheet {
    width: 100%; max-width: 480px; background: #fff; border-radius: 16px 16px 0 0;
    padding: 16px 16px calc(16px + env(safe-area-inset-bottom));
}
.commission-sheet .sheet-title { text-align: center; font-size: 16px; font-weight: 700; margin-bottom: 8px; }
.commission-sheet .sheet-tip { font-size: 12px; color: #999; margin: 0 0 12px; line-height: 1.5; }
.commission-sheet .sheet-field { display: block; margin-bottom: 10px; }
.commission-sheet .sheet-field span { display: block; font-size: 12px; color: #888; margin-bottom: 4px; }
.commission-sheet .sheet-field input,
.commission-sheet .sheet-field select,
.commission-sheet .sheet-field textarea {
    width: 100%; border: 1px solid #eee; border-radius: 10px; padding: 10px 12px; font-size: 14px; background: #fafafa;
    box-sizing: border-box;
}
.commission-sheet .sheet-cancel {
    display: block; text-align: center; color: #999; margin-top: 12px; padding: 8px; text-decoration: none;
}

/* ========== 换得商品 / 换取记录（对标 jjgsc record-order） ========== */
.record-order-page { background: #f6f6f6; min-height: calc(100vh - 46px); }
.record-order-tabs {
    display: flex; height: 38px; background: #fff; border-bottom: 1px solid #f0f0f0;
    position: sticky; top: var(--lottery-nav-h); z-index: 20;
}
.record-order-tabs a,
.record-order-tabs button {
    position: relative; flex: 1; height: 38px; border: 0; background: #fff;
    color: #555; font-size: 13px; font-weight: 400; text-decoration: none;
    display: flex; align-items: center; justify-content: center;
}
.record-order-tabs a.active,
.record-order-tabs button.active { color: #111; }
.record-order-tabs a.active::after,
.record-order-tabs button.active::after {
    content: ""; position: absolute; left: 50%; bottom: 0; width: 36px; height: 2px;
    background: #333; transform: translateX(-50%);
}
.record-order-list { padding: 10px 10px 24px; }
.record-order-card {
    background: #fff; border-radius: 10px; margin-bottom: 10px; overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.03);
}
.record-card-head {
    display: flex; justify-content: space-between; align-items: flex-start;
    padding: 12px 12px 0; gap: 8px;
}
.record-card-label { font-size: 12px; color: #999; }
.record-card-time { font-size: 12px; color: #bbb; margin-top: 2px; }
.record-card-state { font-size: 13px; color: #f0a020; flex-shrink: 0; }
.record-card-state.done { color: #999; }
.record-card-body { padding: 10px 12px; }
.record-card-product {
    display: flex; gap: 10px; text-decoration: none; color: inherit;
}
.record-card-image {
    width: 78px; height: 78px; border-radius: 8px; overflow: hidden;
    background: #f3f3f3; flex-shrink: 0;
}
.record-card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.record-card-content { flex: 1; min-width: 0; }
.record-card-title {
    font-size: 14px; color: #222; line-height: 1.4; margin: 0;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.record-card-chip {
    display: inline-block; margin-top: 6px; padding: 1px 6px;
    font-size: 11px; color: #888; background: #f5f5f5; border-radius: 3px;
}
.record-card-facts {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-top: 8px; gap: 8px;
}
.record-card-price { margin: 0; font-size: 14px; color: #e74c3c; font-weight: 600; }
.record-card-note { font-size: 12px; color: #999; }
.record-card-note em { font-style: normal; color: #e74c3c; }
.record-card-foot {
    display: flex; justify-content: space-between; align-items: center;
    gap: 8px; padding: 10px 12px 12px; border-top: 1px solid #f5f5f5;
}
.record-card-foot-copy { font-size: 12px; color: #999; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.record-card-foot-copy strong { color: #333; font-weight: 600; }
.record-card-actions { display: flex; gap: 8px; flex-shrink: 0; }
.record-card-action {
    display: inline-flex; align-items: center; justify-content: center;
    height: 30px; padding: 0 12px; border-radius: 15px;
    border: 1px solid #ddd; background: #fff; color: #333;
    font-size: 12px; text-decoration: none; white-space: nowrap; cursor: pointer;
}
.record-card-action--primary {
    border-color: #fbbb3f; background: #fbbb3f; color: #fff;
}
.record-card-action--ghost {
    border-color: #f0a020; color: #f0a020;
}
.record-empty {
    text-align: center; color: #bbb; padding: 48px 0 24px; font-size: 13px;
}

/* 换购订单（对标 jjgsc integralOrder） */
.mall-integral-order .mall-order-tabs a.active {
    color: #f0a020;
    font-weight: 500;
}
.mall-integral-order .mall-order-tabs a.active::after {
    background: #f0a020;
    width: 28px;
    height: 2px;
}

/* ========== 邀请好友（对标 jjgsc userShare） ========== */
.lottery-header.share-nav {
    background: rgb(255, 70, 48) !important;
    color: #fff !important;
}
.lottery-header.share-nav .hdr-title,
.lottery-header.share-nav .hdr-back,
.lottery-header.share-nav .hdr-back .fa,
.lottery-header.share-nav .hdr-right-link {
    color: #fff !important;
}
.target-user-share-page {
    background: #ff4630;
    min-height: calc(100vh - 46px);
    padding-bottom: 28px;
}
.target-user-share-main {
    padding: 0 0 8px;
}
.target-user-share-hero {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: top;
}
.target-user-share-code {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: -18px 16px 12px;
    position: relative;
    z-index: 2;
    background: #fff;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 6px 16px rgba(180, 30, 20, .18);
    font-size: 15px;
    color: #333;
}
.target-user-share-code strong {
    color: #ff4630;
    font-size: 18px;
    letter-spacing: 1px;
    margin-left: 4px;
}
.target-user-share-code button {
    border: 0;
    background: #ff4630;
    color: #fff;
    border-radius: 16px;
    padding: 6px 14px;
    font-size: 13px;
}
.target-user-share-stats {
    display: flex;
    gap: 10px;
    margin: 0 16px 14px;
}
.target-user-share-stats a {
    flex: 1;
    background: rgba(255,255,255,.96);
    border-radius: 12px;
    padding: 14px 10px;
    text-align: center;
    text-decoration: none;
    color: #333;
    box-shadow: 0 4px 12px rgba(180, 30, 20, .12);
}
.target-user-share-stats strong {
    display: block;
    font-size: 22px;
    color: #222;
    font-weight: 700;
}
.target-user-share-stats strong small {
    font-size: 13px;
    margin-right: 2px;
}
.target-user-share-stats span {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #888;
}
.target-user-share-qr {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: calc(100% - 32px);
    margin: 0 16px;
    height: 48px;
    border: 0;
    border-radius: 24px;
    background: linear-gradient(90deg, #ffd36a, #ffb82e);
    color: #7a3d00;
    font-size: 16px;
    font-weight: 700;
    box-shadow: 0 6px 14px rgba(255, 170, 40, .35);
}
.target-user-share-qr img {
    width: 22px;
    height: 22px;
}
.share-tip {
    margin: 14px 20px 0;
    text-align: center;
    color: rgba(255,255,255,.92);
    font-size: 13px;
    line-height: 1.5;
}
.share-tip em {
    font-style: normal;
    font-weight: 700;
    color: #ffe28a;
}
.share-record-block {
    margin: 18px 12px 0;
    background: #fff;
    border-radius: 14px;
    padding: 12px 14px 8px;
}
.share-record-title {
    font-size: 15px;
    font-weight: 700;
    color: #222;
    margin-bottom: 6px;
}
.share-record-empty {
    text-align: center;
    color: #bbb;
    padding: 28px 0;
    font-size: 13px;
}
.share-overlay {
    position: fixed;
    inset: 0;
    z-index: 90;
    background: rgba(0,0,0,.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.share-overlay-inner {
    width: 100%;
    max-width: 320px;
    text-align: center;
    color: #fff;
}
.target-user-share-poster {
    position: relative;
    width: 100%;
    margin: 0 auto 12px;
}
.target-user-share-poster .poster-merged,
.target-user-share-poster .poster-shell {
    width: 100%;
    display: block;
    border-radius: 12px;
    -webkit-touch-callout: default;
    user-select: none;
}
.share-save-tip {
    margin: 4px 0 10px !important;
    font-size: 13px !important;
    color: #ffe28a !important;
}
.share-overlay-inner > p {
    margin: 6px 0;
    font-size: 14px;
}
.overlay_share_reward {
    color: #ffe28a;
    font-weight: 700;
}
.share-close {
    margin-top: 14px !important;
    font-size: 28px;
    opacity: .9;
    cursor: pointer;
}
body.ordinary-user-share-overlay-open {
    overflow: hidden;
}

/* ========== 提现账号设置（银行卡/支付宝） ========== */
.wd-account-sheet { max-height: 88vh; overflow-y: auto; }
.wd-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #f0f0f0;
    margin-bottom: 14px;
}
.wd-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 10px 14px;
    border-bottom: 1px solid #f2f2f2;
}
.wd-row.last { border-bottom: 0; }
.wd-label {
    width: 72px;
    flex-shrink: 0;
    font-size: 14px;
    color: #333;
}
.wd-row input[type="text"],
.wd-row input[type="tel"] {
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 14px;
    color: #333;
    min-width: 0;
}
.wd-method-tabs {
    display: flex;
    gap: 8px;
    flex: 1;
}
.wd-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    padding: 0 14px;
    border-radius: 15px;
    background: #f5f5f5;
    color: #666;
    font-size: 13px;
    cursor: pointer;
}
.wd-pill input { display: none; }
.wd-pill.on {
    background: #ffe8b0;
    color: #333;
    font-weight: 600;
}
.wd-bank-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    background: #ffe8b0;
    color: #333;
    border-radius: 16px;
    height: 32px;
    padding: 0 12px;
    font-size: 13px;
    text-align: left;
}
.wd-bank-btn .fa { color: #999; margin-left: 6px; }
.bank-pick-sheet { max-height: 70vh; }
.bank-pick-list {
    max-height: 50vh;
    overflow-y: auto;
    margin-bottom: 8px;
}
.bank-pick-item {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    border-bottom: 1px solid #f3f3f3;
    background: #fff;
    padding: 14px 4px;
    font-size: 14px;
    color: #333;
}
.wd-preview {
    background: #fafafa;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 10px;
}

/* 换得商品-完善地址 */
.win-addr-sheet { max-height: 88vh; overflow-y: auto; }
.win-addr-mode {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}
.win-addr-mode-btn {
    flex: 1;
    height: 34px;
    border: 1px solid #eee;
    border-radius: 17px;
    background: #f7f7f7;
    color: #666;
    font-size: 13px;
}
.win-addr-mode-btn.on {
    background: #ffe8b0;
    border-color: #f5d079;
    color: #333;
    font-weight: 600;
}
.win-addr-empty {
    text-align: center;
    color: #bbb;
    font-size: 13px;
    padding: 18px 0;
}
.win-addr-list { max-height: 220px; overflow-y: auto; margin-bottom: 8px; }
.win-addr-item {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 10px 0;
    border-bottom: 1px solid #f2f2f2;
}
.win-addr-item:last-child { border-bottom: 0; }
.win-addr-item input { margin-top: 4px; }
.win-addr-item-body { flex: 1; min-width: 0; }
.win-addr-item-body .t1 { font-size: 14px; color: #222; font-weight: 600; }
.win-addr-item-body .t1 em {
    display: inline-block; margin-left: 6px; font-style: normal;
    font-size: 11px; color: #f0a020; background: #fff6e0;
    border-radius: 3px; padding: 0 4px; font-weight: 400;
}
.win-addr-item-body .t2 { font-size: 12px; color: #888; margin-top: 4px; line-height: 1.4; }
.win-addr-sheet .addr-region-link {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-decoration: none;
    color: #333;
    font-size: 14px;
    min-height: 22px;
}
.win-addr-sheet .sheet-field {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.win-addr-sheet .sheet-field > span {
    width: 64px;
    flex-shrink: 0;
    padding-top: 10px;
}
.win-addr-sheet .sheet-field input,
.win-addr-sheet .sheet-field textarea {
    flex: 1;
}
.win-addr-save-book {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #666;
    margin: 4px 0 12px;
}

/* ========== 个人中心客服弹窗（对标 jjgsc customer-dialog） ========== */
.cs-mask,
.cs-qr-mask {
    position: fixed;
    inset: 0;
    z-index: 220;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0,0,0,.5);
    box-sizing: border-box;
}
.cs-dialog {
    width: 100%;
    max-width: 460px;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    box-sizing: border-box;
    padding: 30px 20px 0;
    border-radius: 20px;
    background: #fff;
    color: #333;
    box-shadow: 0 20px 64px rgba(0,0,0,.18);
}
.cs-hero { margin-bottom: 26px; text-align: center; }
.cs-eyebrow {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 20px;
    background: #f6f6f6;
    color: #666;
    font-size: 11px;
    line-height: 18px;
    letter-spacing: 2px;
}
.cs-hero h3 {
    margin: 10px 0 6px;
    color: #333;
    font-size: 24px;
    font-weight: 600;
    line-height: 34px;
}
.cs-hero p {
    margin: 0;
    color: #666;
    font-size: 13px;
    line-height: 22px;
}
.cs-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.cs-channel {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    padding: 24px 10px 14px;
    border: 1px solid #e8e8e8;
    border-radius: 14px;
    background: #f6f6f6;
    font-family: inherit;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    transition: transform .16s ease;
}
.cs-channel:active { transform: scale(0.97); }
.cs-channel.online {
    border-color: #f7b844;
    background: #fff;
}
.cs-channel.online .cs-action-cta {
    background: #f7b844;
    color: #333;
}
.cs-action-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    margin-bottom: 16px;
    border-radius: 50%;
    background: #f7b844;
    color: #333;
    font-size: 28px;
}
.cs-action-copy { width: 100%; text-align: center; }
.cs-action-copy strong {
    display: block;
    font-size: 17px;
    font-weight: 600;
    line-height: 26px;
}
.cs-action-copy small {
    display: block;
    min-height: 36px;
    margin-top: 6px;
    font-size: 12px;
    line-height: 18px;
    color: #666;
}
.cs-action-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 100%;
    min-height: 38px;
    margin-top: 14px;
    border-radius: 8px;
    background: #fff;
    color: #333;
    font-size: 13px;
    font-weight: 500;
}
.cs-time {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    margin: 22px 0 18px;
    color: #666;
    font-size: 12px;
    line-height: 20px;
}
.cs-close {
    display: block;
    width: 100%;
    min-height: 44px;
    padding: 10px;
    border: 0;
    border-top: 1px solid #eee;
    background: #fff;
    color: #666;
    font-size: 14px;
    font-family: inherit;
    cursor: pointer;
}
.cs-qr-dialog {
    width: 100%;
    max-width: 300px;
    background: #fff;
    border-radius: 16px;
    padding: 22px 18px 16px;
    text-align: center;
}
.cs-qr-title { font-size: 17px; font-weight: 600; color: #333; margin-bottom: 14px; }
.cs-qr-img {
    display: block;
    width: 200px;
    height: 200px;
    margin: 0 auto;
    object-fit: contain;
    background: #f6f6f6;
    border-radius: 8px;
}
.cs-qr-tip { margin: 12px 0 0; font-size: 13px; color: #666; }
.cs-qr-empty { margin: 20px 0; font-size: 13px; color: #999; line-height: 1.7; }
.cs-qr-close {
    display: block;
    width: 100%;
    margin-top: 16px;
    min-height: 42px;
    border: 0;
    border-top: 1px solid #eee;
    background: #fff;
    color: #666;
    font-size: 14px;
    cursor: pointer;
}

/* ========== 客服中心 / 聊天 ========== */
.kefu-center-page {
    padding: 12px 12px 28px;
    background: #f6f6f6;
    min-height: calc(100vh - 48px);
}
.kefu-hero {
    background: linear-gradient(160deg, #fff8e8 0%, #fff 55%);
    border-radius: 16px;
    padding: 22px 18px 20px;
    box-shadow: 0 4px 18px rgba(0,0,0,.04);
}
.kefu-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}
.kefu-brand img {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
}
.kefu-brand strong { display: block; font-size: 15px; color: #333; }
.kefu-brand span { font-size: 12px; color: #999; }
.kefu-hero h1 {
    margin: 0 0 10px;
    font-size: 24px;
    line-height: 1.35;
    font-weight: 700;
    color: #222;
}
.kefu-hero > p {
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.7;
    color: #666;
}
.kefu-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.kefu-tags span {
    padding: 4px 10px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid #f0e0b8;
    font-size: 12px;
    color: #8a6a20;
}
.kefu-start {
    display: block;
    text-align: center;
    width: 100%;
    height: 44px;
    line-height: 44px;
    border-radius: 10px;
    margin-bottom: 10px;
}
.kefu-hours {
    text-align: center;
    font-size: 12px;
    color: #999;
}
.kefu-block {
    margin-top: 12px;
    background: #fff;
    border-radius: 14px;
    padding: 16px;
}
.kefu-block h2 {
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 700;
    color: #333;
}
.kefu-steps { list-style: none; margin: 0; padding: 0; }
.kefu-steps li {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #f3f3f3;
}
.kefu-steps li:last-child { border-bottom: 0; }
.kefu-steps em {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #fff6e0;
    color: #c48a10;
    font-style: normal;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}
.kefu-steps b { display: block; font-size: 14px; color: #333; margin-bottom: 4px; }
.kefu-steps p { margin: 0; font-size: 12px; color: #888; line-height: 1.5; }
.kefu-scope { display: grid; gap: 10px; }
.kefu-scope > div {
    background: #f8f8f8;
    border-radius: 10px;
    padding: 12px;
}
.kefu-scope b { display: block; font-size: 14px; margin-bottom: 4px; color: #333; }
.kefu-scope p { margin: 0; font-size: 12px; color: #888; line-height: 1.5; }
.kefu-safe { margin: 0; padding-left: 18px; color: #666; font-size: 13px; line-height: 1.8; }

body.lottery-h5.no-tabbar .lottery-app:has(> .kefu-chat-top) {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    height: 100vh;
    background: #f5f5f5;
}
.kefu-chat-top {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 12px 14px;
    background: #f8bc3c;
    color: #333;
    position: sticky;
    top: 0;
    z-index: 20;
    flex-shrink: 0;
}
.kefu-chat-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    background: #fff;
    flex-shrink: 0;
    margin-top: 2px;
}
.kefu-chat-meta {
    flex: 1;
    min-width: 0;
    padding-right: 4px;
}
.kefu-chat-meta strong {
    display: block;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
    color: #222;
}
.kefu-chat-meta p {
    margin: 4px 0 0;
    font-size: 11px;
    line-height: 1.45;
    color: #444;
}
.kefu-chat-close {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    font-size: 18px;
    text-decoration: none;
    margin-top: 2px;
}
.kefu-chat-page {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    background: #f5f5f5;
}
.kefu-chat-list {
    flex: 1;
    overflow-y: auto;
    padding: 16px 12px 10px;
}
.kefu-bubble {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 14px;
    max-width: 88%;
}
.kefu-bubble.user { margin-left: auto; flex-direction: row-reverse; }
.kefu-bubble .av {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    background: #ddd;
}
.kefu-bubble .bubble-main { min-width: 0; max-width: 100%; }
.kefu-bubble .bubble-time {
    margin-bottom: 4px;
    font-size: 11px;
    color: #aaa;
    line-height: 1.2;
}
.kefu-bubble.user .bubble-time { text-align: right; }
.kefu-bubble .bubble-txt {
    position: relative;
    display: inline-block;
    padding: 10px 12px;
    border-radius: 6px;
    background: #fff;
    font-size: 14px;
    line-height: 1.5;
    color: #333;
    white-space: pre-wrap;
    word-break: break-word;
    box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.kefu-bubble:not(.user) .bubble-txt:not(.bubble-img)::before {
    content: '';
    position: absolute;
    left: -6px;
    top: 12px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-right: 6px solid #fff;
}
.kefu-bubble.user .bubble-txt {
    background: #fff;
    color: #333;
}
.kefu-bubble.user .bubble-txt:not(.bubble-img)::before {
    content: '';
    position: absolute;
    right: -6px;
    left: auto;
    top: 12px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid #fff;
    border-right: 0;
}
.kefu-bubble.system .bubble-txt {
    background: #fff;
    color: #555;
}
.kefu-bubble .bubble-img {
    padding: 4px;
    background: #fff;
    max-width: 200px;
}
.kefu-bubble .bubble-img img {
    display: block;
    max-width: 100%;
    max-height: 220px;
    border-radius: 4px;
}
.kefu-chat-input {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    background: #fff;
    border-top: 1px solid #eee;
}
.kefu-chat-input input[type="text"] {
    flex: 1;
    height: 40px;
    border: 0;
    border-radius: 20px;
    padding: 0 14px;
    font-size: 14px;
    outline: none;
    background: #f2f2f2;
    color: #333;
}
.kefu-img-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    font-size: 20px;
    flex-shrink: 0;
    cursor: pointer;
}
.kefu-chat-input button {
    height: 40px;
    min-width: 68px;
    border: 0;
    border-radius: 20px;
    background: #00acee;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    flex-shrink: 0;
}
@media (max-width: 360px) {
    .cs-mask { padding: 14px; }
    .cs-dialog { padding: 24px 14px 0; }
    .cs-list { gap: 10px; }
    .cs-channel { padding: 20px 8px 12px; }
}

/* ========== 计算详情 compute (正确8) ========== */
.compute-hdr .hdr-help-btn {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #333 !important;
    font-size: 18px;
    line-height: 1;
    padding: 4px;
}
.compute-page {
    min-height: calc(100vh - 46px);
    background: #f5f5f5;
    padding: 12px 12px 28px;
    box-sizing: border-box;
}
.compute-card,
.compute-list-card {
    background: #fff;
    border-radius: 12px;
    padding: 16px 14px;
    margin-bottom: 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,.03);
}
.compute-result-box,
.compute-box {
    background: linear-gradient(180deg, #ffd76a 0%, #f4bb4e 100%);
    border-radius: 8px;
    text-align: center;
    color: #5a3a00;
    box-shadow: 0 2px 6px rgba(244, 187, 78, .28);
}
.compute-result-box {
    max-width: 220px;
    margin: 0 auto;
    padding: 12px 10px 10px;
}
.compute-result-box strong,
.compute-box strong {
    display: block;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
    word-break: break-all;
    color: #333;
}
.compute-result-box span,
.compute-box span {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #6b4a10;
}
.compute-eq {
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    color: #666;
    margin: 10px 0 12px;
    letter-spacing: 2px;
}
.compute-formula {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: nowrap;
}
.compute-formula .op {
    font-size: 16px;
    font-weight: 700;
    color: #666;
    flex-shrink: 0;
}
.compute-box {
    flex: 1;
    min-width: 0;
    padding: 10px 4px 8px;
}
.compute-box strong { font-size: 13px; }
.compute-box span { font-size: 11px; }
.compute-tip {
    margin: 14px 0 0;
    font-size: 12px;
    line-height: 1.65;
    color: #333;
}
.compute-list-head {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 8px;
    padding: 0 2px 10px;
    font-size: 14px;
    font-weight: 700;
    color: #222;
    border-bottom: 1px solid #f0f0f0;
}
.compute-row {
    display: grid !important;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 8px;
    align-items: center;
    padding: 12px 2px;
    border-bottom: 1px solid #f3f3f3;
    font-size: 13px;
    color: #333;
    box-sizing: border-box;
    width: 100%;
}
.compute-row[hidden],
.compute-row.is-more[hidden] {
    display: none !important;
}
.compute-row:last-child { border-bottom: 0; }
.compute-help-dialog {
    max-width: 340px;
    text-align: left;
}
.compute-help-dialog .mine-tip-title {
    text-align: center;
    margin-bottom: 4px;
}
.compute-help-body {
    margin-top: 12px !important;
    font-size: 13px !important;
    line-height: 1.75 !important;
    color: #333 !important;
    white-space: pre-wrap;
}
.compute-row .col-time b {
    display: block;
    font-weight: 500;
    color: #222;
}
.compute-row .col-time em {
    display: block;
    margin-top: 2px;
    font-style: normal;
    color: #f4bb4e;
    font-size: 12px;
}
.compute-row .col-data { font-weight: 500; word-break: break-all; }
.compute-row .col-user {
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.compute-empty {
    text-align: center;
    color: #bbb;
    padding: 28px 0 12px;
    font-size: 13px;
}
.compute-expand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 100%;
    margin-top: 4px;
    border: 0;
    background: transparent;
    color: #f4bb4e;
    font-size: 14px;
    padding: 10px 0 2px;
    cursor: pointer;
}

/* ========== 换取记录 join-record (正确12) ========== */
.join-record-page {
    min-height: calc(100vh - 46px);
    background: #f5f5f5;
}
.join-record-tabs a.active { color: #111; font-weight: 600; }
.join-record-list { padding: 10px 10px 24px; }
.join-record-card {
    position: relative;
    display: flex;
    align-items: stretch;
    background: #fff;
    border-radius: 10px;
    margin-bottom: 10px;
    padding: 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,.03);
}
.join-record-main {
    display: flex;
    gap: 10px;
    flex: 1;
    min-width: 0;
    text-decoration: none;
    color: inherit;
    padding-right: 36px;
}
.join-record-main .thumb {
    width: 78px;
    height: 78px;
    border-radius: 6px;
    object-fit: cover;
    background: #f3f3f3;
    flex-shrink: 0;
}
.join-record-main .body { flex: 1; min-width: 0; }
.join-record-main .title {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 600;
    color: #222;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    max-height: calc(1.35em * 2);
}
.join-record-main .meta {
    margin: 0 0 3px;
    font-size: 12px;
    color: #888;
    line-height: 1.45;
}
.join-record-main .meta em {
    font-style: normal;
    color: #f4bb4e;
    font-weight: 600;
    margin: 0 2px;
}
.join-record-main .jr-status {
    display: inline-block;
    margin-right: 4px;
    padding: 0 5px;
    font-size: 11px;
    font-weight: 600;
    color: #c88700;
    background: #fff6e0;
    border-radius: 3px;
    vertical-align: 1px;
}
.join-rec-loading,
.join-rec-nomore {
    text-align: center;
    padding: 12px 0 4px;
    font-size: 12px;
    color: #999;
}

/* 幸运码右侧抽屉 */
.codes-drawer-mask {
    position: fixed;
    inset: 0;
    z-index: 420;
    background: rgba(0,0,0,.45);
    overflow: hidden;
}
.codes-drawer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 92%;
    max-width: 420px;
    background: #fff;
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform .22s ease;
    box-shadow: -4px 0 20px rgba(0,0,0,.12);
}
.codes-drawer-mask.is-open .codes-drawer {
    transform: translateX(0);
}
.codes-drawer-hdr {
    flex-shrink: 0;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 10px;
    background: #fbbb3f;
    color: #222;
}
.codes-drawer-back {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #222 !important;
    font-size: 22px;
    text-decoration: none;
}
.codes-drawer-title {
    font-size: 16px;
    font-weight: 600;
}
.codes-drawer-spacer { width: 36px; }
.codes-drawer-body {
    flex: 1;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 22px 16px 28px;
    text-align: center;
    background: #fff;
}
.codes-sheet-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    margin: 4px auto 12px;
    background: #f3f3f3;
    border: 1px solid #eee;
}
.codes-sheet-brand {
    font-size: 15px;
    font-weight: 700;
    color: #3478f6;
    margin-bottom: 12px;
}
.codes-sheet-name {
    font-size: 15px;
    font-weight: 700;
    color: #222;
    line-height: 1.4;
    word-break: break-all;
    padding: 0 8px;
}
.codes-sheet-pts {
    margin-top: 8px;
    font-size: 14px;
    color: #666;
}
.codes-sheet-pts em {
    font-style: normal;
    color: #f4bb4e;
    font-weight: 700;
}
.codes-sheet-box {
    margin-top: 16px;
    padding: 14px 12px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 1px 6px rgba(0,0,0,.06);
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    min-height: 48px;
}
.codes-pill {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid #e8e8e8;
    font-size: 13px;
    color: #555;
    line-height: 1.2;
}
.codes-sheet-loading {
    width: 100%;
    padding: 8px;
    font-size: 13px;
    color: #999;
}
.join-record-main .jr-progre-text {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-top: 6px;
    gap: 4px;
    font-size: 12px;
    color: #999;
    line-height: 1.35;
}
.join-record-main .jr-progre-text span {
    flex: 1;
    white-space: nowrap;
}
.join-record-main .jr-progre-text span:first-child { text-align: left; }
.join-record-main .jr-progre-text span:nth-child(2) { text-align: center; }
.join-record-main .jr-progre-text span:last-child { text-align: left; }
.join-record-main .jr-progre-text em {
    font-style: normal;
    color: #666;
    font-weight: 500;
    margin-right: 2px;
}
.join-record-main .goods-progress {
    margin-top: 6px;
}
.join-record-main .next-tip {
    display: block;
    margin: 4px 0 0;
    font-size: 12px;
    color: #f4bb4e;
    text-decoration: none;
    font-weight: 500;
}
.join-record-card.is-finished .join-record-main .body {
    padding-right: 0;
}
.join-record-card.is-finished .meta em {
    color: #f0a020;
}
.join-record-main .goods-progress {
    height: 4px;
    margin-top: 8px;
    background: #eee;
    border-radius: 2px;
    overflow: hidden;
}
.join-record-main .is-selling .goods-progress,
.join-record-card.is-selling .goods-progress {
    margin-top: 6px;
}
.join-record-main .goods-progress i {
    display: block;
    height: 100%;
    background: #f4bb4e;
    border-radius: 2px;
}
.join-record-card .add-cart-btn {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border: 0;
    padding: 0;
    background: transparent;
    flex-shrink: 0;
    cursor: pointer;
}
.join-record-card .add-cart-btn img {
    width: 30px;
    height: 30px;
    display: block;
    object-fit: contain;
}

/* ========== 换得商品 win-product (正确13) ========== */
.win-product-list { padding: 10px 10px 24px; }
.win-product-card {
    background: #fff;
    border-radius: 10px;
    margin-bottom: 10px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.03);
}
.win-product-main {
    display: flex;
    gap: 10px;
    padding: 12px 12px 8px;
    text-decoration: none;
    color: inherit;
}
.win-product-main .thumb {
    width: 78px;
    height: 78px;
    border-radius: 6px;
    object-fit: cover;
    background: #f3f3f3;
    flex-shrink: 0;
}
.win-product-main .body { flex: 1; min-width: 0; }
.win-product-main .title {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    max-height: calc(1.35em * 2);
}
.win-product-main .line {
    margin: 0 0 3px;
    font-size: 12px;
    color: #999;
    line-height: 1.45;
}
.win-product-main .line em {
    font-style: normal;
    color: #f4bb4e;
    font-weight: 600;
}
.win-product-foot {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    padding: 8px 12px 12px;
    border-top: 1px solid #f5f5f5;
}
.win-foot-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    padding: 0 14px;
    border-radius: 15px;
    border: 0;
    background: #f8e4c0;
    color: #8a5a18;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}
.win-foot-btn.primary {
    background: #f8e4c0;
    color: #8a5a18;
}
.win-foot-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    padding: 0 14px;
    border-radius: 14px;
    background: linear-gradient(to right, #b9b8b83d, #b1b1cd94);
    font-size: 12px;
    font-weight: 600;
}
/* 待发货 / 待收货 订单详情卡片 */
.win-order-detail-mode .win-product-list {
    padding: 10px 10px 80px;
}
.win-od-wrap { margin-bottom: 16px; }
.win-od-banner {
    background: #fbbb3f;
    border-radius: 10px;
    padding: 14px 14px;
    margin-bottom: 10px;
    color: #333;
    box-shadow: 0 2px 6px rgba(251,187,63,.25);
}
.win-od-banner .t1 {
    font-size: 16px;
 
    margin-bottom: 4px;
}
.win-od-banner .t2 {
    font-size: 12px;
    line-height: 1.45;
    opacity: .9;
}
.win-od-logistics {
    font-size: 13px;
    line-height: 1.55;
}
.win-od-card {
    background: #fff;
    border-radius: 10px;
    padding: 12px 14px;
    margin-bottom: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.win-od-addr {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}
.win-od-edit-addr {
    display: block;
    width: 100%;
    margin-top: 12px;
    height: 40px;
    border: 1px solid #fbbb3f;
    border-radius: 20px;
    background: #fff;
    color: #c48a12;
    font-size: 14px;
    font-weight: 500;
}
.win-od-logi-plain {
    font-size: 14px;
    color: #666;
    line-height: 1.5;
}
.win-od-goods {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    text-decoration: none;
    color: inherit;
}
.win-od-goods .thumb {
    width: 72px;
    height: 72px;
    border-radius: 6px;
    object-fit: cover;
    background: #f3f3f3;
    flex-shrink: 0;
}
.win-od-goods .body { flex: 1; min-width: 0; }
.win-od-goods .title {
    margin: 0 0 4px;
    font-size: 14px;
    color: #333;
    line-height: 1.35;
}
.win-od-goods .price {
    margin: 0 0 4px;
    font-size: 14px;
    color: #e74c6f;
    font-weight: 700;
}
.win-od-goods .price em { font-style: normal; }
.win-od-goods .line {
    margin: 0 0 2px;
    font-size: 12px;
    color: #888;
    line-height: 1.45;
}
.win-od-goods .line.accent { color: #f4bb4e; }
.win-od-goods .line.muted { color: #aaa; }
.win-od-cs {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 46px;
    background: #fff;
    border-radius: 10px;
    color: #666 !important;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.win-od-cs .fa {
    width: 28px;
    height: 28px;
    border-radius: 50%;
   
    color: #fbbb3f;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}
.win-od-foot {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 30;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    background: #fff;
    max-width: var(--lottery-max);
    margin: 0 auto;
    box-shadow: 0 -2px 10px rgba(0,0,0,.06);
}
.win-od-confirm {
    display: block;
    width: 100%;
    height: 44px;
    border: 0;
    border-radius: 22px;
    background: #fbbb3f;
    color: #222;
    font-size: 15px;
    font-weight: 700;
}
.win-foot-btn.ghost {
    background: #fff;
    border: 1px solid #f0a020;
    color: #f0a020;
}
.win-foot-done {
    font-size: 12px;
    color: #999;
}

/* ========== 心愿单空态 ========== */
.wish-empty-page {
    padding: 14px 14px 24px;
    background: #f5f5f5;
    min-height: calc(100vh - 46px - 56px);
    box-sizing: border-box;
}
.wish-empty-card {
    background: #fff;
    border-radius: 12px;
    padding: 48px 16px 40px;
    text-align: center;
    box-shadow: none;
}
.wish-empty-illust {
    width: 140px;
    height: auto;
    display: block;
    margin: 0 auto 16px;
}
.wish-empty-text {
    margin: 0;
    font-size: 14px;
    color: #bdbdbd;
}
.wish-hot-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 22px 0 12px;
    font-size: 15px;
    font-weight: 700;
    color: #222;
    letter-spacing: 2px;
}
.wish-hot-title i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #f4bb4e;
    opacity: .85;
}
.wish-hot-title i:nth-child(2),
.wish-hot-title i:nth-child(6) { opacity: .55; transform: scale(.85); }
.wish-hot-title i:nth-child(3),
.wish-hot-title i:nth-child(5) { opacity: .3; transform: scale(.7); }
.wish-hot-title span { margin: 0 4px; }
.wish-hot-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.wish-hot-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 10px;
    padding: 10px 10px 12px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 4px rgba(0,0,0,.03);
    min-width: 0;
}
.wish-hot-card .thumb-wrap {
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 6px;
    overflow: hidden;
    background: #f7f7f7;
    margin-bottom: 8px;
}
.wish-hot-card .thumb-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.wish-hot-card .name {
    margin: 0 0 8px;
    font-size: 13px;
    color: #222;
    line-height: 1.35;
    min-height: calc(1.35em * 2);
}
.wish-hot-progress {
    height: 4px;
    border-radius: 2px;
    background: #f0f0f0;
    overflow: hidden;
    margin-bottom: 8px;
}
.wish-hot-progress i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #ffd36a, #f4bb4e);
    border-radius: 2px;
}
.wish-hot-stats {
    display: flex;
    justify-content: space-between;
    gap: 2px;
    text-align: center;
}
.wish-hot-stats span {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.wish-hot-stats em {
    font-style: normal;
    font-size: 12px;
    font-weight: 700;
    color: #f0a020;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.wish-hot-stats em.total { color: #666; }
.wish-hot-stats i {
    font-style: normal;
    font-size: 10px;
    color: #999;
    line-height: 1.2;
}