From 0270657f2b9e4c01ca1e91fe119ff97cdd89a9af Mon Sep 17 00:00:00 2001
From: yml2213 <a2213290201@gmail.com>
Date: Sun, 16 Aug 2026 11:03:19 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E7=A7=BB=E5=8A=A8?=
 =?UTF-8?q?=E7=AB=AF=E6=89=93=E6=89=8B=E6=8E=A5=E5=8D=95=E7=95=8C=E9=9D=A2?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80=E5=B9=B6=E5=AE=8C=E6=88=90CSS=E6=9E=B6?=
 =?UTF-8?q?=E6=9E=84=E6=A8=A1=E5=9D=97=E5=8C=96=E6=8B=86=E5=88=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/pages/worker/WorkerHallPage.tsx       |  568 ++-
 apps/frontend/src/styles/admin.css            | 1243 ++++++
 apps/frontend/src/styles/base.css             |  262 ++
 apps/frontend/src/styles/client.css           |  632 +++
 apps/frontend/src/styles/main.css             | 3641 +----------------
 apps/frontend/src/styles/worker.css           | 1686 ++++++++
 6 files changed, 4238 insertions(+), 3794 deletions(-)
 create mode 100644 apps/frontend/src/styles/admin.css
 create mode 100644 apps/frontend/src/styles/base.css
 create mode 100644 apps/frontend/src/styles/client.css
 create mode 100644 apps/frontend/src/styles/worker.css

