/* ===== 全局 ===== */
* {
    box-sizing: border-box;
}
body {
    margin: 0;
    background: #f5f5f5;
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
}

.container {
    padding: 0 0 80px;
    box-sizing: border-box;
    max-width: 600px;
    overflow-x: hidden; margin: 0 auto;
}

/* 隐藏旧头部（如果 PHP 里还留着 .header-bar） */
.header-bar {
    display: none !important;
}
.top-weblogo{  margin: 0;}
.top-weblogo img{margin: 0;padding: 0 }


/* 取消 logo 图底部的默认留白（行内元素基线对齐导致） */
.top-weblogo img {
    display: block; 
    width: 100%;
    margin: 0;
    padding: 0;
}

/* 取消 banner 顶部的默认间距，若需紧贴可加负边距或设 0 */
.top-banner {
    margin-top: 0; 
    padding-top: 14px; /* 若要求绝对紧贴图片，可改为 0 或保留内边距 */
}

/* 若 .container 有上内边距也需清零（当前代码是 0 暂不影响） */
.container {
    padding-top: 0; 
}

/* ===== 顶部红橙渐变头 ===== */
.top-banner {
    background: linear-gradient(180deg, #d94a3d 0%, #b13a2e 55%, #8a4a2a 100%);
    color: #fff;
    padding: 14px 12px 16px;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}

.top-banner .top-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.top-banner .logo-circle {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: ;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.top-banner .logo-circle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.top-banner .site-name {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.2;
}

.top-banner .vip {
    margin-left: auto;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: ;
    color: #fff;
    font-weight: bold;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
	/*
    box-shadow: 0 2px 6px rgba(0,0,0,.2);
    flex-shrink: 0;
	*/
}

.top-banner .desc {
    font-size: 14px;
    line-height: 1.75;
    margin: 0 0 12px;
    color: #fff;
    text-align: justify;
}

.top-banner .btn-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.top-banner .btn-row button,
.top-banner .btn-row a.btn-link {
    flex: 1;
    min-width: 90px;
    height: 38px;
    border: 1px solid rgba(255,255,255,.55);
    background: rgba(255,255,255,.08);
    color: #fff;
    border-radius: 8px;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-decoration: none;
    box-sizing: border-box;
    backdrop-filter: blur(2px);
    font-family: inherit;
    cursor: pointer;
}

.top-banner .btn-row button:active,
.top-banner .btn-row a.btn-link:active {
    opacity: .8;
}

/* ===== 滚动公告 ===== */
.scroll-notice {
    margin: 10px;
    background: #fff7ed;
    border-radius: 10px;
    height: 38px;
    line-height: 38px;
    overflow: hidden;
    display: flex;
    align-items: center;
    padding: 0 10px;
    box-sizing: border-box;
    color: #ff7a1a;
    font-size: 14px;
}

.scroll-notice .bell {
    margin-right: 6px;
    flex-shrink: 0;
}

.scroll-notice a {
    color: #ff7a1a;
    text-decoration: none;
    flex: 1;
    overflow: hidden;
}

.scroll-notice .scroll-text {
    display: inline-block;
    white-space: nowrap;
    animation: scrollLeft 30s linear infinite;
    padding-left: 100%;
}

@keyframes scrollLeft {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}

/* ===== 筛选/排序栏 ===== */
.filter-bar,
.sort-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    padding: 10px 12px;
    margin: 0 10px 10px;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
    box-sizing: border-box;
    gap: 8px;
}

.filter-item,
.filter-itema {
    display: flex;
    align-items: center;
    gap: 8px;
    box-sizing: border-box;
}

.filter-itema {
    width: 100%;
}

.filter-item span,
.filter-itema span {
    font-weight: 500;
    color: #333;
    white-space: nowrap;
}

.filter-item select,
.filter-item input,
.filter-itema select,
.filter-itema input {
    padding: 8px 10px;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    font-size: 14px;
    background: #fafafa;
    box-sizing: border-box;
    font-family: inherit;
}

#filter_category {
    margin-left: auto;
}

.filter-item select {
    min-height: 40px;
}

/* ===== 搜索框（合并，只保留一份） ===== */
.search-box {
    width: 100%;
}

.search-box input {
    width: 100% !important;
    height: 42px;
    border-radius: 22px;
    border: 1px solid #e8e8e8;
    background: #f7f7f7;
    padding: 0 16px 0 38px;
    font-size: 14px;
    box-sizing: border-box;
    outline: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='%23999' d='M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.01 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 12px center;
    background-size: 18px;
}

/* ===== 平台公告 ===== */
.notice {
    margin: 6px 10px 10px;
    background: #fff;
    border-radius: 12px;
    padding: 14px 14px 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
    box-sizing: border-box;
}

.notice .badge {
    display: inline-block;
    background: #ff4d4f;
    color: #fff;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 4px;
    margin-bottom: 8px;
}

.notice h2 {
    margin: 4px 0;
    font-size: 17px;
    color: #222;
    line-height: 1.4;
}

.notice .time {
    color: #999;
    font-size: 13px;
    text-align: right;
    margin-top: 6px;
}

.notice-link {
    color: inherit;
    text-decoration: none;
    display: block;
}

.notice-link:active h2 {
    color: #e53935;
}

/* ===== 列表卡片 ===== */
.card-link {
    text-decoration: none;
    color: inherit;
    display: block;
    padding: 0 10px;
    box-sizing: border-box;
}

.card {
    background: #fff;
    border-radius: 12px;
    padding: 14px;
    margin-bottom: 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
    box-sizing: border-box;
    transition: transform .2s ease;
}

.card-link:active .card {
    transform: scale(.98);
}

.card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
}

.card-title {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    word-break: break-all;
}

