/* ===== mallshop H5 — Premium E-commerce ===== */
:root {
    --p: #4f46e5;
    --p-d: #4338ca;
    --p-l: #eef2ff;
    --accent: #ef4444;
    --accent-d: #dc2626;
    --t1: #0f172a;
    --t2: #475569;
    --t3: #94a3b8;
    --bg: #f8fafc;
    --card: #fff;
    --border: #e2e8f0;
    --border-l: #f1f5f9;
    --r: 10px;
    --r-l: 14px;
    --sh: 0 1px 3px rgba(0,0,0,0.05), 0 1px 2px rgba(0,0,0,0.03);
    --sh-l: 0 4px 12px rgba(0,0,0,0.06);
    --sh-xl: 0 10px 30px rgba(0,0,0,0.08);
    --primary: var(--p);
    --accent: #ef4444;
    --text-1: var(--t1);
    --text-2: var(--t2);
    --text-3: var(--t3);
    --radius: var(--r-l);
    --shadow: var(--sh-l);
    --c-primary: var(--p);
    --c-text-1: var(--t1);
    --c-text-2: var(--t2);
    --c-text-3: var(--t3);
    --c-border: var(--border);
    --c-bg: var(--bg);
}
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html { -webkit-text-size-adjust:100%; }
body { font-family:"SF Pro Text",-apple-system,"PingFang SC","Microsoft YaHei",sans-serif; background:var(--bg); color:var(--t1); font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
svg { flex-shrink:0; }

.page { min-height:100vh; padding-bottom:60px; }

/* Header */
.hdr, .header { background:var(--p); color:#fff; padding:13px 16px; font-size:17px; font-weight:600; position:sticky; top:0; z-index:100; text-align:center; box-shadow:0 2px 12px rgba(79,70,229,0.2); }

/* Tabbar */
.tabbar { position:fixed; bottom:0; left:0; right:0; height:60px; background:#fff; border-top:1px solid var(--border-l); display:flex; z-index:100; }
.tabbar a { flex:1; text-align:center; font-size:10px; color:var(--t3); padding-top:8px; display:flex; flex-direction:column; align-items:center; gap:3px; }
.tabbar a svg { width:22px; height:22px; stroke:var(--t3); transition:stroke 0.15s; }
.tabbar a.active { color:var(--p); }
.tabbar a.active svg { stroke:var(--p); }

/* Search */
.search-bar { background:#fff; padding:10px 12px; border-bottom:1px solid var(--border-l); }
.search-bar form { display:flex; gap:8px; }
.search-bar input { flex:1; padding:9px 16px; border:none; border-radius:20px; background:var(--bg); font-size:13px; }
.search-bar input:focus { outline:2px solid var(--p); }
.search-bar button { padding:0 18px; background:var(--p); color:#fff; border:none; border-radius:20px; font-size:13px; font-weight:500; }

/* Cat Nav */
.cat-nav { background:#fff; padding:10px 12px; display:flex; gap:8px; overflow-x:auto; border-bottom:1px solid var(--border-l); }
.cat-nav::-webkit-scrollbar { display:none; }
.cat-nav a { white-space:nowrap; padding:6px 16px; border-radius:20px; background:var(--bg); font-size:13px; color:var(--t2); transition:all 0.15s; font-weight:500; }
.cat-nav a.active { background:var(--p); color:#fff; }

/* Goods Grid */
.goods-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:10px; }
.goods-card { background:var(--card); border-radius:var(--r-l); overflow:hidden; box-shadow:var(--sh); transition:transform 0.15s, box-shadow 0.15s; border:1px solid var(--border-l); }
.goods-card:active { transform:scale(0.97); }
.goods-card img, .goods-card .no-img { width:100%; aspect-ratio:1; object-fit:cover; }
.goods-card .no-img { background:linear-gradient(135deg,#f1f5f9,#e2e8f0); display:flex; align-items:center; justify-content:center; color:var(--t3); font-size:12px; }
.goods-card .info { padding:10px 12px; }
.goods-card .name { font-size:13px; line-height:1.4; height:36px; overflow:hidden; color:var(--t1); font-weight:500; }
.goods-card .price { color:var(--accent); font-size:18px; font-weight:700; margin-top:4px; font-variant-numeric:tabular-nums; }
.goods-card .price::before { content:'¥'; font-size:12px; font-weight:600; }
.goods-card .sales { color:var(--t3); font-size:11px; margin-top:2px; }

/* Goods Detail */
.goods-detail .gallery img, .goods-detail .gallery .no-img { width:100%; max-height:400px; object-fit:cover; background:linear-gradient(135deg,#f1f5f9,#e2e8f0); display:flex; align-items:center; justify-content:center; color:var(--t3); }
.goods-detail .info { background:#fff; padding:16px; margin-bottom:8px; }
.goods-detail .price { color:var(--accent); font-size:28px; font-weight:700; font-variant-numeric:tabular-nums; }
.goods-detail .price::before { content:'¥'; font-size:16px; }
.goods-detail .name { font-size:16px; margin-top:6px; font-weight:600; }
.goods-detail .subtitle { color:var(--t3); margin-top:4px; font-size:13px; }
.goods-detail .meta { margin-top:12px; color:var(--t3); font-size:12px; display:flex; gap:16px; padding-top:12px; border-top:1px solid var(--border-l); }
.goods-detail .desc { background:#fff; padding:16px; margin-bottom:8px; min-height:80px; line-height:1.8; color:var(--t2); font-size:14px; }

/* Goods Bar */
.goods-bar { position:fixed; bottom:60px; left:0; right:0; height:56px; background:#fff; border-top:1px solid var(--border-l); display:flex; padding:0 14px; gap:10px; align-items:center; z-index:90; box-shadow:0 -2px 10px rgba(0,0,0,0.03); }
.goods-bar .btn-cart, .goods-bar .btn-buy { flex:1; height:42px; border:none; border-radius:21px; font-size:14px; font-weight:600; color:#fff; }
.goods-bar .btn-cart { background:linear-gradient(135deg,#f59e0b,#f97316); }
.goods-bar .btn-buy { background:linear-gradient(135deg,var(--accent),var(--accent-d)); }

/* Cart */
.cart-list { background:#fff; margin-bottom:8px; }
.cart-item { display:flex; padding:12px; border-bottom:1px solid var(--border-l); align-items:center; gap:12px; }
.cart-item:last-child { border-bottom:none; }
.cart-item img, .cart-item .no-img { width:64px; height:64px; border-radius:8px; object-fit:cover; background:linear-gradient(135deg,#f1f5f9,#e2e8f0); }
.cart-item .info { flex:1; }
.cart-item .name { font-size:13px; color:var(--t1); font-weight:500; }
.cart-item .price { color:var(--accent); font-size:16px; font-weight:700; }
.cart-item .price::before { content:'¥'; font-size:11px; }
.cart-item .qty { display:flex; align-items:center; gap:6px; }
.cart-item .qty button { width:28px; height:28px; border:1px solid var(--border); background:#fff; border-radius:6px; font-size:16px; color:var(--t2); }
.cart-item .qty button:disabled { opacity:0.3; }
.cart-item .qty span { min-width:30px; text-align:center; font-size:14px; font-weight:500; }

.cart-bar { position:fixed; bottom:60px; left:0; right:0; height:56px; background:#fff; border-top:1px solid var(--border-l); display:flex; padding:0 16px; align-items:center; justify-content:space-between; z-index:90; box-shadow:0 -2px 10px rgba(0,0,0,0.03); }
.cart-bar .total { font-size:15px; color:var(--t1); }
.cart-bar .total span { color:var(--accent); font-weight:700; font-size:20px; }
.cart-bar .total span::before { content:'¥'; font-size:13px; }
.cart-bar .btn { height:42px; padding:0 36px; background:linear-gradient(135deg,var(--accent),var(--accent-d)); color:#fff; border:none; border-radius:21px; font-size:15px; font-weight:600; }

/* Forms */
.form-group { background:#fff; padding:14px 16px; margin-bottom:8px; }
.form-group label { display:block; margin-bottom:6px; color:var(--t2); font-size:13px; font-weight:500; }
.form-group input, .form-group textarea { width:100%; padding:12px; border:1px solid var(--border); border-radius:8px; font-size:14px; background:var(--bg); font-family:inherit; }
.form-group input:focus, .form-group textarea:focus { outline:none; border-color:var(--p); background:#fff; }

.btn-primary { display:block; width:calc(100% - 32px); height:48px; margin:16px auto; background:linear-gradient(135deg,var(--p),var(--p-d)); color:#fff; border:none; border-radius:24px; font-size:16px; font-weight:600; box-shadow:0 4px 16px rgba(79,70,229,0.25); }
.btn-link { display:block; text-align:center; color:var(--p); margin-top:12px; font-size:14px; }

/* Orders */
.order-card { background:#fff; margin:10px; border-radius:var(--r-l); padding:16px; box-shadow:var(--sh); border:1px solid var(--border-l); }
.order-card .head { display:flex; justify-content:space-between; color:var(--t3); font-size:12px; margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid var(--border-l); }
.order-card .body { display:flex; gap:12px; }
.order-card .body img, .order-card .body .no-img { width:56px; height:56px; border-radius:8px; object-fit:cover; background:var(--bg); }
.order-card .body .info { flex:1; }
.order-card .foot { display:flex; justify-content:space-between; align-items:center; margin-top:10px; padding-top:10px; border-top:1px solid var(--border-l); }

.status-0 { color:#f59e0b; }
.status-1 { color:var(--p); }
.status-2 { color:#16a34a; }
.status-3 { color:var(--t3); }
.status-4 { color:#cbd5e1; }
.status-5 { color:var(--accent); }

.tab-bar { background:#fff; display:flex; margin-bottom:8px; border-bottom:1px solid var(--border-l); position:sticky; top:0; z-index:50; }
.tab-bar a { flex:1; text-align:center; padding:13px 4px; font-size:13px; color:var(--t2); border-bottom:2px solid transparent; transition:all 0.15s; font-weight:500; }
.tab-bar a.active { color:var(--p); border-bottom-color:var(--p); font-weight:600; }

/* User */
.user-header { background:linear-gradient(135deg,var(--p),var(--p-d)); color:#fff; padding:28px 20px; }
.user-header .top { display:flex; align-items:center; }
.user-header .avatar { width:56px; height:56px; border-radius:50%; background:rgba(255,255,255,0.15); display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:700; border:2px solid rgba(255,255,255,0.2); }
.user-header .info { margin-left:14px; }
.user-header .nickname { font-size:17px; font-weight:600; }
.user-header .phone { font-size:13px; opacity:0.7; margin-top:3px; }
.user-header .balance { margin-top:14px; display:flex; align-items:baseline; gap:6px; }
.user-header .balance .label { font-size:12px; opacity:0.6; }
.user-header .balance .amount { font-size:24px; font-weight:700; font-variant-numeric:tabular-nums; }
.user-header .balance .amount::before { content:'¥'; font-size:14px; }

.user-menu { background:#fff; margin:10px; border-radius:var(--r-l); overflow:hidden; box-shadow:var(--sh); border:1px solid var(--border-l); }
.user-menu a { display:flex; padding:14px 16px; border-bottom:1px solid var(--border-l); justify-content:space-between; align-items:center; font-size:14px; color:var(--t1); font-weight:500; }
.user-menu a:last-child { border-bottom:none; }
.user-menu a:active { background:var(--bg); }
.user-menu a .arrow { color:var(--t3); font-size:18px; }

/* Card Box */
.card-box { background:linear-gradient(135deg,#fffbeb,#fef3c7); border:1px solid #fde68a; border-radius:var(--r-l); padding:16px; margin:10px; }
.card-box-title { font-weight:600; margin-bottom:10px; color:#b45309; font-size:14px; display:flex; align-items:center; gap:6px; }
.card-box .card-item { padding:10px 0; border-bottom:1px dashed #fde68a; font-family:'Courier New',monospace; font-size:15px; color:#92400e; word-break:break-all; }
.card-box .card-item:last-child { border-bottom:none; }

/* Msg */
.msg { padding:12px 16px; margin:10px; border-radius:8px; font-size:13px; text-align:center; font-weight:500; }
.msg-ok { background:#ecfdf5; color:#059669; }
.msg-err { background:#fef2f2; color:var(--accent-d); }

/* Empty */
.empty { text-align:center; padding:50px 20px; color:var(--t3); font-size:14px; }
.empty a { color:var(--p); font-weight:500; }

/* Info Card */
.info-card { background:#fff; margin:10px; border-radius:var(--r-l); padding:16px; box-shadow:var(--sh); border:1px solid var(--border-l); }
.info-card .row { display:flex; justify-content:space-between; padding:7px 0; font-size:14px; }
.info-card .row .label { color:var(--t3); }
.info-card .row .value { color:var(--t1); font-weight:500; }
.info-card .section { margin-top:14px; padding-top:12px; border-top:1px solid var(--border-l); }
.info-card .section-label { color:var(--t3); font-size:12px; margin-bottom:6px; }

/* Pagination */
.page-nav { text-align:center; padding:15px; font-size:14px; color:var(--t3); }
.page-nav a { color:var(--p); font-weight:500; padding:0 8px; }

/* ===== Premium Home / Cart Refinement ===== */
body {
    background:
        radial-gradient(circle at 18% 0%, rgba(79,70,229,.10), transparent 28%),
        linear-gradient(180deg, #f6f7fb 0%, #f8fafc 42%, #f4f6fb 100%);
}
.page { max-width:480px; margin:0 auto; position:relative; }

.home-hero {
    padding:26px 18px 18px;
    background:linear-gradient(145deg, #0f172a 0%, #1e293b 52%, #312e81 100%);
    color:#fff;
    border-radius:0 0 28px 28px;
    box-shadow:0 18px 45px rgba(15,23,42,.20);
    position:relative;
    overflow:hidden;
}
.home-hero::after {
    content:"";
    position:absolute;
    width:180px;height:180px;right:-70px;top:-70px;
    background:radial-gradient(circle, rgba(255,255,255,.22), transparent 64%);
    pointer-events:none;
}
.home-topline { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; position:relative; z-index:1; }
.home-kicker,.cart-kicker,.section-kicker { font-size:10px; letter-spacing:.16em; font-weight:800; opacity:.68; margin-bottom:4px; }
.home-topline h1 { font-size:25px; line-height:1.18; font-weight:800; letter-spacing:-.04em; }
.home-user { width:40px;height:40px;border-radius:16px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px); }
.home-user svg { width:21px;height:21px; }
.home-search { margin-top:22px; height:50px; display:flex; align-items:center; gap:10px; background:rgba(255,255,255,.96); border-radius:18px; padding:0 8px 0 15px; box-shadow:0 14px 30px rgba(2,6,23,.18); position:relative; z-index:1; }
.home-search svg { width:18px;height:18px;color:#64748b; }
.home-search input { flex:1; border:0; outline:0; background:transparent; font-size:14px; color:#0f172a; min-width:0; }
.home-search button { border:0; height:36px; padding:0 17px; border-radius:14px; background:#0f172a; color:#fff; font-weight:700; font-size:13px; }
.home-notice { margin:14px 16px 18px; padding:12px 14px; display:flex; align-items:flex-start; gap:10px; background:#fff; border:1px solid rgba(226,232,240,.9); border-radius:18px; color:#334155; font-size:13px; line-height:1.55; box-shadow:0 12px 28px rgba(15,23,42,.06); }
.home-notice svg { width:18px; height:18px; color:#4f46e5; flex-shrink:0; margin-top:1px; }
.home-notice span { flex:1; }

.premium-banner { margin:18px 16px 20px; border-radius:24px; overflow:hidden; position:relative; background:#e2e8f0; box-shadow:0 18px 40px rgba(15,23,42,.13); }
.premium-banner-track { display:flex; transition:transform .38s cubic-bezier(.2,.8,.2,1); }
.premium-banner-slide { min-width:100%; position:relative; height:184px; display:block; }
.premium-banner-slide img { width:100%; height:100%; object-fit:cover; }
.premium-banner-slide::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(0,0,0,.42)); }
.premium-banner-title { position:absolute; left:18px; bottom:18px; right:60px; color:#fff; z-index:1; font-size:18px; font-weight:800; letter-spacing:-.03em; text-shadow:0 2px 10px rgba(0,0,0,.22); }
.premium-banner-dots { position:absolute; right:16px; bottom:18px; z-index:2; display:flex; gap:5px; align-items:center; }
.premium-banner-dots .dot { width:6px;height:6px;border-radius:10px;background:rgba(255,255,255,.55); }
.premium-banner-dots .dot.active { width:18px;background:#fff; }

.home-section { margin:0 16px 20px; }
.section-head { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:12px; }
.section-head h2 { font-size:19px; font-weight:800; letter-spacing:-.03em; color:#0f172a; }
.section-kicker { color:#6366f1; opacity:1; margin-bottom:2px; }
.section-note { font-size:12px; color:#94a3b8; }
.premium-cat-nav { margin:0; padding:0; background:transparent; border:0; gap:10px; }
.premium-cat-nav a { background:#fff; border:1px solid rgba(226,232,240,.9); box-shadow:0 8px 20px rgba(15,23,42,.04); padding:9px 17px; border-radius:999px; }
.premium-cat-nav a.active { background:#111827; color:#fff; border-color:#111827; }
.product-section { padding-bottom:18px; }
.premium-goods-grid { padding:0; gap:14px; }
.premium-goods-card { border:1px solid rgba(226,232,240,.75); border-radius:22px; background:rgba(255,255,255,.94); box-shadow:0 12px 30px rgba(15,23,42,.07); overflow:hidden; }
.premium-goods-card .thumb { margin:8px 8px 0; border-radius:17px; overflow:hidden; background:#f1f5f9; }
.premium-goods-card img,.premium-goods-card .no-img { aspect-ratio:1.05; width:100%; object-fit:cover; }
.premium-goods-card .info { padding:12px 13px 14px; }
.premium-goods-card .name { height:40px; font-size:14px; font-weight:700; line-height:1.42; letter-spacing:-.01em; }
.premium-goods-card .meta-line { display:flex; align-items:flex-end; justify-content:space-between; gap:8px; margin-top:9px; }
.premium-goods-card .price { margin:0; font-size:19px; color:#ef4444; line-height:1; }
.premium-goods-card .price::before { content:'¥'; font-size:12px; margin-right:1px; }
.premium-goods-card .sales { font-size:11px; color:#94a3b8; white-space:nowrap; }
.premium-empty { background:#fff; border-radius:20px; }

.cart-hero { margin:0 0 18px; padding:24px 18px 28px; background:linear-gradient(145deg,#111827,#1e293b); color:#fff; border-radius:0 0 28px 28px; display:flex; gap:14px; align-items:flex-start; box-shadow:0 18px 45px rgba(15,23,42,.18); }
.cart-back { width:40px;height:40px;border-radius:15px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center; }
.cart-back svg { width:21px;height:21px; }
.cart-hero h1 { font-size:25px; font-weight:800; letter-spacing:-.04em; }
.cart-hero p { margin-top:3px; color:rgba(255,255,255,.62); font-size:13px; }
.cart-panel,.cart-summary-card { margin:0 16px 16px; background:rgba(255,255,255,.96); border:1px solid rgba(226,232,240,.85); border-radius:24px; box-shadow:0 14px 34px rgba(15,23,42,.07); overflow:hidden; }
.cart-panel-head { padding:16px 16px 2px; display:flex; justify-content:space-between; align-items:center; }
.cart-panel-head span { font-weight:800; color:#0f172a; font-size:16px; }
.cart-panel-head a { color:#94a3b8; font-size:12px; }
.premium-cart-list { background:transparent; margin:0; padding:6px 12px 12px; }
.premium-cart-item { position:relative; padding:12px 2px; border-bottom:1px solid #f1f5f9; gap:12px; background:transparent; }
.premium-cart-item:last-child { border-bottom:0; }
.cart-thumb { width:78px;height:78px;border-radius:18px;overflow:hidden;flex-shrink:0;background:#f1f5f9; }
.cart-thumb img,.cart-thumb .no-img { width:100%;height:100%;object-fit:cover;border-radius:0; }
.cart-info { flex:1; min-width:0; padding-right:20px; }
.cart-name { font-size:14px; font-weight:800; color:#0f172a; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.cart-sub { margin-top:6px; display:flex; gap:8px; flex-wrap:wrap; color:#94a3b8; font-size:11px; }
.cart-sub span { background:#f8fafc; border:1px solid #eef2f7; border-radius:999px; padding:2px 7px; }
.cart-row { margin-top:11px; display:flex; justify-content:space-between; align-items:center; gap:10px; }
.cart-price { color:#ef4444; font-size:18px; font-weight:900; line-height:1; }
.cart-price::before { content:'¥'; font-size:12px; margin-right:1px; }
.premium-qty { display:flex; align-items:center; background:#f8fafc; border:1px solid #e2e8f0; border-radius:999px; padding:3px; }
.premium-qty button { width:27px;height:27px;border:0;background:#fff;border-radius:50%;color:#334155;font-weight:800;font-size:16px;box-shadow:0 1px 3px rgba(15,23,42,.07); }
.premium-qty button:disabled { opacity:.35; }
.premium-qty span { min-width:28px;text-align:center;font-weight:800;color:#0f172a;font-size:13px; }
.cart-remove { position:absolute; right:1px; top:12px; width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f8fafc;color:#94a3b8;font-size:18px; }
.cart-summary-card { padding:16px; }
.summary-row { display:flex; justify-content:space-between; align-items:center; padding:7px 0; color:#64748b; }
.summary-row strong { color:#0f172a; }
.summary-price { color:#ef4444!important; font-size:18px; }
.summary-price::before { content:'¥'; font-size:12px; }
.premium-cart-bar { max-width:480px; margin:0 auto; height:70px; padding:10px 18px; border-radius:22px 22px 0 0; box-shadow:0 -14px 35px rgba(15,23,42,.10); }
.premium-cart-bar .total { display:flex; flex-direction:column; gap:0; }
.premium-cart-bar .total small { color:#94a3b8; font-size:11px; }
.premium-cart-bar .total span { font-size:23px; line-height:1.15; }
.premium-cart-bar .btn { height:48px; padding:0 34px; border-radius:18px; background:linear-gradient(135deg,#111827,#4f46e5); box-shadow:0 12px 26px rgba(79,70,229,.26); }
.premium-empty-cart { margin:34px 18px 0; background:rgba(255,255,255,.96); border:1px solid rgba(226,232,240,.85); border-radius:28px; padding:40px 22px; text-align:center; box-shadow:0 16px 40px rgba(15,23,42,.07); }
.empty-illustration { width:120px;height:120px;margin:0 auto 14px; }
.premium-empty-cart h2 { font-size:20px; font-weight:900; letter-spacing:-.03em; color:#0f172a; }
.premium-empty-cart p { margin:7px 0 20px; color:#64748b; }
.premium-primary-btn { display:inline-flex; align-items:center; justify-content:center; height:46px; padding:0 34px; border-radius:17px; background:linear-gradient(135deg,#111827,#4f46e5); color:#fff!important; font-weight:800; box-shadow:0 12px 26px rgba(79,70,229,.24); }

/* ===== Unified Premium Skin For All H5 Pages ===== */
.header:not(.home-hero *) {
    background:linear-gradient(145deg,#111827,#1e293b 58%,#312e81);
    color:#fff;
    padding:20px 18px 24px;
    border-radius:0 0 26px 26px;
    box-shadow:0 16px 38px rgba(15,23,42,.18);
    font-size:20px;
    font-weight:900;
    letter-spacing:-.04em;
    text-align:center;
    position:relative;
    top:auto;
}
.header a { color:#fff!important; font-weight:800; }
.search-bar { margin:16px; padding:0; border:0; background:transparent; }
.search-bar form { height:50px; display:flex; align-items:center; gap:9px; background:#fff; border-radius:18px; padding:0 8px 0 14px; box-shadow:0 12px 30px rgba(15,23,42,.07); border:1px solid rgba(226,232,240,.85); }
.search-bar input { background:transparent; padding:0; border-radius:0; font-size:14px; }
.search-bar input:focus { outline:0; }
.search-bar button { height:36px; border-radius:14px; background:#111827; font-weight:800; }
.cat-nav:not(.premium-cat-nav) { margin:16px 16px 6px; padding:0; background:transparent; border:0; gap:10px; }
.cat-nav:not(.premium-cat-nav) a { background:#fff; border:1px solid rgba(226,232,240,.9); box-shadow:0 8px 20px rgba(15,23,42,.04); padding:9px 17px; border-radius:999px; }
.cat-nav:not(.premium-cat-nav) a.active { background:#111827; color:#fff; }
.goods-grid:not(.premium-goods-grid) { padding:16px; gap:14px; }
.goods-card:not(.premium-goods-card) { border:1px solid rgba(226,232,240,.75); border-radius:22px; background:rgba(255,255,255,.96); box-shadow:0 12px 30px rgba(15,23,42,.07); overflow:hidden; }
.goods-card:not(.premium-goods-card) > img,
.goods-card:not(.premium-goods-card) > .no-img { margin:8px 8px 0; width:calc(100% - 16px); border-radius:17px; aspect-ratio:1.05; }
.goods-card:not(.premium-goods-card) .info { padding:12px 13px 14px; }
.goods-card:not(.premium-goods-card) .name { height:40px; font-size:14px; font-weight:800; line-height:1.42; }
.goods-card:not(.premium-goods-card) .price { font-size:19px; margin-top:8px; }
.goods-card:not(.premium-goods-card) .sales { color:#94a3b8; }

.form-group { background:#fff; padding:16px; margin:0 16px 12px; border-radius:20px; box-shadow:0 12px 30px rgba(15,23,42,.06); border:1px solid rgba(226,232,240,.85); }
.form-group label { font-weight:800; color:#0f172a; margin-bottom:9px; }
.form-group input,.form-group textarea,.form-group select { border:1px solid #e2e8f0; background:#f8fafc; border-radius:14px; padding:13px 14px; }
.form-group input:focus,.form-group textarea:focus { border-color:#4f46e5; box-shadow:0 0 0 4px rgba(79,70,229,.10); }
.btn-primary { height:50px; border-radius:18px; background:linear-gradient(135deg,#111827,#4f46e5); box-shadow:0 14px 30px rgba(79,70,229,.24); font-weight:900; }
.btn-link { color:#4f46e5; font-weight:800; }
.msg { border-radius:18px; margin:14px 16px; box-shadow:0 10px 24px rgba(15,23,42,.05); }
.empty { margin:18px 16px; padding:42px 20px; background:#fff; border:1px solid rgba(226,232,240,.85); border-radius:26px; box-shadow:0 14px 34px rgba(15,23,42,.06); }
.empty a { color:#4f46e5!important; font-weight:900; }
.page-nav,.pagination-bar { margin:0 16px 16px; padding:16px; text-align:center; background:#fff; border-radius:20px; box-shadow:0 10px 24px rgba(15,23,42,.05); color:#64748b; }
.page-nav a,.pagination-bar a { color:#4f46e5!important; font-weight:900; padding:0 10px; }

.info-card,.order-card,.card-box { margin:14px 16px; border-radius:24px; background:rgba(255,255,255,.96); border:1px solid rgba(226,232,240,.85); box-shadow:0 14px 34px rgba(15,23,42,.07); }
.info-card { padding:18px; }
.info-card .row { padding:9px 0; }
.info-card .row .label,.info-card .section-label { color:#94a3b8; font-weight:700; }
.info-card .row .value { font-weight:800; }
.cart-list:not(.premium-cart-list) { margin:14px 16px; border-radius:24px; background:#fff; overflow:hidden; box-shadow:0 14px 34px rgba(15,23,42,.07); border:1px solid rgba(226,232,240,.85); }
.cart-item { padding:14px; gap:12px; }
.cart-item img,.cart-item .no-img { width:76px; height:76px; border-radius:18px; }
.cart-item .name { font-weight:800; font-size:14px; }
.cart-item .price { color:#ef4444; font-weight:900; }

.goods-cover { margin:16px; border-radius:26px!important; box-shadow:0 18px 42px rgba(15,23,42,.10); }
.goods-cover img { height:auto!important; max-height:none; aspect-ratio:1; object-fit:cover; }
.goods-detail .info { margin:0 16px 14px; border-radius:24px; box-shadow:0 14px 34px rgba(15,23,42,.07); border:1px solid rgba(226,232,240,.85); }
.goods-detail .price { font-size:30px; font-weight:900; }
.goods-detail .name { font-size:18px; font-weight:900; }
.goods-detail .desc { margin:0 16px 88px; border-radius:24px; box-shadow:0 14px 34px rgba(15,23,42,.07); border:1px solid rgba(226,232,240,.85); }
.desc-images { margin:0 0 14px!important; }
.desc-images img { border-radius:18px!important; margin-bottom:12px!important; }
.goods-bar { max-width:480px; margin:0 auto; height:70px; padding:10px 18px; border-radius:22px 22px 0 0; box-shadow:0 -14px 35px rgba(15,23,42,.10); }
.goods-bar .btn-cart,.goods-bar .btn-buy { height:48px; border-radius:18px; font-weight:900; }
.goods-bar .btn-cart { background:linear-gradient(135deg,#f59e0b,#ef4444); }
.goods-bar .btn-buy { background:linear-gradient(135deg,#111827,#4f46e5); }

.order-card { padding:16px; }
.order-card .head { border-bottom:1px solid #f1f5f9; padding-bottom:12px; }
.order-card .foot { border-top:1px solid #f1f5f9; padding-top:12px; }
.tab-bar { margin:16px; border-radius:18px; overflow-x:auto; background:#fff; border:1px solid rgba(226,232,240,.85); box-shadow:0 10px 24px rgba(15,23,42,.05); top:auto; }
.tab-bar a { min-width:72px; padding:13px 8px; }
.tab-bar a.active { color:#111827; border-bottom-color:#111827; }

.user-header { margin:0 0 18px; padding:30px 20px 34px; border-radius:0 0 30px 30px; background:linear-gradient(145deg,#111827,#1e293b 58%,#312e81); box-shadow:0 18px 45px rgba(15,23,42,.18); }
.user-header .avatar { width:64px;height:64px;border-radius:22px; }
.user-header .balance { margin-top:22px; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.14); border-radius:20px; padding:14px 16px; justify-content:space-between; }
.user-menu { margin:0 16px 18px; border-radius:24px; box-shadow:0 14px 34px rgba(15,23,42,.07); }
.user-menu a { padding:17px 18px; font-weight:800; }
.article-list { padding:16px!important; }
.article-card { border-radius:22px!important; box-shadow:0 12px 30px rgba(15,23,42,.07)!important; border:1px solid rgba(226,232,240,.85); margin-bottom:14px!important; }
.article-card .cover { width:112px!important; min-width:112px!important; height:92px!important; }
.article-detail { margin:16px!important; border-radius:26px!important; box-shadow:0 14px 34px rgba(15,23,42,.07); border:1px solid rgba(226,232,240,.85); padding:20px!important; }
.article-detail .title { font-size:22px!important; }
.card-box { background:linear-gradient(135deg,#fff7ed,#fffbeb); padding:18px; }
.tabbar { max-width:480px; margin:0 auto; height:66px; border-radius:22px 22px 0 0; box-shadow:0 -12px 32px rgba(15,23,42,.08); border:1px solid rgba(226,232,240,.85); border-bottom:0; }
.tabbar a { padding-top:9px; font-weight:800; }
.premium-price { color:#ef4444!important; font-size:19px; font-weight:900; }
.premium-link { color:#4f46e5!important; font-weight:900; }
.auth-shell,.premium-form-shell { padding:18px 0 24px; }
.auth-shell form,.premium-form-shell form { margin-top:4px; }
.premium-tip { margin:0 16px 14px; padding:16px 18px; border-radius:20px; background:linear-gradient(135deg,#eef2ff,#fff); border:1px solid #e0e7ff; color:#475569; line-height:1.7; box-shadow:0 12px 30px rgba(15,23,42,.05); }

/* Wallet Page */
.wallet-hero { margin:0 0 18px; padding:24px 18px 28px; background:linear-gradient(145deg,#111827,#1e293b 58%,#312e81); color:#fff; border-radius:0 0 30px 30px; display:flex; gap:14px; align-items:flex-start; box-shadow:0 18px 45px rgba(15,23,42,.18); }
.wallet-back { width:40px;height:40px;border-radius:15px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center; }
.wallet-back svg { width:21px;height:21px; }
.wallet-kicker { font-size:10px; letter-spacing:.18em; font-weight:900; opacity:.68; margin-bottom:4px; }
.wallet-hero h1 { font-size:25px; line-height:1.18; font-weight:900; letter-spacing:-.04em; }
.wallet-hero p { margin-top:4px; color:rgba(255,255,255,.62); font-size:13px; }
.wallet-balance-card { margin:-10px 16px 16px; padding:22px 20px; border-radius:26px; color:#fff; background:linear-gradient(135deg,#4f46e5,#111827); box-shadow:0 18px 42px rgba(79,70,229,.22); position:relative; overflow:hidden; }
.wallet-balance-card::after { content:""; position:absolute; width:150px;height:150px; right:-55px; top:-55px; border-radius:50%; background:rgba(255,255,255,.13); }
.wallet-balance-card .label { color:rgba(255,255,255,.68); font-size:12px; font-weight:800; letter-spacing:.08em; }
.wallet-balance-card .amount { margin-top:6px; font-size:34px; font-weight:900; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.wallet-balance-card .amount::before { content:'¥'; font-size:17px; margin-right:3px; opacity:.85; }
.wallet-balance-card .recharge-btn { position:absolute; right:18px; bottom:20px; z-index:1; height:38px; padding:0 18px; border-radius:14px; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.24); color:#fff; display:flex; align-items:center; font-size:13px; font-weight:900; backdrop-filter:blur(8px); }
.wallet-log-panel { margin:0 16px 20px; background:rgba(255,255,255,.96); border:1px solid rgba(226,232,240,.85); border-radius:26px; box-shadow:0 14px 34px rgba(15,23,42,.07); overflow:hidden; }
.wallet-log-panel .panel-head { padding:18px 18px 4px; display:flex; align-items:center; justify-content:space-between; }
.wallet-log-panel .panel-head span { font-size:17px; font-weight:900; color:#0f172a; letter-spacing:-.03em; }
.wallet-log-panel .panel-head small { color:#94a3b8; font-size:12px; }
.wallet-log-item { display:flex; align-items:center; gap:12px; padding:16px 18px; border-bottom:1px solid #f1f5f9; }
.wallet-log-item:last-child { border-bottom:none; }
.log-icon { width:38px;height:38px;border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:900; flex-shrink:0; }
.log-icon.income { background:#ecfdf5; color:#16a34a; }
.log-icon.expense { background:#fef2f2; color:#ef4444; }
.log-main { flex:1; min-width:0; }
.log-main .remark { font-size:14px; font-weight:900; color:#0f172a; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.log-main .time { margin-top:3px; font-size:12px; color:#94a3b8; }
.log-amount { font-size:16px; font-weight:900; font-variant-numeric:tabular-nums; }
.log-amount.income { color:#16a34a; }
.log-amount.expense { color:#ef4444; }
.wallet-empty { padding:42px 20px; text-align:center; color:#94a3b8; }
.wallet-empty .empty-dot { width:48px;height:48px;border-radius:18px;background:linear-gradient(135deg,#eef2ff,#fff);border:1px solid #e0e7ff;margin:0 auto 12px; }
.wallet-empty p { margin-bottom:12px; }
.wallet-empty a { color:#4f46e5; font-weight:900; }

/* Profile Center */
.profile-hero { margin:0 0 18px; padding:30px 20px 34px; border-radius:0 0 30px 30px; color:#fff; background:linear-gradient(145deg,#111827,#1e293b 58%,#312e81); box-shadow:0 18px 45px rgba(15,23,42,.18); position:relative; overflow:hidden; }
.profile-hero::after { content:""; position:absolute; width:180px;height:180px; right:-70px; top:-70px; border-radius:50%; background:rgba(255,255,255,.12); }
.profile-top { display:flex; align-items:center; gap:14px; position:relative; z-index:1; }
.profile-avatar { width:64px;height:64px;border-radius:22px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:900;box-shadow:inset 0 1px 0 rgba(255,255,255,.16); }
.profile-info .nickname { font-size:20px;font-weight:900;letter-spacing:-.03em; }
.profile-info .phone { margin-top:3px;font-size:13px;color:rgba(255,255,255,.62); }
.h5-level-badge { display:inline-flex; align-items:center; height:22px; padding:0 10px; margin-top:8px; color:#fff; border-radius:999px; font-size:11px; font-weight:900; box-shadow:0 8px 18px rgba(0,0,0,.16); }
.profile-balance { margin-top:22px;padding:16px 18px;border-radius:22px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1;backdrop-filter:blur(8px); }
.profile-balance .label { display:block;color:rgba(255,255,255,.62);font-size:12px;font-weight:800;letter-spacing:.08em; }
.profile-balance strong { display:block;margin-top:4px;font-size:28px;font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-.04em; }
.profile-balance strong .yen { font-size:14px;margin-right:2px;opacity:.85; }
.profile-balance a { height:38px;padding:0 18px;border-radius:14px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.24);display:flex;align-items:center;color:#fff;font-size:13px;font-weight:900; }
.profile-quick-grid { margin:-4px 16px 16px; padding:20px 12px; display:grid; grid-template-columns:repeat(5,1fr); gap:6px; background:rgba(255,255,255,.96); border:1px solid rgba(226,232,240,.85); border-radius:26px; box-shadow:0 14px 34px rgba(15,23,42,.07); }
.profile-quick-grid a { display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none; }
.profile-quick-grid em { font-style:normal;font-size:11px;font-weight:800;color:#0f172a;white-space:nowrap; }
.quick-icon { width:42px;height:42px;border-radius:16px;display:flex;align-items:center;justify-content:center; }
.quick-icon svg { width:21px;height:21px; }
.quick-icon.order { background:#eef2ff;color:#4f46e5; }
.quick-icon.wallet { background:#ecfdf5;color:#16a34a; }
.quick-icon.recharge { background:#fff7ed;color:#f97316; }
.quick-icon.cart { background:#fef2f2;color:#ef4444; }
.quick-icon.ref { background:#f5f3ff;color:#7c3aed; }
.profile-menu-card { margin:0 16px 16px; background:rgba(255,255,255,.96); border:1px solid rgba(226,232,240,.85); border-radius:26px; box-shadow:0 14px 34px rgba(15,23,42,.07); overflow:hidden; }
.profile-menu-title { padding:17px 18px 4px;font-size:16px;font-weight:900;color:#0f172a;letter-spacing:-.03em; }
.profile-menu-card a { display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #f1f5f9;font-weight:900;color:#0f172a; }
.profile-menu-card a:last-child { border-bottom:none; }
.profile-menu-card b { color:#cbd5e1;font-size:20px;font-weight:700; }
.menu-left { display:flex;align-items:center;gap:12px; }
.menu-icon { width:38px;height:38px;border-radius:15px;display:flex;align-items:center;justify-content:center; }
.menu-icon svg { width:19px;height:19px; }
.menu-icon.notice { background:#eef2ff;color:#4f46e5; }
.menu-icon.help { background:#ecfeff;color:#0891b2; }
.menu-icon.logout { background:#f8fafc;color:#64748b; }
.profile-menu-card.danger { margin-bottom:86px; }
.profile-menu-card.danger a { color:#64748b; }
