:root {
    --green: #ecd894;
    --green-deep: #a8863a;
    --ink: #4a3a10;
    --ease-spring: cubic-bezier(0.34, 1.45, 0.5, 1);
  }
body {
    font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
    background:
      radial-gradient(circle at 22% 4%, rgba(236,216,148,.40) 0%, rgba(236,216,148,0) 42%),
      linear-gradient(180deg, #f9f4e1 0%, #f4ecd2 32%, #fcfaef 55%, #ffffff 68%);
    background-attachment: fixed;
    color:#111;
  }
.goods-card .inf .p { font-size:16px; font-weight:800; color:#e60023; }
/* 分类页:左侧竖排分类栏 + 右侧两列商品 */
  .cat-page { padding:0 0 20px; max-width:none; margin:0; }
.cat-layout { display:flex; padding:0 0 20px; align-items:stretch; }
.cat-side {
    flex:none; width:96px;
    position:sticky; top:0;
    align-self:stretch;
    min-height:100vh;
    background:#ffffff;
    border-right:1px solid rgba(0,0,0,.06);
    display:flex; flex-direction:column;
  }
.cat-side button {
    position:relative;
    font-family:inherit; font-size:13px; font-weight:700; color:#111;
    background:#f2f2f4;
    border:none;
    border-bottom:1px solid rgba(0,0,0,.06);
    padding:15px 8px;
    cursor:pointer; text-align:center; word-break:break-all;
  }
.cat-side button.on { background:#ffffff; color:#111; font-weight:800; }
.cat-side button.on::before {
    content:''; position:absolute; right:0; top:50%; transform:translateY(-50%);
    width:3px; height:18px; background:#a855f7; border-radius:2px 0 0 2px;
  }
.cat-side-top { padding:0; }
.cat-side-top img { width:100%; display:block; border-radius:8px; }
.cat-main { flex:1; min-width:0; padding:12px 12px 0; }
.cat-banner { position:relative; aspect-ratio:21/9; overflow:hidden; background:#ffffff; margin:0 0 10px; border-radius:0; }
.cat-banner img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .8s ease; }
.cat-banner img.on { opacity:1; }
.cat-grid2 { display:grid; grid-template-columns:repeat(2, 1fr); gap:10px; }
.cat-grid2 .goods-card .inf .r { position:relative; padding-right:32px; }
.cat-cart {
    position:absolute; right:0; bottom:0;
    width:24px; height:24px; border-radius:50%; background:#ff8a1e;
    display:flex; align-items:center; justify-content:center;
  }
.cat-cart svg { width:14px; height:14px; }
/* 我的页背景:顶部黄色25%,其余白色 */
  #homePage, #panel-0, #panel-1, #panel-3, #panel-4 { background:linear-gradient(180deg, #fbf7ec 0%, #ffffff 16%); min-height:100vh; }
/* 余额/客服双卡内的矢量图标 */
  .mine-duo .c { display:flex; align-items:center; gap:10px; }
.mine-duo .duo-ic { width:44px; height:44px; border-radius:12px; flex:none; display:flex; align-items:center; justify-content:center; }
.mine-duo .bal .duo-ic { background:rgba(240,67,3,.18); }
.mine-duo .kf .duo-ic { background:rgba(29,121,243,.12); }
.mine-duo .duo-ic svg { width:30px; height:30px; display:block; }
.mine-duo .duo-tx { flex:1; min-width:0; }
/* 聊天窗口(覆盖在店铺页上方) */
  #chatPage {
    position:fixed; inset:0; z-index:150;
    background:#f7f2e2;
    display:flex; flex-direction:column;
  }
.chat-input button {
    flex:none; border:none; cursor:pointer;
    font-family:inherit; font-size:14px; font-weight:800;
    color:#4a3a10; background:linear-gradient(135deg,#f5e6ac,#ecd894);
    border-radius:999px; padding:10px 18px;
  }
.mine-top .ava-frame { position:relative; width:82px; height:82px; flex:none; }
.mine-top .ava-frame .fr { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:118%; height:118%; object-fit:contain; z-index:2; pointer-events:none; }
.mine-top .ava-frame .av { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:74%; height:74%; border-radius:50%; object-fit:cover; display:block; }
.order-ic .i { width:30px; height:30px; margin:0 auto; color:#33333a; }
.mine-duo .bal { background:rgba(255,255,255,.95); border:1px solid rgba(0,0,0,.06); box-shadow:0 6px 16px rgba(0,0,0,.06); }
.mine-duo .bal .l { font-size:12px; color:#9a9aa0; display:flex; align-items:center; gap:4px; }
.mine-duo .bal .v { font-size:24px; font-weight:800; margin-top:8px; color:#111; }
.mine-duo .kf {
    background:rgba(255,255,255,.95); border:1px solid rgba(0,0,0,.06); box-shadow:0 6px 16px rgba(0,0,0,.06);
    display:flex; flex-direction:row; align-items:center; justify-content:flex-start; gap:10px;
  }
.mine-duo .kf .l { font-size:11px; color:#9a9aa0; }
.mine-duo .kf .v { font-size:17px; font-weight:800; margin-top:6px; color:#111; }
.login-card input:focus { border-color:#c9a227; }
.login-big {
    width:100%; border:none; cursor:pointer;
    font-family:inherit; font-size:15px; font-weight:800;
    color:#4a3a10; background:linear-gradient(135deg,#f5e6ac,#ecd894);
    border-radius:999px; padding:13px 0;
    box-shadow:0 8px 20px rgba(190,150,60,.4);
  }
.od-goods .mi .p { font-size:16px; font-weight:800; color:#e60023; margin-top:6px; }
.od-zone button.on { background:linear-gradient(135deg,#f5e6ac,#ecd894); color:#4a3a10; border-color:#ecd894; }
.od-buybar .tt .v { font-size:19px; font-weight:800; color:#e60023; }
.od-buybar button {
    border:none; cursor:pointer;
    font-family:inherit; font-size:16px; font-weight:800;
    color:#4a3a10; background:linear-gradient(135deg,#f5e6ac,#ecd894);
    border-radius:999px; padding:13px 34px;
    box-shadow:0 8px 20px rgba(190,150,60,.4);
  }
.gd-price .p { font-size:24px; font-weight:800; color:#e60023; }
.gd-buybar button {
    width:100%; border:none; cursor:pointer;
    font-family:inherit; font-size:16px; font-weight:800;
    color:#4a3a10; background:linear-gradient(135deg,#f5e6ac,#ecd894);
    border-radius:999px; padding:14px 0;
    box-shadow:0 8px 20px rgba(190,150,60,.4);
  }
.pw-row-ava { position:relative; width:62px; height:62px; flex:none; overflow:visible; border-radius:0; box-shadow:none; background:transparent; }
.pw-row-ava .fr { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:132%; height:132%; object-fit:contain; z-index:2; pointer-events:none; }
.pw-row-ava .av { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:76%; height:76%; border-radius:50%; object-fit:cover; display:block; background:#eee; }
.pw-row-tag.green { color:var(--green-deep); background:rgba(190,150,60,.18); }
#panel-2 { background:#ffffff; min-height:100vh; }
.dock-item .ic { width:23px; height:23px; color:#8a8a8a; transition: color .25s; }
.dock-item .lb { font-size:11px; color:#8a8a8a; font-weight:600; transition: color .25s; white-space:nowrap; }
.dock-item.active .ic, .dock-item.active .lb { color:#e6b422; }
/* ================= 抽奖转盘页 ================= */
  #wheelPage {
    position:fixed; inset:0; z-index:240;
    background:
      radial-gradient(circle at 22% 4%, rgba(236,216,148,.40) 0%, rgba(236,216,148,0) 42%),
      linear-gradient(180deg, #f9f4e1 0%, #f4ecd2 32%, #fcfaef 55%, #ffffff 68%);
    overflow-y:auto;
    padding-bottom:110px;
  }
.wh-top .tt { font-size:17px; font-weight:800; color:#4a3a10; }
.wh-rule {
    margin-left:auto; flex:none;
    font-family:inherit; font-size:12px; font-weight:700; color:#4a3a10;
    background:rgba(255,255,255,.9);
    border:1px solid rgba(0,0,0,.08);
    border-radius:999px; padding:6px 13px; cursor:pointer;
    box-shadow:0 3px 8px rgba(0,0,0,.06);
  }
.wh-tip {
    text-align:center; color:#a8863a;
    font-size:14px; font-weight:700;
    margin:6px 16px 0;
  }
.wh-tip b { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; background:#a8863a; color:#fff; font-size:12px; margin-right:5px; vertical-align:-3px; }
.wh-disc {
    position:relative;
    width:100%; aspect-ratio:1/1;
    border-radius:50%;
    background: repeating-conic-gradient(from -22.5deg,
      #a8863a 0deg 1.4deg, #ffffff 1.4deg 45deg,
      #a8863a 45deg 46.4deg, #f6eed4 46.4deg 90deg);
    border:10px solid #ecd894;
    box-shadow:0 0 0 6px #fff, 0 0 0 8px rgba(111,163,35,.45), 0 16px 40px rgba(0,0,0,.18);
    transition: transform 5s cubic-bezier(0.15, 0.9, 0.25, 1);
    will-change: transform;
  }
.wh-prize .nm {
    position:absolute; left:0; right:0; bottom:0;
    font-size:12px; font-weight:800; color:#3c5a14;
    text-align:center; white-space:normal; line-height:1.25;
    text-shadow:0 1px 0 #fff, 0 0 4px #fff;
  }
.wh-prize .box {
    position:absolute; left:0; bottom:0;
    width:56px; height:56px;
    border-radius:12px; overflow:hidden;
    box-shadow:0 3px 8px rgba(0,0,0,.25), inset 0 0 0 2px #ffd94d;
    background:#2b2113;
  }