.card-price {
    color: #ff4d4f;
    font-size: 18px;
    font-weight: bold;
    white-space: nowrap;
}

.tags {
    margin: 10px 0;
}

.tag {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    color: #fff;
    margin-right: 6px;
}

.tag-green { background: #52c41a; }
.tag-red   { background: #ff4d4f; }
.tag-blue { background: #3a96dd; }

.card-footer {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: #999;
    margin-top: 10px;
}

/* ===== 加载 ===== */
.loading {
    text-align: center;
    padding: 15px;
    color: #999;
    font-size: 14px;
}

/* ===== 弹窗 ===== */
.modal-mask {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 99999;
    justify-content: center;
    align-items: center;
}

.modal-mask.active {
    display: flex;
}

.modal-box {
    width: 86%;
    max-width: 340px;
    background: #fff;
    border-radius: 14px;
    padding: 18px 16px 16px;
    box-sizing: border-box;
    position: relative;
    animation: popUp .2s ease;
}

@keyframes popUp {
    from { transform: scale(.92); opacity: 0; }
    to   { transform: scale(1); opacity: 1; }
}

.modal-close {
    position: absolute;
    right: 12px;
    top: 8px;
    font-size: 26px;
    color: #666;
    line-height: 1;
    cursor: pointer;
}

.modal-title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
    color: #333;
}

.modal-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f7f8fa;
    border-radius: 8px;
    padding: 12px;
    font-size: 15px;
    box-sizing: border-box;
    gap: 10px;
}

.copy-btn {
    border: 1px solid #e3e3e3;
    background: #fff;
    color: #1989fa;
    border-radius: 6px;
    padding: 6px 12px;
    font-size: 13px;
    cursor: pointer;
    font-family: inherit;
    white-space: nowrap;
}

.modal-tip {
    color: #999;
    font-size: 12px;
    margin-top: 10px;
    text-align: center;
}

/* ===== 通用 ===== */
img {
    max-width: 100%;
}


/* 公告头部 */
.notice-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

/* 更多链接 */
.more-link {
    font-size: 13px;
    color: #ff6a00;
    text-decoration: none;
    font-weight: normal;
}

.more-link:active {
    opacity: 0.7;
}

/* 公告列表 */
.notice-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* 单条公告 */
.notice-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    background: #fff;
    border-radius: 8px;
    text-decoration: none;
    border: 1px solid #f0f0f0;
}

.notice-item:active {
    background: #fff8f0;
}

/* 标题 */
.notice-title {
    flex: 1;
    font-size: 14px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 10px;
}

/* 时间 */
.notice-time {
    font-size: 12px;
    color: #999;
    white-space: nowrap;
}

/* 空状态 */
.notice-empty {
    text-align: center;
    color: #999;
    padding: 20px 0;
    font-size: 14px;
}
/* ===== 登录/注册按钮行 ===== */
.hang{ clear: both; height: 10px;line-height: 10px;}
.login-reg-bar {
    display: flex;
    gap: 12px;
    padding: 2px 15px 0;
}

.login-reg-bar .btn {
    flex: 1;
    display: block;
    height: 42px;
    line-height: 42px;
    text-align: center;
    border-radius: 21px;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    transition: all .25s ease;
    box-sizing: border-box;
}

/* 主按钮 - 会员注册（紫渐变） */
.login-reg-bar .btn-primary {
    color: #fff;
    background: linear-gradient(135deg, #7b5eea 0%, #9b7af6 100%);
    box-shadow: 0 4px 12px rgba(123, 94, 234, 0.35);
}

.login-reg-bar .btn-primary:active {
    opacity: 0.88;
    transform: translateY(1px);
    box-shadow: 0 2px 6px rgba(123, 94, 234, 0.3);
}

/* 次按钮 - 会员登录（描边紫） */
.login-reg-bar .btn-outline {
    color: #7b5eea;
    background: #fff;
    border: 1px solid #7b5eea;
}

.login-reg-bar .btn-outline:active {
    background: rgba(123, 94, 234, 0.08);
    transform: translateY(1px);
}

.login-reg-bar .btn-user {
    color: #7b5eea;
    background: #fff;
    border: 1px solid #7b5eea;
}
/* ===== APP下载按钮行 ===== */
/* ===== APP下载按钮（正方形） ===== */

/* ===== APP下载：左右占满 + 正方形 ===== */
/* ===== APP下载：缩小正方形按钮 ===== */
.app-down-bar {
    display: flex;
    justify-content: center;   /* 整体居中 */
    gap: 16px;
    padding: 12px 15px 0;
    flex-wrap: wrap;           /* 极小屏幕自动换行兜底 */
}

.app-down-bar a {
    width: 110px;             /* 正方形边长，改这里调大小 */
    max-width: 42vw;          /* 手机上不超过屏幕宽度 */
    aspect-ratio: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    box-sizing: border-box;
    transition: opacity .2s, transform .1s;
}

.app-down-bar a:active {
    opacity: .85;
    transform: translateY(1px);
}

/* 苹果：紫底白图标 */
.app-down-bar .btn-ios {
    color: #fff;
    background: linear-gradient(135deg, #7b5eea 0%, #9b7af6 100%);
    box-shadow: 0 4px 12px rgba(123, 94, 234, .35);
}

/* 安卓：白底紫边紫图标 */
.app-down-bar .btn-android {
    color: #7b5eea;
    background: #fff;
    border: 1px solid #7b5eea;
}

/* 图标图片 */
.app-down-bar .icon-img {
    width: 36%;
    height: 36%;
    margin-bottom: 8px;
    object-fit: contain;
}

.app-down-bar .btn-ios .icon-img {
    filter: brightness(0) invert(1);
}

.app-down-bar .btn-android .icon-img {
    filter: none;
}

