:root {
        color-scheme: light dark;
        --cream: #fff4e0;
        --paper: #fffdf7;
        --ink: #2e2118;
        --ink-soft: #6b5a49;
        --peach: #ffab7a;
        --peach-deep: #ff8a4c;
        --yellow: #ffd94d;
        --mint: #9fe3c0;
        --sky: #a8d8ff;
        --pink: #ffc4d6;
        --line: #2e2118;
        --shadow: 5px 5px 0 #2e2118;
        --gw-bg: #f4f5f7;
        --gw-card: #ffffff;
        --gw-ink: #26282c;
        --gw-soft: #8a8f98;
        --gw-line: #e4e6ea;
        --alipay: #1677ff;
        --wechat: #07c160;
        --ok: #1faf5f;
        --danger: #c22e2e;
        --req: #c22e2e;
      }
      @media (prefers-color-scheme: dark) {
        :root {
          --cream: #241b12;
          --paper: #322619;
          --ink: #f7ead6;
          --ink-soft: #cbb69a;
          --line: #f7ead6;
          --shadow: 5px 5px 0 rgba(0, 0, 0, 0.55);
          --gw-bg: #17181b;
          --gw-card: #222327;
          --gw-ink: #eceef1;
          --gw-soft: #9aa0a8;
          --gw-line: #3a3c42;
          --req: #ff7a6b;
        }
      }
      * { box-sizing: border-box; }
      html, body { margin: 0; padding: 0; }
      body {
        font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, sans-serif;
        -webkit-font-smoothing: antialiased;
      }
      button { font-family: inherit; cursor: pointer; }
      input, select { font-family: inherit; }
      .view { display: none; }
      .view.active { display: block; }

      /* ============ 小店 ============ */
      .shop-wrap {
        background: var(--cream);
        min-height: 100vh;
        padding: 18px 14px 40px;
        background-image: radial-gradient(color-mix(in srgb, var(--peach-deep) 13%, transparent) 1.6px, transparent 1.7px);
        background-size: 26px 26px;
      }
      .shop-col { max-width: 480px; margin: 0 auto; }
      @media (min-width: 760px) { .shop-col { max-width: 560px; } }

      .winbar {
        display: flex; align-items: center; gap: 7px;
        background: var(--paper);
        border: 2.5px solid var(--line); border-radius: 999px;
        padding: 8px 16px; box-shadow: var(--shadow);
      }
      .winbar .dot { width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--line); flex: none; }
      .winbar .dot.d1 { background: var(--peach-deep); }
      .winbar .dot.d2 { background: var(--yellow); }
      .winbar .dot.d3 { background: var(--mint); }
      .winbar .win-title {
        margin-left: 6px; font-size: 12px; letter-spacing: 3px; font-weight: 700; color: var(--ink-soft);
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
      }
      .winbar .win-demo {
        margin-left: auto; flex: none; font-size: 11px; font-weight: 700; color: #2e2118;
        background: var(--yellow); border: 2px solid #2e2118; border-radius: 999px; padding: 2px 9px;
      }

      .card {
        background: var(--paper);
        border: 2.5px solid var(--line); border-radius: 22px;
        box-shadow: var(--shadow);
      }

      /* ---- 店主卡 ---- */
      .owner-card { margin-top: 28px; padding: 22px 18px 18px; position: relative; overflow: visible; }
      .deco-star { position: absolute; pointer-events: none; }
      .bubble {
        position: absolute; top: -17px; right: 14px; z-index: 2;
        background: var(--yellow); color: #2e2118;
        border: 2.5px solid #2e2118; border-radius: 999px;
        font-size: 13px; font-weight: 800; padding: 6px 13px;
        box-shadow: 3px 3px 0 #2e2118; transform: rotate(2deg);
      }
      .bubble::after {
        content: ""; position: absolute; left: 22px; bottom: -8px;
        width: 12px; height: 12px; background: var(--yellow);
        border-right: 2.5px solid #2e2118; border-bottom: 2.5px solid #2e2118;
        transform: rotate(45deg); border-bottom-right-radius: 3px;
      }
      .owner-top { display: flex; gap: 14px; align-items: center; }
      .avatar-wrap { position: relative; flex: none; }
      .avatar {
        width: 70px; height: 70px; border-radius: 16px;
        border: 3px solid var(--line); background: var(--peach);
        display: flex; align-items: center; justify-content: center; overflow: hidden;
      }
      .avatar img, .modal-card .m-avatar img {
        width: 100%; height: 100%; display: block; object-fit: cover; object-position: center;
      }
      .avatar-badge {
        position: absolute; right: -4px; bottom: -2px;
        width: 24px; height: 24px; border-radius: 50%;
        background: var(--yellow); border: 2.5px solid #2e2118;
        display: flex; align-items: center; justify-content: center;
      }
      .owner-name-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
      .owner-name { font-size: 22px; font-weight: 900; color: var(--ink); margin: 0; letter-spacing: 0.5px; }
      .badge {
        font-size: 11px; font-weight: 800; color: #2e2118; background: var(--mint);
        border: 2px solid var(--line); border-radius: 999px; padding: 2px 8px;
        display: inline-flex; align-items: center; gap: 3px;
      }
      .owner-sub { margin: 5px 0 0; font-size: 13px; color: var(--ink-soft); line-height: 1.55; }
      .owner-meta {
        display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px;
        margin-top: 13px; padding: 9px 12px;
        background: var(--cream); border: 2px dashed color-mix(in srgb, var(--line) 45%, transparent);
        border-radius: 14px; font-size: 13px; color: var(--ink);
      }
      .owner-meta b { font-size: 15px; font-weight: 900; }
      .owner-meta .sep { color: var(--peach-deep); font-weight: 900; }
      .owner-meta .stars { display: inline-flex; gap: 1px; margin-left: auto; align-items: center; }
      .owner-meta .rate-note { font-size: 12px; color: var(--ink-soft); font-weight: 700; }
      .service-btn {
        margin-top: 14px; width: 100%;
        background: var(--peach-deep); color: #fff;
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 15.5px; font-weight: 900; padding: 11px 0;
        box-shadow: 4px 4px 0 var(--line);
        display: flex; align-items: center; justify-content: center; gap: 8px;
      }
      .service-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }

      /* ---- 分页导航 ---- */
      .tabs {
        display: flex; gap: 8px; margin-top: 24px;
      }
      .tab {
        flex: 1; padding: 10px 2px;
        background: var(--paper); color: var(--ink);
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 14.5px; font-weight: 900;
        box-shadow: 3px 3px 0 var(--line);
        white-space: nowrap;
      }
      .tab:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }
      .tab.active { background: var(--yellow); color: #2e2118; border-color: #2e2118; }
      .panel { display: none; }
      .panel.active { display: block; }

      /* ---- 信任标签 ---- */
      .trust-row {
        display: flex; gap: 9px; margin-top: 20px;
        overflow-x: auto; padding: 6px 2px 12px; scrollbar-width: none;
      }
      .trust-row::-webkit-scrollbar { display: none; }
      .trust-tag {
        flex: none; display: inline-flex; align-items: center; gap: 6px;
        font-size: 13px; font-weight: 800; color: #2e2118;
        border: 2px solid #2e2118; border-radius: 999px;
        padding: 7px 13px; box-shadow: 3px 3px 0 #2e2118;
      }
      .trust-tag.c1 { background: var(--peach); transform: rotate(-1.6deg); }
      .trust-tag.c2 { background: var(--yellow); transform: rotate(1.2deg); }
      .trust-tag.c3 { background: var(--mint); transform: rotate(-1deg); }
      .trust-tag.c4 { background: var(--sky); transform: rotate(1.6deg); }
      .trust-tag.c5 { background: var(--pink); transform: rotate(-1.4deg); }
      .trust-tag svg { flex: none; }

      .pending-banner {
        display: none; margin-top: 16px; padding: 13px 15px;
        align-items: center; gap: 10px;
      }
      .pending-banner.show { display: flex; }
      .pending-banner p { margin: 0; flex: 1; font-size: 13px; color: var(--ink); line-height: 1.5; }
      .pending-banner button {
        flex: none; background: var(--peach-deep); color: #fff;
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 13px; font-weight: 800; padding: 8px 14px;
        box-shadow: 3px 3px 0 var(--line);
      }
      .pending-banner button:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }

      .section-title {
        display: flex; align-items: center; gap: 9px;
        margin: 28px 2px 16px; color: var(--ink);
      }
      .section-title .st-icon {
        width: 30px; height: 30px; flex: none; border-radius: 10px;
        border: 2.5px solid var(--line); background: var(--yellow);
        display: flex; align-items: center; justify-content: center;
        box-shadow: 2px 2px 0 var(--line);
      }
      .section-title h2 { font-size: 19px; font-weight: 900; margin: 0; }
      .section-title .squig { flex: 1; height: 3px; border-radius: 3px; background: repeating-linear-gradient(90deg, var(--peach-deep) 0 10px, transparent 10px 18px); }
      .section-title .st-note { font-size: 12px; color: var(--ink-soft); font-weight: 700; flex: none; }

      /* ---- 商品卡 ---- */
      .product { padding: 18px 16px 16px; margin-bottom: 20px; position: relative; }
      .sticker {
        position: absolute; top: -11px; left: 14px; z-index: 2;
        background: var(--yellow); color: #2e2118;
        border: 2.5px solid #2e2118; border-radius: 10px;
        font-size: 12.5px; font-weight: 900; padding: 4px 11px;
        transform: rotate(-4deg); box-shadow: 3px 3px 0 #2e2118;
        display: inline-flex; align-items: center; gap: 5px;
      }
      .product-head { display: flex; gap: 13px; margin-top: 4px; }
      .product-img {
        width: 94px; height: 94px; flex: none; border-radius: 16px;
        border: 2.5px solid var(--line);
        display: flex; align-items: center; justify-content: center;
        font-size: 42px; font-weight: 900; color: #2e2118;
        background-image: radial-gradient(rgba(46,33,24,.16) 2.2px, transparent 2.3px);
        background-size: 16px 16px;
        position: relative;
      }
      .product-img .img-star { position: absolute; top: 5px; right: 6px; z-index: 1; }
      .product-img.has-photo { overflow: hidden; padding: 0; background-image: none; }
      .product-img.has-photo img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
      .product-main { flex: 1; min-width: 0; }
      .p-tag {
        display: inline-block; font-size: 11px; font-weight: 800; color: #2e2118;
        background: var(--mint); border: 2px solid var(--line); border-radius: 999px; padding: 2px 9px;
        transform: rotate(-1deg);
      }
      .p-name { margin: 7px 0 4px; font-size: 17px; font-weight: 900; color: var(--ink); line-height: 1.35; }
      .p-intro { margin: 0; font-size: 13px; color: var(--ink-soft); line-height: 1.55; }
      .p-points { list-style: none; margin: 12px 0 0; padding: 12px 0 0; border-top: 2px dashed color-mix(in srgb, var(--line) 25%, transparent); }
      .p-points li {
        display: flex; gap: 8px; align-items: flex-start;
        font-size: 13.5px; color: var(--ink); line-height: 1.5; padding: 3px 0;
      }
      .p-points .tick {
        flex: none; width: 18px; height: 18px; margin-top: 1px; border-radius: 50%;
        background: var(--mint); border: 2px solid var(--line);
        display: flex; align-items: center; justify-content: center;
      }
      .stock-row { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
      .stock-row .stock-txt { font-size: 12.5px; font-weight: 800; color: var(--ink); flex: none; }
      .stock-row .stock-txt.hot { color: #d3542a; }
      .stock-bar {
        flex: 1; height: 10px; border: 2px solid var(--line); border-radius: 999px;
        background: var(--paper); overflow: hidden;
      }
      .stock-bar i { display: block; height: 100%; background: repeating-linear-gradient(45deg, var(--peach-deep) 0 7px, var(--peach) 7px 14px); }
      .stock-row .sold-txt { font-size: 12px; color: var(--ink-soft); font-weight: 700; flex: none; }
      .product-foot { display: flex; align-items: flex-end; gap: 10px; margin-top: 14px; }
      .p-price { color: var(--ink); line-height: 1; flex: none; }
      .p-price .cur { font-size: 16px; font-weight: 800; }
      .p-price .num { font-size: 34px; font-weight: 900; letter-spacing: -0.5px; }
      .p-delivery { flex: 1; font-size: 12px; color: var(--ink-soft); line-height: 1.5; padding-bottom: 4px; }
      .buy-btn {
        flex: none; background: var(--yellow); color: #2e2118;
        border: 2.5px solid #2e2118; border-radius: 999px;
        font-size: 16.5px; font-weight: 900; padding: 12px 26px;
        box-shadow: 4px 4px 0 #2e2118;
      }
      .buy-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #2e2118; }

      /* ---- 跟团记录 ---- */
      .feed-card { padding: 8px 16px 14px; position: relative; }
      .feed-note { font-size: 11px; color: var(--ink-soft); font-weight: 700; padding: 8px 0 2px; }
      .feed-item {
        display: flex; align-items: center; gap: 10px;
        padding: 10px 0; border-bottom: 2px dashed color-mix(in srgb, var(--line) 25%, transparent);
        font-size: 13px; color: var(--ink); line-height: 1.5;
      }
      .feed-avatar {
        width: 34px; height: 34px; flex: none; border-radius: 50%;
        border: 2px solid var(--line);
        display: flex; align-items: center; justify-content: center;
        font-size: 16px;
      }
      .feed-item .who { font-weight: 900; flex: none; }
      .feed-item .what { flex: 1; min-width: 0; }
      .feed-item .qty-chip {
        flex: none; font-size: 11px; font-weight: 900; color: #2e2118;
        background: var(--yellow); border: 2px solid var(--line); border-radius: 999px; padding: 1px 8px;
      }
      .feed-item .when { flex: none; font-size: 12px; color: var(--ink-soft); }
      .feed-item.fresh { animation: pop .45s ease; }
      @keyframes pop { from { transform: scale(.96); opacity: 0; } to { transform: scale(1); opacity: 1; } }
      @media (prefers-reduced-motion: reduce) { .feed-item.fresh { animation: none; } }
      .more-btn {
        margin: 12px auto 4px; display: block;
        background: var(--paper); color: var(--ink);
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 14px; font-weight: 900; padding: 9px 26px;
        box-shadow: 3px 3px 0 var(--line);
      }
      .more-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }
      .more-btn:disabled { opacity: .55; cursor: default; box-shadow: none; }
      .more-btn:disabled:active { transform: none; }

      /* ---- 商品分类入口与分类页（炸串类 / 券类 / 定制类 / 甜品类四个入口） ---- */
      /* 「商品分类」标题：收掉与上方购物车栏之间的空隙，分类整块上移（仅此标题，不影响其他 section-title） */
      .section-title.cat-head { margin-top: 8px; margin-bottom: 6px; }
      /* 探头改最小规格后整块间距跟着收：margin-top 12px 让第一排方框贴近标题、探头顶仍贴近虚线；行间 gap 26px 与探头露出高度相称，两排疏密统一 */
      /* 四个分类方框整组下移微调：上边距 12→18（整组下移 6px，第一排即此量）；第二排再多下 4px——行距 26→30、下边距 16→6 补回增量，方框组底边位置不变、与跟团记录标题的间距保持正常。列距不变。探头贴纸是方框的子元素，随方框自然跟随、相对位置不变 */
      .cat-entries { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 12px; margin: 18px 0 6px; }
      .cat-entry {
        flex: 1; display: flex; align-items: center; gap: 10px;
        background: var(--paper); color: var(--ink); text-align: left;
        border: 2.5px solid var(--line); border-radius: 18px;
        font-size: 16.5px; font-weight: 900; padding: 14px 15px;
        box-shadow: 4px 4px 0 var(--line);
      }
      .cat-entry:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }
      .cat-entry .cat-chip {
        flex: none; width: 38px; height: 38px; border-radius: 12px;
        border: 2.5px solid var(--line);
        display: flex; align-items: center; justify-content: center;
        font-size: 19px; font-weight: 900; color: #2e2118;
      }
      /* 购物车入口：图标图片（自带奶油底，圆角裁切融入 chip） */
      .cat-entry .cat-chip.cart-chip { overflow: hidden; padding: 0; }
      .cat-entry .cat-chip.cart-chip img { width: 100%; height: 100%; object-fit: cover; display: block; }
      /* ---- 宝可梦探头贴纸：最小规格、整只骑在边沿之上——不再裁切，图片底边与所骑边沿齐平，头脸与辨识特征完整露出，下半身由原图自带的台沿线收尾 ---- */
      .cat-entry { position: relative; }
      .section-title { position: relative; }
      .peek {
        position: absolute; z-index: 3; display: block; pointer-events: none;
        border-radius: 8px;
      }
      /* 分类方框四只：高 25px，整张脸完整露出（小火龙连尾巴火苗、霜奶仙整张脸、卡比兽整颗头连爆米花桶、小锯鳄整颗头），底边落在方框上沿 */
      .peek-cat { right: 12px; bottom: 100%; height: 25px; }
      .peek-snorlax { right: 10px; }
      /* 标题两只：底边下沉到标题行正中的虚线（.squig 居中于 30px 高的标题行，线心约在标题顶下方 15px），齐平骑住不悬空 */
      .peek-title { left: 150px; bottom: calc(100% - 16px); }
      /* 梦幻：高 22px，横向以 22:18 版为准（left:150px）；纵向定版为贴近虚线只留一线之隔——实测虚线占标题顶下方 14~16px，图底落在 +13px，即虚线正上方 1px，不压不盖、虚线完整可见（压线版是 +18px、图底盖住虚线） */
      .peek-mew { height: 22px; left: 150px; bottom: calc(100% - 13px); }
      /* 火球鼠：高 22px，横向以 22:18 版为准（left:46px，标题左上方原位）；其正下方是标题文字（字形上沿在标题顶下方 8px），纵向收至图底 +6px、离字 2px——不盖字前提下最贴近虚线行的一档；整只含背火苗完整露出 */
      .peek-cyndaquil { height: 22px; left: 46px; bottom: calc(100% - 3px); }
      /* 三地鼠：高 22px，横向骑位以 22:18 版为准（板块上沿中段偏右，三颗头完整露出、中间最高层次分明，不压板块内文字）；在此基础上上抬 3px，不压上方跟团记录标题的虚线 */
      .peek-dugtrio { height: 22px; left: calc(50% + 35px); transform: translateX(-50%); bottom: calc(100% + 3px); }
      @media (max-width: 380px) {
        .peek-cat { height: 23px; }
        /* 小屏标题行高约 27px、虚线线心约在标题顶下方 13.5px，两只下沉量同步收小，仍齐平骑线 */
        .peek-title { bottom: calc(100% - 14px); }
        .peek-mew { height: 20px; bottom: calc(100% - 11px); }
        .peek-cyndaquil { height: 20px; }
        .peek-dugtrio { height: 20px; }
      }
      .cat-entry .cat-arrow { margin-left: auto; font-size: 20px; font-weight: 900; color: var(--ink-soft); }
      .cat-view { display: none; }
      .cat-view.open { display: block; }
      #panel-buy.cat-open .hide-in-cat { display: none; }
      .cat-back {
        margin-top: 20px;
        background: var(--paper); color: var(--ink);
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 14.5px; font-weight: 900; padding: 9px 22px;
        box-shadow: 3px 3px 0 var(--line);
      }
      .cat-back:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }

      /* ---- 购物车 ---- */
      .cart-bar { margin: 0 0 20px; }
      .cart-bar .cat-entry { width: 100%; }
      .cart-badge {
        flex: none; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 999px;
        background: #d3542a; color: #fff; border: 2px solid var(--line);
        font-size: 13px; font-weight: 900; display: inline-flex; align-items: center; justify-content: center;
      }
      .cart-item { padding: 14px 16px; margin-bottom: 14px; }
      .cart-item .ci-row1 { display: flex; align-items: baseline; gap: 8px; }
      .cart-item .ci-name { font-size: 15.5px; font-weight: 900; color: var(--ink); flex: 1; min-width: 0; }
      .cart-item .ci-del {
        flex: none; background: none; border: none; color: var(--danger);
        font-size: 13px; font-weight: 800; padding: 2px 4px;
      }
      .cart-item .ci-opt { margin-top: 4px; font-size: 12.5px; color: var(--ink-soft); font-weight: 700; }
      .cart-item .ci-row2 { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
      .cart-item .ci-unit { font-size: 13px; color: var(--ink-soft); font-weight: 700; }
      .cart-item .ci-sub { margin-left: auto; font-size: 16px; font-weight: 900; color: #d3542a; }
      .cart-item .qty-ctl button { width: 30px; height: 30px; font-size: 15px; }
      .cart-item .qty-ctl .qty-val { line-height: 26px; }
      .cart-total-row {
        display: flex; justify-content: space-between; align-items: center; gap: 12px;
        padding: 13px 16px; margin-bottom: 16px; font-size: 15px; font-weight: 900; color: var(--ink);
      }
      .cart-total-row .ct-amt { font-size: 20px; color: #d3542a; }
      .cart-checkout-btn {
        width: 100%; background: var(--peach-deep); color: #fff;
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 16.5px; font-weight: 900; padding: 13px 0;
        box-shadow: 4px 4px 0 var(--line); margin-bottom: 10px;
      }
      .cart-checkout-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }
      .cart-checkout-btn:disabled { opacity: .5; cursor: not-allowed; box-shadow: 2px 2px 0 var(--line); }
      .cart-empty {
        text-align: center; padding: 26px 12px; font-size: 14px; color: var(--ink-soft); font-weight: 700;
        border: 2px dashed color-mix(in srgb, var(--line) 35%, transparent); border-radius: 14px; margin-bottom: 16px;
      }
      .btn-row { display: flex; gap: 10px; margin-top: 18px; }
      .btn-row .submit-btn { margin-top: 0; flex: 1.35; }
      .cart-add-btn {
        flex: 1; background: var(--yellow); color: #2e2118;
        border: 2.5px solid #2e2118; border-radius: 999px;
        font-size: 15.5px; font-weight: 900; padding: 13px 4px;
        box-shadow: 4px 4px 0 #2e2118;
      }
      .cart-add-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #2e2118; }

      /* ---- 订单查询 ---- */
      .query-card { padding: 20px 18px; }
      .query-card .field:first-child { margin-top: 0; }
      .captcha {
        display: none; margin-top: 14px;
        border: 2.5px solid var(--line); border-radius: 14px;
        background: var(--cream); padding: 13px 14px;
      }
      .captcha.show { display: block; }
      .captcha label { display: flex; align-items: center; gap: 10px; font-size: 14.5px; font-weight: 800; color: var(--ink); cursor: pointer; }
      .captcha input { position: absolute; opacity: 0; pointer-events: none; }
      .captcha .cbox {
        width: 24px; height: 24px; flex: none; border-radius: 7px;
        border: 2.5px solid var(--line); background: var(--paper);
        display: flex; align-items: center; justify-content: center;
      }
      .captcha input:checked + .cbox { background: var(--mint); }
      .captcha input:checked + .cbox svg { display: block; }
      .captcha .cbox svg { display: none; }
      .captcha .captcha-note { margin-left: auto; font-size: 11px; color: var(--ink-soft); font-weight: 700; }
      .captcha .captcha-done { display: none; font-size: 12px; color: var(--ok); font-weight: 800; }
      .captcha.verified .captcha-done { display: inline; }
      .query-btn {
        margin-top: 16px; width: 100%;
        background: var(--yellow); color: #2e2118;
        border: 2.5px solid #2e2118; border-radius: 999px;
        font-size: 15.5px; font-weight: 900; padding: 12px 0;
        box-shadow: 4px 4px 0 #2e2118;
      }
      .query-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #2e2118; }
      .query-btn:disabled { opacity: .5; cursor: not-allowed; box-shadow: 2px 2px 0 #2e2118; }
      .query-btn:disabled:active { transform: none; }
      .query-btn.alt { background: var(--peach-deep); color: #fff; border-color: var(--line); box-shadow: 4px 4px 0 var(--line); }
      .code-hint {
        display: none; margin-top: 14px; padding: 11px 13px;
        background: var(--cream); border: 2px dashed color-mix(in srgb, var(--line) 45%, transparent);
        border-radius: 12px; font-size: 13px; color: var(--ink); line-height: 1.6;
      }
      .code-hint.show { display: block; }
      .code-hint b { font-size: 16px; letter-spacing: 2px; }
      .q-results { margin-top: 18px; }
      .q-empty {
        text-align: center; padding: 20px 10px; font-size: 14px; color: var(--ink-soft); font-weight: 700;
        border: 2px dashed color-mix(in srgb, var(--line) 35%, transparent); border-radius: 14px;
      }
      .q-order {
        border: 2px solid var(--line); border-radius: 14px; padding: 12px 14px; margin-bottom: 12px;
        background: var(--cream);
      }
      .q-order .q-row1 { display: flex; align-items: center; gap: 8px; }
      .q-order .q-name { font-weight: 900; font-size: 14.5px; color: var(--ink); flex: 1; min-width: 0; }
      .q-status { flex: none; font-size: 11.5px; font-weight: 900; border: 2px solid var(--line); border-radius: 999px; padding: 2px 9px; color: #2e2118; }
      .q-status.paid { background: var(--mint); }
      .q-status.pending { background: var(--yellow); }
      .q-order .q-meta { margin-top: 6px; font-size: 12.5px; color: var(--ink-soft); line-height: 1.7; word-break: break-all; }
      .q-pay-btn {
        margin-top: 9px; background: var(--peach-deep); color: #fff;
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 13px; font-weight: 900; padding: 7px 18px;
        box-shadow: 3px 3px 0 var(--line);
      }
      .q-pay-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }

      /* ---- 美食攻略 ---- */
      .guide-item { padding: 0; margin-bottom: 16px; overflow: hidden; }
      .guide-head {
        width: 100%; display: flex; align-items: center; gap: 10px;
        background: none; border: none; text-align: left;
        padding: 16px; font-size: 15.5px; font-weight: 900; color: var(--ink);
      }
      .guide-head .g-num {
        flex: none; width: 26px; height: 26px; border-radius: 50%;
        background: var(--peach); border: 2px solid var(--line); color: #2e2118;
        display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 900;
      }
      .guide-head .g-title { flex: 1; }
      .guide-head .g-chev { flex: none; transition: transform .25s ease; }
      .guide-item.open .g-chev { transform: rotate(180deg); }
      .guide-body { display: none; padding: 0 16px 16px 52px; font-size: 13.5px; color: var(--ink-soft); line-height: 1.75; }
      .guide-item.open .guide-body { display: block; }
      .guide-body p { margin: 0 0 8px; }
      .guide-body a { color: #d3542a; font-weight: 800; word-break: break-all; }
      .guide-body .ext-note { font-size: 11.5px; color: var(--ink-soft); }

      .shop-footer { text-align: center; margin-top: 30px; font-size: 12px; color: var(--ink-soft); font-weight: 700; line-height: 2; }
      .shop-footer .paws { display: flex; justify-content: center; gap: 14px; margin-bottom: 2px; opacity: .8; }

      /* ============ 弹窗通用 ============ */
      .overlay {
        display: none; position: fixed; inset: 0; z-index: 40;
        background: rgba(30, 20, 10, 0.55);
        align-items: flex-end; justify-content: center;
        overflow-y: auto; overscroll-behavior: contain;
      }
      .overlay.open { display: flex; }
      @media (min-width: 640px) { .overlay { align-items: center; padding: 20px; } }
      .sheet {
        background: var(--paper); color: var(--ink);
        width: 100%; max-width: 480px; max-height: 92vh; max-height: 92dvh; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
        border: 2.5px solid var(--line); border-bottom: none;
        border-radius: 24px 24px 0 0; box-shadow: 0 -6px 0 rgba(0,0,0,.15);
        padding: 20px 18px 26px;
      }
      @media (min-width: 640px) { .sheet { border-bottom: 2.5px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); } }
      .sheet-head { display: flex; align-items: flex-start; gap: 10px; }
      .sheet-head h3 { margin: 0; font-size: 18px; font-weight: 900; flex: 1; line-height: 1.4; }
      .close-btn {
        flex: none; width: 32px; height: 32px; border-radius: 50%;
        border: 2.5px solid var(--line); background: var(--yellow); color: #2e2118;
        font-size: 16px; font-weight: 900; line-height: 1;
      }
      .sheet-prod {
        display: flex; justify-content: space-between; align-items: center; gap: 10px;
        background: var(--cream); border: 2px solid var(--line); border-radius: 14px;
        padding: 10px 13px; margin-top: 12px; font-size: 14px; font-weight: 800;
      }
      .sheet-prod .unit { flex: none; color: var(--ink-soft); font-size: 13px; }
      .qty-row { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
      .qty-row label { font-size: 14px; font-weight: 800; }
      .qty-ctl { display: flex; align-items: center; margin-left: auto; }
      .qty-ctl button {
        width: 34px; height: 34px; font-size: 17px; font-weight: 900; color: var(--ink);
        background: var(--paper); border: 2.5px solid var(--line);
      }
      .qty-ctl button:first-child { border-radius: 10px 0 0 10px; }
      .qty-ctl button:last-child { border-radius: 0 10px 10px 0; }
      .qty-ctl button:disabled { opacity: .35; cursor: not-allowed; }
      .qty-ctl .qty-val {
        width: 44px; text-align: center; font-weight: 900; font-size: 15px;
        border-top: 2.5px solid var(--line); border-bottom: 2.5px solid var(--line); line-height: 30px;
      }
      .cart-hint { margin: 10px 0 0; font-size: 13px; font-weight: 900; color: #d3542a; line-height: 1.5; }
      .field { margin-top: 14px; }
      .field label { display: block; font-size: 13px; font-weight: 800; margin-bottom: 6px; }
      .field label .req { color: var(--req); font-weight: 900; margin-left: 2px; }
      .field input, .field select {
        width: 100%; font-size: 15px; color: var(--ink);
        background: var(--paper); border: 2.5px solid var(--line); border-radius: 12px;
        padding: 11px 12px; outline: none;
      }
      .field input:focus, .field select:focus { border-color: var(--peach-deep); box-shadow: 3px 3px 0 var(--peach); }
      .field-hint { margin: 6px 0 0; font-size: 12px; color: var(--ink-soft); line-height: 1.5; font-weight: 700; }
      .field-row3 { display: flex; gap: 8px; }
      .field-row3 select { flex: 1; min-width: 0; }
      .confirm-row {
        display: none; margin-top: 16px;
        border: 2.5px solid var(--line); border-radius: 14px;
        background: var(--cream); padding: 12px 13px;
      }
      .confirm-row.show { display: block; }
      .confirm-row label { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; font-weight: 700; color: var(--ink); line-height: 1.55; cursor: pointer; }
      .confirm-row input { position: absolute; opacity: 0; pointer-events: none; }
      .confirm-row .cbox {
        width: 23px; height: 23px; flex: none; margin-top: 1px; border-radius: 7px;
        border: 2.5px solid var(--line); background: var(--paper);
        display: flex; align-items: center; justify-content: center;
      }
      .confirm-row input:checked + .cbox { background: var(--mint); }
      .confirm-row input:checked + .cbox svg { display: block; }
      .confirm-row .cbox svg { display: none; }
      .pay-opts { display: flex; gap: 8px; margin-top: 6px; width: 100%; align-items: stretch; }
      .pay-opt { flex: 1 1 0; min-width: 0; position: relative; display: flex; }
      .pay-opt input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
      .pay-opt .opt-box {
        flex: 1; width: 100%; height: 100%; min-height: 46px;
        display: flex; align-items: center; justify-content: center; gap: 5px;
        border: 2.5px solid var(--line); border-radius: 14px; padding: 11px 4px;
        font-size: 14px; font-weight: 900; background: var(--paper); color: var(--ink);
        white-space: nowrap; line-height: 1; letter-spacing: -0.2px; text-align: center;
      }
      .pay-opt input:checked + .opt-box {
        background: var(--yellow); color: #2e2118;
        box-shadow: 3px 3px 0 var(--line), inset 0 0 0 1.5px var(--line);
      }
      .pay-opt input:focus-visible + .opt-box { outline: 3px solid var(--peach-deep); outline-offset: 2px; }
      .pay-dot { width: 20px; height: 20px; border-radius: 6px; color: #fff; font-size: 11px; font-weight: 900; display: flex; align-items: center; justify-content: center; flex: none; }
      @media (max-width: 400px) {
        .pay-opts { gap: 6px; }
        .pay-opt .opt-box { font-size: 13px; gap: 4px; padding: 10px 2px; min-height: 44px; }
        .pay-opt .pay-dot { width: 18px; height: 18px; font-size: 10px; border-radius: 5px; }
      }
      .pay-dot.ali { background: var(--alipay); }
      .pay-dot.wx { background: var(--wechat); }
      .pay-dot.vip { background: #d9930d; }
      .pay-opt.disabled .opt-box { opacity: .45; }
      .vip-note { margin: 8px 0 0; font-size: 12px; font-weight: 700; color: var(--danger); }
      .field-error { display: none; margin: 6px 0 0; font-size: 12px; font-weight: 700; color: var(--danger); line-height: 1.5; }
      .field-error.show { display: block; }
      .vip-hint { margin: 7px 0 0; font-size: 12px; color: var(--ink-soft); line-height: 1.6; }
      .gift-note {
        margin-top: 12px; padding: 9px 12px;
        background: var(--cream); border: 2px dashed color-mix(in srgb, var(--line) 45%, transparent);
        border-radius: 12px; font-size: 12.5px; font-weight: 800; color: var(--ink);
      }
      .custom-amount {
        flex: 1; min-width: 0; display: flex; align-items: center; gap: 4px;
        border: 2.5px solid var(--line); border-radius: 999px;
        background: var(--paper); padding: 0 16px; font-size: 16px; font-weight: 900; color: var(--ink);
      }
      .custom-amount input {
        flex: 1; min-width: 0; border: none; outline: none; background: transparent;
        font-size: 16px; font-weight: 800; color: var(--ink); padding: 11px 0;
      }
      .breakdown {
        margin-top: 16px; border: 2px solid var(--line); border-radius: 14px;
        padding: 6px 14px; background: var(--paper);
      }
      .breakdown .b-row {
        display: flex; justify-content: space-between; gap: 12px;
        padding: 8px 0; font-size: 13.5px; color: var(--ink);
        border-bottom: 2px dashed color-mix(in srgb, var(--line) 22%, transparent);
      }
      .breakdown .b-row:last-child { border-bottom: none; }
      .breakdown .b-row .bk { color: var(--ink-soft); font-weight: 700; }
      .breakdown .b-row .bv { font-weight: 800; }
      .breakdown .b-row.total { font-size: 15px; }
      .breakdown .b-row.total .bk { color: var(--ink); font-weight: 900; }
      .breakdown .b-row.total .bv { font-size: 19px; font-weight: 900; color: #d3542a; }
      .submit-btn {
        margin-top: 18px; width: 100%;
        background: var(--peach-deep); color: #fff;
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 16.5px; font-weight: 900; padding: 13px 0;
        box-shadow: 4px 4px 0 var(--line);
      }
      .submit-btn:active { transform: translate(2px, 2px); box-shadow: 2px 2px 0 var(--line); }
      .submit-btn:disabled { opacity: .45; cursor: not-allowed; box-shadow: 2px 2px 0 var(--line); }
      .submit-btn:disabled:active { transform: none; }
      .sheet-note { text-align: center; font-size: 12px; color: var(--ink-soft); margin: 12px 0 0; }

      /* ---- 客服弹窗 ---- */
      .modal-card {
        background: var(--paper); color: var(--ink);
        width: 100%; max-width: 420px;
        max-height: calc(100vh - 28px); max-height: calc(100dvh - 28px);
        overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
        border: 2.5px solid var(--line); border-radius: 24px;
        box-shadow: var(--shadow); padding: 24px 20px 22px; text-align: center;
        margin: auto 14px;
      }
      @media (max-width: 639px) { .overlay.centered { align-items: center; } }
      .modal-card .m-avatar {
        width: 62px; height: 62px; margin: 0 auto; border-radius: 16px;
        border: 3px solid var(--line); background: var(--peach);
        display: flex; align-items: center; justify-content: center; overflow: hidden;
      }
      .modal-card h3 { margin: 13px 0 4px; font-size: 18px; font-weight: 900; }
      .modal-card .m-sub { margin: 0; font-size: 13px; color: var(--ink-soft); line-height: 1.6; }
      .m-channel {
        margin-top: 16px; border: 2px dashed color-mix(in srgb, var(--line) 45%, transparent);
        background: var(--cream); border-radius: 14px; padding: 13px 14px;
        font-size: 14px; line-height: 1.8; color: var(--ink); text-align: left;
      }
      .m-channel b { font-weight: 900; }
      .m-channel .m-k { color: var(--ink-soft); font-size: 12.5px; font-weight: 700; display: block; }
      .m-row {
        display: flex; align-items: center; gap: 9px;
        padding: 7px 0; font-size: 14px; line-height: 1.5;
      }
      .m-row + .m-row { border-top: 2px dashed color-mix(in srgb, var(--line) 22%, transparent); }
      .m-row .m-ic {
        flex: none; width: 27px; height: 27px; border-radius: 9px;
        border: 2px solid var(--line); background: var(--yellow);
        display: flex; align-items: center; justify-content: center;
        box-shadow: 2px 2px 0 var(--line);
      }
      .m-row .m-lab { font-weight: 800; color: var(--ink); flex: none; }
      .m-row .m-val { margin-left: auto; font-weight: 900; color: var(--ink); text-align: right; word-break: break-all; }
      .m-back-btn {
        margin-top: 18px; width: 100%;
        background: var(--yellow); color: #2e2118;
        border: 2.5px solid #2e2118; border-radius: 999px;
        font-size: 15.5px; font-weight: 900; padding: 12px 0;
        box-shadow: 4px 4px 0 #2e2118;
      }
      .m-back-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #2e2118; }

      /* ---- 失败提示框 ---- */
      .fail-card {
        background: var(--paper); color: var(--ink);
        width: 100%; max-width: 360px; margin: auto 20px;
        max-height: calc(100vh - 28px); max-height: calc(100dvh - 28px);
        overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
        border: 2.5px solid var(--line); border-radius: 22px;
        box-shadow: var(--shadow); padding: 24px 20px 20px; text-align: center;
      }
      .fail-ring {
        width: 56px; height: 56px; margin: 0 auto; border-radius: 50%;
        background: var(--pink); border: 2.5px solid var(--line);
        display: flex; align-items: center; justify-content: center;
        font-size: 28px; font-weight: 900; color: #2e2118;
      }
      .fail-card h3 { margin: 13px 0 5px; font-size: 17px; font-weight: 900; }
      .fail-card p { margin: 0; font-size: 13.5px; color: var(--ink-soft); line-height: 1.6; }
      .fail-ok {
        margin-top: 16px; width: 100%;
        background: var(--peach-deep); color: #fff;
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 15px; font-weight: 900; padding: 11px 0;
        box-shadow: 3px 3px 0 var(--line);
      }
      .fail-ok:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }

      /* ============ 跳转过渡 ============ */
      .redirect-wrap {
        min-height: 100vh; background: var(--cream);
        display: flex; flex-direction: column; align-items: center; justify-content: center;
        padding: 24px; text-align: center;
      }
      .spinner {
        width: 52px; height: 52px; border-radius: 50%;
        border: 6px solid color-mix(in srgb, var(--peach-deep) 25%, transparent);
        border-top-color: var(--peach-deep);
        animation: spin .8s linear infinite;
      }
      .spinner.small { width: 34px; height: 34px; border-width: 4px; }
      @keyframes spin { to { transform: rotate(360deg); } }
      @media (prefers-reduced-motion: reduce) { .spinner { animation-duration: 2.4s; } }
      .redirect-wrap h2 { color: var(--ink); font-size: 19px; font-weight: 900; margin: 22px 0 8px; }
      .redirect-wrap p { color: var(--ink-soft); font-size: 13.5px; margin: 0; line-height: 1.7; }
      .redirect-wrap .target {
        margin-top: 18px; font-size: 12.5px; font-weight: 700; color: var(--ink);
        background: var(--paper); border: 2px solid var(--line); border-radius: 999px; padding: 6px 14px;
      }

      /* ============ 套壳网关收银台（朴素电商风） ============ */
      .gw-wrap { background: var(--gw-bg); min-height: 100vh; padding: 14px 12px 44px; color: var(--gw-ink); }
      .gw-col { max-width: 480px; margin: 0 auto; }
      @media (min-width: 760px) { .gw-col { max-width: 540px; } }
      .addrbar {
        display: flex; align-items: center; gap: 8px;
        background: var(--gw-card); border: 1px solid var(--gw-line); border-radius: 999px;
        padding: 9px 15px; font-size: 13px; color: var(--gw-soft);
      }
      .addrbar .url { color: var(--gw-ink); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
      .addrbar svg { flex: none; }
      .gw-site-tag { text-align: center; font-size: 12px; color: var(--gw-soft); margin: 10px 0 0; }
      .gw-card {
        background: var(--gw-card); border: 1px solid var(--gw-line); border-radius: 10px;
        margin-top: 12px; padding: 26px 20px 24px; text-align: center;
      }
      .gw-payway { display: flex; align-items: center; justify-content: center; gap: 9px; font-size: 16px; font-weight: 600; }
      .gw-payway .pay-dot { width: 26px; height: 26px; border-radius: 6px; font-size: 14px; }
      .gw-amount { margin-top: 16px; font-weight: 700; line-height: 1; }
      .gw-amount .cur { font-size: 22px; vertical-align: 14px; }
      .gw-amount .num { font-size: 46px; letter-spacing: -1px; }
      .qr-box {
        width: 196px; height: 196px; margin: 20px auto 8px;
        border: 1px solid var(--gw-line); border-radius: 6px; background: #fff;
        display: flex; align-items: center; justify-content: center;
      }
      .qr-note { font-size: 12px; color: var(--gw-soft); margin: 0; }
      .gw-scan-tip { font-size: 13.5px; color: var(--gw-soft); margin: 14px 0 0; }
      .gw-open-btn {
        margin-top: 18px; width: 100%; border: none; border-radius: 8px;
        color: #fff; font-size: 16px; font-weight: 600; padding: 13px 0;
      }
      .gw-open-btn.ali { background: var(--alipay); }
      .gw-open-btn.wx { background: var(--wechat); }
      .gw-paid-link {
        display: inline-block; margin-top: 16px; font-size: 14.5px; font-weight: 600;
        color: var(--alipay); background: none; border: none; text-decoration: underline; text-underline-offset: 3px;
      }
      .gw-demo-note { margin-top: 18px; font-size: 12px; color: var(--gw-soft); border-top: 1px dashed var(--gw-line); padding-top: 14px; }
      .gw-collapse {
        background: var(--gw-card); border: 1px solid var(--gw-line); border-radius: 10px;
        margin-top: 12px; overflow: hidden;
      }
      .gw-collapse-head {
        width: 100%; display: flex; align-items: center; justify-content: space-between;
        background: none; border: none; padding: 14px 18px;
        font-size: 14px; font-weight: 600; color: var(--gw-ink);
      }
      .gw-collapse-head .chev { color: var(--gw-soft); transition: transform .25s ease; }
      .gw-collapse.open .gw-collapse-head .chev { transform: rotate(180deg); }
      .gw-collapse-body { display: none; padding: 0 18px 6px; }
      .gw-collapse.open .gw-collapse-body { display: block; }
      .gw-collapse-body .row {
        display: flex; justify-content: space-between; gap: 14px;
        padding: 11px 0; font-size: 13.5px; border-top: 1px solid var(--gw-line);
      }
      .gw-collapse-body .k { color: var(--gw-soft); flex: none; }
      .gw-collapse-body .v { text-align: right; word-break: break-all; }
      .gw-back {
        display: block; margin: 18px auto 0; background: none; border: none;
        color: var(--gw-soft); font-size: 13.5px; text-decoration: underline; text-underline-offset: 3px;
      }
      .gw-notify {
        display: none; position: fixed; inset: 0; z-index: 50;
        background: rgba(20, 20, 22, 0.55);
        align-items: center; justify-content: center; padding: 24px;
      }
      .gw-notify.show { display: flex; }
      .gw-notify .box {
        background: var(--gw-card); color: var(--gw-ink); border-radius: 12px;
        padding: 28px 30px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 14px;
        font-size: 15px; font-weight: 600;
      }

      /* ============ 订单详情 ============ */
      .order-card { margin-top: 26px; padding: 26px 18px 20px; text-align: center; position: relative; }
      .ok-ring {
        width: 74px; height: 74px; margin: 0 auto; border-radius: 50%;
        background: var(--mint); border: 2.5px solid var(--line);
        display: flex; align-items: center; justify-content: center;
        box-shadow: 3px 3px 0 var(--line);
      }
      .order-card h2 { margin: 16px 0 4px; font-size: 22px; font-weight: 900; color: var(--ink); }
      .order-card .sub { margin: 0; font-size: 13.5px; color: var(--ink-soft); }
      .status-pill {
        display: inline-block; margin-top: 14px; font-size: 13px; font-weight: 900; color: #2e2118;
        background: var(--yellow); border: 2.5px solid var(--line); border-radius: 999px; padding: 6px 15px;
      }
      .order-rows { margin-top: 20px; text-align: left; }
      .order-rows .row {
        display: flex; justify-content: space-between; gap: 14px;
        padding: 11px 2px; font-size: 14px; color: var(--ink);
        border-bottom: 2px dashed color-mix(in srgb, var(--line) 25%, transparent);
      }
      .order-rows .row:last-child { border-bottom: none; }
      .order-rows .k { color: var(--ink-soft); font-weight: 700; flex: none; }
      .order-rows .v { font-weight: 800; text-align: right; word-break: break-all; }
      .home-btn {
        margin-top: 20px; width: 100%;
        background: var(--peach-deep); color: #fff;
        border: 2.5px solid var(--line); border-radius: 999px;
        font-size: 16px; font-weight: 900; padding: 13px 0;
        box-shadow: 4px 4px 0 var(--line);
      }
      .home-btn:active { transform: translate(2px, 2px); box-shadow: 2px 2px 0 var(--line); }

      /* ============ Toast ============ */
      .toast {
        position: fixed; left: 50%; bottom: 30px; transform: translateX(-50%) translateY(20px);
        z-index: 60; max-width: min(88vw, 420px);
        background: #2e2118; color: #fff6e8; font-size: 13.5px; font-weight: 700; line-height: 1.5;
        border-radius: 999px; padding: 11px 20px; text-align: center;
        opacity: 0; pointer-events: none; transition: opacity .25s ease, transform .25s ease;
      }
      .toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

      /* ============ 小屏适配（只按尺寸，不分系统）：320px 起全站可用 ============ */
      .gw-notify .box { max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow-y: auto; }
      @media (max-width: 480px) {
        .field-row3 select { font-size: 12px; padding: 10px 5px; }
      }
      @media (max-width: 380px) {
        .shop-wrap { padding: 14px 10px 32px; }
        .gw-wrap { padding: 12px 10px 36px; }
        .winbar { padding: 7px 12px; gap: 6px; }
        .winbar .win-title { letter-spacing: 1.5px; font-size: 11px; margin-left: 3px; }
        .winbar .win-demo { font-size: 10.5px; padding: 2px 7px; }
        /* 店主卡整块按原模版冻结：不参与小屏收紧，字号/内边距/按钮高度保持原始尺寸 */
        .tabs { gap: 6px; margin-top: 20px; }
        .tab { font-size: 13px; padding: 9px 1px; letter-spacing: -0.2px; }
        .trust-row { gap: 7px; margin-top: 16px; }
        .trust-tag { font-size: 12px; padding: 6px 10px; gap: 5px; }
        .section-title { margin: 24px 1px 14px; gap: 7px; }
        .section-title h2 { font-size: 17px; }
        .section-title .st-note { font-size: 11px; }
        .section-title .st-icon { width: 27px; height: 27px; border-radius: 9px; }
        .product { padding: 15px 13px 13px; margin-bottom: 17px; }
        .product-img { width: 76px; height: 76px; font-size: 34px; border-radius: 14px; }
        .product-head { gap: 10px; }
        .p-name { font-size: 15.5px; }
        .p-intro { font-size: 12.5px; }
        .p-points li { font-size: 12.5px; }
        .stock-row { gap: 7px; }
        .stock-row .stock-txt { font-size: 11.5px; }
        .stock-row .sold-txt { font-size: 11px; }
        .p-price .num { font-size: 28px; }
        .p-price .cur { font-size: 14px; }
        .p-delivery { font-size: 11.5px; }
        .buy-btn { font-size: 15px; padding: 10px 20px; }
        .custom-amount { padding: 0 12px; font-size: 15px; }
        .feed-card { padding: 6px 13px 12px; }
        .sheet { padding: 16px 14px 20px; }
        .sheet-head h3 { font-size: 16.5px; }
        .field-row3 select { font-size: 13px; padding: 10px 6px; }
        .sheet-prod { font-size: 13.5px; }
        .query-card { padding: 16px 14px; }
        .q-order .q-meta { word-break: break-word; overflow-wrap: anywhere; }
        .guide-head { padding: 14px 13px; font-size: 14.5px; gap: 8px; }
        .guide-body { padding: 0 14px 14px 14px; font-size: 13px; }
        .modal-card { padding: 20px 15px 18px; margin: auto 10px; }
        .fail-card { margin: auto 12px; padding: 20px 16px 17px; }
        .gw-card { padding: 22px 14px 20px; }
        .gw-amount .num { font-size: 40px; }
        .gw-amount .cur { font-size: 19px; vertical-align: 11px; }
        .qr-box { width: 180px; height: 180px; }
        .order-card { padding: 22px 14px 16px; }
        .order-card h2 { font-size: 20px; }
        .submit-btn { font-size: 15.5px; padding: 12px 6px; }
      }
      @media (max-width: 340px) {
        .tab { font-size: 12px; letter-spacing: -0.4px; }
        .field-row3 select { font-size: 12px; padding: 10px 4px; }
        .pay-opts { gap: 5px; }
        .pay-opt .opt-box { font-size: 12px; gap: 3px; padding: 10px 1px; min-height: 42px; letter-spacing: -0.4px; }
        .pay-opt .pay-dot { width: 16px; height: 16px; font-size: 9.5px; border-radius: 5px; }
        .qty-ctl .qty-val { width: 38px; }
        .breakdown { padding: 4px 11px; }
        .breakdown .b-row { font-size: 12.5px; }
        .gw-payway { font-size: 14.5px; }
      }
      /* 矮屏（≤500px 高）：弹窗贴近满高，靠内部滚动够到提交/关闭 */
      @media (max-height: 500px) {
        .sheet { max-height: 96vh; max-height: 96dvh; }
        .modal-card, .fail-card { max-height: calc(100vh - 16px); max-height: calc(100dvh - 16px); }
      }

/* ===== 兜底修复（正式版追加，样稿原 CSS 之外）：任何带 hidden 属性的元素强制隐藏，
   避免被组件自身的 display 规则盖过（v1 曾因此出现跳转遮罩常驻的 bug） ===== */
[hidden] { display: none !important; }

/* 真机适配（2026-10-14）：禁止安卓 Chrome 文字自动放大——样稿的探头定位按标题字形度量校准，系统字体放大行盒会把火球鼠顶到压字。 */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* 真机手势加固（2026-10-14）：分类/购物车页只允许纵向滚动接管，横滑留给页面内的右滑返回。 */
.cat-view { touch-action: pan-y; }

/* 真机手势加固二版（2026-10-14）：弹窗层同样只许纵向滚动接管，横滑留给全层右滑返回。 */
.overlay { touch-action: pan-y; }