diff --git a/apps/frontend/src/pages/worker/WorkerHallPage.tsx b/apps/frontend/src/pages/worker/WorkerHallPage.tsx
index 0fa9eded..a92890c7 100644
--- a/apps/frontend/src/pages/worker/WorkerHallPage.tsx
+++ b/apps/frontend/src/pages/worker/WorkerHallPage.tsx
@@ -203,48 +203,81 @@ export default function WorkerHallPage() {
   ]
 
   return (
-    <section className="page-stack">
-      <div className="worker-page-head">
-        <div className="worker-page-head-title-row">
-          <Typography.Title level={3}>抢单大厅</Typography.Title>
-          <div className="worker-hall-head-controls">
-            <Tooltip
-              title={
-                autoRefresh
-                  ? '已开启自动刷新，每 5 秒刷新一次'
-                  : '开启后每 5 秒自动刷新订单列表'
-              }
-            >
-              <div className="worker-hall-autorefresh-box">
-                <span className="worker-hall-autorefresh-label">自动刷新</span>
+    <>
+      {isMobile ? (
+        <div className="worker-hall-mobile-page">
+          {/* 移动端顶部极简状态 & 刷新控制 */}
+          <div className="worker-hall-mobile-top-bar">
+            <div className="worker-hall-mobile-stat-pill">
+              <span className="worker-hall-mobile-stat-item">
+                余额 <strong className="worker-hall-mobile-stat-highlight">{worker ? formatMoney(worker.wallet.availableAmount) : '-'}</strong>
+              </span>
+              <span className="worker-hall-mobile-stat-divider">|</span>
+              <span className="worker-hall-mobile-stat-item">
+                上限 <strong>{remainingSlots === null ? '-' : `${activeCount}/${maxActiveOrders}`}</strong>
+              </span>
+            </div>
+
+            <div className="worker-hall-mobile-top-actions">
+              <div className="worker-hall-mobile-autorefresh-switch">
+                <span className="worker-hall-mobile-autorefresh-text">自动刷新</span>
                 <Switch
                   size="small"
                   checked={autoRefresh}
                   onChange={toggleAutoRefresh}
                 />
               </div>
-            </Tooltip>
-            <Button
-              icon={<ReloadOutlined />}
-              loading={
-                ordersQuery.isFetching ||
-                profileQuery.isFetching ||
-                hallSummaryQuery.isFetching
-              }
-              onClick={() => refreshAll()}
-            >
-              刷新
-            </Button>
+              <Button
+                size="small"
+                shape="circle"
+                icon={<ReloadOutlined />}
+                loading={
+                  ordersQuery.isFetching ||
+                  profileQuery.isFetching ||
+                  hallSummaryQuery.isFetching
+                }
+                onClick={() => refreshAll()}
+              />
+            </div>
           </div>
-        </div>
 
-        <div className="worker-hall-search-bar">
-          <Space.Compact className="worker-hall-search">
+          {/* 移动端横向滑动分类条 */}
+          {categories.length > 0 ? (
+            <div className="worker-hall-mobile-category-bar">
+              <button
+                type="button"
+                className={`worker-hall-mobile-cat-pill ${categoryId === 0 ? 'active' : ''}`}
+                onClick={() => {
+                  setCategoryId(0)
+                  setPage(1)
+                }}
+              >
+                全部
+              </button>
+              {categories.map((category) => (
+                <button
+                  key={category.categoryId}
+                  type="button"
+                  className={`worker-hall-mobile-cat-pill ${categoryId === category.categoryId ? 'active' : ''}`}
+                  onClick={() => {
+                    setCategoryId(category.categoryId)
+                    setPage(1)
+                  }}
+                >
+                  {category.name}
+                </button>
+              ))}
+            </div>
+          ) : null}
+
+          {/* 紧凑搜索栏 */}
+          <div className="worker-hall-mobile-search-row">
             <Input
               allowClear
               value={keywordInput}
-              placeholder="搜索商品名称 / 订单号"
+              placeholder="搜索商品 / 订单号"
               prefix={<SearchOutlined />}
+              className="worker-hall-mobile-search-input"
               onChange={(event) => {
                 const nextKeyword = event.target.value
                 setKeywordInput(nextKeyword)
@@ -263,76 +296,45 @@ export default function WorkerHallPage() {
             >
               搜索
             </Button>
-          </Space.Compact>
-        </div>
-      </div>
-
-      <Card className="worker-hall-board-card" bordered={false}>
-        <div className="worker-hall-summary-strip">
-          {summaryItems.map((item) => (
-            <div key={item.label} className="worker-hall-summary-item">
-              <span className="worker-hall-summary-label">{item.label}</span>
-              <strong className="worker-hall-summary-value">{item.value}</strong>
-              <small className="worker-hall-summary-note">{item.note}</small>
-            </div>
-          ))}
-        </div>
-
-        {categories.length > 0 ? (
-          <Tabs
-            size="small"
-            activeKey={String(categoryId)}
-            items={[
-              { key: '0', label: '全部' },
-              ...categories.map((category) => ({
-                key: String(category.categoryId),
-                label: category.name,
-              })),
-            ]}
-            onChange={(nextKey) => {
-              setCategoryId(Number(nextKey) || 0)
-              setPage(1)
-            }}
-          />
-        ) : null}
-
-        {shouldWarn ? (
-          <Alert
-            className="worker-hall-warning"
-            showIcon
-            type="warning"
-            message={
-              remainingSlots !== null && remainingSlots <= 0
-                ? '当前已达到接单上限，请先处理现有工单'
-                : `当前还有 ${problemCount} 单问题单待处理，建议优先收口`
-            }
-          />
-        ) : null}
-
-        {ordersQuery.isLoading ? (
-          <div className="worker-hall-loading">
-            <Spin size="large" />
           </div>
-        ) : ordersQuery.error ? (
-          <Empty
-            description={
-              ordersQuery.error instanceof Error
-                ? ordersQuery.error.message
-                : '读取抢单大厅失败'
-            }
-          />
-        ) : orders.length === 0 ? (
-          <Empty
-            description={
-              keyword
-                ? `没有找到与 “${keyword}” 相关的可抢工单`
-                : '当前暂无可抢订单，可稍后刷新再看'
-            }
-          />
-        ) : (
-          <>
-            <div className="worker-hall-card-grid">
-              {orders.map((order) => {
+
+          {shouldWarn ? (
+            <Alert
+              className="worker-hall-warning"
+              showIcon
+              type="warning"
+              message={
+                remainingSlots !== null && remainingSlots <= 0
+                  ? '当前已达到接单上限，请先处理现有工单'
+                  : `当前还有 ${problemCount} 单问题单待处理，建议优先收口`
+              }
+            />
+          ) : null}
+
+          {/* 移动端高密度订单卡片流 */}
+          <div className="worker-hall-mobile-list">
+            {ordersQuery.isLoading ? (
+              <div className="worker-hall-loading">
+                <Spin size="large" />
+              </div>
+            ) : ordersQuery.error ? (
+              <Empty
+                description={
+                  ordersQuery.error instanceof Error
+                    ? ordersQuery.error.message
+                    : '读取抢单大厅失败'
+                }
+              />
+            ) : orders.length === 0 ? (
+              <Empty
+                description={
+                  keyword
+                    ? `没有找到与 “${keyword}” 相关的可抢工单`
+                    : '当前暂无可抢工单，可稍后刷新再看'
+                }
+              />
+            ) : (
+              orders.map((order) => {
                 const disabledReason = resolveGrabDisabledReason(
                   order,
                   worker,
@@ -340,69 +342,58 @@ export default function WorkerHallPage() {
                 )
 
                 return (
-                  <article key={order.workOrderId} className="worker-hall-card">
-                    <div className="worker-hall-card-title">
-                      <strong
-                        className="worker-hall-card-title-text"
-                        title={order.productName || '未命名商品'}
-                      >
+                  <article key={order.workOrderId} className="worker-hall-mobile-card">
+                    {/* 卡片头部: 分类 + 拼单/时限标签 + 订单号 */}
+                    <div className="worker-hall-mobile-card-top">
+                      <div className="worker-hall-mobile-card-tags">
+                        {order.categoryName ? (
+                          <Tag color="blue" className="worker-hall-mobile-tag">
+                            {order.categoryName}
+                          </Tag>
+                        ) : null}
+                        {order.sharing?.enabled ? (
+                          <Tag color="purple" className="worker-hall-mobile-tag">
+                            拼单 剩{resolveSharingRemaining(order)}份
+                          </Tag>
+                        ) : null}
+                        {Number(order.timeoutMinutes || 0) > 0 ? (
+                          <Tag color="orange" icon={<ClockCircleOutlined />} className="worker-hall-mobile-tag">
+                            限时{order.timeoutMinutes}分
+                          </Tag>
+                        ) : null}
+                      </div>
+                      <span className="worker-hall-mobile-card-orderno">
+                        {getDisplayOrderNo(order)}
+                      </span>
+                    </div>
+
+                    {/* 商品标题与保证金说明 */}
+                    <div className="worker-hall-mobile-card-main">
+                      <strong className="worker-hall-mobile-card-title" title={order.productName || '未命名商品'}>
                         {order.productName || '未命名商品'}
                       </strong>
-                      <Typography.Text type="secondary">
-                        {order.categoryName || '默认分类'}
-                      </Typography.Text>
-                      <Typography.Text type="secondary">
-                        订单号：{getDisplayOrderNo(order)}
-                      </Typography.Text>
+                      <div className="worker-hall-mobile-card-meta">
+                        <span>所需保证金: {formatMoney(order.freezeDepositAmount)}</span>
+                        {order.sharing?.enabled ? (
+                          <span> · 拼单单价 {formatMoney(order.sharing.unitReward)}/份</span>
+                        ) : null}
+                      </div>
                     </div>
 
-                    {order.sharing?.enabled ? (
-                      <div className="worker-hall-card-sharing">
-                        <Tag color="purple">拼单</Tag>
-                        <Typography.Text type="secondary">
-                          单价 {formatMoney(order.sharing.unitReward)} · 进度{' '}
-                          {order.sharingProgress?.joinedQuantity || 0}/
-                          {order.sharing.totalQuantity} · 剩{' '}
-                          {resolveSharingRemaining(order)} 份
-                        </Typography.Text>
+                    {/* 底部报酬金额与抢单按钮 */}
+                    <div className="worker-hall-mobile-card-footer">
+                      <div className="worker-hall-mobile-card-price-group">
+                        <span className="worker-hall-mobile-card-price-label">接单报酬</span>
+                        <strong className="worker-hall-mobile-card-price-val">
+                          {formatMoney(order.rewardAmount)}
+                        </strong>
                       </div>
-                    ) : null}
 
-                    {Number(order.timeoutMinutes || 0) > 0 ? (
-                      <div className="worker-hall-card-sharing">
-                        <Tag color="orange" icon={<ClockCircleOutlined />}>
-                          限时 {order.timeoutMinutes} 分钟
-                        </Tag>
-                      </div>
-                    ) : null}
-
-                    <div className="worker-hall-card-amount-row">
-                      <div className="worker-hall-card-amount">
-                        {formatMoney(order.rewardAmount)}
-                      </div>
-                      <Typography.Text
-                        type="secondary"
-                        className="worker-hall-card-deposit"
-                      >
-                        所需保证金：{formatMoney(order.freezeDepositAmount)}
-                      </Typography.Text>
-                    </div>
-
-                    {disabledReason ? (
-                      <Typography.Text
-                        type="danger"
-                        className="worker-hall-card-hint"
-                      >
-                        {disabledReason}
-                      </Typography.Text>
-                    ) : null}
-
-                    <div className="worker-hall-card-actions">
-                      <div className="worker-hall-card-grab-row">
+                      <div className="worker-hall-mobile-card-btn-group">
                         {order.sharing?.enabled && !disabledReason ? (
                           <Button
                             type="primary"
-                            size="large"
+                            size="middle"
                             className="worker-hall-sharing-button"
                             disabled={Boolean(disabledReason) || Boolean(order.myShare)}
                             onClick={() => openSharingModal(order)}
@@ -414,7 +405,8 @@ export default function WorkerHallPage() {
                         ) : null}
                         <Button
                           type="primary"
-                          size="large"
+                          size="middle"
+                          className="worker-hall-mobile-grab-btn"
                           disabled={Boolean(disabledReason)}
                           loading={grabbingId === order.workOrderId}
                           onClick={() => submitGrab(order)}
@@ -425,29 +417,273 @@ export default function WorkerHallPage() {
                     </div>
                   </article>
                 )
-              })}
-            </div>
+              })
+            )}
 
             {(pagination?.total || 0) > 0 ? (
-              <div className="worker-hall-pagination">
+              <div className="worker-orders-mobile-pagination">
                 <Pagination
                   current={pagination?.page || page}
                   pageSize={pagination?.pageSize || pageSize}
                   total={pagination?.total || 0}
-                  showSizeChanger={!isMobile}
-                  simple={isMobile}
-                  pageSizeOptions={[20, 50, 100]}
-                  showTotal={isMobile ? undefined : (total) => `共 ${total} 条`}
-                  onChange={(nextPage, nextPageSize) => {
+                  simple
+                  onChange={(nextPage: number, nextPageSize: number) => {
                     setPage(nextPage)
                     setPageSize(nextPageSize)
                   }}
                 />
               </div>
             ) : null}
-          </>
-        )}
-      </Card>
+          </div>
+        </div>
+      ) : (
+        <section className="page-stack">
+          <div className="worker-page-head">
+            <div className="worker-page-head-title-row">
+              <Typography.Title level={3}>抢单大厅</Typography.Title>
+              <div className="worker-hall-head-controls">
+                <Tooltip
+                  title={
+                    autoRefresh
+                      ? '已开启自动刷新，每 5 秒刷新一次'
+                      : '开启后每 5 秒自动刷新订单列表'
+                  }
+                >
+                  <div className="worker-hall-autorefresh-box">
+                    <span className="worker-hall-autorefresh-label">自动刷新</span>
+                    <Switch
+                      size="small"
+                      checked={autoRefresh}
+                      onChange={toggleAutoRefresh}
+                    />
+                  </div>
+                </Tooltip>
+                <Button
+                  icon={<ReloadOutlined />}
+                  loading={
+                    ordersQuery.isFetching ||
+                    profileQuery.isFetching ||
+                    hallSummaryQuery.isFetching
+                  }
+                  onClick={() => refreshAll()}
+                >
+                  刷新
+                </Button>
+              </div>
+            </div>
+
+            <div className="worker-hall-search-bar">
+              <Space.Compact className="worker-hall-search">
+                <Input
+                  allowClear
+                  value={keywordInput}
+                  placeholder="搜索商品名称 / 订单号"
+                  prefix={<SearchOutlined />}
+                  onChange={(event) => {
+                    const nextKeyword = event.target.value
+                    setKeywordInput(nextKeyword)
+                    if (!nextKeyword.trim()) {
+                      setKeyword('')
+                      setPage(1)
+                    }
+                  }}
+                  onPressEnter={applyKeywordSearch}
+                />
+                <Button
+                  type="primary"
+                  icon={<SearchOutlined />}
+                  loading={ordersQuery.isFetching}
+                  onClick={applyKeywordSearch}
+                >
+                  搜索
+                </Button>
+              </Space.Compact>
+            </div>
+          </div>
+
+          <Card className="worker-hall-board-card" bordered={false}>
+            <div className="worker-hall-summary-strip">
+              {summaryItems.map((item) => (
+                <div key={item.label} className="worker-hall-summary-item">
+                  <span className="worker-hall-summary-label">{item.label}</span>
+                  <strong className="worker-hall-summary-value">{item.value}</strong>
+                  <small className="worker-hall-summary-note">{item.note}</small>
+                </div>
+              ))}
+            </div>
+
+            {categories.length > 0 ? (
+              <Tabs
+                size="small"
+                activeKey={String(categoryId)}
+                items={[
+                  { key: '0', label: '全部' },
+                  ...categories.map((category) => ({
+                    key: String(category.categoryId),
+                    label: category.name,
+                  })),
+                ]}
+                onChange={(nextKey) => {
+                  setCategoryId(Number(nextKey) || 0)
+                  setPage(1)
+                }}
+              />
+            ) : null}
+
+            {shouldWarn ? (
+              <Alert
+                className="worker-hall-warning"
+                showIcon
+                type="warning"
+                message={
+                  remainingSlots !== null && remainingSlots <= 0
+                    ? '当前已达到接单上限，请先处理现有工单'
+                    : `当前还有 ${problemCount} 单问题单待处理，建议优先收口`
+                }
+              />
+            ) : null}
+
+            {ordersQuery.isLoading ? (
+              <div className="worker-hall-loading">
+                <Spin size="large" />
+              </div>
+            ) : ordersQuery.error ? (
+              <Empty
+                description={
+                  ordersQuery.error instanceof Error
+                    ? ordersQuery.error.message
+                    : '读取抢单大厅失败'
+                }
+              />
+            ) : orders.length === 0 ? (
+              <Empty
+                description={
+                  keyword
+                    ? `没有找到与 “${keyword}” 相关的可抢工单`
+                    : '当前暂无可抢订单，可稍后刷新再看'
+                }
+              />
+            ) : (
+              <>
+                <div className="worker-hall-card-grid">
+                  {orders.map((order) => {
+                    const disabledReason = resolveGrabDisabledReason(
+                      order,
+                      worker,
+                      remainingSlots,
+                    )
+
+                    return (
+                      <article key={order.workOrderId} className="worker-hall-card">
+                        <div className="worker-hall-card-title">
+                          <strong
+                            className="worker-hall-card-title-text"
+                            title={order.productName || '未命名商品'}
+                          >
+                            {order.productName || '未命名商品'}
+                          </strong>
+                          <Typography.Text type="secondary">
+                            {order.categoryName || '默认分类'}
+                          </Typography.Text>
+                          <Typography.Text type="secondary">
+                            订单号：{getDisplayOrderNo(order)}
+                          </Typography.Text>
+                        </div>
+
+                        {order.sharing?.enabled ? (
+                          <div className="worker-hall-card-sharing">
+                            <Tag color="purple">拼单</Tag>
+                            <Typography.Text type="secondary">
+                              单价 {formatMoney(order.sharing.unitReward)} · 进度{' '}
+                              {order.sharingProgress?.joinedQuantity || 0}/
+                              {order.sharing.totalQuantity} · 剩{' '}
+                              {resolveSharingRemaining(order)} 份
+                            </Typography.Text>
+                          </div>
+                        ) : null}
+
+                        {Number(order.timeoutMinutes || 0) > 0 ? (
+                          <div className="worker-hall-card-sharing">
+                            <Tag color="orange" icon={<ClockCircleOutlined />}>
+                              限时 {order.timeoutMinutes} 分钟
+                            </Tag>
+                          </div>
+                        ) : null}
+
+                        <div className="worker-hall-card-amount-row">
+                          <div className="worker-hall-card-amount">
+                            {formatMoney(order.rewardAmount)}
+                          </div>
+                          <Typography.Text
+                            type="secondary"
+                            className="worker-hall-card-deposit"
+                          >
+                            所需保证金：{formatMoney(order.freezeDepositAmount)}
+                          </Typography.Text>
+                        </div>
+
+                        {disabledReason ? (
+                          <Typography.Text
+                            type="danger"
+                            className="worker-hall-card-hint"
+                          >
+                            {disabledReason}
+                          </Typography.Text>
+                        ) : null}
+
+                        <div className="worker-hall-card-actions">
+                          <div className="worker-hall-card-grab-row">
+                            {order.sharing?.enabled && !disabledReason ? (
+                              <Button
+                                type="primary"
+                                size="large"
+                                className="worker-hall-sharing-button"
+                                disabled={Boolean(disabledReason) || Boolean(order.myShare)}
+                                onClick={() => openSharingModal(order)}
+                              >
+                                {order.myShare
+                                  ? `已拼 ${order.myShare.quantity} 份`
+                                  : `拼单 ${formatMoney(order.sharing.unitReward)}/份`}
+                              </Button>
+                            ) : null}
+                            <Button
+                              type="primary"
+                              size="large"
+                              disabled={Boolean(disabledReason)}
+                              loading={grabbingId === order.workOrderId}
+                              onClick={() => submitGrab(order)}
+                            >
+                              {disabledReason || '立即抢单'}
+                            </Button>
+                          </div>
+                        </div>
+                      </article>
+                    )
+                  })}
+                </div>
+
+                {(pagination?.total || 0) > 0 ? (
+                  <div className="worker-hall-pagination">
+                    <Pagination
+                      current={pagination?.page || page}
+                      pageSize={pagination?.pageSize || pageSize}
+                      total={pagination?.total || 0}
+                      showSizeChanger={!isMobile}
+                      simple={isMobile}
+                      pageSizeOptions={[20, 50, 100]}
+                      showTotal={isMobile ? undefined : (total) => `共 ${total} 条`}
+                      onChange={(nextPage, nextPageSize) => {
+                        setPage(nextPage)
+                        setPageSize(nextPageSize)
+                      }}
+                    />
+                  </div>
+                ) : null}
+              </>
+            )}
+          </Card>
+        </section>
+      )}
 
       <Modal
         title={`拼单参与 · ${sharingOrder?.productName || ''}`}
@@ -491,7 +727,7 @@ export default function WorkerHallPage() {
           </Space>
         ) : null}
       </Modal>
-    </section>
+    </>
   )
 }
 
diff --git a/apps/frontend/src/styles/admin.css b/apps/frontend/src/styles/admin.css
new file mode 100644
index 00000000..5c36f1c1
--- /dev/null
+++ b/apps/frontend/src/styles/admin.css
@@ -0,0 +1,1243 @@
+/* ==========================================================================
+   管理后台与登录 (Admin Portal & Auth Layout)
+   ========================================================================== */
+
+/* ===== 登录页：工作台入口布局 ===== */
+
+.auth-page {
+  min-height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 48px 24px;
+  background:
+    linear-gradient(135deg, rgba(255, 106, 0, 0.055), transparent 30%),
+    linear-gradient(315deg, rgba(31, 41, 55, 0.045), transparent 38%), #f5f7fb;
+}
+
+.auth-shell {
+  width: min(940px, 100%);
+  min-height: 560px;
+  display: grid;
+  grid-template-columns: minmax(300px, 0.84fr) minmax(420px, 1fr);
+  overflow: hidden;
+  border: 1px solid rgba(226, 232, 240, 0.86);
+  border-radius: 18px;
+  background: #fff;
+  box-shadow: 0 28px 72px rgba(15, 23, 42, 0.12);
+}
+
+.auth-brand {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  gap: 34px;
+  padding: 40px;
+  color: #f9fafb;
+  background:
+    radial-gradient(circle at 100% 0%, rgba(255, 106, 0, 0.28), transparent 34%),
+    linear-gradient(160deg, #211816 0%, #171717 100%);
+  overflow: hidden;
+}
+
+.auth-brand::before {
+  content: '';
+  position: absolute;
+  inset: 0 auto 0 0;
+  width: 4px;
+  background: linear-gradient(180deg, var(--theme-primary), #ffb45a);
+}
+
+.auth-brand::after {
+  content: '';
+  position: absolute;
+  right: 28px;
+  bottom: 28px;
+  width: 108px;
+  height: 108px;
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  border-radius: 24px;
+  transform: rotate(12deg);
+}
+
+.auth-brand-top,
+.auth-brand-features,
+.auth-brand-footer {
+  position: relative;
+  z-index: 1;
+}
+
+.auth-brand-logo {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.auth-brand-logo .auth-logo-mark {
+  width: 42px;
+  height: 42px;
+  display: grid;
+  place-items: center;
+  border-radius: 10px;
+  background: var(--theme-primary);
+  color: #fff;
+  font-size: 21px;
+  box-shadow: 0 14px 30px rgba(255, 106, 0, 0.26);
+}
+
+.auth-brand-logo strong,
+.auth-brand-logo div > span {
+  display: block;
+}
+
+.auth-brand-logo strong {
+  color: #fff;
+  font-size: 18px;
+  line-height: 1.2;
+}
+
+.auth-brand-logo div > span {
+  margin-top: 3px;
+  color: rgba(249, 250, 251, 0.58);
+  font-size: 12px;
+  line-height: 1.2;
+}
+
+.auth-brand-body {
+  max-width: 320px;
+  margin-top: 58px;
+}
+
+.auth-brand-kicker {
+  display: inline-flex;
+  align-items: center;
+  min-height: 26px;
+  margin-bottom: 18px;
+  padding: 0 10px;
+  border: 1px solid rgba(255, 106, 0, 0.36);
+  border-radius: 999px;
+  color: #ffbd85;
+  font-size: 12px;
+  font-weight: 700;
+}
+
+.auth-brand-body h2 {
+  margin: 0 0 16px;
+  color: #fff;
+  font-size: 30px;
+  font-weight: 700;
+  line-height: 1.28;
+}
+
+.auth-brand-body p {
+  margin: 0;
+  color: rgba(249, 250, 251, 0.68);
+  font-size: 14px;
+  line-height: 1.8;
+}
+
+.auth-brand-features {
+  display: grid;
+  gap: 12px;
+}
+
+.auth-brand-feature {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+  min-height: 74px;
+  padding: 14px;
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  border-radius: 10px;
+  background: rgba(255, 255, 255, 0.045);
+}
+
+.auth-brand-feature .auth-feature-icon {
+  flex: 0 0 34px;
+  width: 34px;
+  height: 34px;
+  display: grid;
+  place-items: center;
+  border-radius: 8px;
+  background: rgba(255, 106, 0, 0.16);
+  color: #ffb45a;
+  font-size: 16px;
+}
+
+.auth-brand-feature-text strong {
+  display: block;
+  margin-bottom: 4px;
+  color: #fff;
+  font-size: 14px;
+}
+
+.auth-brand-feature-text span {
+  color: rgba(249, 250, 251, 0.58);
+  font-size: 12px;
+  line-height: 1.55;
+}
+
+.auth-brand-footer {
+  color: rgba(249, 250, 251, 0.42);
+  font-size: 12px;
+}
+
+.auth-form-side {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 56px 52px;
+  background: #fff;
+}
+
+.auth-form-card {
+  width: min(410px, 100%);
+}
+
+.auth-form-header {
+  margin: 22px 0 22px;
+}
+
+.auth-form-header h1 {
+  margin: 0 0 8px;
+  color: #111827;
+  font-size: 25px;
+  font-weight: 700;
+}
+
+.auth-form-header p {
+  margin: 0;
+  color: #6b7280;
+  font-size: 13px;
+  line-height: 1.7;
+}
+
+.auth-form-card .ant-tabs {
+  margin-bottom: 2px;
+}
+
+.auth-form-card .ant-tabs-nav {
+  margin-bottom: 0;
+}
+
+.auth-form-card .ant-tabs-tab {
+  padding: 8px 0;
+  font-size: 16px;
+}
+
+.auth-form-card .ant-form-item {
+  margin-bottom: 17px;
+}
+
+.auth-form-card .ant-form-item-label {
+  padding-bottom: 7px;
+}
+
+.auth-form-card .ant-input-affix-wrapper {
+  height: 46px;
+  display: flex;
+  align-items: center;
+  padding: 0 14px;
+}
+
+.auth-form-card .ant-input-affix-wrapper .ant-input {
+  height: auto;
+  min-height: 0;
+  padding: 0;
+  line-height: 22px;
+}
+
+.auth-form-card .ant-input-affix-wrapper .ant-input-prefix,
+.auth-form-card .ant-input-affix-wrapper .ant-input-suffix {
+  display: inline-flex;
+  align-items: center;
+}
+
+.auth-form-card .ant-input {
+  height: 46px;
+  padding: 0 14px;
+  line-height: 22px;
+}
+
+.auth-form-card .ant-btn-lg,
+.auth-form-card .ant-space-compact .ant-btn {
+  height: 46px;
+}
+
+.auth-form-card .ant-btn-lg {
+  font-size: 15px;
+  font-weight: 600;
+}
+
+.auth-form-footer {
+  margin-top: 24px;
+  color: #9ca3af;
+  text-align: center;
+  font-size: 13px;
+}
+
+.auth-mobile-brand {
+  display: none;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 24px;
+}
+
+.auth-mobile-brand .auth-logo-mark {
+  width: 36px;
+  height: 36px;
+  display: grid;
+  place-items: center;
+  border-radius: 9px;
+  background: var(--theme-primary);
+  color: #fff;
+  font-size: 18px;
+}
+
+.auth-mobile-brand strong {
+  color: #111827;
+  font-size: 18px;
+}
+
+/* ===== 后台整体框架与侧边栏 ===== */
+
+.admin-shell {
+  height: 100vh;
+  min-height: 100vh;
+  overflow: hidden;
+}
+
+.admin-sider {
+  height: 100vh;
+  overflow: hidden;
+  border-right: 1px solid #edf0f5;
+  box-shadow: 4px 0 18px rgba(15, 23, 42, 0.04);
+  z-index: 2;
+}
+
+.admin-main-shell {
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+}
+
+.admin-sider .ant-layout-sider-children {
+  height: 100%;
+}
+
+.admin-sider-inner {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+}
+
+.admin-brand {
+  min-height: 68px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+  padding: 12px 14px 12px 18px;
+  border-bottom: 1px solid #edf0f5;
+}
+
+.admin-brand-copy {
+  min-width: 0;
+  display: grid;
+  line-height: 1.25;
+}
+
+.admin-brand strong {
+  color: #111827;
+  font-size: 18px;
+}
+
+.admin-brand span {
+  color: #6b7280;
+  font-size: 12px;
+}
+
+.admin-collapse-button {
+  flex: 0 0 auto;
+  border-color: #e5e7eb;
+}
+
+.admin-sidebar-profile {
+  margin: 12px 14px 8px;
+  padding: 12px;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+  background: #f8fafc;
+  display: grid;
+  gap: 3px;
+  line-height: 1.35;
+}
+
+.admin-sidebar-profile .ant-typography {
+  margin: 0;
+  font-size: 12px;
+}
+
+.admin-menu {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+  overflow-x: hidden;
+  border-inline-end: 0 !important;
+  padding: 6px 8px 10px;
+}
+
+.admin-menu .ant-menu-item,
+.admin-menu .ant-menu-submenu-title {
+  border-radius: 6px;
+  margin-inline: 0;
+  width: 100%;
+}
+
+.admin-menu .ant-menu-item-selected {
+  font-weight: 700;
+}
+
+.admin-menu .ant-menu-item-group-title {
+  padding: 12px 10px 6px;
+  color: #9ca3af;
+  font-size: 12px;
+  font-weight: 700;
+}
+
+.admin-sider-footer {
+  padding: 10px 14px 14px;
+  border-top: 1px solid #edf0f5;
+}
+
+.admin-sider.ant-layout-sider-collapsed .admin-brand {
+  padding: 12px 8px;
+  flex-direction: column;
+}
+
+.admin-sider.ant-layout-sider-collapsed .admin-brand-copy {
+  justify-items: center;
+}
+
+.admin-sider.ant-layout-sider-collapsed .admin-menu {
+  padding-inline: 6px;
+}
+
+.admin-sider.ant-layout-sider-collapsed .admin-menu .ant-menu-item-group-title {
+  padding: 8px 0;
+  height: 8px;
+  overflow: hidden;
+}
+
+.admin-sider.ant-layout-sider-collapsed .admin-sider-footer {
+  padding-inline: 8px;
+}
+
+.admin-topbar {
+  flex: 0 0 64px;
+  height: 64px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  padding: 0 20px;
+  border-bottom: 1px solid #edf0f5;
+}
+
+.admin-user {
+  margin-left: auto;
+}
+
+.admin-user-copy {
+  display: grid;
+  justify-items: end;
+  line-height: 1.3;
+}
+
+.admin-content {
+  height: calc(100vh - 64px);
+  min-height: 0;
+  overflow: auto;
+  padding: 20px;
+}
+
+/* ===== 用户管理与操作区 ===== */
+
+.users-action-card .ant-card-body {
+  padding: 18px 24px;
+}
+
+.users-action-row {
+  display: grid;
+  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
+  gap: 22px;
+  align-items: start;
+}
+
+.users-action-section {
+  min-width: 0;
+  display: grid;
+  gap: 10px;
+}
+
+.users-action-title {
+  color: #1f2937;
+  font-weight: 700;
+  line-height: 1.4;
+}
+
+.users-action-form {
+  row-gap: 10px;
+}
+
+.users-action-form .ant-form-item {
+  margin-inline-end: 8px;
+  margin-bottom: 0;
+}
+
+.users-input-md {
+  width: 200px;
+}
+
+.users-input-lg {
+  width: 220px;
+}
+
+.users-select-sm {
+  width: 140px;
+}
+
+/* ===== 快手行业版 / 本地券码 ===== */
+
+.kuaishou-voucher-code-text {
+  min-width: 0;
+  white-space: normal;
+  overflow-wrap: anywhere;
+  word-break: break-all;
+}
+
+.kuaishou-voucher-meta {
+  font-size: 12px;
+  line-height: 1.4;
+}
+
+.kuaishou-industry-split {
+  display: grid;
+  grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.55fr);
+  gap: 16px;
+  align-items: start;
+}
+
+.kuaishou-industry-voucher-card {
+  min-width: 0;
+}
+
+.kuaishou-industry-voucher-card .ant-table {
+  font-size: 13px;
+}
+
+.kuaishou-industry-voucher-card .ant-table-cell {
+  vertical-align: top;
+}
+
+.kuaishou-industry-row-selected > td {
+  background: var(--theme-primary-soft) !important;
+}
+
+.kuaishou-industry-row-selected:hover > td {
+  background: var(--theme-primary-soft-hover) !important;
+}
+
+.kuaishou-industry-tool-card .ant-card-body {
+  padding: 16px;
+}
+
+.kuaishou-industry-tool-card {
+  position: sticky;
+  top: 0;
+  align-self: start;
+}
+
+.kuaishou-industry-tool-section + .kuaishou-industry-tool-section {
+  margin-top: 16px;
+  padding-top: 16px;
+  border-top: 1px solid #edf0f5;
+}
+
+.kuaishou-industry-tool-section-title {
+  margin-bottom: 10px;
+  color: #1f2937;
+  font-size: 14px;
+  font-weight: 700;
+}
+
+.kuaishou-industry-selected-voucher {
+  min-width: 0;
+}
+
+.kuaishou-industry-selected-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 8px;
+  min-width: 0;
+}
+
+.kuaishou-industry-selected-code {
+  min-width: 0;
+  overflow-wrap: anywhere;
+  word-break: break-all;
+}
+
+.kuaishou-industry-selected-meta {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 10px 16px;
+  margin-top: 12px;
+}
+
+.kuaishou-industry-selected-meta > div {
+  display: grid;
+  gap: 2px;
+  min-width: 0;
+}
+
+.kuaishou-industry-selected-meta span,
+.kuaishou-industry-selected-meta small {
+  color: #6b7280;
+  font-size: 12px;
+}
+
+.kuaishou-industry-selected-meta strong,
+.kuaishou-industry-selected-meta .ant-typography {
+  min-width: 0;
+  overflow-wrap: anywhere;
+  word-break: break-all;
+}
+
+.kuaishou-industry-selected-empty {
+  display: grid;
+  gap: 4px;
+  padding: 4px 0;
+  color: #6b7280;
+  font-size: 13px;
+}
+
+.kuaishou-industry-selected-empty strong {
+  color: #374151;
+}
+
+.kuaishou-industry-tool-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 12px;
+}
+
+.kuaishou-industry-tool-field {
+  display: grid;
+  gap: 6px;
+  min-width: 0;
+}
+
+.kuaishou-industry-tool-field > span {
+  color: #4b5563;
+  font-size: 12px;
+  line-height: 1.3;
+}
+
+.kuaishou-industry-tool-field-wide {
+  grid-column: 1 / -1;
+}
+
+.kuaishou-industry-tool-field .ant-select {
+  width: 100%;
+}
+
+.kuaishou-industry-manual-target {
+  margin-top: 14px;
+  border-top: 1px solid #edf0f5;
+}
+
+.kuaishou-industry-manual-target .ant-collapse-header {
+  padding: 12px 0 8px;
+  color: #6b7280;
+  font-size: 12px;
+}
+
+.kuaishou-industry-manual-target .ant-collapse-content-box {
+  padding: 4px 0 0;
+}
+
+.kuaishou-industry-actions {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 8px;
+  margin-top: 16px;
+  padding-top: 16px;
+  border-top: 1px solid #edf0f5;
+}
+
+.kuaishou-industry-actions .ant-btn {
+  width: 100%;
+  min-width: 0;
+}
+
+.kuaishou-industry-actions > :last-child {
+  grid-column: 1 / -1;
+}
+
+.kuaishou-industry-action-result {
+  margin-top: 14px;
+  padding-top: 14px;
+  border-top: 1px solid #edf0f5;
+}
+
+.kuaishou-industry-action-result .json-preview {
+  max-height: 280px;
+}
+
+/* ===== 任务流与履约看板 ===== */
+
+.task-action-hint {
+  display: block;
+  margin-top: 10px;
+}
+
+.task-action-groups {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: 12px;
+  align-items: start;
+}
+
+.task-action-group {
+  min-width: 0;
+  min-height: 86px;
+  padding: 12px;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+  background: #f8fafc;
+  display: grid;
+  gap: 8px;
+  align-content: start;
+}
+
+.task-action-group > .ant-typography {
+  font-size: 13px;
+  font-weight: 700;
+}
+
+.task-list-blocker-detail {
+  max-width: 220px;
+  display: block;
+}
+
+.task-list-blocker-tag,
+.task-list-executor-tag {
+  width: fit-content;
+  max-width: 100%;
+  margin-inline-end: 0 !important;
+  justify-self: start;
+  line-height: 18px;
+  font-size: 12px;
+}
+
+.task-list-status-main {
+  display: inline-flex;
+  cursor: help;
+}
+
+.task-list-status-tooltip {
+  display: grid;
+  gap: 6px;
+}
+
+.task-list-status-tooltip-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.task-list-status-tooltip-row > span:first-child {
+  min-width: 2em;
+  color: rgba(255, 255, 255, 0.75);
+}
+
+.task-list-row-error > td {
+  background: #fff7f7 !important;
+}
+
+.task-list-row-error:hover > td {
+  background: #ffefef !important;
+}
+
+.fulfillment-overview-grid {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 10px;
+}
+
+.fulfillment-step-card {
+  min-width: 0;
+  padding: 12px;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+  background: #ffffff;
+  display: grid;
+  gap: 8px;
+  align-content: start;
+}
+
+.fulfillment-step-card .ant-typography {
+  min-width: 0;
+}
+
+.manual-dispatch-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 12px;
+  align-items: end;
+}
+
+.manual-dispatch-grid > div {
+  min-width: 0;
+  display: grid;
+  gap: 6px;
+}
+
+.kuaishou-cloud-stack {
+  display: grid;
+  gap: 12px;
+}
+
+.task-flow-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 10px;
+}
+
+.task-flow-item {
+  min-width: 0;
+  padding: 12px;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+  background: #f8fafc;
+  display: grid;
+  gap: 8px;
+}
+
+.task-screenshot-preview {
+  display: grid;
+  place-items: center;
+  min-height: 260px;
+  padding: 12px;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+  background: #f8fafc;
+}
+
+.task-screenshot-preview .ant-image,
+.task-screenshot-preview img {
+  max-width: 100%;
+}
+
+/* ===== 平台路由、店铺与履约规则 ===== */
+
+.platform-tabs {
+  min-width: 0;
+}
+
+.platform-tabs > .ant-tabs-nav {
+  margin-bottom: 14px;
+}
+
+.platform-panel-stack {
+  display: grid;
+  gap: 16px;
+  min-width: 0;
+}
+
+.platform-section-gap {
+  margin-top: 14px;
+}
+
+.platform-form-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 14px;
+  align-items: end;
+}
+
+.platform-routing-grid {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 12px;
+}
+
+.platform-routing-priority-row,
+.platform-route-rule-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+}
+
+.platform-route-rule {
+  min-width: 0;
+  padding: 12px;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+  background: #f8fafc;
+  display: grid;
+  gap: 10px;
+}
+
+.platform-route-rule-grid {
+  display: grid;
+  grid-template-columns: minmax(220px, 1fr) 110px minmax(160px, 0.7fr) 110px;
+  gap: 10px;
+  align-items: center;
+}
+
+.field-switch {
+  min-height: 54px;
+  padding: 10px 12px;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+}
+
+.field-switch span {
+  color: #4b5563;
+  font-weight: 600;
+}
+
+.platform-inline-row,
+.platform-shop-row,
+.platform-rule-head,
+.platform-delivery-row {
+  display: grid;
+  gap: 10px;
+  align-items: center;
+  min-width: 0;
+}
+
+.platform-inline-row {
+  grid-template-columns: auto minmax(120px, 0.8fr) minmax(180px, 1.2fr) auto;
+}
+
+.platform-shop-row {
+  grid-template-columns:
+    auto auto minmax(120px, 0.9fr) minmax(140px, 1fr)
+    minmax(220px, 1.5fr) auto auto;
+}
+
+.platform-rule-head {
+  grid-template-columns: minmax(220px, 1fr) minmax(180px, 0.8fr);
+}
+
+.platform-delivery-row {
+  grid-template-columns: minmax(220px, 1.2fr) minmax(180px, 1fr) 110px auto;
+}
+
+.platform-split-layout {
+  display: grid;
+  grid-template-columns: minmax(220px, 300px) minmax(0, 1fr);
+  gap: 16px;
+  align-items: start;
+}
+
+.platform-side-card {
+  position: sticky;
+  top: 82px;
+}
+
+.platform-select-card {
+  width: 100%;
+  padding: 10px 12px;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+  background: #ffffff;
+  color: inherit;
+  cursor: pointer;
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  text-align: left;
+}
+
+.platform-select-card.active,
+.platform-source-card.active {
+  border-color: var(--theme-primary);
+  box-shadow: 0 0 0 2px var(--theme-primary-shadow);
+}
+
+.platform-select-card span {
+  display: grid;
+  gap: 4px;
+}
+
+.platform-select-card small {
+  color: #6b7280;
+}
+
+.cloud-records-filter {
+  display: grid;
+  grid-template-columns:
+    minmax(180px, 0.28fr) minmax(220px, 0.36fr) minmax(360px, 1fr)
+    auto;
+  gap: 12px;
+  align-items: center;
+}
+
+/* ===== 物品规则配置：3:7 比例响应式双栏 ===== */
+
+.product-rules-layout {
+  display: flex;
+  gap: 16px;
+  align-items: flex-start;
+  width: 100%;
+}
+
+.product-rules-form-card {
+  flex: 0 0 calc(30% - 8px);
+  width: calc(30% - 8px);
+  min-width: 360px;
+  border-radius: 8px;
+}
+
+.product-rules-form-card .ant-card-body {
+  padding: 12px 14px;
+  overflow: visible;
+}
+
+.worker-rule-form {
+  width: 100%;
+}
+
+.worker-rule-form-30 .rule-form-grid-2col {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 0 10px;
+}
+
+.worker-rule-form-30 .rule-form-grid-2col .span-2 {
+  grid-column: span 2;
+}
+
+.worker-rule-form-30 .ant-form-item {
+  margin-bottom: 7px;
+}
+
+.worker-rule-form-30 .ant-form-item-label {
+  padding-bottom: 1px;
+}
+
+.worker-rule-form-30 .ant-form-item-label > label {
+  font-size: 12px;
+  color: #374151;
+  font-weight: 500;
+}
+
+.worker-rule-form-30 .form-switches-strip {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  background: #f9fafb;
+  padding: 5px 10px;
+  border-radius: 6px;
+  margin-top: 3px;
+  margin-bottom: 7px;
+}
+
+.worker-rule-form-30 .form-switches-strip .ant-form-item {
+  margin-bottom: 0;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.worker-rule-form-30 .sharing-box-inline {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 8px;
+  background: #f8fafc;
+  border: 1px dashed #cbd5e1;
+  padding: 6px 8px;
+  border-radius: 6px;
+  margin-bottom: 7px;
+}
+
+.worker-rule-form-30 .sharing-box-inline .ant-form-item {
+  margin-bottom: 0;
+}
+
+.product-rules-list-card {
+  flex: 0 0 calc(70% - 8px);
+  width: calc(70% - 8px);
+  min-width: 0;
+  border-radius: 8px;
+}
+
+.product-rules-list-card .ant-card-body {
+  padding: 12px 16px;
+}
+
+.product-rules-category-tabs-bar {
+  margin-bottom: 10px;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.product-rules-category-tabs-bar .ant-tabs-nav {
+  margin: 0;
+}
+
+.product-rule-row-active > td {
+  background: #e6f4ff !important;
+}
+
+/* ===== 后台响应式断点 ===== */
+
+@media (max-width: 1080px) {
+  .product-rules-layout {
+    flex-direction: column;
+  }
+
+  .product-rules-form-card,
+  .product-rules-list-card {
+    flex: 1 1 100%;
+    width: 100%;
+  }
+}
+
+@media (max-width: 900px) {
+  .admin-sider {
+    position: fixed !important;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    height: 100vh;
+  }
+
+  .admin-content {
+    padding: 14px;
+  }
+
+  .admin-user-copy {
+    display: none;
+  }
+
+  .page-header {
+    display: grid;
+  }
+
+  .users-action-row {
+    grid-template-columns: 1fr;
+  }
+
+  .kuaishou-industry-split {
+    grid-template-columns: 1fr;
+  }
+
+  .kuaishou-industry-tool-card {
+    position: static;
+  }
+
+  .manual-dispatch-grid,
+  .fulfillment-overview-grid,
+  .task-flow-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .users-action-form .ant-form-item {
+    margin-bottom: 0;
+  }
+
+  .metric-grid.three,
+  .metric-grid.four,
+  .metric-grid.five,
+  .platform-form-grid,
+  .platform-routing-grid,
+  .platform-route-rule-grid,
+  .platform-split-layout {
+    grid-template-columns: 1fr;
+  }
+
+  .platform-routing-priority-row,
+  .platform-route-rule-head {
+    display: grid;
+  }
+
+  .platform-side-card {
+    position: static;
+  }
+
+  .platform-inline-row,
+  .platform-shop-row,
+  .platform-rule-head,
+  .platform-delivery-row {
+    grid-template-columns: 1fr;
+  }
+
+  .cloud-records-filter {
+    grid-template-columns: 1fr;
+  }
+
+  .table-toolbar {
+    display: grid;
+  }
+}
+
+@media (max-width: 860px) {
+  .auth-shell {
+    width: 100%;
+    min-height: 0;
+    display: block;
+    border-radius: 14px;
+  }
+
+  .auth-brand {
+    display: none;
+  }
+
+  .auth-form-side {
+    padding: 32px 24px;
+  }
+
+  .auth-mobile-brand {
+    display: flex;
+  }
+}
+
+@media (max-width: 720px) {
+  .users-action-card .ant-card-body {
+    padding: 14px;
+  }
+
+  .users-action-form,
+  .users-action-form .ant-form-item,
+  .users-action-form .ant-input-affix-wrapper,
+  .users-action-form .ant-input,
+  .users-action-form .ant-select,
+  .users-action-form .ant-space,
+  .users-action-form .ant-btn {
+    width: 100%;
+  }
+}
+
+@media (max-width: 520px) {
+  .kuaishou-industry-selected-meta,
+  .kuaishou-industry-tool-grid,
+  .kuaishou-industry-actions {
+    grid-template-columns: 1fr;
+  }
+
+  .kuaishou-industry-tool-field-wide,
+  .kuaishou-industry-actions > :last-child {
+    grid-column: auto;
+  }
+}
diff --git a/apps/frontend/src/styles/base.css b/apps/frontend/src/styles/base.css
new file mode 100644
index 00000000..6a4502dd
--- /dev/null
+++ b/apps/frontend/src/styles/base.css
@@ -0,0 +1,262 @@
+:root {
+  --theme-primary: #ff6a00;
+  --theme-primary-hover: #ff7a1a;
+  --theme-primary-active: #e65f00;
+  --theme-primary-soft: #fff3e8;
+  --theme-primary-soft-hover: #ffe6d1;
+  --theme-primary-shadow: rgba(255, 106, 0, 0.14);
+  color: #1f2937;
+  background: #f5f7fb;
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  min-width: 320px;
+  min-height: 100vh;
+}
+
+button,
+input,
+textarea,
+select {
+  font: inherit;
+}
+
+/* ===== 通用布局与页面容器 ===== */
+
+.page-stack {
+  display: grid;
+  gap: 16px;
+}
+
+.page-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+}
+
+.page-title {
+  margin: 0 !important;
+}
+
+.page-description {
+  margin: 6px 0 0;
+  color: #6b7280;
+}
+
+.filter-form {
+  row-gap: 12px;
+}
+
+.cell-stack {
+  display: grid;
+  gap: 4px;
+  min-width: 0;
+}
+
+.muted {
+  color: #6b7280;
+}
+
+.full-width {
+  width: 100%;
+}
+
+.json-preview {
+  max-height: 460px;
+  overflow: auto;
+  margin: 0;
+  padding: 14px;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+  background: #0f172a;
+  color: #dbeafe;
+  font-size: 12px;
+  line-height: 1.6;
+}
+
+.empty-page {
+  min-height: 50vh;
+  display: grid;
+  place-items: center;
+}
+
+.route-loading {
+  min-height: 100vh;
+  display: grid;
+  place-items: center;
+}
+
+.feedback-prompt p {
+  margin-top: 0;
+}
+
+.modal-form {
+  margin-top: 14px;
+}
+
+.payload-text {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', monospace;
+  font-size: 12px;
+  color: #4b5563;
+  word-break: break-all;
+}
+
+.dev-mock-pre {
+  margin: 0;
+  padding: 12px 14px;
+  overflow: auto;
+  max-height: 360px;
+  border-radius: 8px;
+  background: #0f172a;
+  color: #e2e8f0;
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+.total-badge {
+  display: inline-flex;
+  align-items: center;
+  min-height: 32px;
+  padding: 0 12px;
+  border-radius: 6px;
+  background: var(--theme-primary-soft);
+  color: var(--theme-primary);
+  font-weight: 700;
+}
+
+.table-toolbar {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  align-items: center;
+  margin-bottom: 12px;
+}
+
+.table-toolbar span {
+  color: #6b7280;
+  font-size: 13px;
+}
+
+.status-stack {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 4px;
+}
+
+.record-preview {
+  display: grid;
+  place-items: center;
+  min-height: 260px;
+  padding: 12px;
+  background: #f8fafc;
+  border: 1px solid #edf0f5;
+  border-radius: 6px;
+}
+
+.record-preview .ant-image,
+.record-preview img {
+  max-width: 100%;
+}
+
+.record-preview img {
+  height: auto;
+  border: 1px solid #edf0f5;
+  background: #ffffff;
+}
+
+.metric-grid {
+  display: grid;
+  gap: 12px;
+}
+
+.metric-grid.three {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+
+.metric-grid.four {
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+}
+
+.metric-grid.five {
+  grid-template-columns: repeat(5, minmax(0, 1fr));
+}
+
+.metric-card .ant-card-body,
+.metric-card {
+  min-width: 0;
+}
+
+.metric-card .ant-card-body {
+  display: grid;
+  gap: 5px;
+}
+
+.metric-card span,
+.metric-card small {
+  color: #6b7280;
+}
+
+.metric-card strong {
+  color: #111827;
+  font-size: 24px;
+  line-height: 1.1;
+}
+
+/* 图片上传通用组件 */
+.image-upload-trigger {
+  width: 100%;
+  height: 100%;
+  min-height: 72px;
+  border: 0;
+  background: transparent;
+  color: #64748b;
+  display: grid;
+  place-items: center;
+  gap: 4px;
+  cursor: pointer;
+}
+
+.image-upload-trigger span {
+  font-size: 12px;
+}
+
+.image-upload-droppable {
+  display: grid;
+  gap: 8px;
+  justify-items: start;
+}
+
+.image-upload-hint {
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+.image-preview-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  align-items: center;
+}
+
+.image-preview-item {
+  object-fit: cover;
+  border-radius: 6px;
+  border: 1px solid #e5e7eb;
+  background: #f8fafc;
+}
+
+.image-preview-more {
+  font-size: 12px;
+  white-space: nowrap;
+}
diff --git a/apps/frontend/src/styles/client.css b/apps/frontend/src/styles/client.css
new file mode 100644
index 00000000..a62e2b15
--- /dev/null
+++ b/apps/frontend/src/styles/client.css
@@ -0,0 +1,632 @@
+/* ==========================================================================
+   买家前台：提卡与信息收集页 (Buyer Claim & Collect Pages)
+   ========================================================================== */
+
+.claim-page {
+  min-height: 100vh;
+  padding: 24px;
+  background: linear-gradient(180deg, #f8fafc 0%, #eef4fb 100%);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 18px;
+}
+
+.claim-header-card,
+.claim-content-card {
+  width: min(680px, 100%);
+  border-color: rgba(148, 163, 184, 0.18);
+  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
+}
+
+.claim-header-card {
+  position: relative;
+}
+
+.claim-header-card .ant-card-body,
+.claim-content-card .ant-card-body {
+  display: flex;
+  flex-direction: column;
+  gap: 18px;
+}
+
+.claim-header-copy {
+  min-width: 0;
+  padding-right: 220px;
+}
+
+.claim-header-copy h1 {
+  margin: 0;
+  color: #0f172a;
+  font-size: 30px;
+  line-height: 1.25;
+  overflow-wrap: anywhere;
+}
+
+.claim-header-copy p,
+.claim-muted {
+  margin: 0;
+  color: #64748b;
+  line-height: 1.6;
+}
+
+.claim-step-indicator {
+  position: absolute;
+  top: 24px;
+  right: 24px;
+  max-width: 210px;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  gap: 7px;
+}
+
+.claim-step-dots {
+  display: flex;
+  gap: 8px;
+}
+
+.claim-step-dot {
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  background: #e5e7eb;
+  color: #94a3b8;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-weight: 700;
+}
+
+.claim-step-dot.active {
+  background: var(--theme-primary);
+  color: #ffffff;
+}
+
+.claim-step-progress-text {
+  color: #64748b;
+  font-size: 13px;
+  font-weight: 700;
+  line-height: 1.4;
+  text-align: right;
+  overflow-wrap: anywhere;
+}
+
+.claim-content-card .ant-typography {
+  margin: 0;
+}
+
+.claim-state-card .ant-card-body {
+  min-height: 240px;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+}
+
+.claim-large-icon {
+  font-size: 44px;
+}
+
+.claim-icon-success {
+  color: #16a34a;
+}
+
+.claim-icon-warning {
+  color: #d97706;
+}
+
+.claim-icon-info {
+  color: var(--theme-primary);
+}
+
+.claim-icon-error {
+  color: #dc2626;
+}
+
+.claim-qr-block {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 14px;
+  padding: 14px;
+  border-radius: 8px;
+  background: #f8fbff;
+  border: 1px solid #dbeafe;
+}
+
+.claim-qr-guide-panel {
+  display: grid;
+  grid-template-columns: 42px minmax(0, 280px) 42px;
+  grid-template-areas:
+    'left code right'
+    '. hint .';
+  gap: 10px;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  max-width: 410px;
+  min-width: 0;
+}
+
+.claim-scan-label {
+  align-self: stretch;
+  min-height: 150px;
+  padding: 10px 6px;
+  color: #e11d48;
+  font-weight: 900;
+  font-size: 17px;
+  line-height: 1.2;
+  writing-mode: vertical-rl;
+  text-orientation: upright;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.claim-scan-label-left {
+  grid-area: left;
+}
+
+.claim-scan-label-right {
+  grid-area: right;
+}
+
+.claim-qr-code {
+  grid-area: code;
+  width: 100%;
+  max-width: 280px;
+  aspect-ratio: 1 / 1;
+  padding: 10px;
+  background: #ffffff;
+  border-radius: 8px;
+  border: 1px solid #dbeafe;
+}
+
+.claim-save-hint {
+  grid-area: hint;
+  margin: 0;
+  justify-self: center;
+  color: #64748b;
+  font-size: 14px;
+  font-weight: 700;
+  line-height: 1.4;
+  text-align: center;
+}
+
+.claim-role-panel {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 8px;
+}
+
+.claim-role-panel.pending {
+  opacity: 0.82;
+}
+
+.claim-role-panel-item {
+  min-width: 0;
+  display: grid;
+  grid-template-columns: 88px minmax(0, 1fr);
+  align-items: center;
+  gap: 12px;
+}
+
+.claim-role-panel-item span {
+  color: #64748b;
+  font-size: 13px;
+  line-height: 1.4;
+  white-space: nowrap;
+}
+
+.claim-role-panel-item strong {
+  min-width: 0;
+  color: #0f172a;
+  font-size: 17px;
+  line-height: 1.45;
+  overflow-wrap: anywhere;
+}
+
+.claim-action-row {
+  width: 100%;
+}
+
+.claim-action-tooltip-wrap {
+  display: inline-flex;
+}
+
+.claim-meta-footer {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px 10px;
+  justify-content: center;
+  color: #94a3b8;
+  font-size: 11px;
+  line-height: 1.5;
+}
+
+.claim-info-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 14px;
+}
+
+.claim-info-grid-compact {
+  gap: 8px;
+  margin-bottom: 10px;
+}
+
+.claim-info-grid-compact .claim-info-item {
+  padding: 8px 10px;
+  gap: 2px;
+  border-radius: 6px;
+}
+
+.claim-info-grid-compact .claim-info-item span {
+  font-size: 11px;
+  line-height: 1.3;
+}
+
+.claim-info-grid-compact .claim-info-item strong {
+  font-size: 13px;
+  line-height: 1.35;
+  font-weight: 600;
+}
+
+.claim-uid-step .ant-card-body {
+  gap: 10px;
+}
+
+.claim-uid-step-title.ant-typography {
+  margin: 0 !important;
+  font-size: 20px !important;
+  line-height: 1.3 !important;
+}
+
+.claim-uid-step-desc {
+  font-size: 13px;
+  line-height: 1.45;
+}
+
+.claim-uid-guide {
+  margin: 4px 0 0;
+  padding: 6px;
+  border-radius: 8px;
+  background: #f8fafc;
+  border: 1px solid #e5e7eb;
+}
+
+.claim-uid-guide-image {
+  display: block;
+  width: 100%;
+  max-width: 360px;
+  max-height: 160px;
+  margin: 0 auto;
+  border-radius: 6px;
+  border: 1px solid #e2e8f0;
+  object-fit: contain;
+  background: #fff;
+}
+
+.claim-uid-guide-caption {
+  margin: 6px 0 0;
+  text-align: center;
+  color: #64748b;
+  font-size: 12px;
+  line-height: 1.35;
+}
+
+.claim-uid-warning {
+  margin: 2px 0 0;
+  color: #ff4d4f;
+  font-size: 13px;
+  font-weight: 600;
+  line-height: 1.45;
+}
+
+.claim-info-item {
+  min-width: 0;
+  padding: 16px;
+  border-radius: 6px;
+  background: #f8fafc;
+  border: 1px solid #e5e7eb;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.claim-info-item span {
+  color: #64748b;
+  font-size: 13px;
+}
+
+.claim-info-item strong {
+  color: #0f172a;
+  font-size: 17px;
+  overflow-wrap: anywhere;
+}
+
+.claim-result-header {
+  display: flex;
+  align-items: flex-start;
+  gap: 14px;
+}
+
+.claim-feifei-main {
+  display: grid;
+  gap: 8px;
+}
+
+.claim-feifei-main p {
+  margin: 0;
+  color: var(--theme-primary);
+  font-weight: 700;
+}
+
+.claim-feifei-label {
+  color: #64748b;
+  font-size: 13px;
+}
+
+.claim-product-items {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.claim-product-items-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  color: #64748b;
+  font-size: 13px;
+}
+
+.claim-product-items-header strong {
+  color: var(--theme-primary);
+  font-weight: 700;
+}
+
+.claim-product-items-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.claim-product-item-row {
+  min-height: 44px;
+  padding: 10px 12px;
+  border: 1px solid #e5e7eb;
+  border-radius: 6px;
+  background: #f8fafc;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+}
+
+.claim-product-item-row span {
+  min-width: 0;
+  color: #0f172a;
+  font-weight: 700;
+  line-height: 1.35;
+  overflow-wrap: anywhere;
+}
+
+.claim-product-item-row strong {
+  flex: 0 0 auto;
+  color: #0f172a;
+  font-size: 15px;
+}
+
+.claim-product-items.compact {
+  margin-top: 10px;
+  gap: 8px;
+}
+
+.claim-product-items.compact .claim-product-items-list {
+  gap: 6px;
+}
+
+.claim-product-items.compact .claim-product-item-row {
+  min-height: 36px;
+  padding: 8px 10px;
+  background: rgba(248, 250, 252, 0.72);
+}
+
+/* ===== 收集页 (Collect Page) ===== */
+
+.collect-page {
+  min-height: 100vh;
+  display: grid;
+  place-items: center;
+  padding: 32px 16px;
+  background: #f5f7fb;
+}
+
+.collect-card {
+  width: min(520px, 100%);
+}
+
+.collect-order-input {
+  flex: 1;
+  margin-bottom: 0;
+}
+
+/* ===== 买家页面响应式断点 ===== */
+
+@media (max-width: 720px) {
+  .claim-page {
+    padding: 14px;
+  }
+
+  .claim-header-card .ant-card-body,
+  .claim-content-card .ant-card-body {
+    gap: 14px;
+  }
+
+  .claim-header-copy {
+    padding-right: 150px;
+  }
+
+  .claim-header-copy h1 {
+    font-size: 24px;
+    line-height: 1.22;
+  }
+
+  .claim-header-copy p {
+    font-size: 14px;
+    line-height: 1.4;
+  }
+
+  .claim-step-indicator {
+    top: 16px;
+    right: 16px;
+    max-width: 140px;
+  }
+
+  .claim-step-dots {
+    gap: 5px;
+  }
+
+  .claim-step-dot {
+    width: 26px;
+    height: 26px;
+    font-size: 13px;
+  }
+
+  .claim-step-progress-text {
+    font-size: 12px;
+  }
+
+  .claim-info-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .claim-qr-block {
+    padding: 12px;
+  }
+
+  .claim-qr-guide-panel {
+    grid-template-columns: 34px minmax(0, 1fr) 34px;
+    gap: 8px;
+    max-width: 100%;
+  }
+
+  .claim-scan-label {
+    min-height: 128px;
+    padding: 8px 4px;
+    font-size: 14px;
+  }
+
+  .claim-qr-code {
+    max-width: 232px;
+    padding: 8px;
+  }
+
+  .claim-save-hint {
+    font-size: 13px;
+  }
+
+  .claim-role-panel-item {
+    grid-template-columns: 76px minmax(0, 1fr);
+    gap: 10px;
+  }
+
+  .claim-role-panel-item span {
+    font-size: 12px;
+  }
+
+  .claim-role-panel-item strong {
+    font-size: 16px;
+  }
+
+  .claim-action-row {
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .claim-action-row .ant-space-item,
+  .claim-action-row .ant-btn,
+  .claim-action-tooltip-wrap {
+    width: 100%;
+  }
+
+  .claim-meta-footer {
+    justify-content: flex-start;
+  }
+
+  .claim-result-header {
+    display: grid;
+  }
+}
+
+@media (max-width: 480px) {
+  .claim-page {
+    padding: 12px;
+    gap: 10px;
+  }
+
+  .claim-header-card .ant-card-body,
+  .claim-content-card .ant-card-body {
+    gap: 12px;
+  }
+
+  .claim-header-copy {
+    padding-right: 112px;
+  }
+
+  .claim-header-copy h1 {
+    font-size: 22px;
+  }
+
+  .claim-step-indicator {
+    position: absolute;
+    top: 16px;
+    right: 16px;
+    max-width: 100px;
+    align-items: flex-end;
+  }
+
+  .claim-step-dot {
+    width: 26px;
+    height: 26px;
+    font-size: 12px;
+  }
+
+  .claim-step-dots {
+    gap: 5px;
+  }
+
+  .claim-step-progress-text {
+    text-align: right;
+    font-size: 12px;
+  }
+
+  .claim-uid-step-title.ant-typography {
+    font-size: 18px !important;
+  }
+
+  .claim-uid-guide-image {
+    max-height: 140px;
+  }
+}
+
+@media (max-width: 420px) {
+  .claim-header-copy {
+    padding-right: 124px;
+  }
+
+  .claim-header-copy h1 {
+    font-size: 22px;
+  }
+
+  .claim-header-copy p {
+    padding-right: 0;
+  }
+
+  .claim-step-indicator {
+    max-width: 116px;
+  }
+}
diff --git a/apps/frontend/src/styles/main.css b/apps/frontend/src/styles/main.css
index 2257a06b..84d3bb71 100644
--- a/apps/frontend/src/styles/main.css
+++ b/apps/frontend/src/styles/main.css
@@ -1,3628 +1,13 @@
-:root {
-  --theme-primary: #ff6a00;
-  --theme-primary-hover: #ff7a1a;
-  --theme-primary-active: #e65f00;
-  --theme-primary-soft: #fff3e8;
-  --theme-primary-soft-hover: #ffe6d1;
-  --theme-primary-shadow: rgba(255, 106, 0, 0.14);
-  color: #1f2937;
-  background: #f5f7fb;
-  font-synthesis: none;
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-* {
-  box-sizing: border-box;
-}
-
-body {
-  margin: 0;
-  min-width: 320px;
-  min-height: 100vh;
-}
-
-button,
-input,
-textarea,
-select {
-  font: inherit;
-}
-
-/* ===== 登录页：工作台入口布局 ===== */
-
-.auth-page {
-  min-height: 100vh;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 48px 24px;
-  background:
-    linear-gradient(135deg, rgba(255, 106, 0, 0.055), transparent 30%),
-    linear-gradient(315deg, rgba(31, 41, 55, 0.045), transparent 38%), #f5f7fb;
-}
-
-.auth-shell {
-  width: min(940px, 100%);
-  min-height: 560px;
-  display: grid;
-  grid-template-columns: minmax(300px, 0.84fr) minmax(420px, 1fr);
-  overflow: hidden;
-  border: 1px solid rgba(226, 232, 240, 0.86);
-  border-radius: 18px;
-  background: #fff;
-  box-shadow: 0 28px 72px rgba(15, 23, 42, 0.12);
-}
-
-.auth-brand {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  gap: 34px;
-  padding: 40px;
-  color: #f9fafb;
-  background:
-    radial-gradient(circle at 100% 0%, rgba(255, 106, 0, 0.28), transparent 34%),
-    linear-gradient(160deg, #211816 0%, #171717 100%);
-  overflow: hidden;
-}
-
-.auth-brand::before {
-  content: '';
-  position: absolute;
-  inset: 0 auto 0 0;
-  width: 4px;
-  background: linear-gradient(180deg, var(--theme-primary), #ffb45a);
-}
-
-.auth-brand::after {
-  content: '';
-  position: absolute;
-  right: 28px;
-  bottom: 28px;
-  width: 108px;
-  height: 108px;
-  border: 1px solid rgba(255, 255, 255, 0.08);
-  border-radius: 24px;
-  transform: rotate(12deg);
-}
-
-.auth-brand-top,
-.auth-brand-features,
-.auth-brand-footer {
-  position: relative;
-  z-index: 1;
-}
-
-.auth-brand-logo {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-}
-
-.auth-brand-logo .auth-logo-mark {
-  width: 42px;
-  height: 42px;
-  display: grid;
-  place-items: center;
-  border-radius: 10px;
-  background: var(--theme-primary);
-  color: #fff;
-  font-size: 21px;
-  box-shadow: 0 14px 30px rgba(255, 106, 0, 0.26);
-}
-
-.auth-brand-logo strong,
-.auth-brand-logo div > span {
-  display: block;
-}
-
-.auth-brand-logo strong {
-  color: #fff;
-  font-size: 18px;
-  line-height: 1.2;
-}
-
-.auth-brand-logo div > span {
-  margin-top: 3px;
-  color: rgba(249, 250, 251, 0.58);
-  font-size: 12px;
-  line-height: 1.2;
-}
-
-.auth-brand-body {
-  max-width: 320px;
-  margin-top: 58px;
-}
-
-.auth-brand-kicker {
-  display: inline-flex;
-  align-items: center;
-  min-height: 26px;
-  margin-bottom: 18px;
-  padding: 0 10px;
-  border: 1px solid rgba(255, 106, 0, 0.36);
-  border-radius: 999px;
-  color: #ffbd85;
-  font-size: 12px;
-  font-weight: 700;
-}
-
-.auth-brand-body h2 {
-  margin: 0 0 16px;
-  color: #fff;
-  font-size: 30px;
-  font-weight: 700;
-  line-height: 1.28;
-}
-
-.auth-brand-body p {
-  margin: 0;
-  color: rgba(249, 250, 251, 0.68);
-  font-size: 14px;
-  line-height: 1.8;
-}
-
-.auth-brand-features {
-  display: grid;
-  gap: 12px;
-}
-
-.auth-brand-feature {
-  display: flex;
-  align-items: flex-start;
-  gap: 12px;
-  min-height: 74px;
-  padding: 14px;
-  border: 1px solid rgba(255, 255, 255, 0.08);
-  border-radius: 10px;
-  background: rgba(255, 255, 255, 0.045);
-}
-
-.auth-brand-feature .auth-feature-icon {
-  flex: 0 0 34px;
-  width: 34px;
-  height: 34px;
-  display: grid;
-  place-items: center;
-  border-radius: 8px;
-  background: rgba(255, 106, 0, 0.16);
-  color: #ffb45a;
-  font-size: 16px;
-}
-
-.auth-brand-feature-text strong {
-  display: block;
-  margin-bottom: 4px;
-  color: #fff;
-  font-size: 14px;
-}
-
-.auth-brand-feature-text span {
-  color: rgba(249, 250, 251, 0.58);
-  font-size: 12px;
-  line-height: 1.55;
-}
-
-.auth-brand-footer {
-  color: rgba(249, 250, 251, 0.42);
-  font-size: 12px;
-}
-
-.auth-form-side {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 56px 52px;
-  background: #fff;
-}
-
-.auth-form-card {
-  width: min(410px, 100%);
-}
-
-.auth-form-header {
-  margin: 22px 0 22px;
-}
-
-.auth-form-header h1 {
-  margin: 0 0 8px;
-  color: #111827;
-  font-size: 25px;
-  font-weight: 700;
-}
-
-.auth-form-header p {
-  margin: 0;
-  color: #6b7280;
-  font-size: 13px;
-  line-height: 1.7;
-}
-
-.auth-form-card .ant-tabs {
-  margin-bottom: 2px;
-}
-
-.auth-form-card .ant-tabs-nav {
-  margin-bottom: 0;
-}
-
-.auth-form-card .ant-tabs-tab {
-  padding: 8px 0;
-  font-size: 16px;
-}
-
-.auth-form-card .ant-form-item {
-  margin-bottom: 17px;
-}
-
-.auth-form-card .ant-form-item-label {
-  padding-bottom: 7px;
-}
-
-.auth-form-card .ant-input-affix-wrapper {
-  height: 46px;
-  display: flex;
-  align-items: center;
-  padding: 0 14px;
-}
-
-.auth-form-card .ant-input-affix-wrapper .ant-input {
-  height: auto;
-  min-height: 0;
-  padding: 0;
-  line-height: 22px;
-}
-
-.auth-form-card .ant-input-affix-wrapper .ant-input-prefix,
-.auth-form-card .ant-input-affix-wrapper .ant-input-suffix {
-  display: inline-flex;
-  align-items: center;
-}
-
-.auth-form-card .ant-input {
-  height: 46px;
-  padding: 0 14px;
-  line-height: 22px;
-}
-
-.auth-form-card .ant-btn-lg,
-.auth-form-card .ant-space-compact .ant-btn {
-  height: 46px;
-}
-
-.auth-form-card .ant-btn-lg {
-  font-size: 15px;
-  font-weight: 600;
-}
-
-.auth-form-footer {
-  margin-top: 24px;
-  color: #9ca3af;
-  text-align: center;
-  font-size: 13px;
-}
-
-.auth-mobile-brand {
-  display: none;
-  align-items: center;
-  gap: 10px;
-  margin-bottom: 24px;
-}
-
-.auth-mobile-brand .auth-logo-mark {
-  width: 36px;
-  height: 36px;
-  display: grid;
-  place-items: center;
-  border-radius: 9px;
-  background: var(--theme-primary);
-  color: #fff;
-  font-size: 18px;
-}
-
-.auth-mobile-brand strong {
-  color: #111827;
-  font-size: 18px;
-}
-
-@media (max-width: 860px) {
-  .auth-shell {
-    width: 100%;
-    min-height: 0;
-    display: block;
-    border-radius: 14px;
-  }
-
-  .auth-brand {
-    display: none;
-  }
-
-  .auth-form-side {
-    padding: 32px 24px;
-  }
-
-  .auth-mobile-brand {
-    display: flex;
-  }
-}
-
-.admin-shell {
-  height: 100vh;
-  min-height: 100vh;
-  overflow: hidden;
-}
-
-.admin-sider {
-  height: 100vh;
-  overflow: hidden;
-  border-right: 1px solid #edf0f5;
-  box-shadow: 4px 0 18px rgba(15, 23, 42, 0.04);
-  z-index: 2;
-}
-
-.admin-main-shell {
-  min-width: 0;
-  min-height: 0;
-  overflow: hidden;
-}
-
-.admin-sider .ant-layout-sider-children {
-  height: 100%;
-}
-
-.admin-sider-inner {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  min-height: 0;
-}
-
-.admin-brand {
-  min-height: 68px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 10px;
-  padding: 12px 14px 12px 18px;
-  border-bottom: 1px solid #edf0f5;
-}
-
-.admin-brand-copy {
-  min-width: 0;
-  display: grid;
-  line-height: 1.25;
-}
-
-.admin-brand strong {
-  color: #111827;
-  font-size: 18px;
-}
-
-.admin-brand span {
-  color: #6b7280;
-  font-size: 12px;
-}
-
-.admin-collapse-button {
-  flex: 0 0 auto;
-  border-color: #e5e7eb;
-}
-
-.admin-sidebar-profile {
-  margin: 12px 14px 8px;
-  padding: 12px;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-  background: #f8fafc;
-  display: grid;
-  gap: 3px;
-  line-height: 1.35;
-}
-
-.admin-sidebar-profile .ant-typography {
-  margin: 0;
-  font-size: 12px;
-}
-
-.admin-menu {
-  flex: 1;
-  min-height: 0;
-  overflow-y: auto;
-  overflow-x: hidden;
-  border-inline-end: 0 !important;
-  padding: 6px 8px 10px;
-}
-
-.admin-menu .ant-menu-item,
-.admin-menu .ant-menu-submenu-title {
-  border-radius: 6px;
-  margin-inline: 0;
-  width: 100%;
-}
-
-.admin-menu .ant-menu-item-selected {
-  font-weight: 700;
-}
-
-.admin-menu .ant-menu-item-group-title {
-  padding: 12px 10px 6px;
-  color: #9ca3af;
-  font-size: 12px;
-  font-weight: 700;
-}
-
-.admin-sider-footer {
-  padding: 10px 14px 14px;
-  border-top: 1px solid #edf0f5;
-}
-
-.admin-sider.ant-layout-sider-collapsed .admin-brand {
-  padding: 12px 8px;
-  flex-direction: column;
-}
-
-.admin-sider.ant-layout-sider-collapsed .admin-brand-copy {
-  justify-items: center;
-}
-
-.admin-sider.ant-layout-sider-collapsed .admin-menu {
-  padding-inline: 6px;
-}
-
-.admin-sider.ant-layout-sider-collapsed .admin-menu .ant-menu-item-group-title {
-  padding: 8px 0;
-  height: 8px;
-  overflow: hidden;
-}
-
-.admin-sider.ant-layout-sider-collapsed .admin-sider-footer {
-  padding-inline: 8px;
-}
-
-.admin-topbar {
-  flex: 0 0 64px;
-  height: 64px;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  padding: 0 20px;
-  border-bottom: 1px solid #edf0f5;
-}
-
-.admin-user {
-  margin-left: auto;
-}
-
-.admin-user-copy {
-  display: grid;
-  justify-items: end;
-  line-height: 1.3;
-}
-
-.admin-content {
-  height: calc(100vh - 64px);
-  min-height: 0;
-  overflow: auto;
-  padding: 20px;
-}
-
-.page-stack {
-  display: grid;
-  gap: 16px;
-}
-
-.page-header {
-  display: flex;
-  align-items: flex-start;
-  justify-content: space-between;
-  gap: 16px;
-}
-
-.page-title {
-  margin: 0 !important;
-}
-
-.page-description {
-  margin: 6px 0 0;
-  color: #6b7280;
-}
-
-.filter-form {
-  row-gap: 12px;
-}
-
-.users-action-card .ant-card-body {
-  padding: 18px 24px;
-}
-
-.users-action-row {
-  display: grid;
-  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
-  gap: 22px;
-  align-items: start;
-}
-
-.users-action-section {
-  min-width: 0;
-  display: grid;
-  gap: 10px;
-}
-
-.users-action-title {
-  color: #1f2937;
-  font-weight: 700;
-  line-height: 1.4;
-}
-
-.users-action-form {
-  row-gap: 10px;
-}
-
-.users-action-form .ant-form-item {
-  margin-inline-end: 8px;
-  margin-bottom: 0;
-}
-
-.users-input-md {
-  width: 200px;
-}
-
-.users-input-lg {
-  width: 220px;
-}
-
-.users-select-sm {
-  width: 140px;
-}
-
-.cell-stack {
-  display: grid;
-  gap: 4px;
-  min-width: 0;
-}
-
-.kuaishou-voucher-code-text {
-  min-width: 0;
-  white-space: normal;
-  overflow-wrap: anywhere;
-  word-break: break-all;
-}
-
-.kuaishou-voucher-meta {
-  font-size: 12px;
-  line-height: 1.4;
-}
-
-.muted {
-  color: #6b7280;
-}
-
-.json-preview {
-  max-height: 460px;
-  overflow: auto;
-  margin: 0;
-  padding: 14px;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-  background: #0f172a;
-  color: #dbeafe;
-  font-size: 12px;
-  line-height: 1.6;
-}
-
-.kuaishou-industry-split {
-  display: grid;
-  /* 本地券码优先占宽，减少表格横向滚动 */
-  grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.55fr);
-  gap: 16px;
-  align-items: start;
-}
-
-.kuaishou-industry-voucher-card {
-  min-width: 0;
-}
-
-.kuaishou-industry-voucher-card .ant-table {
-  font-size: 13px;
-}
-
-.kuaishou-industry-voucher-card .ant-table-cell {
-  vertical-align: top;
-}
-
-.kuaishou-industry-row-selected > td {
-  background: var(--theme-primary-soft) !important;
-}
-
-.kuaishou-industry-row-selected:hover > td {
-  background: var(--theme-primary-soft-hover) !important;
-}
-
-.kuaishou-industry-tool-card .ant-card-body {
-  padding: 16px;
-}
-
-.kuaishou-industry-tool-card {
-  /* 右侧操作区跟随管理内容滚动容器，始终保持在可视区域内。 */
-  position: sticky;
-  top: 0;
-  align-self: start;
-}
-
-.kuaishou-industry-tool-section + .kuaishou-industry-tool-section {
-  margin-top: 16px;
-  padding-top: 16px;
-  border-top: 1px solid #edf0f5;
-}
-
-.kuaishou-industry-tool-section-title {
-  margin-bottom: 10px;
-  color: #1f2937;
-  font-size: 14px;
-  font-weight: 700;
-}
-
-.kuaishou-industry-selected-voucher {
-  min-width: 0;
-}
-
-.kuaishou-industry-selected-header {
-  display: flex;
-  align-items: flex-start;
-  justify-content: space-between;
-  gap: 8px;
-  min-width: 0;
-}
-
-.kuaishou-industry-selected-code {
-  min-width: 0;
-  overflow-wrap: anywhere;
-  word-break: break-all;
-}
-
-.kuaishou-industry-selected-meta {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 10px 16px;
-  margin-top: 12px;
-}
-
-.kuaishou-industry-selected-meta > div {
-  display: grid;
-  gap: 2px;
-  min-width: 0;
-}
-
-.kuaishou-industry-selected-meta span,
-.kuaishou-industry-selected-meta small {
-  color: #6b7280;
-  font-size: 12px;
-}
-
-.kuaishou-industry-selected-meta strong,
-.kuaishou-industry-selected-meta .ant-typography {
-  min-width: 0;
-  overflow-wrap: anywhere;
-  word-break: break-all;
-}
-
-.kuaishou-industry-selected-empty {
-  display: grid;
-  gap: 4px;
-  padding: 4px 0;
-  color: #6b7280;
-  font-size: 13px;
-}
-
-.kuaishou-industry-selected-empty strong {
-  color: #374151;
-}
-
-.kuaishou-industry-tool-grid {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 12px;
-}
-
-.kuaishou-industry-tool-field {
-  display: grid;
-  gap: 6px;
-  min-width: 0;
-}
-
-.kuaishou-industry-tool-field > span {
-  color: #4b5563;
-  font-size: 12px;
-  line-height: 1.3;
-}
-
-.kuaishou-industry-tool-field-wide {
-  grid-column: 1 / -1;
-}
-
-.kuaishou-industry-tool-field .ant-select {
-  width: 100%;
-}
-
-.kuaishou-industry-manual-target {
-  margin-top: 14px;
-  border-top: 1px solid #edf0f5;
-}
-
-.kuaishou-industry-manual-target .ant-collapse-header {
-  padding: 12px 0 8px;
-  color: #6b7280;
-  font-size: 12px;
-}
-
-.kuaishou-industry-manual-target .ant-collapse-content-box {
-  padding: 4px 0 0;
-}
-
-.kuaishou-industry-actions {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 8px;
-  margin-top: 16px;
-  padding-top: 16px;
-  border-top: 1px solid #edf0f5;
-}
-
-.kuaishou-industry-actions .ant-btn {
-  width: 100%;
-  min-width: 0;
-}
-
-.kuaishou-industry-actions > :last-child {
-  grid-column: 1 / -1;
-}
-
-.kuaishou-industry-action-result {
-  margin-top: 14px;
-  padding-top: 14px;
-  border-top: 1px solid #edf0f5;
-}
-
-.kuaishou-industry-action-result .json-preview {
-  max-height: 280px;
-}
-
-.task-action-hint {
-  display: block;
-  margin-top: 10px;
-}
-
-.task-action-groups {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
-  gap: 12px;
-  align-items: start;
-}
-
-.task-action-group {
-  min-width: 0;
-  min-height: 86px;
-  padding: 12px;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-  background: #f8fafc;
-  display: grid;
-  gap: 8px;
-  align-content: start;
-}
-
-.task-action-group > .ant-typography {
-  font-size: 13px;
-  font-weight: 700;
-}
-
-.task-list-blocker-detail {
-  max-width: 220px;
-  display: block;
-}
-
-.task-list-blocker-tag,
-.task-list-executor-tag {
-  width: fit-content;
-  max-width: 100%;
-  margin-inline-end: 0 !important;
-  justify-self: start;
-  line-height: 18px;
-  font-size: 12px;
-}
-
-.task-list-status-main {
-  display: inline-flex;
-  cursor: help;
-}
-
-.task-list-status-tooltip {
-  display: grid;
-  gap: 6px;
-}
-
-.task-list-status-tooltip-row {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.task-list-status-tooltip-row > span:first-child {
-  min-width: 2em;
-  color: rgba(255, 255, 255, 0.75);
-}
-
-.task-list-row-error > td {
-  background: #fff7f7 !important;
-}
-
-.task-list-row-error:hover > td {
-  background: #ffefef !important;
-}
-
-.fulfillment-overview-grid {
-  display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-  gap: 10px;
-}
-
-.fulfillment-step-card {
-  min-width: 0;
-  padding: 12px;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-  background: #ffffff;
-  display: grid;
-  gap: 8px;
-  align-content: start;
-}
-
-.fulfillment-step-card .ant-typography {
-  min-width: 0;
-}
-
-.manual-dispatch-grid {
-  display: grid;
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  gap: 12px;
-  align-items: end;
-}
-
-.manual-dispatch-grid > div {
-  min-width: 0;
-  display: grid;
-  gap: 6px;
-}
-
-.kuaishou-cloud-stack {
-  display: grid;
-  gap: 12px;
-}
-
-.task-flow-grid {
-  display: grid;
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  gap: 10px;
-}
-
-.task-flow-item {
-  min-width: 0;
-  padding: 12px;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-  background: #f8fafc;
-  display: grid;
-  gap: 8px;
-}
-
-.task-screenshot-preview {
-  display: grid;
-  place-items: center;
-  min-height: 260px;
-  padding: 12px;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-  background: #f8fafc;
-}
-
-.task-screenshot-preview .ant-image,
-.task-screenshot-preview img {
-  max-width: 100%;
-}
-
-.empty-page {
-  min-height: 50vh;
-  display: grid;
-  place-items: center;
-}
-
-.route-loading {
-  min-height: 100vh;
-  display: grid;
-  place-items: center;
-}
-
-.full-width {
-  width: 100%;
-}
-
-.feedback-prompt p {
-  margin-top: 0;
-}
-
-.modal-form {
-  margin-top: 14px;
-}
-
-.payload-text {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', monospace;
-  font-size: 12px;
-  color: #4b5563;
-  word-break: break-all;
-}
-
-.claim-page {
-  min-height: 100vh;
-  padding: 24px;
-  background: linear-gradient(180deg, #f8fafc 0%, #eef4fb 100%);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 18px;
-}
-
-.claim-header-card,
-.claim-content-card {
-  width: min(680px, 100%);
-  border-color: rgba(148, 163, 184, 0.18);
-  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
-}
-
-.claim-header-card {
-  position: relative;
-}
-
-.claim-header-card .ant-card-body,
-.claim-content-card .ant-card-body {
-  display: flex;
-  flex-direction: column;
-  gap: 18px;
-}
-
-.claim-header-copy {
-  min-width: 0;
-  padding-right: 220px;
-}
-
-.claim-header-copy h1 {
-  margin: 0;
-  color: #0f172a;
-  font-size: 30px;
-  line-height: 1.25;
-  overflow-wrap: anywhere;
-}
-
-.claim-header-copy p,
-.claim-muted {
-  margin: 0;
-  color: #64748b;
-  line-height: 1.6;
-}
-
-.claim-step-indicator {
-  position: absolute;
-  top: 24px;
-  right: 24px;
-  max-width: 210px;
-  display: flex;
-  flex-direction: column;
-  align-items: flex-end;
-  gap: 7px;
-}
-
-.claim-step-dots {
-  display: flex;
-  gap: 8px;
-}
-
-.claim-step-dot {
-  width: 32px;
-  height: 32px;
-  border-radius: 50%;
-  background: #e5e7eb;
-  color: #94a3b8;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  font-weight: 700;
-}
-
-.claim-step-dot.active {
-  background: var(--theme-primary);
-  color: #ffffff;
-}
-
-.claim-step-progress-text {
-  color: #64748b;
-  font-size: 13px;
-  font-weight: 700;
-  line-height: 1.4;
-  text-align: right;
-  overflow-wrap: anywhere;
-}
-
-.claim-content-card .ant-typography {
-  margin: 0;
-}
-
-.claim-state-card .ant-card-body {
-  min-height: 240px;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-}
-
-.claim-large-icon {
-  font-size: 44px;
-}
-
-.claim-icon-success {
-  color: #16a34a;
-}
-
-.claim-icon-warning {
-  color: #d97706;
-}
-
-.claim-icon-info {
-  color: var(--theme-primary);
-}
-
-.claim-icon-error {
-  color: #dc2626;
-}
-
-.claim-qr-block {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 14px;
-  padding: 14px;
-  border-radius: 8px;
-  background: #f8fbff;
-  border: 1px solid #dbeafe;
-}
-
-.claim-qr-guide-panel {
-  display: grid;
-  grid-template-columns: 42px minmax(0, 280px) 42px;
-  grid-template-areas:
-    'left code right'
-    '. hint .';
-  gap: 10px;
-  align-items: center;
-  justify-content: center;
-  width: 100%;
-  max-width: 410px;
-  min-width: 0;
-}
-
-.claim-scan-label {
-  align-self: stretch;
-  min-height: 150px;
-  padding: 10px 6px;
-  color: #e11d48;
-  font-weight: 900;
-  font-size: 17px;
-  line-height: 1.2;
-  writing-mode: vertical-rl;
-  text-orientation: upright;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.claim-scan-label-left {
-  grid-area: left;
-}
-
-.claim-scan-label-right {
-  grid-area: right;
-}
-
-.claim-qr-code {
-  grid-area: code;
-  width: 100%;
-  max-width: 280px;
-  aspect-ratio: 1 / 1;
-  padding: 10px;
-  background: #ffffff;
-  border-radius: 8px;
-  border: 1px solid #dbeafe;
-}
-
-.claim-save-hint {
-  grid-area: hint;
-  margin: 0;
-  justify-self: center;
-  color: #64748b;
-  font-size: 14px;
-  font-weight: 700;
-  line-height: 1.4;
-  text-align: center;
-}
-
-.claim-role-panel {
-  display: grid;
-  grid-template-columns: 1fr;
-  gap: 8px;
-}
-
-.claim-role-panel.pending {
-  opacity: 0.82;
-}
-
-.claim-role-panel-item {
-  min-width: 0;
-  display: grid;
-  grid-template-columns: 88px minmax(0, 1fr);
-  align-items: center;
-  gap: 12px;
-}
-
-.claim-role-panel-item span {
-  color: #64748b;
-  font-size: 13px;
-  line-height: 1.4;
-  white-space: nowrap;
-}
-
-.claim-role-panel-item strong {
-  min-width: 0;
-  color: #0f172a;
-  font-size: 17px;
-  line-height: 1.45;
-  overflow-wrap: anywhere;
-}
-
-.claim-action-row {
-  width: 100%;
-}
-
-.claim-action-tooltip-wrap {
-  display: inline-flex;
-}
-
-.claim-meta-footer {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 4px 10px;
-  justify-content: center;
-  color: #94a3b8;
-  font-size: 11px;
-  line-height: 1.5;
-}
-
-.claim-info-grid {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 14px;
-}
-
-.claim-info-grid-compact {
-  gap: 8px;
-  margin-bottom: 10px;
-}
-
-.claim-info-grid-compact .claim-info-item {
-  padding: 8px 10px;
-  gap: 2px;
-  border-radius: 6px;
-}
-
-.claim-info-grid-compact .claim-info-item span {
-  font-size: 11px;
-  line-height: 1.3;
-}
-
-.claim-info-grid-compact .claim-info-item strong {
-  font-size: 13px;
-  line-height: 1.35;
-  font-weight: 600;
-}
-
-.claim-uid-step .ant-card-body {
-  gap: 10px;
-}
-
-.claim-uid-step-title.ant-typography {
-  margin: 0 !important;
-  font-size: 20px !important;
-  line-height: 1.3 !important;
-}
-
-.claim-uid-step-desc {
-  font-size: 13px;
-  line-height: 1.45;
-}
-
-.claim-uid-guide {
-  margin: 4px 0 0;
-  padding: 6px;
-  border-radius: 8px;
-  background: #f8fafc;
-  border: 1px solid #e5e7eb;
-}
-
-.claim-uid-guide-image {
-  display: block;
-  width: 100%;
-  max-width: 360px;
-  max-height: 160px;
-  margin: 0 auto;
-  border-radius: 6px;
-  border: 1px solid #e2e8f0;
-  object-fit: contain;
-  background: #fff;
-}
-
-.claim-uid-guide-caption {
-  margin: 6px 0 0;
-  text-align: center;
-  color: #64748b;
-  font-size: 12px;
-  line-height: 1.35;
-}
-
-.claim-uid-warning {
-  margin: 2px 0 0;
-  color: #ff4d4f;
-  font-size: 13px;
-  font-weight: 600;
-  line-height: 1.45;
-}
-
-@media (max-width: 480px) {
-  .claim-page {
-    padding: 12px;
-    gap: 10px;
-  }
-
-  .claim-header-card .ant-card-body,
-  .claim-content-card .ant-card-body {
-    gap: 12px;
-  }
-
-  .claim-header-copy {
-    /* 为右上角步骤条预留空间 */
-    padding-right: 112px;
-  }
-
-  .claim-header-copy h1 {
-    font-size: 22px;
-  }
-
-  .claim-step-indicator {
-    position: absolute;
-    top: 16px;
-    right: 16px;
-    max-width: 100px;
-    align-items: flex-end;
-  }
-
-  .claim-step-dot {
-    width: 26px;
-    height: 26px;
-    font-size: 12px;
-  }
-
-  .claim-step-dots {
-    gap: 5px;
-  }
-
-  .claim-step-progress-text {
-    text-align: right;
-    font-size: 12px;
-  }
-
-  .claim-uid-step-title.ant-typography {
-    font-size: 18px !important;
-  }
-
-  .claim-uid-guide-image {
-    max-height: 140px;
-  }
-}
-
-.claim-info-item {
-  min-width: 0;
-  padding: 16px;
-  border-radius: 6px;
-  background: #f8fafc;
-  border: 1px solid #e5e7eb;
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-
-.claim-info-item span {
-  color: #64748b;
-  font-size: 13px;
-}
-
-.claim-info-item strong {
-  color: #0f172a;
-  font-size: 17px;
-  overflow-wrap: anywhere;
-}
-
-.claim-result-header {
-  display: flex;
-  align-items: flex-start;
-  gap: 14px;
-}
-
-.claim-feifei-main {
-  display: grid;
-  gap: 8px;
-}
-
-.claim-feifei-main p {
-  margin: 0;
-  color: var(--theme-primary);
-  font-weight: 700;
-}
-
-.claim-feifei-label {
-  color: #64748b;
-  font-size: 13px;
-}
-
-.claim-product-items {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-}
-
-.claim-product-items-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 12px;
-  color: #64748b;
-  font-size: 13px;
-}
-
-.claim-product-items-header strong {
-  color: var(--theme-primary);
-  font-weight: 700;
-}
-
-.claim-product-items-list {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-}
-
-.claim-product-item-row {
-  min-height: 44px;
-  padding: 10px 12px;
-  border: 1px solid #e5e7eb;
-  border-radius: 6px;
-  background: #f8fafc;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 12px;
-}
-
-.claim-product-item-row span {
-  min-width: 0;
-  color: #0f172a;
-  font-weight: 700;
-  line-height: 1.35;
-  overflow-wrap: anywhere;
-}
-
-.claim-product-item-row strong {
-  flex: 0 0 auto;
-  color: #0f172a;
-  font-size: 15px;
-}
-
-.claim-product-items.compact {
-  margin-top: 10px;
-  gap: 8px;
-}
-
-.claim-product-items.compact .claim-product-items-list {
-  gap: 6px;
-}
-
-.claim-product-items.compact .claim-product-item-row {
-  min-height: 36px;
-  padding: 8px 10px;
-  background: rgba(248, 250, 252, 0.72);
-}
-
-.platform-tabs {
-  min-width: 0;
-}
-
-.platform-tabs > .ant-tabs-nav {
-  margin-bottom: 14px;
-}
-
-.platform-panel-stack {
-  display: grid;
-  gap: 16px;
-  min-width: 0;
-}
-
-.worker-orders-toolbar {
-  display: flex;
-  align-items: center;
-  gap: 24px;
-  min-width: 0;
-}
-
-.worker-orders-search-controls {
-  flex: 0 0 auto;
-}
-
-.worker-orders-mock {
-  flex: 1;
-  min-width: 0;
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  padding-left: 24px;
-  border-left: 1px solid #edf0f5;
-}
-
-.worker-orders-mock > .ant-typography {
-  flex: 0 0 auto;
-  white-space: nowrap;
-}
-
-.worker-order-mock-form {
-  flex: 1;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 8px 12px;
-  min-width: 0;
-}
-
-.worker-order-mock-form .ant-form-item {
-  min-width: 0;
-  margin: 0;
-}
-
-.worker-order-mock-field-order .ant-input {
-  width: 150px;
-}
-
-.worker-order-mock-field-product .ant-input {
-  width: 190px;
-}
-
-.worker-order-mock-field-amount .ant-input-number {
-  width: 116px;
-}
-
-.worker-order-detail-stack {
-  display: grid;
-  gap: 16px;
-}
-
-.worker-order-actions {
-  display: grid;
-  justify-items: start;
-  gap: 4px;
-}
-
-.worker-order-actions .ant-btn-link {
-  height: auto;
-  padding: 0;
-}
-
-.worker-order-detail-value {
-  white-space: pre-wrap;
-  overflow-wrap: anywhere;
-  word-break: break-word;
-}
-
-.worker-order-detail-json-tabs > .ant-tabs-nav {
-  margin-bottom: 12px;
-}
-
-.acceptance-draft-badge-wrap {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 6px;
-}
-
-.acceptance-draft-badge-wrap .ant-tag {
-  margin-inline-end: 0;
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-}
-
-.worker-note-cell {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  min-width: 0;
-}
-
-.worker-note-badge {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-  max-width: 100%;
-  padding: 3px 8px;
-  background: #f6f8fa;
-  border: 1px solid #d0d7de;
-  border-radius: 6px;
-  cursor: pointer;
-  transition: all 0.2s ease;
-  font-size: 12px;
-  color: #24292f;
-}
-
-.worker-note-badge:hover {
-  background: #e6f4ff;
-  border-color: #91caff;
-  color: #0958d9;
-}
-
-.worker-note-text {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  max-width: 110px;
-}
-
-.worker-note-edit-icon {
-  font-size: 12px;
-  color: #8c8c8c;
-  transition: color 0.2s;
-}
-
-.worker-note-badge:hover .worker-note-edit-icon {
-  color: #0958d9;
-}
-
-.worker-note-add-btn {
-  border-style: dashed;
-  color: #595959;
-  font-size: 12px;
-}
-
-.worker-note-preset-tags {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-}
-
-.worker-note-preset-tag {
-  cursor: pointer;
-  user-select: none;
-  padding: 2px 10px;
-  border-radius: 4px;
-  transition: all 0.2s ease;
-}
-
-.worker-note-preset-tag:hover {
-  border-color: #1677ff;
-  color: #1677ff;
-  background: #e6f4ff;
-}
-
-
-.metric-grid {
-  display: grid;
-  gap: 12px;
-}
-
-.metric-grid.three {
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-}
-
-.metric-grid.four {
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-}
-
-.metric-grid.five {
-  grid-template-columns: repeat(5, minmax(0, 1fr));
-}
-
-.metric-card .ant-card-body,
-.metric-card {
-  min-width: 0;
-}
-
-.metric-card .ant-card-body {
-  display: grid;
-  gap: 5px;
-}
-
-/* 接单平台顶部紧凑统计条 */
-.platform-summary-strip-card {
-  width: 100%;
-}
-
-.platform-summary-strip-card .ant-card-body {
-  padding: 8px 16px !important;
-}
-
-.platform-summary-strip-item {
-  font-size: 13px;
-  color: rgba(0, 0, 0, 0.65);
-  white-space: nowrap;
-}
-
-.platform-summary-strip-item strong {
-  font-size: 16px;
-  margin-left: 6px;
-  color: rgba(0, 0, 0, 0.88);
-}
-
-.metric-card span,
-.metric-card small {
-  color: #6b7280;
-}
-
-.metric-card strong {
-  color: #111827;
-  font-size: 24px;
-  line-height: 1.1;
-}
-
-.platform-section-gap {
-  margin-top: 14px;
-}
-
-.platform-form-grid {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 14px;
-  align-items: end;
-}
-
-.platform-routing-grid {
-  display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-  gap: 12px;
-}
-
-.platform-routing-priority-row,
-.platform-route-rule-head {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 12px;
-}
-
-.platform-route-rule {
-  min-width: 0;
-  padding: 12px;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-  background: #f8fafc;
-  display: grid;
-  gap: 10px;
-}
-
-.platform-route-rule-grid {
-  display: grid;
-  grid-template-columns: minmax(220px, 1fr) 110px minmax(160px, 0.7fr) 110px;
-  gap: 10px;
-  align-items: center;
-}
-
-.field-switch {
-  min-height: 54px;
-  padding: 10px 12px;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 12px;
-}
-
-.field-switch span {
-  color: #4b5563;
-  font-weight: 600;
-}
-
-.platform-inline-row,
-.platform-shop-row,
-.platform-rule-head,
-.platform-delivery-row {
-  display: grid;
-  gap: 10px;
-  align-items: center;
-  min-width: 0;
-}
-
-.platform-inline-row {
-  grid-template-columns: auto minmax(120px, 0.8fr) minmax(180px, 1.2fr) auto;
-}
-
-.platform-shop-row {
-  grid-template-columns:
-    auto auto minmax(120px, 0.9fr) minmax(140px, 1fr)
-    minmax(220px, 1.5fr) auto auto;
-}
-
-.platform-rule-head {
-  grid-template-columns: minmax(220px, 1fr) minmax(180px, 0.8fr);
-}
-
-.platform-delivery-row {
-  grid-template-columns: minmax(220px, 1.2fr) minmax(180px, 1fr) 110px auto;
-}
-
-.platform-split-layout {
-  display: grid;
-  grid-template-columns: minmax(220px, 300px) minmax(0, 1fr);
-  gap: 16px;
-  align-items: start;
-}
-
-.platform-side-card {
-  position: sticky;
-  top: 82px;
-}
-
-.platform-select-card {
-  width: 100%;
-  padding: 10px 12px;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-  background: #ffffff;
-  color: inherit;
-  cursor: pointer;
-  display: flex;
-  justify-content: space-between;
-  gap: 12px;
-  text-align: left;
-}
-
-.platform-select-card.active,
-.platform-source-card.active {
-  border-color: var(--theme-primary);
-  box-shadow: 0 0 0 2px var(--theme-primary-shadow);
-}
-
-.platform-select-card span {
-  display: grid;
-  gap: 4px;
-}
-
-.platform-select-card small {
-  color: #6b7280;
-}
-
-.total-badge {
-  display: inline-flex;
-  align-items: center;
-  min-height: 32px;
-  padding: 0 12px;
-  border-radius: 6px;
-  background: var(--theme-primary-soft);
-  color: var(--theme-primary);
-  font-weight: 700;
-}
-
-.cloud-records-filter {
-  display: grid;
-  grid-template-columns:
-    minmax(180px, 0.28fr) minmax(220px, 0.36fr) minmax(360px, 1fr)
-    auto;
-  gap: 12px;
-  align-items: center;
-}
-
-.table-toolbar {
-  display: flex;
-  justify-content: space-between;
-  gap: 12px;
-  align-items: center;
-  margin-bottom: 12px;
-}
-
-.table-toolbar span {
-  color: #6b7280;
-  font-size: 13px;
-}
-
-.status-stack {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 4px;
-}
-
-.record-preview {
-  display: grid;
-  place-items: center;
-  min-height: 260px;
-  padding: 12px;
-  background: #f8fafc;
-  border: 1px solid #edf0f5;
-  border-radius: 6px;
-}
-
-.record-preview .ant-image,
-.record-preview img {
-  max-width: 100%;
-}
-
-.record-preview img {
-  height: auto;
-  border: 1px solid #edf0f5;
-  background: #ffffff;
-}
-
-@media (max-width: 900px) {
-  .admin-sider {
-    position: fixed !important;
-    left: 0;
-    top: 0;
-    bottom: 0;
-    height: 100vh;
-  }
-
-  .admin-content {
-    padding: 14px;
-  }
-
-  .admin-user-copy {
-    display: none;
-  }
-
-  .page-header {
-    display: grid;
-  }
-
-  .users-action-row {
-    grid-template-columns: 1fr;
-  }
-
-  .worker-orders-toolbar {
-    flex-direction: column;
-    align-items: stretch;
-    gap: 12px;
-  }
-
-  .worker-orders-mock {
-    padding-top: 12px;
-    padding-left: 0;
-    border-top: 1px solid #edf0f5;
-    border-left: 0;
-  }
-
-  .kuaishou-industry-split {
-    grid-template-columns: 1fr;
-  }
-
-  .kuaishou-industry-tool-card {
-    /* 窄屏单列展示时不固定操作区，避免遮挡下方内容。 */
-    position: static;
-  }
-
-  .manual-dispatch-grid,
-  .fulfillment-overview-grid,
-  .task-flow-grid {
-    grid-template-columns: 1fr;
-  }
-
-  .users-action-form .ant-form-item {
-    margin-bottom: 0;
-  }
-
-  .metric-grid.three,
-  .metric-grid.four,
-  .metric-grid.five,
-  .platform-form-grid,
-  .platform-routing-grid,
-  .platform-route-rule-grid,
-  .platform-split-layout {
-    grid-template-columns: 1fr;
-  }
-
-  .platform-routing-priority-row,
-  .platform-route-rule-head {
-    display: grid;
-  }
-
-  .platform-side-card {
-    position: static;
-  }
-
-  .platform-inline-row,
-  .platform-shop-row,
-  .platform-rule-head,
-  .platform-delivery-row {
-    grid-template-columns: 1fr;
-  }
-
-  .cloud-records-filter {
-    grid-template-columns: 1fr;
-  }
-
-  .table-toolbar {
-    display: grid;
-  }
-
-  .worker-hall-toolbar {
-    width: 100%;
-    justify-content: flex-start;
-  }
-
-  .worker-hall-search {
-    width: 100%;
-  }
-
-  .worker-hall-summary-strip {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-
-  .worker-hall-card-grid {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-}
-
-@media (max-width: 720px) {
-  .users-action-card .ant-card-body {
-    padding: 14px;
-  }
-
-  .users-action-form,
-  .users-action-form .ant-form-item,
-  .users-action-form .ant-input-affix-wrapper,
-  .users-action-form .ant-input,
-  .users-action-form .ant-select,
-  .users-action-form .ant-space,
-  .users-action-form .ant-btn {
-    width: 100%;
-  }
-}
-
-@media (max-width: 720px) {
-  .claim-page {
-    padding: 14px;
-  }
-
-  .claim-header-card .ant-card-body,
-  .claim-content-card .ant-card-body {
-    gap: 14px;
-  }
-
-  .claim-header-copy {
-    padding-right: 150px;
-  }
-
-  .claim-header-copy h1 {
-    font-size: 24px;
-    line-height: 1.22;
-  }
-
-  .claim-header-copy p {
-    font-size: 14px;
-    line-height: 1.4;
-  }
-
-  .claim-step-indicator {
-    top: 16px;
-    right: 16px;
-    max-width: 140px;
-  }
-
-  .claim-step-dots {
-    gap: 5px;
-  }
-
-  .claim-step-dot {
-    width: 26px;
-    height: 26px;
-    font-size: 13px;
-  }
-
-  .claim-step-progress-text {
-    font-size: 12px;
-  }
-
-  .claim-info-grid {
-    grid-template-columns: 1fr;
-  }
-
-  .claim-qr-block {
-    padding: 12px;
-  }
-
-  .claim-qr-guide-panel {
-    grid-template-columns: 34px minmax(0, 1fr) 34px;
-    gap: 8px;
-    max-width: 100%;
-  }
-
-  .claim-scan-label {
-    min-height: 128px;
-    padding: 8px 4px;
-    font-size: 14px;
-  }
-
-  .claim-qr-code {
-    max-width: 232px;
-    padding: 8px;
-  }
-
-  .claim-save-hint {
-    font-size: 13px;
-  }
-
-  .claim-role-panel-item {
-    grid-template-columns: 76px minmax(0, 1fr);
-    gap: 10px;
-  }
-
-  .claim-role-panel-item span {
-    font-size: 12px;
-  }
-
-  .claim-role-panel-item strong {
-    font-size: 16px;
-  }
-
-  .claim-action-row {
-    display: flex;
-    flex-direction: column;
-    align-items: stretch;
-  }
-
-  .claim-action-row .ant-space-item,
-  .claim-action-row .ant-btn,
-  .claim-action-tooltip-wrap {
-    width: 100%;
-  }
-
-  .claim-meta-footer {
-    justify-content: flex-start;
-  }
-
-  .claim-result-header {
-    display: grid;
-  }
-}
-
-@media (max-width: 520px) {
-  .kuaishou-industry-selected-meta,
-  .kuaishou-industry-tool-grid,
-  .kuaishou-industry-actions {
-    grid-template-columns: 1fr;
-  }
-
-  .kuaishou-industry-tool-field-wide,
-  .kuaishou-industry-actions > :last-child {
-    grid-column: auto;
-  }
-}
-
-@media (max-width: 420px) {
-  .claim-header-copy {
-    padding-right: 124px;
-  }
-
-  .claim-header-copy h1 {
-    font-size: 22px;
-  }
-
-  .claim-header-copy p {
-    padding-right: 0;
-  }
-
-  .claim-step-indicator {
-    max-width: 116px;
-  }
-}
-
-.dev-mock-pre {
-  margin: 0;
-  padding: 12px 14px;
-  overflow: auto;
-  max-height: 360px;
-  border-radius: 8px;
-  background: #0f172a;
-  color: #e2e8f0;
-  font-size: 12px;
-  line-height: 1.5;
-}
-
-.worker-auth-page,
-.collect-page {
-  min-height: 100vh;
-  display: grid;
-  place-items: center;
-  padding: 32px 16px;
-  background: #f5f7fb;
-}
-
-.collect-card {
-  width: min(520px, 100%);
-}
-
-.worker-page-head {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 16px;
-}
-
-.worker-page-head h3 {
-  margin: 0;
-}
-
-.worker-order-summary-card {
-  cursor: pointer;
-  transition:
-    border-color 0.2s ease,
-    box-shadow 0.2s ease;
-}
-
-.worker-order-summary-card.active {
-  border-color: var(--theme-primary);
-  box-shadow: 0 0 0 1px var(--theme-primary) inset;
-}
-
-.worker-order-summary-card .ant-statistic-title {
-  font-size: 12px;
-}
-
-.worker-order-tab-count {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-width: 18px;
-  height: 18px;
-  padding: 0 5px;
-  margin-left: 6px;
-  border-radius: 9px;
-  background: #f0f0f0;
-  color: #595959;
-  font-size: 12px;
-  line-height: 18px;
-}
-
-.worker-order-tabs .ant-tabs-nav {
-  margin-bottom: 12px;
-}
-
-.worker-profile-wallet-card .ant-card-body {
-  padding: 0;
-}
-
-.worker-profile-wallet-strip {
-  display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-  gap: 0;
-  overflow: hidden;
-}
-
-.worker-profile-wallet-item {
-  min-width: 0;
-  padding: 14px 16px;
-  display: grid;
-  gap: 4px;
-}
-
-.worker-profile-wallet-item + .worker-profile-wallet-item {
-  border-left: 1px solid #f0f0f0;
-}
-
-.worker-profile-wallet-label {
-  color: #64748b;
-  font-size: 12px;
-}
-
-.worker-profile-wallet-value {
-  color: #0f172a;
-  font-size: 20px;
-  line-height: 1.2;
-}
-
-.worker-profile-wallet-note {
-  color: #94a3b8;
-  font-size: 12px;
-  line-height: 1.5;
-}
-
-@media (max-width: 768px) {
-  .worker-profile-wallet-strip {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-  .worker-profile-wallet-item:nth-child(3) {
-    border-left: 0;
-    border-top: 1px solid #f0f0f0;
-  }
-  .worker-profile-wallet-item:nth-child(4) {
-    border-top: 1px solid #f0f0f0;
-  }
-}
-
-.worker-hall-head-copy {
-  display: grid;
-  gap: 4px;
-}
-
-.worker-hall-head-copy .ant-typography {
-  margin: 0;
-}
-
-.worker-hall-toolbar {
-  justify-content: flex-end;
-}
-
-.worker-hall-search {
-  width: min(460px, 100%);
-}
-
-.worker-hall-board-card .ant-card-body {
-  display: grid;
-  gap: 16px;
-}
-
-.worker-hall-summary-strip {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 0;
-  border: 1px solid #e5e7eb;
-  border-radius: 12px;
-  overflow: hidden;
-  background: #ffffff;
-}
-
-.worker-hall-summary-item {
-  min-width: 0;
-  padding: 14px 16px;
-  display: grid;
-  gap: 4px;
-}
-
-.worker-hall-summary-item + .worker-hall-summary-item {
-  border-left: 1px solid #e5e7eb;
-}
-
-.worker-hall-summary-label {
-  color: #64748b;
-  font-size: 12px;
-}
-
-.worker-hall-summary-value {
-  color: #0f172a;
-  font-size: 22px;
-  line-height: 1.15;
-}
-
-.worker-hall-summary-note {
-  color: #94a3b8;
-  font-size: 12px;
-  line-height: 1.5;
-}
-
-.worker-hall-warning {
-  margin-bottom: 0;
-}
-
-.worker-hall-loading {
-  min-height: 220px;
-  display: grid;
-  place-items: center;
-}
-
-.worker-hall-card-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
-  gap: 16px;
-}
-
-.worker-hall-card {
-  min-width: 0;
-  padding: 16px;
-  border-radius: 14px;
-  background: #ffffff;
-  border: 1px solid #e5e7eb;
-  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
-  display: grid;
-  gap: 12px;
-}
-
-.worker-hall-card-title {
-  display: grid;
-  gap: 4px;
-  min-width: 0;
-}
-
-.worker-hall-card-title .ant-typography {
-  margin: 0;
-}
-
-.worker-hall-card-link,
-.worker-hall-card-title-text {
-  display: block;
-  max-width: 100%;
-  font-weight: 600;
-  color: #0f172a;
-  font-size: 15px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.worker-hall-card-amount-row {
-  display: grid;
-  gap: 6px;
-}
-
-.worker-hall-card-amount {
-  color: #f97316;
-  font-size: 32px;
-  line-height: 1;
-  font-weight: 700;
-}
-
-.worker-hall-card-deposit,
-.worker-hall-card-hint {
-  margin: 0;
-  font-size: 12px;
-  line-height: 1.5;
-}
-
-.worker-hall-card-actions {
-  display: grid;
-  gap: 8px;
-  margin-top: auto;
-}
-
-.worker-hall-card-actions-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 8px;
-}
-
-.worker-hall-card-actions-row .ant-btn {
-  padding-inline: 8px;
-}
-
-.worker-hall-card-grab-row {
-  display: flex;
-  gap: 8px;
-}
-
-.worker-hall-card-grab-row .ant-btn {
-  flex: 1;
-  min-width: 0;
-}
-
-.worker-hall-sharing-button:not(:disabled) {
-  background: linear-gradient(135deg, #8b5cf6, #7c3aed) !important;
-  border-color: #7c3aed !important;
-  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.28) !important;
-}
-
-.worker-hall-sharing-button:not(:disabled):hover {
-  background: linear-gradient(135deg, #7c3aed, #6d28d9) !important;
-  border-color: #6d28d9 !important;
-}
-
-.worker-hall-detail-stack {
-  display: grid;
-  gap: 16px;
-}
-
-.worker-amount-positive {
-  color: #047857;
-}
-
-.worker-amount-negative {
-  color: #dc2626;
-}
-
-.worker-profile-help-text {
-  margin: 0;
-  color: #64748b;
-}
-
-.collect-order-input {
-  flex: 1;
-  margin-bottom: 0;
-}
-
-.image-upload-trigger {
-  width: 100%;
-  height: 100%;
-  min-height: 72px;
-  border: 0;
-  background: transparent;
-  color: #64748b;
-  display: grid;
-  place-items: center;
-  gap: 4px;
-  cursor: pointer;
-}
-
-.image-upload-trigger span {
-  font-size: 12px;
-}
-
-.image-upload-droppable {
-  display: grid;
-  gap: 8px;
-  justify-items: start;
-}
-
-.image-upload-hint {
-  font-size: 12px;
-  line-height: 1.5;
-}
-
-.image-preview-list {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 6px;
-  align-items: center;
-}
-
-.image-preview-item {
-  object-fit: cover;
-  border-radius: 6px;
-  border: 1px solid #e5e7eb;
-  background: #f8fafc;
-}
-
-.image-preview-more {
-  font-size: 12px;
-  white-space: nowrap;
-}
-
-.worker-rule-form {
-  width: 100%;
-}
-
-/* 物品规则：3:7 比例响应式双栏 (左侧 30% + 右侧 70%) */
-.product-rules-layout {
-  display: flex;
-  gap: 16px;
-  align-items: flex-start;
-  width: 100%;
-}
-
-.product-rules-form-card {
-  flex: 0 0 calc(30% - 8px);
-  width: calc(30% - 8px);
-  min-width: 360px;
-  border-radius: 8px;
-}
-
-/* 左侧表单彻底消除滚动条，紧凑舒适排版 */
-.product-rules-form-card .ant-card-body {
-  padding: 12px 14px;
-  overflow: visible;
-}
-
-.worker-rule-form-30 .rule-form-grid-2col {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  gap: 0 10px;
-}
-
-.worker-rule-form-30 .rule-form-grid-2col .span-2 {
-  grid-column: span 2;
-}
-
-.worker-rule-form-30 .ant-form-item {
-  margin-bottom: 7px;
-}
-
-.worker-rule-form-30 .ant-form-item-label {
-  padding-bottom: 1px;
-}
-
-.worker-rule-form-30 .ant-form-item-label > label {
-  font-size: 12px;
-  color: #374151;
-  font-weight: 500;
-}
-
-.worker-rule-form-30 .form-switches-strip {
-  display: flex;
-  align-items: center;
-  gap: 16px;
-  background: #f9fafb;
-  padding: 5px 10px;
-  border-radius: 6px;
-  margin-top: 3px;
-  margin-bottom: 7px;
-}
-
-.worker-rule-form-30 .form-switches-strip .ant-form-item {
-  margin-bottom: 0;
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.worker-rule-form-30 .sharing-box-inline {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  gap: 8px;
-  background: #f8fafc;
-  border: 1px dashed #cbd5e1;
-  padding: 6px 8px;
-  border-radius: 6px;
-  margin-bottom: 7px;
-}
-
-.worker-rule-form-30 .sharing-box-inline .ant-form-item {
-  margin-bottom: 0;
-}
-
-.product-rules-list-card {
-  flex: 0 0 calc(70% - 8px);
-  width: calc(70% - 8px);
-  min-width: 0;
-  border-radius: 8px;
-}
-
-.product-rules-list-card .ant-card-body {
-  padding: 12px 16px;
-}
-
-.product-rules-category-tabs-bar {
-  margin-bottom: 10px;
-  border-bottom: 1px solid #f0f0f0;
-}
-
-.product-rules-category-tabs-bar .ant-tabs-nav {
-  margin: 0;
-}
-
-.product-rule-row-active > td {
-  background: #e6f4ff !important;
-}
-
-@media (max-width: 1080px) {
-  .product-rules-layout {
-    flex-direction: column;
-  }
-
-  .product-rules-form-card,
-  .product-rules-list-card {
-    flex: 1 1 100%;
-    width: 100%;
-  }
-}
-
-@media (max-width: 720px) {
-  .worker-page-head {
-    align-items: stretch;
-    flex-direction: column;
-  }
-
-  .worker-hall-toolbar {
-    align-items: stretch;
-    flex-direction: column;
-  }
-
-  .worker-hall-search {
-    width: 100%;
-  }
-
-  .worker-hall-card-grid {
-    grid-template-columns: 1fr;
-  }
-
-  .worker-hall-card {
-    padding: 16px;
-  }
-
-  .worker-hall-card-actions-row {
-    align-items: stretch;
-    flex-direction: column;
-  }
-
-  .worker-hall-card-grab-row {
-    flex-direction: column;
-  }
-}
-
-@media (max-width: 480px) {
-  .worker-hall-summary-strip {
-    grid-template-columns: 1fr;
-  }
-
-  .worker-hall-summary-item + .worker-hall-summary-item {
-    border-top: 1px solid #e5e7eb;
-    border-left: 0;
-  }
-}
-
-/* ==========================================================================
-   打手端 (Worker Portal) 移动端专属响应式自适应样式
-   ========================================================================== */
-
-html,
-body {
-  overflow-x: hidden;
-  max-width: 100vw;
-}
-
-.worker-mobile-shell {
-  width: 100%;
-  max-width: 100vw;
-  min-height: 100vh;
-  overflow-x: hidden;
-  display: flex;
-  flex-direction: column;
-  background: #f1f5f9;
-  position: relative;
-}
-
-.worker-mobile-header {
-  position: sticky;
-  top: 0;
-  z-index: 100;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 8px 12px;
-  background: #ffffff;
-  border-bottom: 1px solid #e2e8f0;
-  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
-}
-
-.worker-mobile-brand {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.worker-mobile-brand-badge {
-  width: 26px;
-  height: 26px;
-  background: var(--theme-primary);
-  color: #ffffff;
-  border-radius: 6px;
-  display: grid;
-  place-items: center;
-  font-weight: 700;
-  font-size: 13px;
-  box-shadow: 0 2px 6px rgba(255, 106, 0, 0.28);
-}
-
-.worker-mobile-brand-text strong {
-  font-size: 15px;
-  color: #0f172a;
-}
-
-.worker-mobile-user-area {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.worker-mobile-status-tag {
-  margin: 0;
-  font-size: 11px;
-}
-
-.worker-mobile-username {
-  font-size: 13px;
-  font-weight: 500;
-  color: #334155;
-  max-width: 90px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.worker-mobile-logout-btn {
-  color: #94a3b8;
-  padding: 4px;
-}
-
-.worker-mobile-content {
-  flex: 1;
-  min-height: 0;
-  width: 100%;
-  max-width: 100vw;
-  box-sizing: border-box;
-  padding: 10px 10px calc(65px + env(safe-area-inset-bottom, 0px)) 10px;
-}
-
-.worker-mobile-content .ant-card {
-  border-radius: 12px;
-}
-
-.worker-mobile-content .ant-card .ant-card-body {
-  padding: 12px;
-}
-
-.worker-mobile-tabbar {
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  width: 100%;
-  max-width: 100vw;
-  height: calc(54px + env(safe-area-inset-bottom, 0px));
-  box-sizing: border-box;
-  z-index: 999;
-  display: flex;
-  align-items: stretch;
-  justify-content: space-around;
-  background: #ffffff;
-  border-top: 1px solid #e2e8f0;
-  padding-bottom: env(safe-area-inset-bottom, 0px);
-  box-shadow: 0 -2px 10px rgba(15, 23, 42, 0.06);
-}
-
-.worker-mobile-tab-item {
-  flex: 1 1 0;
-  width: 33.333%;
-  border: none;
-  background: transparent;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 2px;
-  cursor: pointer;
-  color: #64748b;
-  font-size: 11px;
-  padding: 4px 0;
-  -webkit-tap-highlight-color: transparent;
-  transition: color 0.15s ease;
-}
-
-.worker-mobile-tab-item.active {
-  color: var(--theme-primary);
-  font-weight: 600;
-}
-
-.worker-mobile-tab-icon {
-  font-size: 18px;
-  line-height: 1;
-}
-
-.worker-mobile-tab-label {
-  font-size: 11px;
-  line-height: 1;
-}
-
-/* ==========================================================================
-   移动端 我的订单 (Worker Orders Mobile Page)
-   ========================================================================== */
-
-.worker-orders-mobile-page {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-  width: 100%;
-  max-width: 100%;
-  box-sizing: border-box;
-}
-
-/* 顶部滑动状态胶囊栏 */
-.worker-orders-mobile-status-bar {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  overflow-x: auto;
-  padding: 2px 2px 6px 2px;
-  -webkit-overflow-scrolling: touch;
-  scrollbar-width: none;
-}
-
-.worker-orders-mobile-status-bar::-webkit-scrollbar {
-  display: none;
-}
-
-.worker-orders-status-pill {
-  flex-shrink: 0;
-  border: 1px solid #e2e8f0;
-  background: #ffffff;
-  color: #475569;
-  padding: 5px 12px;
-  border-radius: 999px;
-  font-size: 12px;
-  font-weight: 500;
-  cursor: pointer;
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-  -webkit-tap-highlight-color: transparent;
-  transition: all 0.15s ease;
-}
-
-.worker-orders-status-pill.active {
-  background: var(--theme-primary);
-  color: #ffffff;
-  border-color: var(--theme-primary);
-  box-shadow: 0 2px 6px rgba(255, 106, 0, 0.25);
-}
-
-.worker-orders-status-pill-count {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-width: 16px;
-  height: 16px;
-  padding: 0 4px;
-  border-radius: 8px;
-  font-size: 10px;
-  font-weight: 700;
-  background: #f1f5f9;
-  color: #475569;
-}
-
-.worker-orders-status-pill.active .worker-orders-status-pill-count {
-  background: rgba(255, 255, 255, 0.28);
-  color: #ffffff;
-}
-
-/* 搜索与快捷刷新栏 */
-.worker-orders-mobile-search-row {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  width: 100%;
-}
-
-.worker-orders-mobile-search-input {
-  flex: 1;
-}
-
-/* 订单卡片列表 */
-.worker-orders-mobile-list {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-  width: 100%;
-}
-
-.worker-order-mobile-card {
-  background: #ffffff;
-  border: 1px solid #e2e8f0;
-  border-radius: 12px;
-  padding: 12px 14px;
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
-}
-
-/* 头部：分类 + 订单号 + 状态 */
-.worker-order-mobile-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 8px;
-  padding-bottom: 6px;
-  border-bottom: 1px solid #f1f5f9;
-}
-
-.worker-order-mobile-header-left {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  min-width: 0;
-  flex: 1;
-}
-
-.worker-order-mobile-tag {
-  margin: 0;
-  font-size: 11px;
-  padding: 0 6px;
-  line-height: 18px;
-}
-
-.worker-order-mobile-orderno-text {
-  font-size: 12px;
-  color: #64748b;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.worker-order-mobile-header-right {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  flex-shrink: 0;
-}
-
-.worker-order-mobile-header-right .ant-tag {
-  margin: 0;
-}
-
-/* 商品名称与奖励 */
-.worker-order-mobile-main-row {
-  display: flex;
-  align-items: flex-start;
-  justify-content: space-between;
-  gap: 10px;
-}
-
-.worker-order-mobile-product-title {
-  font-size: 15px;
-  font-weight: 700;
-  color: #0f172a;
-  line-height: 1.35;
-  flex: 1;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-
-.worker-order-mobile-price-badge {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-end;
-  flex-shrink: 0;
-  line-height: 1;
-}
-
-.worker-order-mobile-price-label {
-  font-size: 10px;
-  color: #9a3412;
-  margin-bottom: 2px;
-}
-
-.worker-order-mobile-price-num {
-  font-size: 18px;
-  color: #ea580c;
-  font-weight: 800;
-}
-
-/* 辅助信息行 */
-.worker-order-mobile-sub-row {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 8px;
-  font-size: 11px;
-  color: #64748b;
-}
-
-.worker-order-mobile-sub-item {
-  display: inline-flex;
-}
-
-.worker-order-mobile-sub-time {
-  margin-left: auto;
-  color: #94a3b8;
-}
-
-/* 问题单提示 */
-.worker-order-mobile-problem-box {
-  background: #fef2f2;
-  border: 1px solid #fecaca;
-  border-radius: 6px;
-  padding: 6px 10px;
-  font-size: 12px;
-  color: #b91c1c;
-  line-height: 1.4;
-}
-
-/* 资料凭据区 */
-.worker-order-mobile-credentials-box {
-  background: #f8fafc;
-  border: 1px solid #e2e8f0;
-  border-radius: 8px;
-  padding: 8px 10px;
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-
-.worker-order-mobile-credentials-grid {
-  display: grid;
-  gap: 3px;
-  font-size: 12px;
-}
-
-.worker-order-mobile-credential-line {
-  display: flex;
-  align-items: baseline;
-  gap: 6px;
-  line-height: 1.4;
-}
-
-.worker-order-mobile-credential-label {
-  color: #64748b;
-  font-size: 12px;
-  flex-shrink: 0;
-}
-
-.worker-order-mobile-credential-val {
-  color: #1e293b;
-  font-weight: 600;
-  word-break: break-all;
-}
-
-.worker-order-mobile-screenshots-row {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  margin-top: 2px;
-}
-
-.worker-order-mobile-copy-toolbar {
-  display: flex;
-  gap: 6px;
-  margin-top: 4px;
-  border-top: 1px dashed #e2e8f0;
-  padding-top: 6px;
-}
-
-/* 验收凭据条 */
-.worker-order-mobile-acceptance-strip {
-  background: #f0fdf4;
-  border: 1px solid #bbf7d0;
-  border-radius: 8px;
-  padding: 6px 10px;
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  font-size: 12px;
-}
-
-.worker-order-mobile-acceptance-files,
-.worker-order-mobile-draft-files {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.worker-order-mobile-acceptance-tag {
-  color: #15803d;
-  font-size: 11px;
-  font-weight: 600;
-}
-
-.worker-order-mobile-acceptance-text {
-  color: #374151;
-  font-size: 11px;
-}
-
-/* 底部操作行 */
-.worker-order-mobile-footer-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 8px;
-  padding-top: 6px;
-  border-top: 1px solid #f1f5f9;
-}
-
-.worker-order-mobile-note-block {
-  min-width: 0;
-  flex: 1;
-}
-
-.worker-order-mobile-add-note-btn {
-  border: 1px dashed #cbd5e1;
-  background: transparent;
-  color: #64748b;
-  font-size: 12px;
-  padding: 3px 8px;
-  border-radius: 6px;
-  cursor: pointer;
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-}
-
-.worker-order-mobile-btn-group {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  flex-shrink: 0;
-}
-
-.worker-order-mobile-action-submit {
-  font-weight: 600;
-}
-
-.worker-orders-mobile-pagination {
-  display: flex;
-  justify-content: center;
-  padding: 10px 0 6px 0;
-}
-
-/* 移动端接单大厅顶部控制栏 */
-.worker-page-head-title-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 8px;
-  width: 100%;
-}
-
-.worker-page-head-title-row h3 {
-  margin: 0;
-}
-
-.worker-hall-head-controls {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.worker-hall-autorefresh-box {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-  padding: 4px 8px;
-  background: #f1f5f9;
-  border-radius: 6px;
-  font-size: 12px;
-  color: #475569;
-}
-
-.worker-hall-autorefresh-label {
-  font-size: 12px;
-  white-space: nowrap;
-}
-
-.worker-hall-search-bar {
-  width: 100%;
-}
-
-/* 移动端个人中心资金明细/申请记录卡片 */
-.worker-profile-mobile-records {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  width: 100%;
-}
-
-.worker-profile-record-card {
-  background: #ffffff;
-  border: 1px solid #e2e8f0;
-  border-radius: 10px;
-  padding: 10px 12px;
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  font-size: 12px;
-}
-
-.worker-profile-record-row-head {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-
-.worker-profile-record-row-meta {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 12px;
-  color: #64748b;
-  font-size: 12px;
-}
-
-.worker-profile-record-note {
-  color: #334155;
-  font-size: 12px;
-  background: #f8fafc;
-  padding: 4px 8px;
-  border-radius: 4px;
-}
-
-.worker-profile-record-sub {
-  color: #64748b;
-  font-size: 11px;
-}
-
-.worker-profile-record-time {
-  color: #94a3b8;
-  font-size: 11px;
-  margin-top: 2px;
-}
-
-/* ==========================================================================
-   移动端 个人中心 (Worker Profile Mobile Page)
-   ========================================================================== */
-
-.worker-profile-mobile-page {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-  width: 100%;
-  box-sizing: border-box;
-}
-
-/* 顶部沉浸式个人卡片（明亮温润风格） */
-.worker-profile-mobile-hero {
-  background: #ffffff;
-  border: 1px solid #e2e8f0;
-  border-radius: 14px;
-  padding: 14px;
-  color: #0f172a;
-  box-shadow: 0 1px 6px rgba(15, 23, 42, 0.04);
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-}
-
-.worker-profile-mobile-user-row {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  position: relative;
-}
-
-.worker-profile-mobile-avatar {
-  background: linear-gradient(135deg, #ff8c00, #ea580c);
-  color: #ffffff;
-  font-weight: 700;
-  font-size: 20px;
-  box-shadow: 0 2px 8px rgba(234, 88, 12, 0.25);
-  flex-shrink: 0;
-}
-
-.worker-profile-mobile-user-info {
-  display: flex;
-  flex-direction: column;
-  gap: 3px;
-  min-width: 0;
-  flex: 1;
-}
-
-.worker-profile-mobile-name-row {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.worker-profile-mobile-name {
-  font-size: 17px;
-  font-weight: 700;
-  color: #0f172a;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.worker-profile-mobile-tags-row {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  flex-wrap: wrap;
-}
-
-.worker-profile-mobile-vip-badge {
-  display: inline-flex;
-  align-items: center;
-  padding: 1px 6px;
-  background: linear-gradient(135deg, #fef08a, #facc15);
-  color: #854d0e;
-  border-radius: 4px;
-  font-size: 10px;
-  font-weight: 700;
-  line-height: 14px;
-}
-
-.worker-profile-mobile-tag {
-  margin: 0;
-  font-size: 10px;
-  padding: 0 4px;
-  line-height: 16px;
-}
-
-.worker-profile-mobile-account-text {
-  font-size: 11px;
-  color: #64748b;
-}
-
-.worker-profile-mobile-refresh-btn {
-  color: #64748b;
-  background: #f1f5f9;
-  border: none;
-  width: 28px;
-  height: 28px;
-  display: grid;
-  place-items: center;
-  flex-shrink: 0;
-}
-
-.worker-profile-mobile-refresh-btn:hover,
-.worker-profile-mobile-refresh-btn:focus {
-  color: var(--theme-primary);
-  background: #e2e8f0;
-}
-
-.worker-profile-mobile-hero-bottom {
-  border-top: 1px solid #f1f5f9;
-  padding-top: 8px;
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-
-.worker-profile-mobile-invite-bar {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-size: 12px;
-  background: #fff7ed;
-  border: 1px solid #ffedd5;
-  border-radius: 6px;
-  padding: 4px 8px;
-}
-
-.worker-profile-mobile-invite-label {
-  color: #9a3412;
-  font-size: 11px;
-}
-
-.worker-profile-mobile-invite-code {
-  color: #ea580c;
-  letter-spacing: 0.5px;
-  font-weight: 700;
-  font-size: 13px;
-}
-
-.worker-profile-mobile-copy-btn {
-  border: 1px solid #fdba74;
-  background: #ffffff;
-  color: #ea580c;
-  border-radius: 4px;
-  padding: 1px 6px;
-  font-size: 11px;
-  cursor: pointer;
-  display: inline-flex;
-  align-items: center;
-  gap: 2px;
-  margin-left: auto;
-}
-
-.worker-profile-mobile-level-box {
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-}
-
-.worker-profile-mobile-level-text {
-  font-size: 11px;
-  color: #64748b;
-}
-
-/* 资产钱包卡片 */
-.worker-profile-mobile-wallet-card {
-  background: #ffffff;
-  border: 1px solid #e2e8f0;
-  border-radius: 14px;
-  padding: 14px;
-  box-shadow: 0 1px 6px rgba(15, 23, 42, 0.04);
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-}
-
-.worker-profile-mobile-wallet-top {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 8px;
-}
-
-.worker-profile-mobile-wallet-main {
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-}
-
-.worker-profile-mobile-wallet-title {
-  font-size: 11px;
-  color: #64748b;
-}
-
-.worker-profile-mobile-wallet-amount {
-  font-size: 24px;
-  font-weight: 800;
-  color: #ea580c;
-  line-height: 1;
-}
-
-.worker-profile-mobile-wallet-actions {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.worker-profile-mobile-recharge-btn {
-  font-weight: 600;
-}
-
-.worker-profile-mobile-withdraw-btn {
-  font-weight: 600;
-}
-
-.worker-profile-mobile-wallet-grid {
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-  gap: 4px;
-  border-top: 1px solid #f1f5f9;
-  padding-top: 10px;
-  text-align: center;
-}
-
-.worker-profile-mobile-wallet-col {
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-  padding: 0 4px;
-}
-
-.worker-profile-mobile-wallet-col + .worker-profile-mobile-wallet-col {
-  border-left: 1px solid #f1f5f9;
-}
-
-.worker-profile-mobile-sub-label {
-  font-size: 11px;
-  color: #64748b;
-}
-
-.worker-profile-mobile-sub-val {
-  font-size: 14px;
-  font-weight: 700;
-  color: #1e293b;
-}
-
-/* 快捷操作宫格 */
-.worker-profile-mobile-tools-card {
-  background: #ffffff;
-  border: 1px solid #e2e8f0;
-  border-radius: 14px;
-  padding: 12px 8px;
-  box-shadow: 0 1px 6px rgba(15, 23, 42, 0.04);
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 4px;
-}
-
-.worker-profile-mobile-tool-item {
-  border: none;
-  background: transparent;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 6px;
-  cursor: pointer;
-  padding: 6px 2px;
-  border-radius: 8px;
-  transition: background 0.15s ease;
-  -webkit-tap-highlight-color: transparent;
-}
-
-.worker-profile-mobile-tool-item:active {
-  background: #f8fafc;
-  transform: scale(0.96);
-}
-
-.worker-profile-mobile-tool-icon {
-  width: 38px;
-  height: 38px;
-  border-radius: 10px;
-  display: grid;
-  place-items: center;
-  font-size: 18px;
-}
-
-.worker-profile-mobile-tool-item span {
-  font-size: 11px;
-  color: #334155;
-  font-weight: 500;
-  white-space: nowrap;
-}
-
-/* 记录与明细分段滑动卡片 */
-.worker-profile-mobile-sections-card {
-  background: #ffffff;
-  border: 1px solid #e2e8f0;
-  border-radius: 14px;
-  box-shadow: 0 1px 6px rgba(15, 23, 42, 0.04);
-  overflow: hidden;
-  display: flex;
-  flex-direction: column;
-}
-
-.worker-profile-mobile-tab-nav {
-  display: flex;
-  border-bottom: 1px solid #e2e8f0;
-  background: #f8fafc;
-}
-
-.worker-profile-mobile-tab-btn {
-  flex: 1;
-  border: none;
-  background: transparent;
-  padding: 10px 0;
-  font-size: 13px;
-  font-weight: 500;
-  color: #64748b;
-  cursor: pointer;
-  position: relative;
-  transition: all 0.15s ease;
-}
-
-.worker-profile-mobile-tab-btn.active {
-  color: var(--theme-primary);
-  font-weight: 700;
-  background: #ffffff;
-}
-
-.worker-profile-mobile-tab-btn.active::after {
-  content: '';
-  position: absolute;
-  bottom: 0;
-  left: 20%;
-  right: 20%;
-  height: 2px;
-  background: var(--theme-primary);
-  border-radius: 2px;
-}
-
-.worker-profile-mobile-tab-body {
-  padding: 12px;
-}
-
-.worker-profile-mobile-filter-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 8px;
-  margin-bottom: 10px;
-}
-
-/* 账号详情列表 */
-.worker-profile-mobile-account-list {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-}
-
-.worker-profile-mobile-account-item {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 6px 0;
-  border-bottom: 1px solid #f1f5f9;
-  font-size: 12px;
-}
-
-.worker-profile-mobile-acc-label {
-  color: #64748b;
-}
-
-.worker-profile-mobile-acc-val {
-  color: #0f172a;
-  font-weight: 500;
-}
-
-
-
+/**
+ * 主样式汇总入口 (Main CSS Entrypoint)
+ * 按业务模块拆分，便于维护与多人协作开发：
+ * 1. base.css   - 全局主题变量、基础排版、重置、通用工具类
+ * 2. admin.css  - 后台管理端 (Admin Portal & Login)
+ * 3. client.css - 买家前台提卡与聚合页 (Buyer Claim & Collect)
+ * 4. worker.css - 打手接单端 PC 与移动端 (Worker Portal & Mobile)
+ */
+
+@import './base.css';
+@import './admin.css';
+@import './client.css';
+@import './worker.css';
diff --git a/apps/frontend/src/styles/worker.css b/apps/frontend/src/styles/worker.css
new file mode 100644
index 00000000..cf3c1e1d
--- /dev/null
+++ b/apps/frontend/src/styles/worker.css
@@ -0,0 +1,1686 @@
+/* ==========================================================================
+   打手端 (Worker Portal) PC 与移动端全套样式
+   ========================================================================== */
+
+/* ===== 登录与基础头部 ===== */
+
+.worker-auth-page {
+  min-height: 100vh;
+  display: grid;
+  place-items: center;
+  padding: 32px 16px;
+  background: #f5f7fb;
+}
+
+.worker-page-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+}
+
+.worker-page-head h3 {
+  margin: 0;
+}
+
+.worker-page-head-title-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+}
+
+.worker-hall-head-controls {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.worker-hall-autorefresh-box {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  background: #f1f5f9;
+  padding: 4px 10px;
+  border-radius: 6px;
+  font-size: 12px;
+  color: #475569;
+}
+
+.worker-hall-autorefresh-label {
+  font-size: 12px;
+  white-space: nowrap;
+}
+
+.worker-hall-search-bar {
+  width: 100%;
+}
+
+/* ===== 我的订单统计与 Tabs (PC端) ===== */
+
+.worker-orders-toolbar {
+  display: flex;
+  align-items: center;
+  gap: 24px;
+  min-width: 0;
+}
+
+.worker-orders-search-controls {
+  flex: 0 0 auto;
+}
+
+.worker-orders-mock {
+  flex: 1;
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding-left: 24px;
+  border-left: 1px solid #edf0f5;
+}
+
+.worker-orders-mock > .ant-typography {
+  flex: 0 0 auto;
+  white-space: nowrap;
+}
+
+.worker-order-mock-form {
+  flex: 1;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px 12px;
+  min-width: 0;
+}
+
+.worker-order-mock-form .ant-form-item {
+  min-width: 0;
+  margin: 0;
+}
+
+.worker-order-mock-field-order .ant-input {
+  width: 150px;
+}
+
+.worker-order-mock-field-product .ant-input {
+  width: 190px;
+}
+
+.worker-order-mock-field-amount .ant-input-number {
+  width: 116px;
+}
+
+.worker-order-summary-card {
+  cursor: pointer;
+  transition:
+    border-color 0.2s ease,
+    box-shadow 0.2s ease;
+}
+
+.worker-order-summary-card.active {
+  border-color: var(--theme-primary);
+  box-shadow: 0 0 0 1px var(--theme-primary) inset;
+}
+
+.worker-order-summary-card .ant-statistic-title {
+  font-size: 12px;
+}
+
+.worker-order-tab-count {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 18px;
+  height: 18px;
+  padding: 0 5px;
+  margin-left: 6px;
+  border-radius: 9px;
+  background: #f0f0f0;
+  color: #595959;
+  font-size: 12px;
+  line-height: 18px;
+}
+
+.worker-order-tabs .ant-tabs-nav {
+  margin-bottom: 12px;
+}
+
+.worker-order-detail-stack {
+  display: grid;
+  gap: 16px;
+}
+
+.worker-order-actions {
+  display: grid;
+  justify-items: start;
+  gap: 4px;
+}
+
+.worker-order-actions .ant-btn-link {
+  height: auto;
+  padding: 0;
+}
+
+.worker-order-detail-value {
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  word-break: break-word;
+}
+
+.worker-order-detail-json-tabs > .ant-tabs-nav {
+  margin-bottom: 12px;
+}
+
+.acceptance-draft-badge-wrap {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 6px;
+}
+
+.acceptance-draft-badge-wrap .ant-tag {
+  margin-inline-end: 0;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.worker-note-cell {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  min-width: 0;
+}
+
+.worker-note-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  max-width: 100%;
+  padding: 3px 8px;
+  background: #f6f8fa;
+  border: 1px solid #d0d7de;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  font-size: 12px;
+  color: #24292f;
+}
+
+.worker-note-badge:hover {
+  background: #e6f4ff;
+  border-color: #91caff;
+  color: #0958d9;
+}
+
+.worker-note-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 110px;
+}
+
+.worker-note-edit-icon {
+  font-size: 12px;
+  color: #8c8c8c;
+  transition: color 0.2s;
+}
+
+.worker-note-badge:hover .worker-note-edit-icon {
+  color: #0958d9;
+}
+
+.worker-note-add-btn {
+  border-style: dashed;
+  color: #595959;
+  font-size: 12px;
+}
+
+.worker-note-preset-tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+.worker-note-preset-tag {
+  cursor: pointer;
+  user-select: none;
+  padding: 2px 10px;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+}
+
+.worker-note-preset-tag:hover {
+  border-color: #1677ff;
+  color: #1677ff;
+  background: #e6f4ff;
+}
+
+/* 接单平台顶部统计条 (PC) */
+.platform-summary-strip-card {
+  width: 100%;
+}
+
+.platform-summary-strip-card .ant-card-body {
+  padding: 8px 16px !important;
+}
+
+.platform-summary-strip-item {
+  font-size: 13px;
+  color: rgba(0, 0, 0, 0.65);
+  white-space: nowrap;
+}
+
+.platform-summary-strip-item strong {
+  font-size: 16px;
+  margin-left: 6px;
+  color: rgba(0, 0, 0, 0.88);
+}
+
+/* ===== 个人中心资产卡片 (PC端) ===== */
+
+.worker-profile-wallet-card .ant-card-body {
+  padding: 0;
+}
+
+.worker-profile-wallet-strip {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 0;
+  overflow: hidden;
+}
+
+.worker-profile-wallet-item {
+  min-width: 0;
+  padding: 14px 16px;
+  display: grid;
+  gap: 4px;
+}
+
+.worker-profile-wallet-item + .worker-profile-wallet-item {
+  border-left: 1px solid #f0f0f0;
+}
+
+.worker-profile-wallet-label {
+  color: #64748b;
+  font-size: 12px;
+}
+
+.worker-profile-wallet-value {
+  color: #0f172a;
+  font-size: 20px;
+  line-height: 1.2;
+}
+
+.worker-profile-wallet-note {
+  color: #94a3b8;
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+.worker-amount-positive {
+  color: #047857;
+}
+
+.worker-amount-negative {
+  color: #dc2626;
+}
+
+.worker-profile-help-text {
+  margin: 0;
+  color: #64748b;
+}
+
+/* ===== 抢单大厅 (PC端) ===== */
+
+.worker-hall-head-copy {
+  display: grid;
+  gap: 4px;
+}
+
+.worker-hall-head-copy .ant-typography {
+  margin: 0;
+}
+
+.worker-hall-toolbar {
+  justify-content: flex-end;
+}
+
+.worker-hall-search {
+  width: min(460px, 100%);
+}
+
+.worker-hall-board-card .ant-card-body {
+  display: grid;
+  gap: 16px;
+}
+
+.worker-hall-summary-strip {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 0;
+  border: 1px solid #e5e7eb;
+  border-radius: 12px;
+  overflow: hidden;
+  background: #ffffff;
+}
+
+.worker-hall-summary-item {
+  min-width: 0;
+  padding: 14px 16px;
+  display: grid;
+  gap: 4px;
+}
+
+.worker-hall-summary-item + .worker-hall-summary-item {
+  border-left: 1px solid #e5e7eb;
+}
+
+.worker-hall-summary-label {
+  color: #64748b;
+  font-size: 12px;
+}
+
+.worker-hall-summary-value {
+  color: #0f172a;
+  font-size: 22px;
+  line-height: 1.15;
+}
+
+.worker-hall-summary-note {
+  color: #94a3b8;
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+.worker-hall-warning {
+  margin-bottom: 0;
+}
+
+.worker-hall-loading {
+  min-height: 220px;
+  display: grid;
+  place-items: center;
+}
+
+.worker-hall-card-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
+  gap: 16px;
+}
+
+.worker-hall-card {
+  min-width: 0;
+  padding: 16px;
+  border-radius: 14px;
+  background: #ffffff;
+  border: 1px solid #e5e7eb;
+  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
+  display: grid;
+  gap: 12px;
+}
+
+.worker-hall-card-title {
+  display: grid;
+  gap: 4px;
+  min-width: 0;
+}
+
+.worker-hall-card-title .ant-typography {
+  margin: 0;
+}
+
+.worker-hall-card-link,
+.worker-hall-card-title-text {
+  display: block;
+  max-width: 100%;
+  font-weight: 600;
+  color: #0f172a;
+  font-size: 15px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.worker-hall-card-amount-row {
+  display: grid;
+  gap: 6px;
+}
+
+.worker-hall-card-amount {
+  color: #f97316;
+  font-size: 32px;
+  line-height: 1;
+  font-weight: 700;
+}
+
+.worker-hall-card-deposit,
+.worker-hall-card-hint {
+  margin: 0;
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+.worker-hall-card-actions {
+  display: grid;
+  gap: 8px;
+  margin-top: auto;
+}
+
+.worker-hall-card-actions-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.worker-hall-card-actions-row .ant-btn {
+  padding-inline: 8px;
+}
+
+.worker-hall-card-grab-row {
+  display: flex;
+  gap: 8px;
+}
+
+.worker-hall-card-grab-row .ant-btn {
+  flex: 1;
+  min-width: 0;
+}
+
+.worker-hall-sharing-button:not(:disabled) {
+  background: linear-gradient(135deg, #8b5cf6, #7c3aed) !important;
+  border-color: #7c3aed !important;
+  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.28) !important;
+}
+
+.worker-hall-sharing-button:not(:disabled):hover {
+  background: linear-gradient(135deg, #7c3aed, #6d28d9) !important;
+  border-color: #6d28d9 !important;
+}
+
+.worker-hall-detail-stack {
+  display: grid;
+  gap: 16px;
+}
+
+/* ==========================================================================
+   移动端专属响应式自适应样式 (Worker Mobile Portal)
+   ========================================================================== */
+
+html,
+body {
+  overflow-x: hidden;
+  max-width: 100vw;
+}
+
+.worker-mobile-shell {
+  width: 100%;
+  max-width: 100vw;
+  min-height: 100vh;
+  overflow-x: hidden;
+  display: flex;
+  flex-direction: column;
+  background: #f1f5f9;
+  position: relative;
+}
+
+.worker-mobile-header {
+  position: sticky;
+  top: 0;
+  z-index: 100;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 12px;
+  background: #ffffff;
+  border-bottom: 1px solid #e2e8f0;
+  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
+}
+
+.worker-mobile-brand {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.worker-mobile-brand-badge {
+  width: 26px;
+  height: 26px;
+  background: var(--theme-primary);
+  color: #ffffff;
+  border-radius: 6px;
+  display: grid;
+  place-items: center;
+  font-weight: 700;
+  font-size: 13px;
+  box-shadow: 0 2px 6px rgba(255, 106, 0, 0.28);
+}
+
+.worker-mobile-brand-text strong {
+  font-size: 15px;
+  color: #0f172a;
+}
+
+.worker-mobile-user-area {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.worker-mobile-status-tag {
+  margin: 0;
+  font-size: 11px;
+}
+
+.worker-mobile-username {
+  font-size: 13px;
+  font-weight: 500;
+  color: #334155;
+  max-width: 90px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.worker-mobile-logout-btn {
+  color: #94a3b8;
+  padding: 4px;
+}
+
+.worker-mobile-content {
+  flex: 1;
+  min-height: 0;
+  width: 100%;
+  max-width: 100vw;
+  box-sizing: border-box;
+  padding: 10px 10px calc(65px + env(safe-area-inset-bottom, 0px)) 10px;
+}
+
+.worker-mobile-content .ant-card {
+  border-radius: 12px;
+}
+
+.worker-mobile-content .ant-card .ant-card-body {
+  padding: 12px;
+}
+
+.worker-mobile-tabbar {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  width: 100%;
+  max-width: 100vw;
+  height: calc(54px + env(safe-area-inset-bottom, 0px));
+  box-sizing: border-box;
+  z-index: 999;
+  display: flex;
+  align-items: stretch;
+  justify-content: space-around;
+  background: #ffffff;
+  border-top: 1px solid #e2e8f0;
+  padding-bottom: env(safe-area-inset-bottom, 0px);
+  box-shadow: 0 -2px 10px rgba(15, 23, 42, 0.06);
+}
+
+.worker-mobile-tab-item {
+  flex: 1 1 0;
+  width: 33.333%;
+  border: none;
+  background: transparent;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 2px;
+  cursor: pointer;
+  color: #64748b;
+  font-size: 11px;
+  padding: 4px 0;
+  -webkit-tap-highlight-color: transparent;
+  transition: color 0.15s ease;
+}
+
+.worker-mobile-tab-item.active {
+  color: var(--theme-primary);
+  font-weight: 600;
+}
+
+.worker-mobile-tab-icon {
+  font-size: 18px;
+  line-height: 1;
+}
+
+.worker-mobile-tab-label {
+  font-size: 11px;
+  line-height: 1;
+}
+
+/* ==========================================================================
+   移动端 我的订单 (Worker Orders Mobile Page)
+   ========================================================================== */
+
+.worker-orders-mobile-page {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+/* 顶部滑动状态胶囊栏 */
+.worker-orders-mobile-status-bar {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  overflow-x: auto;
+  padding-bottom: 2px;
+  -webkit-overflow-scrolling: touch;
+  scrollbar-width: none;
+}
+
+.worker-orders-mobile-status-bar::-webkit-scrollbar {
+  display: none;
+}
+
+.worker-orders-status-pill {
+  flex-shrink: 0;
+  border: 1px solid #e2e8f0;
+  background: #ffffff;
+  color: #475569;
+  padding: 5px 12px;
+  border-radius: 999px;
+  font-size: 12px;
+  font-weight: 500;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+  transition: all 0.15s ease;
+}
+
+.worker-orders-status-pill.active {
+  background: var(--theme-primary);
+  color: #ffffff;
+  border-color: var(--theme-primary);
+  box-shadow: 0 2px 6px rgba(255, 106, 0, 0.25);
+  font-weight: 600;
+}
+
+.worker-orders-pill-badge {
+  background: rgba(0, 0, 0, 0.06);
+  color: inherit;
+  font-size: 10px;
+  padding: 0 5px;
+  border-radius: 999px;
+  line-height: 16px;
+}
+
+.worker-orders-status-pill.active .worker-orders-pill-badge {
+  background: rgba(255, 255, 255, 0.25);
+  color: #ffffff;
+}
+
+/* 搜索与快捷刷新栏 */
+.worker-orders-mobile-search-bar {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  width: 100%;
+}
+
+.worker-orders-mobile-search-input {
+  flex: 1;
+}
+
+/* 订单卡片列表 */
+.worker-orders-mobile-list {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  width: 100%;
+}
+
+.worker-order-mobile-card {
+  background: #ffffff;
+  border: 1px solid #e2e8f0;
+  border-radius: 12px;
+  padding: 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
+}
+
+/* 头部：分类 + 订单号 + 状态 */
+.worker-order-mobile-card-top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 6px;
+}
+
+.worker-order-mobile-top-left {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  min-width: 0;
+  flex: 1;
+}
+
+.worker-order-mobile-category-tag {
+  margin: 0;
+  font-size: 11px;
+  line-height: 18px;
+  padding: 0 6px;
+}
+
+.worker-order-mobile-orderno {
+  font-size: 12px;
+  color: #64748b;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.worker-order-mobile-top-right {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  flex-shrink: 0;
+}
+
+.worker-order-mobile-deadline {
+  font-size: 11px;
+}
+
+/* 商品名称与奖励 */
+.worker-order-mobile-main-row {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.worker-order-mobile-product-title {
+  font-size: 14px;
+  font-weight: 700;
+  color: #0f172a;
+  line-height: 1.35;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  flex: 1;
+}
+
+.worker-order-mobile-reward {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  flex-shrink: 0;
+  line-height: 1;
+}
+
+.worker-order-mobile-reward-val {
+  font-size: 18px;
+  font-weight: 800;
+  color: #ea580c;
+}
+
+.worker-order-mobile-reward-label {
+  font-size: 10px;
+  color: #94a3b8;
+  margin-top: 2px;
+}
+
+/* 辅助信息行 */
+.worker-order-mobile-meta-row {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  flex-wrap: wrap;
+}
+
+.worker-order-mobile-tag {
+  margin: 0;
+  font-size: 11px;
+  padding: 0 6px;
+  line-height: 18px;
+}
+
+.worker-order-mobile-deposit-text {
+  font-size: 11px;
+  color: #64748b;
+}
+
+/* 问题单提示 */
+.worker-order-mobile-problem-box {
+  background: #fef2f2;
+  border: 1px solid #fecaca;
+  border-radius: 6px;
+  padding: 6px 10px;
+  color: #b91c1c;
+  font-size: 12px;
+  line-height: 1.4;
+}
+
+/* 资料凭据区 */
+.worker-order-mobile-credentials-box {
+  background: #f8fafc;
+  border: 1px solid #e2e8f0;
+  border-radius: 8px;
+  padding: 8px 10px;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.worker-order-mobile-credentials-grid {
+  display: grid;
+  gap: 3px;
+  font-size: 12px;
+}
+
+.worker-order-mobile-credential-line {
+  display: flex;
+  align-items: baseline;
+  gap: 6px;
+  line-height: 1.4;
+}
+
+.worker-order-mobile-credential-label {
+  color: #64748b;
+  font-size: 12px;
+  flex-shrink: 0;
+}
+
+.worker-order-mobile-credential-val {
+  color: #1e293b;
+  font-weight: 600;
+  word-break: break-all;
+}
+
+.worker-order-mobile-screenshots-row {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  margin-top: 2px;
+}
+
+.worker-order-mobile-copy-toolbar {
+  display: flex;
+  gap: 6px;
+  margin-top: 4px;
+  border-top: 1px dashed #e2e8f0;
+  padding-top: 6px;
+}
+
+/* 验收凭据条 */
+.worker-order-mobile-acceptance-strip {
+  background: #f0fdf4;
+  border: 1px solid #bbf7d0;
+  border-radius: 8px;
+  padding: 6px 10px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.worker-order-mobile-acceptance-left {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.worker-order-mobile-acceptance-text {
+  font-size: 12px;
+  color: #166534;
+  font-weight: 500;
+}
+
+.worker-order-mobile-acceptance-time {
+  font-size: 11px;
+  color: #15803d;
+}
+
+/* 底部操作行 */
+.worker-order-mobile-actions-row {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 8px;
+  border-top: 1px solid #f1f5f9;
+  padding-top: 8px;
+}
+
+.worker-order-mobile-action-btn {
+  font-weight: 600;
+}
+
+.worker-orders-mobile-pagination {
+  display: flex;
+  justify-content: center;
+  padding: 8px 0;
+}
+
+/* 移动端个人中心资金明细/申请记录卡片 */
+.worker-profile-mobile-records {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  width: 100%;
+}
+
+.worker-profile-record-card {
+  background: #ffffff;
+  border: 1px solid #e2e8f0;
+  border-radius: 10px;
+  padding: 10px 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  font-size: 12px;
+}
+
+.worker-profile-record-row-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.worker-profile-record-row-meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  color: #64748b;
+  font-size: 12px;
+}
+
+.worker-profile-record-note {
+  color: #334155;
+  font-size: 12px;
+  background: #f8fafc;
+  padding: 4px 8px;
+  border-radius: 4px;
+}
+
+.worker-profile-record-sub {
+  color: #64748b;
+  font-size: 11px;
+}
+
+.worker-profile-record-time {
+  color: #94a3b8;
+  font-size: 11px;
+  margin-top: 2px;
+}
+
+/* ==========================================================================
+   移动端 个人中心 (Worker Profile Mobile Page)
+   ========================================================================== */
+
+.worker-profile-mobile-page {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+/* 顶部沉浸式个人卡片（明亮温润风格） */
+.worker-profile-mobile-hero {
+  background: #ffffff;
+  border: 1px solid #e2e8f0;
+  border-radius: 14px;
+  padding: 14px;
+  color: #0f172a;
+  box-shadow: 0 1px 6px rgba(15, 23, 42, 0.04);
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.worker-profile-mobile-user-row {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  position: relative;
+}
+
+.worker-profile-mobile-avatar {
+  background: linear-gradient(135deg, #ff8c00, #ea580c);
+  color: #ffffff;
+  font-weight: 700;
+  font-size: 20px;
+  box-shadow: 0 2px 8px rgba(234, 88, 12, 0.25);
+  flex-shrink: 0;
+}
+
+.worker-profile-mobile-user-info {
+  display: flex;
+  flex-direction: column;
+  gap: 3px;
+  min-width: 0;
+  flex: 1;
+}
+
+.worker-profile-mobile-name-row {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.worker-profile-mobile-name {
+  font-size: 17px;
+  font-weight: 700;
+  color: #0f172a;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.worker-profile-mobile-tags-row {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  flex-wrap: wrap;
+}
+
+.worker-profile-mobile-vip-badge {
+  display: inline-flex;
+  align-items: center;
+  padding: 1px 6px;
+  background: linear-gradient(135deg, #fef08a, #facc15);
+  color: #854d0e;
+  border-radius: 4px;
+  font-size: 10px;
+  font-weight: 700;
+  line-height: 14px;
+}
+
+.worker-profile-mobile-tag {
+  margin: 0;
+  font-size: 10px;
+  padding: 0 4px;
+  line-height: 16px;
+}
+
+.worker-profile-mobile-account-text {
+  font-size: 11px;
+  color: #64748b;
+}
+
+.worker-profile-mobile-refresh-btn {
+  color: #64748b;
+  background: #f1f5f9;
+  border: none;
+  width: 28px;
+  height: 28px;
+  display: grid;
+  place-items: center;
+  flex-shrink: 0;
+}
+
+.worker-profile-mobile-refresh-btn:hover,
+.worker-profile-mobile-refresh-btn:focus {
+  color: var(--theme-primary);
+  background: #e2e8f0;
+}
+
+.worker-profile-mobile-hero-bottom {
+  border-top: 1px solid #f1f5f9;
+  padding-top: 8px;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.worker-profile-mobile-invite-bar {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-size: 12px;
+  background: #fff7ed;
+  border: 1px solid #ffedd5;
+  border-radius: 6px;
+  padding: 4px 8px;
+}
+
+.worker-profile-mobile-invite-label {
+  color: #9a3412;
+  font-size: 11px;
+}
+
+.worker-profile-mobile-invite-code {
+  color: #ea580c;
+  letter-spacing: 0.5px;
+  font-weight: 700;
+  font-size: 13px;
+}
+
+.worker-profile-mobile-copy-btn {
+  border: 1px solid #fdba74;
+  background: #ffffff;
+  color: #ea580c;
+  border-radius: 4px;
+  padding: 1px 6px;
+  font-size: 11px;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  margin-left: auto;
+}
+
+.worker-profile-mobile-level-box {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.worker-profile-mobile-level-text {
+  font-size: 11px;
+  color: #64748b;
+}
+
+/* 资产钱包卡片 */
+.worker-profile-mobile-wallet-card {
+  background: #ffffff;
+  border: 1px solid #e2e8f0;
+  border-radius: 14px;
+  padding: 14px;
+  box-shadow: 0 1px 6px rgba(15, 23, 42, 0.04);
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.worker-profile-mobile-wallet-top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.worker-profile-mobile-wallet-main {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.worker-profile-mobile-wallet-title {
+  font-size: 11px;
+  color: #64748b;
+}
+
+.worker-profile-mobile-wallet-amount {
+  font-size: 24px;
+  font-weight: 800;
+  color: #ea580c;
+  line-height: 1;
+}
+
+.worker-profile-mobile-wallet-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.worker-profile-mobile-recharge-btn {
+  font-weight: 600;
+}
+
+.worker-profile-mobile-withdraw-btn {
+  font-weight: 600;
+}
+
+.worker-profile-mobile-wallet-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+  gap: 4px;
+  border-top: 1px solid #f1f5f9;
+  padding-top: 10px;
+  text-align: center;
+}
+
+.worker-profile-mobile-wallet-col {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  padding: 0 4px;
+}
+
+.worker-profile-mobile-wallet-col + .worker-profile-mobile-wallet-col {
+  border-left: 1px solid #f1f5f9;
+}
+
+.worker-profile-mobile-sub-label {
+  font-size: 11px;
+  color: #64748b;
+}
+
+.worker-profile-mobile-sub-val {
+  font-size: 14px;
+  font-weight: 700;
+  color: #1e293b;
+}
+
+/* 快捷操作宫格 */
+.worker-profile-mobile-tools-card {
+  background: #ffffff;
+  border: 1px solid #e2e8f0;
+  border-radius: 14px;
+  padding: 12px 8px;
+  box-shadow: 0 1px 6px rgba(15, 23, 42, 0.04);
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 4px;
+}
+
+.worker-profile-mobile-tool-item {
+  border: none;
+  background: transparent;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 6px;
+  cursor: pointer;
+  padding: 6px 2px;
+  border-radius: 8px;
+  transition: background 0.15s ease;
+  -webkit-tap-highlight-color: transparent;
+}
+
+.worker-profile-mobile-tool-item:active {
+  background: #f8fafc;
+  transform: scale(0.96);
+}
+
+.worker-profile-mobile-tool-icon {
+  width: 38px;
+  height: 38px;
+  border-radius: 10px;
+  display: grid;
+  place-items: center;
+  font-size: 18px;
+}
+
+.worker-profile-mobile-tool-item span {
+  font-size: 11px;
+  color: #334155;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+/* 记录与明细分段滑动卡片 */
+.worker-profile-mobile-sections-card {
+  background: #ffffff;
+  border: 1px solid #e2e8f0;
+  border-radius: 14px;
+  box-shadow: 0 1px 6px rgba(15, 23, 42, 0.04);
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.worker-profile-mobile-tab-nav {
+  display: flex;
+  border-bottom: 1px solid #e2e8f0;
+  background: #f8fafc;
+}
+
+.worker-profile-mobile-tab-btn {
+  flex: 1;
+  border: none;
+  background: transparent;
+  padding: 10px 0;
+  font-size: 13px;
+  font-weight: 500;
+  color: #64748b;
+  cursor: pointer;
+  position: relative;
+  transition: all 0.15s ease;
+}
+
+.worker-profile-mobile-tab-btn.active {
+  color: var(--theme-primary);
+  font-weight: 700;
+  background: #ffffff;
+}
+
+.worker-profile-mobile-tab-btn.active::after {
+  content: '';
+  position: absolute;
+  bottom: 0;
+  left: 20%;
+  right: 20%;
+  height: 2px;
+  background: var(--theme-primary);
+  border-radius: 2px;
+}
+
+.worker-profile-mobile-tab-body {
+  padding: 12px;
+}
+
+.worker-profile-mobile-filter-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  margin-bottom: 10px;
+}
+
+/* 账号详情列表 */
+.worker-profile-mobile-account-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.worker-profile-mobile-account-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 0;
+  border-bottom: 1px solid #f1f5f9;
+  font-size: 12px;
+}
+
+.worker-profile-mobile-acc-label {
+  color: #64748b;
+}
+
+.worker-profile-mobile-acc-val {
+  color: #0f172a;
+  font-weight: 500;
+}
+
+/* ==========================================================================
+   移动端 抢单大厅 (Worker Hall Mobile Page)
+   ========================================================================== */
+
+.worker-hall-mobile-page {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+/* 顶部紧凑状态与控制栏 */
+.worker-hall-mobile-top-bar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.worker-hall-mobile-stat-pill {
+  background: #ffffff;
+  border: 1px solid #e2e8f0;
+  border-radius: 999px;
+  padding: 5px 12px;
+  font-size: 12px;
+  color: #475569;
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
+}
+
+.worker-hall-mobile-stat-highlight {
+  color: #ea580c;
+  font-weight: 700;
+}
+
+.worker-hall-mobile-stat-divider {
+  color: #cbd5e1;
+}
+
+.worker-hall-mobile-top-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.worker-hall-mobile-autorefresh-switch {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  background: #ffffff;
+  border: 1px solid #e2e8f0;
+  border-radius: 999px;
+  padding: 4px 10px;
+  font-size: 11px;
+  color: #64748b;
+}
+
+.worker-hall-mobile-autorefresh-text {
+  font-size: 11px;
+  white-space: nowrap;
+}
+
+/* 分类横向滑动胶囊条 */
+.worker-hall-mobile-category-bar {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  overflow-x: auto;
+  padding: 2px 0 2px 0;
+  -webkit-overflow-scrolling: touch;
+  scrollbar-width: none;
+}
+
+.worker-hall-mobile-category-bar::-webkit-scrollbar {
+  display: none;
+}
+
+.worker-hall-mobile-cat-pill {
+  flex-shrink: 0;
+  border: 1px solid #e2e8f0;
+  background: #ffffff;
+  color: #475569;
+  padding: 5px 14px;
+  border-radius: 999px;
+  font-size: 12px;
+  font-weight: 500;
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+  transition: all 0.15s ease;
+}
+
+.worker-hall-mobile-cat-pill.active {
+  background: var(--theme-primary);
+  color: #ffffff;
+  border-color: var(--theme-primary);
+  box-shadow: 0 2px 6px rgba(255, 106, 0, 0.25);
+  font-weight: 600;
+}
+
+/* 搜索栏 */
+.worker-hall-mobile-search-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+}
+
+.worker-hall-mobile-search-input {
+  flex: 1;
+}
+
+/* 移动端呼吸感舒展订单卡片列表 */
+.worker-hall-mobile-list {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  width: 100%;
+}
+
+.worker-hall-mobile-card {
+  background: #ffffff;
+  border: 1px solid #e2e8f0;
+  border-radius: 14px;
+  padding: 14px 14px 12px 14px;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
+}
+
+.worker-hall-mobile-card-top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.worker-hall-mobile-card-tags {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  flex-wrap: wrap;
+}
+
+.worker-hall-mobile-tag {
+  margin: 0;
+  font-size: 11px;
+  padding: 1px 6px;
+  line-height: 18px;
+  border-radius: 4px;
+}
+
+.worker-hall-mobile-card-orderno {
+  font-size: 11px;
+  color: #94a3b8;
+  white-space: nowrap;
+}
+
+.worker-hall-mobile-card-main {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.worker-hall-mobile-card-title {
+  font-size: 15px;
+  font-weight: 700;
+  color: #0f172a;
+  line-height: 1.4;
+  word-break: break-all;
+}
+
+.worker-hall-mobile-card-meta {
+  font-size: 12px;
+  color: #64748b;
+  line-height: 1.4;
+}
+
+/* 底部操作与报酬行 */
+.worker-hall-mobile-card-footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  border-top: 1px dashed #f1f5f9;
+  padding-top: 10px;
+  margin-top: 2px;
+}
+
+.worker-hall-mobile-card-price-group {
+  display: flex;
+  align-items: baseline;
+  gap: 6px;
+}
+
+.worker-hall-mobile-card-price-label {
+  font-size: 11px;
+  color: #64748b;
+}
+
+.worker-hall-mobile-card-price-val {
+  font-size: 22px;
+  font-weight: 800;
+  color: #ea580c;
+  line-height: 1;
+}
+
+.worker-hall-mobile-card-btn-group {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-shrink: 0;
+}
+
+.worker-hall-mobile-grab-btn {
+  min-width: 100px;
+  height: 36px;
+  border-radius: 8px;
+  font-weight: 700;
+  font-size: 14px;
+  padding: 0 16px;
+}
+
+/* ===== 打手端响应式断点 ===== */
+
+@media (max-width: 768px) {
+  .worker-profile-wallet-strip {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+  .worker-profile-wallet-item:nth-child(3) {
+    border-left: 0;
+    border-top: 1px solid #f0f0f0;
+  }
+  .worker-profile-wallet-item:nth-child(4) {
+    border-top: 1px solid #f0f0f0;
+  }
+}
+
+@media (max-width: 720px) {
+  .worker-page-head {
+    align-items: stretch;
+    flex-direction: column;
+  }
+
+  .worker-hall-toolbar {
+    align-items: stretch;
+    flex-direction: column;
+  }
+
+  .worker-hall-search {
+    width: 100%;
+  }
+
+  .worker-hall-card-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .worker-hall-card {
+    padding: 16px;
+  }
+
+  .worker-hall-card-actions-row {
+    align-items: stretch;
+    flex-direction: column;
+  }
+
+  .worker-hall-card-grab-row {
+    flex-direction: column;
+  }
+}
+
+@media (max-width: 480px) {
+  .worker-hall-summary-strip {
+    grid-template-columns: 1fr;
+  }
+
+  .worker-hall-summary-item + .worker-hall-summary-item {
+    border-top: 1px solid #e5e7eb;
+    border-left: 0;
+  }
+}