* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body { font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; background: #f5f5f5; color: #333; max-width: 480px; margin: 0 auto; min-height: 100vh; padding-bottom: 60px; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

.search-bar { display: flex; align-items: center; background: #16305a; padding: 10px 14px; }
.search-bar input { flex: 1; border: none; border-radius: 18px; padding: 8px 14px; font-size: 14px; outline: none; }

.nav-tabs { display: flex; gap: 18px; background: #16305a; color: #d8d8d8; padding: 10px 14px 12px; font-size: 15px; }
.nav-tabs a.active { color: #fff; font-weight: bold; }

.banner { margin: 10px; border-radius: 10px; overflow: hidden; }
.banner img { width: 100%; }

.sec-head { display: flex; justify-content: space-between; align-items: baseline; padding: 14px 12px 8px; }
.sec-head h3 { font-size: 17px; }
.sec-head span { font-size: 12px; color: #999; }

.goods-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0 12px; }
.goods-card { background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,.05); }
.goods-card .thumb { width: 100%; aspect-ratio: 1; object-fit: cover; background: #eee; }
.goods-card .info { padding: 8px 10px 12px; }
.goods-card .name { font-size: 13px; line-height: 1.4; height: 36px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.goods-card .price { color: #333; font-weight: bold; margin: 6px 0 8px; }

.btn-primary { display: block; width: 100%; background: #14a327; color: #fff; border: none; border-radius: 24px; padding: 12px; font-size: 16px; text-align: center; cursor: pointer; }
.btn-buy { background: #16305a; color: #fff; border: none; border-radius: 14px; padding: 6px 16px; font-size: 13px; }

.swiper { position: relative; background: #000; overflow: hidden; }   
.swiper-track {
    display: flex;                       
    transition: transform .3s ease;      
    will-change: transform;
    cursor: grab;                        
    touch-action: pan-y;                 
}
.swiper-track.dragging { transition: none; cursor: grabbing; }        
.swiper .swiper-slide { flex: 0 0 100%; }                            
.swiper .swiper-slide img { width: 100%; aspect-ratio: 1; object-fit: cover; -webkit-user-drag: none; user-select: none; }
.swiper .counter { position: absolute; right: 12px; bottom: 12px; background: rgba(0,0,0,.5); color: #fff; font-size: 12px; border-radius: 12px; padding: 2px 10px; pointer-events: none; }

.swiper .arrow-btn {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 30px; height: 30px; line-height: 28px; text-align: center;
    background: rgba(0,0,0,.35); color: #fff; border-radius: 50%; font-size: 16px; cursor: pointer;
}
.swiper .arrow-btn.prev { left: 8px; }
.swiper .arrow-btn.next { right: 8px; }

.swiper .dots { position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: center; gap: 6px; pointer-events: none; }
.swiper .dots i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.45); }
.swiper .dots i.on { background: #fff; width: 14px; border-radius: 3px; }
.pd-price-row { display: flex; gap: 6px; padding: 8px 12px 0; align-items: center; flex-wrap: wrap; }
.tag { background: #eef3fb; color: #16305a; border: 1px solid #16305a; border-radius: 14px; font-size: 12px; padding: 3px 10px; }
.pd-price { font-size: 20px; font-weight: bold; }
.pd-title { font-size: 16px; font-weight: bold; padding: 6px 12px; line-height: 1.5; }
.pd-meta { display: flex; justify-content: space-between; color: #999; font-size: 12px; padding: 0 12px 10px; }
.card { background: #fff; border-radius: 10px; margin: 10px 12px; padding: 12px; }
.spec-row { display: flex; justify-content: space-between; align-items: center; }
.arrow { color: #ccc; }

.spec-mask { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: none; z-index: 99; }
.spec-panel { position: fixed; left: 0; right: 0; bottom: 0; max-width: 480px; margin: 0 auto; background: #fff; border-radius: 14px 14px 0 0; padding: 14px; display: none; z-index: 100; max-height: 70vh; overflow: auto; }
.spec-item { display: inline-block; border: 1px solid #16305a; color: #16305a; border-radius: 14px; padding: 5px 12px; font-size: 13px; margin: 4px 6px 4px 0; cursor: pointer; }
.spec-item.on { background: #16305a; color: #fff; }
.num-ctrl { display: inline-flex; align-items: center; gap: 10px; }
.num-ctrl button { width: 28px; height: 28px; border: 1px solid #ddd; background: #fff; border-radius: 6px; }

.bottom-bar { position: fixed; left: 0; right: 0; bottom: 0; max-width: 480px; margin: 0 auto; background: #fff; display: flex; align-items: center; padding: 8px 12px; gap: 8px; box-shadow: 0 -2px 8px rgba(0,0,0,.06); z-index: 90; }
.bottom-bar .op { text-align: center; font-size: 11px; color: #666; width: 44px; }
.bottom-bar .op .ico { font-size: 18px; }
.btn-cart { flex: 1; background: #9aa6bd; color: #fff; border: none; border-radius: 22px; padding: 11px; font-size: 15px; }
.btn-buy2 { flex: 1; background: #16305a; color: #fff; border: none; border-radius: 22px; padding: 11px; font-size: 15px; }

.tabbar { position: fixed; left: 0; right: 0; bottom: 0; max-width: 480px; margin: 0 auto; background: #fff; display: flex; border-top: 1px solid #eee; z-index: 90; }
.tabbar a { flex: 1; text-align: center; padding: 8px 0 10px; font-size: 11px; color: #888; }
.tabbar a .ico { font-size: 20px; display: block; }
.tabbar a.active { color: #16305a; }

.form-item { display: flex; align-items: center; gap: 8px; background: #fff; border-bottom: 1px solid #eee; padding: 14px 16px; }
.form-item input { flex: 1; border: none; outline: none; font-size: 15px; }

.cell { background: #fff; display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid #f0f0f0; }

.me-head { background: #16305a; color: #fff; padding: 18px 16px 0; }
.me-stats { display: flex; text-align: center; padding: 14px 0; }
.me-stats div { flex: 1; }
.me-stats b { display: block; font-size: 18px; }
.me-stats span { font-size: 12px; color: #cfd8ea; }

.order-grid { display: flex; background: #fff; padding: 12px 0; margin-top: 10px; }
.order-grid a { flex: 1; text-align: center; font-size: 12px; color: #555; position: relative; }
.order-grid .ico { font-size: 22px; display: block; margin-bottom: 4px; }
.order-grid .badge { position: absolute; top: -6px; right: 18%; background: #e33; color: #fff; font-size: 10px; border-radius: 10px; padding: 0 5px; }

.admin-wrap { max-width: 100%; }
.admin-nav { background: #1f2d3d; color: #fff; }
.admin-nav a { color: #c6cbd4; display: block; padding: 12px 18px; border-bottom: 1px solid rgba(255,255,255,.06); }
.admin-nav a.active { background: #16305a; color: #fff; }
.table { width: 100%; border-collapse: collapse; background: #fff; }
.table th, .table td { border-bottom: 1px solid #eee; padding: 10px; font-size: 13px; text-align: left; }
.table th { background: #f8f9fb; }
.btn-sm { padding: 4px 10px; font-size: 12px; border-radius: 6px; border: 1px solid #ddd; background: #fff; cursor: pointer; }
.btn-del { color: #e33; border-color: #e33; }

body { background:#F6F3EA; color:#2B2B28; }

.hz2-top { background:#46586B; padding:16px 14px 0; }
.hz2-topin { display:flex; align-items:center; gap:12px; padding-bottom:12px; }
.hz2-seal { display:flex; flex-direction:column; background:#F6F3EA; color:#2B2B28; border-radius:4px; padding:6px 7px; line-height:1.25; font-weight:700; font-size:14px; letter-spacing:2px; text-align:center; box-shadow:0 2px 6px rgba(0,0,0,.25); }
.hz2-seal span { display:block; }
.hz2-topdate { flex:1; color:#fff; }
.hz2-topdate b { display:block; font-size:17px; letter-spacing:.5px; }
.hz2-topdate span { display:block; font-size:11px; opacity:.78; margin-top:3px; letter-spacing:1px; }
.hz2-top-mini { padding:12px 14px 0; }
.hz2-pdbar { display:flex; align-items:center; gap:10px; padding-bottom:10px; }
.hz2-back { color:#fff; font-size:24px; line-height:1; text-decoration:none; padding:0 6px; }
.hz2-pdcart { color:#F6F3EA; font-size:12px; border:1px solid rgba(246,243,234,.5); border-radius:20px; padding:5px 12px; text-decoration:none; }

.hz2-chips { display:flex; gap:8px; overflow-x:auto; padding:2px 0 12px; -webkit-overflow-scrolling:touch; }
.hz2-chips::-webkit-scrollbar { display:none; }
.hz2-chips a { flex:none; background:rgba(246,243,234,.14); border:1px solid rgba(246,243,234,.32); color:#F6F3EA; border-radius:6px; padding:6px 11px 5px; font-size:12px; line-height:1.3; text-decoration:none; text-align:center; }
.hz2-chips a i { display:block; font-style:normal; font-size:10px; opacity:.75; margin-top:1px; font-family:Menlo,Consolas,monospace; }
.hz2-chips a.on { background:#F6F3EA; color:#46586B; border-color:#F6F3EA; font-weight:700; }

.hz2-wrap { padding:14px 12px 6px; }

.hz2-hero { background:#fff; border:1px solid #E4DED0; border-radius:10px; padding:16px 16px 14px; position:relative; }
.hz2-hero::before { content:""; position:absolute; left:16px; right:16px; top:34px; border-top:1px dashed #E4DED0; }
.hz2-hero-date { font-size:20px; font-weight:700; color:#46586B; padding-bottom:10px; font-family:'Songti SC',SimSun,serif; }
.hz2-hero-line { font-size:13px; color:#4a4a45; line-height:1.9; margin-top:8px; }
.hz2-hero-tags { display:flex; gap:8px; margin-top:12px; }
.hz2-hero-tags span { background:#F6F3EA; border:1px solid #E4DED0; color:#46586B; font-size:11px; border-radius:4px; padding:3px 9px; }

.hz2-floor { margin-top:16px; }
.hz2-fhead { display:flex; align-items:stretch; gap:10px; padding:0 2px 10px; }
.hz2-ftime { flex:none; background:#46586B; color:#F6F3EA; border-radius:6px; padding:6px 9px; text-align:center; }
.hz2-ftime b { display:block; font-size:15px; font-family:Menlo,Consolas,monospace; letter-spacing:1px; }
.hz2-ftime span { display:block; font-size:9px; opacity:.75; margin-top:2px; letter-spacing:2px; }
.hz2-ftitle { flex:1; min-width:0; }
.hz2-ftitle h3 { font-size:17px; margin:0; color:#2B2B28; }
.hz2-ftitle h3 i { font-style:normal; font-size:11px; color:#D8703C; border:1px solid #D8703C; border-radius:3px; padding:1px 5px; margin-left:6px; vertical-align:2px; }
.hz2-ftitle p { margin:4px 0 0; font-size:11px; color:#8a867c; line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hz2-fmore { flex:none; align-self:center; color:#46586B; font-size:12px; text-decoration:none; }
.hz2-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.hz2-card { position:relative; background:#fff; border:1px solid #E4DED0; border-radius:8px; overflow:hidden; text-decoration:none; color:#2B2B28; display:block; }
.hz2-card img { display:block; width:100%; aspect-ratio:1/1; object-fit:cover; }
.hz2-no { position:absolute; left:8px; top:8px; background:rgba(70,88,107,.92); color:#F6F3EA; font-size:10px; font-family:Menlo,Consolas,monospace; padding:2px 6px; border-radius:3px; letter-spacing:1px; }
.hz2-cname { font-size:13px; line-height:1.5; padding:8px 10px 0; height:38px; overflow:hidden; }
.hz2-cprice { display:flex; align-items:baseline; gap:6px; padding:6px 10px 12px; border-top:1px dashed #E4DED0; margin-top:8px; }
.hz2-cprice b { color:#D8703C; font-size:17px; }
.hz2-cprice del { color:#b5b0a4; font-size:11px; }

.hz2-scenehead { background:#fff; border:1px solid #E4DED0; border-radius:10px; padding:14px 16px; margin-bottom:12px; }
.hz2-scenehead b { font-size:17px; color:#46586B; }
.hz2-scenehead p { margin:6px 0 0; font-size:12px; color:#8a867c; line-height:1.7; }
.hz2-rows { display:flex; flex-direction:column; gap:10px; }
.hz2-row { display:flex; gap:12px; align-items:center; background:#fff; border:1px solid #E4DED0; border-radius:8px; padding:10px; text-decoration:none; color:#2B2B28; }
.hz2-row img { flex:none; width:86px; height:86px; object-fit:cover; border-radius:6px; }
.hz2-rinfo { flex:1; min-width:0; }
.hz2-rname { font-size:14px; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hz2-rmeta { font-size:11px; color:#8a867c; margin-top:4px; font-family:Menlo,Consolas,monospace; }
.hz2-rprice { display:flex; align-items:baseline; gap:8px; margin-top:6px; }
.hz2-rprice b { color:#D8703C; font-size:18px; }
.hz2-rprice del { color:#b5b0a4; font-size:11px; }
.hz2-rarrow { flex:none; color:#c9c3b4; font-size:22px; }
.hz2-backall { display:block; text-align:center; color:#46586B; font-size:13px; padding:16px 0 8px; text-decoration:none; }

.hz2-promise { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:16px; }
.hz2-promise div { background:#fff; border:1px solid #E4DED0; border-radius:8px; padding:10px 12px; }
.hz2-promise b { display:block; font-size:13px; color:#46586B; }
.hz2-promise span { display:block; font-size:10px; color:#8a867c; margin-top:3px; }

.hz2-pdtitle { font-size:17px; line-height:1.6; margin:12px 2px 0; color:#2B2B28; }
.hz2-ticket { display:flex; gap:0; background:#fff; border:1px solid #E4DED0; border-radius:10px; overflow:hidden; margin-top:12px; position:relative; }
.hz2-ticket::before, .hz2-ticket::after { content:""; position:absolute; width:14px; height:14px; background:#F6F3EA; border:1px solid #E4DED0; border-radius:50%; top:50%; margin-top:-8px; }
.hz2-ticket::before { left:-8px; }
.hz2-ticket::after { right:-8px; }
.hz2-ticket-time { flex:none; width:64px; background:#46586B; color:#F6F3EA; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:14px 0; border-right:1px dashed rgba(246,243,234,.4); }
.hz2-ticket-time b { font-size:16px; font-family:Menlo,Consolas,monospace; letter-spacing:1px; }
.hz2-ticket-time span { font-size:9px; opacity:.75; letter-spacing:2px; }
.hz2-ticket-main { flex:1; min-width:0; padding:12px 14px; }
.hz2-ticket-price { display:flex; align-items:baseline; gap:8px; }
.hz2-ticket-price span { font-size:11px; color:#8a867c; }
.hz2-ticket-price b { color:#D8703C; font-size:24px; }
.hz2-ticket-price del { color:#b5b0a4; font-size:12px; }
.hz2-ticket-meta { display:flex; gap:10px; margin-top:8px; font-size:10px; color:#8a867c; flex-wrap:wrap; }
.hz2-gallery { position:relative; background:#fff; border-bottom:1px solid #E4DED0; }

.hz2-stags { display:flex; gap:8px; margin:12px 2px 0; flex-wrap:wrap; }
.hz2-stags .tag { background:#fff; border:1px solid #E4DED0; color:#46586B; font-size:12px; border-radius:4px; padding:4px 10px; }
.hz2-specrow { display:flex; justify-content:space-between; align-items:center; background:#fff; border:1px solid #E4DED0; border-radius:8px; padding:12px 14px; margin-top:10px; font-size:13px; color:#2B2B28; cursor:pointer; }
.hz2-specarrow { color:#46586B; font-size:12px; }
.hz2-desccard { background:#fff; border:1px solid #E4DED0; border-radius:10px; padding:14px 16px; margin-top:12px; }
.hz2-desccard h4 { margin:0 0 10px; font-size:15px; color:#46586B; border-left:3px solid #D8703C; padding-left:8px; }
.hz2-descbody { font-size:13px; line-height:1.9; color:#3d3b35; }
.hz2-descbody p { margin:0 0 10px; }
.hz2-descbody ul { margin:0 0 10px; padding-left:18px; }
.hz2-descbody li { margin-bottom:4px; }
.hz2-descbody table { width:100%; border-collapse:collapse; margin:6px 0 10px; }
.hz2-descbody td { border:1px solid #EAE5D8; padding:7px 9px; font-size:12px; }
.hz2-descbody td:first-child { width:76px; color:#8a867c; background:#FAF8F2; }
.hz2-note { font-size:11px; color:#a09a8c; line-height:1.8; margin:12px 2px 86px; }

.bottom-bar { gap:6px; padding:8px 8px; }
.bottom-bar .op { width:40px; min-width:40px; font-size:10px; }
.bottom-bar .btn-cart, .bottom-bar .btn-buy2 { flex:1; min-width:0; padding:0 4px; font-size:14px; }

/* ===== 桌面端适配（≥768px）：解除 480 窄条，商品卡 4 列 ===== */
@media (min-width:768px){
  body{max-width:none;margin:0;padding:0 40px 72px;box-shadow:none}
  .hz2-wrap{max-width:1180px;margin:0 auto;padding:18px 0 6px}
  .hz2-grid{grid-template-columns:repeat(4,calc(25% - 8px))}
  .hz2-floor{margin-top:24px}
  .hz2-card img{aspect-ratio:4/3}
  .hz2-hero-line{font-size:17px;line-height:1.9}
  .hz2-chips a{padding:10px 14px}
  .tabbar,.bottom-bar,.spec-panel{max-width:1180px;margin:0 auto;border-radius:8px 8px 0 0;box-shadow:0 -2px 12px rgba(0,0,0,.08)}
}