/* ===================================================================
   界面精简（10-06 第二轮）：以现有界面为基础，保留业务功能和页面结构，去掉模板感。
   原则：每个区域只有一个橙色主操作；不用装饰性渐变、点阵、光晕和悬停阴影；
   不在卡片里再套卡片；英文小标签（ASSETS / TRADE …）去掉；字号、间距、圆角统一成一套。
   回滚：删掉 index.html 里引用本文件的一行即可（另有几处 JS 改动见各文件注释）。
   =================================================================== */
:root {
  /* 颜色：中性灰四级 + 一个强调色；文字三级 */
  /* 第三版（10-06 晚）：比上一版亮一档，页面四角加回橙色暖光（原来橙色主题的感觉） */
  --c-bg: #1f1f21; --c-surface: #2a2a2c; --c-raised: #343437; --c-line: #ffffff17;
  --c-text: #f7f7f7; --c-text-2: #b4b4b9; --c-text-3: #808086;
  --c-accent: #ff7a1a; --c-accent-hi: #ff9142; --c-accent-soft: #ff7a1a1f;
  /* 圆角：控件 10、卡片 16，胶囊 999 */
  --r-ctl: 10px; --r-card: 16px;
  /* 字号：页面标题 / 区块标题 / 卡片标题 / 正文 / 辅助 */
  --fs-h1: 28px; --fs-h2: 20px; --fs-h3: 16px; --fs-body: 14px; --fs-meta: 12px;
  /* 覆盖之前的令牌，让旧样式一起变 */
  --v2-bg: var(--c-bg); --v2-bar: #212122; --v2-surface: var(--c-surface); --v2-surface-2: var(--c-raised); --v2-surface-3: #3a3a3d; --v2-line: var(--c-line);
  --v2-muted: var(--c-text-2); --v2-dim: var(--c-text-3);
  --v2-r-lg: var(--r-card); --v2-r-md: 12px; --v2-r-sm: var(--r-ctl);
}

body { background: radial-gradient(ellipse 1000px 680px at 100% 0, #ff6a0026, #ff6a001a 22%, #ff6a000e 42%, #ff6a0005 60%, transparent 76%), radial-gradient(ellipse 700px 600px at 0 0, #ff6a0010, #ff6a0008 40%, transparent 70%), var(--c-bg) !important; background-repeat: no-repeat !important; }

/* ---------- 去装饰：英文小标签（悬停光晕和阴影保留，见 card-glow.css） ---------- */
.eyebrow { display: none !important; }
.v2-card { transition: transform .2s, box-shadow .2s, background .2s; }
.v2-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px #0009 !important; }

/* 大面积橙色的地方恢复：App 下载横幅、新手引导卡插图（第一轮去掉后不如原来好看） */
.v2-app { background: radial-gradient(circle, #ffffff1f 1.4px, transparent 2.2px) 0 0 / 22px 22px, linear-gradient(120deg, #ff7a1a, #c94800) !important; }
.v2-app p { color: #fff3e6 !important; }
.v2-app .btn { background: #fff !important; color: #1b1b1c !important; }
.v2-app .btn:hover { background: #ffe9d6 !important; }
.v2-app-art img { border-color: #fff !important; }
.v2-promo-art { background: radial-gradient(circle, #ffffff26 1.4px, transparent 2.2px) 0 0 / 20px 20px, linear-gradient(135deg, #ff8a2a, #c94800) !important; }
.v2-promo-art img { border-color: #fff !important; }

/* ---------- 字号层级 ---------- */
.titlebar h1, .v2-list-head h1 { font-size: var(--fs-h1) !important; font-weight: 700; letter-spacing: -.4px; }
.v2-sec-head h2, .panel h2, .panel-head h2 { font-size: var(--fs-h2) !important; font-weight: 700; letter-spacing: -.2px; }
.v2-sec-head p, .titlebar p { font-size: 13px !important; color: var(--c-text-2) !important; }
.v2-sec-head { margin-bottom: 16px !important; }
.v2-home .home-section { margin: 40px 0 !important; padding-top: 0 !important; border-top: 0 !important; }
.v2-card h3 { font-size: var(--fs-h3) !important; letter-spacing: 0 !important; }
.v2-price b { font-size: 20px !important; }
@media (max-width: 760px) {
  :root { --fs-h1: 24px; --fs-h2: 18px; }
}

/* ---------- 导航与返回：返回改成文字链接，面包屑弱化 ---------- */
/* 「返回」键用 ui2.css 里的橙色底版本（用户要求恢复） */
.crumb { font-size: var(--fs-meta) !important; margin-bottom: 16px !important; }
.g-search .icon { color: var(--c-text-3) !important; }


/* ---------- 个人概览条：一行，头像 + 名字，右侧三个数字 + 充值 ---------- */
.v2-userbar { padding: 0 0 20px !important; margin-bottom: 24px !important; gap: 16px !important; flex-direction: row !important; align-items: center !important; }
.v2-user { gap: 12px !important; }
.mavatar.v2-av { width: 40px !important; height: 40px !important; }
.v2-user > b { font-size: 15px; font-weight: 600; }
.v2-stats { display: flex; align-items: center; gap: 28px; }
.v2-stat { display: grid; gap: 2px; color: inherit; }
.v2-stat small { font-size: var(--fs-meta); color: var(--c-text-3); }
.v2-stat b { font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.v2-stat:hover b { color: var(--c-accent-hi); }
@media (max-width: 760px) {
  .v2-userbar { flex-direction: column !important; align-items: stretch !important; padding-bottom: 16px !important; margin-bottom: 18px !important; }
  .v2-stats { justify-content: space-between; gap: 12px; }
  .v2-stat b { font-size: 14px; }
}

/* ---------- 按钮：橙色只给主操作；次要按钮灰底；去掉按钮上的装饰图标阴影 ---------- */
.btn { border-radius: var(--r-ctl) !important; }
.btn.small { height: 34px; padding: 0 14px; font-size: 13px; }
.v2-show-all { border-radius: var(--r-ctl) !important; }
.v2-arrow { background: var(--c-surface) !important; }
.v2-sq { border-radius: var(--r-ctl) !important; }
/* 流动性承接横幅（首页、承接页）：橙色方块图标 + 右侧橙色暖光 */
.liquidity-banner { background: linear-gradient(100deg, var(--c-surface) 55%, #ff7a1a33) !important; }

/* ---------- 不在卡片里套卡片 ---------- */
/* 详情页价格块：不再是一块灰底卡片，改成上下分隔线 */
.detail-price { background: transparent !important; border-radius: 0 !important; padding: 16px 0 !important; border-top: 1px solid var(--c-line) !important; border-bottom: 1px solid var(--c-line) !important; }
/* 买卖报价中间的参考价：同样只用分隔线 */
.quote-reference { background: transparent !important; border-radius: 0 !important; border-top: 1px solid var(--c-line) !important; border-bottom: 1px solid var(--c-line) !important; padding: 14px 10px !important; }
.quote-reference strong { font-size: 22px !important; }
.quote-empty { margin: 18px 0 6px; color: var(--c-text-3); font-size: 13px; text-align: center; }
.sell-pl { margin-top: 6px; color: var(--c-text-2); font-size: 13px; }
.owned-series-inline { border-top: 0 !important; }
.info-note { background: transparent !important; border-left: 2px solid var(--c-accent) !important; border-radius: 0 !important; padding: 8px 12px !important; }

/* ---------- 标签：统一小号、低饱和 ---------- */
.v2-img-pill { font-size: 11px !important; padding: 4px 10px !important; }

/* ---------- 手机：底部有标签栏，页脚只留一行版权和协议链接 ---------- */
@media (max-width: 760px) {
  .v2-foot-top { display: none !important; }
  .v2-footer { margin-top: 32px !important; background: transparent !important; }
  .v2-foot-bottom { flex-direction: column; align-items: center; gap: 6px; border-top: 1px solid var(--c-line) !important; text-align: center; }
}

/* ---------- 作品卡片：橙色操作按钮保留；每张都重复的「平台承接持有 / 支持承接评估」不显示（详情页仍有） ---------- */
.v2-card .v2-pill { background: transparent !important; padding: 0 4px !important; }
.v2-card .v2-pill-text { display: none !important; }
.v2-card .v2-pill-btn { color: var(--c-text-2) !important; }
.v2-card .v2-pill-btn:hover { color: var(--c-accent-hi) !important; }

/* ---------- 标签 / 筛选：选中项橙色 ---------- */
.tab, button.tab { border-radius: 999px !important; background: var(--c-surface) !important; color: var(--c-text-2) !important; font-weight: 500 !important; }
.tab:hover, button.tab:hover { color: var(--c-text) !important; }
.tab.active, button.tab.active { background: var(--c-accent) !important; color: #fff !important; font-weight: 600 !important; }

/* ---------- 区块标题左侧一条橙色短竖线，代替去掉的英文小标签 ---------- */
.v2-sec-head h2, .panel > h2, .panel-head h2 { position: relative; padding-left: 12px; }
.v2-sec-head h2::before, .panel > h2::before, .panel-head h2::before { content: ""; position: absolute; left: 0; top: .22em; bottom: .22em; width: 4px; border-radius: 2px; background: var(--c-accent); }

/* ---------- 页面切换：内容轻微上移淡入（只在换页时，数据刷新不播） ---------- */
@keyframes page-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
#main.page-enter { animation: page-enter .28s cubic-bezier(.2, .8, .2, 1); }
@media (prefers-reduced-motion: reduce) { #main.page-enter { animation: none; } }

/* ---------- 去「太阳纹」：深色底上的大面积橙色渐变会出现一圈圈 / 一条条色阶。
   盖一层极淡的细噪点把色阶打散（不拦截点击，肉眼看不出颗粒）；渐变本身也加了中间过渡点 ---------- */
body::after { content: ""; position: fixed; inset: 0; z-index: 2147483000; pointer-events: none; opacity: .5;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 0 .07'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0 / 180px 180px repeat; }
@media print { body::after { display: none; } }

/* ---------- 未发售作品：发售状态右侧的定时发售倒计时 ---------- */
.unreleased-price-box:has(.release-countdown) { grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); }
.unreleased-price-box .release-line { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 18px; }
.unreleased-price-box .release-state { display: grid; align-content: start; gap: 6px; }
.release-countdown { display: grid; gap: 6px; justify-items: center; padding: 12px 16px; border: 1px solid #ff7a1a33; border-radius: 10px; background: #ff7a1a0d; }
.release-countdown strong { font-size: 20px; font-weight: 700; color: #ffb563; font-variant-numeric: tabular-nums; letter-spacing: .5px; white-space: nowrap; }
@media (max-width: 600px) { .unreleased-price-box:has(.release-countdown) { grid-template-columns: 1fr; } .release-countdown { width: 100%; } }

/* ---------- 手机充值：拉起支付宝按钮、微信付款步骤 ---------- */
.pay-modal .pay-jump { margin: 4px 0 6px; }
.pay-wx-steps { margin: 4px 0 14px; padding: 12px 14px; border: 1px solid #ffffff14; border-radius: 10px; background: #ffffff06; font-size: 13px; }
.pay-wx-steps ol { margin: 8px 0 10px; padding-left: 18px; line-height: 1.8; color: var(--v2-text-2, #c9c9cc); }
.pay-wx-steps .actions { gap: 10px; }

/* ---------- 充值：支付倒计时、支付结果、未完成订单提示 ---------- */
.pay-modal .pay-timer { margin: 4px 0 12px; }
.pay-modal .danger-ghost { color: #ff8a80; border-color: #ff8a8040; }
.pay-result-icon { width: 64px; height: 64px; margin: 4px auto 10px; border-radius: 50%; display: grid; place-items: center; font-size: 30px; font-weight: 800; }
.pay-result-icon.ok { background: #2dd59c22; color: #2dd59c; border: 1px solid #2dd59c55; }
.pay-result-icon.bad { background: #ef736822; color: #ef7368; border: 1px solid #ef736855; }
.pending-pay { margin: 0 0 18px; }
.pending-pay .actions { margin-top: 10px; gap: 10px; }

/* 资产记录 → 充值订单 */
.click-row { cursor: pointer; }
.click-row:hover td { background: #ffffff05; }
small.block { display: block; margin-top: 4px; }

/* 个人中心头部（10-09）：左边头像 + 用户名，右边账户地址 + 复制 */
.profile-head { display: flex; align-items: center; gap: 18px; }
.profile-head > div:not(.profile-addr) { flex: 1; min-width: 0; }
.profile-addr { display: grid; gap: 6px; justify-items: start; max-width: 46%; padding: 12px 14px; border: 1px solid #ffffff12; border-radius: 12px; background: #ffffff06; }
.profile-addr .hash { font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; word-break: break-all; color: var(--v2-text, #eee); }
.profile-addr .addr-short { display: none; }
@media (max-width: 600px) {
  .profile-head { flex-direction: row !important; align-items: center !important; text-align: left !important; gap: 12px; }
  .profile-head > div:not(.profile-addr) { display: block !important; width: auto !important; justify-items: start !important; }
  .profile-head > div:not(.profile-addr) h2 { font-size: 18px; margin: 0 0 4px; }
  .profile-head .profile-av { width: 56px; height: 56px; }
  .profile-head .av-edit { gap: 6px; }
  .profile-head .av-edit .av-edit-label { padding: 3px 9px; font-size: 11px; }
  .profile-addr { max-width: 48%; flex: 0 0 auto; padding: 9px 10px; gap: 5px; justify-items: stretch; }
  .profile-addr .label { font-size: 10.5px; }
  .profile-addr .addr-full { display: none; }
  .profile-addr .addr-short { display: inline; }
  .profile-addr .btn { padding: 6px 10px; font-size: 12px; }
}

/* 手机 / 桌面入口（10-09 反馈：App 和状态栏交界处模糊、滑动时顶栏一直固定在上面不协调）：
   · 顶栏不再固定，跟着页面一起滚走
   · 状态栏后面铺一条同色的纯色底（不透明、无模糊、无噪点），页面内容滚上去时被它挡住，不会透到时间和电量下面 */
@media (max-width: 600px) {
  .m-header { position: relative !important; top: auto !important; }
  body::before { content: ""; position: fixed; left: 0; right: 0; top: 0; height: env(safe-area-inset-top, 0px); background: var(--v2-bar); z-index: 2147483001; pointer-events: none; }
}

/* ---------- 作品图片渐显（10-09）：加载完成前透明 + 轻微模糊，加载完成后 0.6 秒内自然浮现，不再突然闪出 ----------
   js/app.js 在图片 load 时加 .pm-in；缓存里的图片也一样过渡 */
img[src*="/uploads/"], img[src*="assets/art-"] { opacity: 0; filter: blur(8px); transition: opacity .6s ease, filter .7s ease, transform .5s cubic-bezier(.16, 1, .3, 1), clip-path .5s cubic-bezier(.16, 1, .3, 1); }
img[src*="/uploads/"].pm-in, img[src*="assets/art-"].pm-in { opacity: 1; filter: none; }
@media (prefers-reduced-motion: reduce) { img[src*="/uploads/"], img[src*="assets/art-"] { transition: none; filter: none; } }

/* ---------- 电脑端作品大图动效（10-10，取代取景框 + 细节图）：鼠标在图上时以光标为中心轻微鼓起并随鼠标微倾，
   移开后缓慢复原。transform 由 js/app.js 写入 ---------- */
.detail-grid .big-art { transition: transform .9s cubic-bezier(.16, 1, .3, 1); will-change: transform; }
.detail-grid .big-art.fx-on { transition: transform .25s ease-out; }
.art-frame:hover .big-art:not(.fx-on), a:hover > .big-art { transform: none; }

/* 收到报价弹窗三个按钮、交易中心「收到的报价」（10-09） */
.offer-recv-actions { display: grid !important; grid-template-columns: auto 1fr 2fr; gap: 10px; }
.trade-offers .offer-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 14px; }
.trade-offers .cell-art { min-width: 0; color: inherit; }
.trade-offers .to-name { font-size: 14px; }
.trade-offers .to-price { text-align: right; }
.trade-offers .to-price b { display: block; font-size: 18px; color: var(--v2-accent-hi, #ffa043); }
.trade-offers .actions { gap: 8px; }
@media (max-width: 600px) {
  .offer-recv-actions { grid-template-columns: 1fr 1fr; }
  .offer-recv-actions .btn.primary { grid-column: 1 / -1; order: -1; width: 100% !important; max-width: none !important; }
  .trade-offers .offer-row { grid-template-columns: minmax(0, 1fr) auto; }
  .trade-offers .actions { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, 1fr); }
  .artwork-title .actions:has(.trade-detail-link) { display: flex !important; flex-direction: column; align-items: stretch; gap: 10px; }
  .trade-detail-link { order: 5; width: 100%; justify-content: center; min-height: 44px; }
}

/* 页面顶部账户信息条（10-09）：和「我的资产」同一风格——灰色背景框，标签小号灰字、数字加粗白色，
   参考收益保留红绿，充值为橙色主按钮，头像加橙色描边 */
.v2-userbar { background: var(--c-surface, #2a2a2c) !important; border: 1px solid #ffffff0f !important; border-bottom: 1px solid #ffffff0f !important; border-radius: var(--v2-r-lg, 16px) !important; padding: 16px 20px !important; }
.v2-userbar .v2-user b { font-size: 17px; font-weight: 800; }
.v2-userbar .v2-user-av .mavatar { box-shadow: 0 0 0 2px var(--v2-accent, #ff7a1a), 0 0 12px #ff7a1a40; }
.v2-userbar .v2-stat small { font-size: 12px; color: var(--c-text-3, #9a9aa0); }
.v2-userbar .v2-stat b { font-size: 18px; font-weight: 800; color: #fff; letter-spacing: -.2px; }
.v2-userbar .v2-stat b .up, .v2-userbar .v2-stat b .green { color: var(--green, #2dd59c); }
.v2-userbar .v2-stat b .down, .v2-userbar .v2-stat b .red { color: var(--red, #ef7368); }
.v2-userbar .v2-topup { min-width: 72px; font-weight: 700; }
/* 我的资产等页面的金额也统一加粗 */
.money-split b, .balance-panel .amount, .big-figure { font-weight: 800 !important; }
@media (max-width: 600px) {
  .v2-userbar { padding: 14px 14px !important; }
  .v2-userbar .v2-stat b { font-size: 16px; }
}

/* 系列封面（10-09）：固定一长条（电脑约 16:4、手机约 16:6），上传的图片按比例铺满并居中裁切；
   和作品图一样加载完成后渐显（img 地址是 /uploads/，沿用上面的渐显规则） */
.series-cover { position: relative; width: 100%; aspect-ratio: 4 / 1; border-radius: var(--v2-r-lg, 16px); overflow: hidden; background: #2a2a2c; margin-bottom: 16px; }
.series-cover .series-cover-img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; aspect-ratio: auto !important; object-fit: cover; object-position: center; border-radius: 0 !important; }
@media (max-width: 760px) { .series-cover { aspect-ratio: 8 / 3; border-radius: 14px; } }
/* 默认系列插画也一样渐显 */
.ui-series-banner { animation: pmFadeIn .7s ease both; }
@keyframes pmFadeIn { from { opacity: 0; filter: blur(8px); } to { opacity: 1; filter: none; } }
.series-cover .series-cover-img { animation: none; }

/* 作品卡片：定时发售倒计时（10-09） */
.card-clock.release b { color: #ffb563; }

/* ---------- 图标（10-09 重做）：双色线性图标 + 橙色调底框 ----------
   主体线条跟随文字颜色，关键部分品牌橙；线宽 1.8，圆角端点；大图标放在半透明橙色圆角底框里，深色背景上轮廓清楚 */
.icon.duo { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.icon.duo .ac { stroke: var(--ic-ac, #ff8a2a); }
.icon.duo .acf { fill: var(--ic-ac, #ff8a2a); stroke: none; }
.ui-tile { display: inline-grid !important; place-items: center; border-radius: 28%; color: #fff;
  background: linear-gradient(145deg, #ff8a2a33, #ff6a0010 70%), #2c2c2f; border: 1px solid #ff8a2a4d; box-shadow: inset 0 1px 0 #ffffff14, 0 6px 16px -8px #ff7a1a66; object-fit: initial !important; }
.ui-tile .icon.duo { width: 54% !important; height: 54% !important; stroke-width: 1.7; }
/* 底部导航：未选中灰色（橙色部分也变灰），选中整体橙色 */
.m-bottom .icon.duo { width: 26px; height: 26px; color: #a1a1a6; }
.m-bottom a:not(.active):not(.on) .icon.duo .ac { stroke: currentColor; }
.m-bottom a:not(.active):not(.on) .icon.duo .acf { fill: currentColor; }
.m-bottom a.active .icon.duo, .m-bottom a.on .icon.duo { color: #ffd2a8; }
/* 侧栏、按钮里的小图标 */
.sidebar a .icon.duo { width: 22px; height: 22px; }
.sidebar a.active .icon.duo { color: #fff; }

/* 创作者：署名锁定、系列封面要求（10-09） */
.locked-input { opacity: .75; cursor: not-allowed; }
.warn-text { color: #ffb563; font-weight: 700; }
.cover-req { margin: 2px 0 8px; }
#sa-cover-hint.error { color: var(--red, #ef7368); }

/* 交易中心「收到的报价」按作品折叠（10-09） */
.trade-offers .offer-group { border-top: 1px solid #ffffff0d; }
.trade-offers .offer-group:first-of-type { border-top: 0; }
.trade-offers .offer-group > .offer-row { border-top: 0; }
.offer-more > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; margin: 0 0 10px 56px; padding: 8px 12px; border-radius: 10px; background: #ffffff08; color: var(--c-text-3, #a1a1a6); font-size: 13px; }
.offer-more > summary::-webkit-details-marker { display: none; }
.offer-more > summary span { margin-left: auto; color: var(--v2-accent-hi, #ffa043); font-weight: 600; }
.offer-more:not([open]) .om-close, .offer-more[open] .om-open { display: none; }
.trade-offers .offer-row.sub { padding-left: 56px; border-top: 1px dashed #ffffff10; }
.trade-offers .offer-row.sub .to-name { font-size: 13px; color: var(--c-text-3, #a1a1a6); }
.sub-dot { width: 8px; height: 8px; border-radius: 50%; background: #ffffff33; flex: none; margin-top: 6px; }
@media (max-width: 600px) { .offer-more > summary { margin-left: 0; } .trade-offers .offer-row.sub { padding-left: 0; } }

/* 手机行情页（10-09）：「查看」按钮挪到卡片右上角、和缩略图同一行，做成小按钮；走势图和数字更紧凑 */
@media (max-width: 760px) {
  .market-table tbody tr { position: relative; }
  .market-table tbody td:last-child { position: absolute; top: 16px; right: 16px; padding: 0 !important; border: 0 !important; display: block !important; }
  .market-table tbody td:last-child::before { display: none !important; }
  .market-table tbody td:last-child .link-btn { display: inline-flex; align-items: center; gap: 4px; height: 32px; padding: 0 14px; border-radius: 999px; background: #ff7a1a1f; border: 1px solid #ff8a2a55; color: var(--v2-accent-hi, #ffa043); font-size: 13px; font-weight: 600; }
  .market-table tbody td:first-child { padding-right: 96px !important; }
}
@media (max-width: 760px) {
  .market-art-stat > .ui-art-icon, .stats .ui-art-icon { width: 30px !important; height: 30px !important; top: 14px !important; right: 10px !important; transform: none !important; border-radius: 9px; }
  .market-art-stat strong { padding-right: 0; }
}

/* 热门作品轮播可左右拖动（10-09）：横向拖动交给页面脚本，竖向仍可滚动页面 */
.js-marquee { touch-action: pan-y; cursor: grab; user-select: none; -webkit-user-select: none; }
.js-marquee.mq-dragging { cursor: grabbing; }
.js-marquee.mq-dragging * { pointer-events: none; }
.js-marquee img { -webkit-user-drag: none; }
/* 作品详情大图完整显示（10-09：正方形框按铺满裁切，非正方形作品边缘被裁掉）；空白处用深色底 */
.detail-grid .big-art { object-fit: contain !important; background-color: #232325 !important; }

/* 固定深色模式（10-09）：不跟随手机系统浅色设置；表单、滚动条等浏览器自带控件也是深色 */
:root { color-scheme: dark only; }

/* 区块标题（10-09）：标题和右侧按钮（如「全部作品」）在同一行垂直居中对齐，说明文字放在下一行 */
.v2-sec-head { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 6px; align-items: center !important; }
.v2-sec-head > div:first-child { display: contents; }
.v2-sec-head h2 { grid-column: 1; grid-row: 1; margin: 0 !important; }
.v2-sec-head p { grid-column: 1 / -1; grid-row: 2; margin: 0 !important; }
.v2-sec-head .v2-sec-actions { grid-column: 2; grid-row: 1; align-self: center; }
/* 开屏加载画面显示期间不叠颗粒纹理：和系统启动图（纯 #1f1f21 底）颜色完全一致，衔接不跳色（10-09） */
body:has(#pm-splash:not(.out))::after { display: none; }
/* 手机「我的资产」弹窗资金记录（10-09）：左边类型 + 说明 + 时间、右边金额在同一行垂直居中对齐 */
@media (max-width: 760px) {
  .my-row:has(.my-row-wide) { grid-template-columns: minmax(0, 1fr) auto !important; grid-template-rows: auto auto; row-gap: 2px; align-items: center; }
  .my-row:has(.my-row-wide) .my-row-wide { grid-column: 1 !important; grid-row: 1; }
  .my-row:has(.my-row-wide) .my-row-num { grid-column: 2 !important; grid-row: 1 / span 2 !important; align-self: center; font-size: 15px; }
  .my-row:has(.my-row-wide) .my-row-end { grid-column: 1 !important; grid-row: 2; align-items: flex-start; }
}

/* 系列封面：电脑和移动端统一 6.4:1，与作品区域左右对齐。 */
.ui-series-visual { width: 100%; aspect-ratio: 32 / 5 !important; overflow: hidden; }
.ui-series-visual .ui-series-banner, .series-cover .series-cover-img { position: absolute; inset: 0; display: block; width: 100% !important; height: 100% !important; aspect-ratio: auto !important; object-fit: cover !important; object-position: center; z-index: 1; }
.series-cover .series-cover-bg { display: none; }
.series-cover-preview { width: 100%; aspect-ratio: 32 / 5; object-fit: cover; border-radius: 10px; display: block; margin-top: 10px; }
.series-cover-preview[hidden] { display: none; }
/* 页面标题右侧插图（行情 / 我的 / 交易等，10-09）：限制在标题区域内，不再往上压到导航栏的铃铛、头像；文字在插图上层；手机上缩小、靠右，不压说明文字 */
.ui-scene-title { position: relative; min-height: 0; }
.ui-scene-title > div, .ui-scene-title > .actions { position: relative; z-index: 1; }
.ui-page-header { top: 0 !important; bottom: 0 !important; height: 100% !important; max-height: 150px; width: auto !important; max-width: 40%; right: 0 !important; transform: none !important; }
@media (max-width: 700px) {
  /* 只给带插图的页头留右侧空间；以前误伤了右边的状态标签区，标签被挤成竖排（10-10） */
  .ui-scene-title:has(> .ui-page-header) { min-height: 96px; }
  .ui-scene-title:has(> .ui-page-header) > div:not(.actions) { padding-right: 34%; }
  .ui-page-header { max-height: 96px; max-width: 34%; opacity: .75 !important; }
}
/* 手机页头（出售撮合状态 / 动态撮合 / 订单详情 / 流动性承接等）：标题和说明在左、状态标签在右，横向一行；标题不拆字，标签不换行（10-10） */
@media (max-width: 600px) {
  .titlebar { flex-wrap: nowrap; align-items: center; }
  .titlebar > div:not(.actions) { flex: 1 1 auto; min-width: 0; }
  .titlebar > div:not(.actions) h1 { word-break: keep-all; overflow-wrap: break-word; line-height: 1.25; }
  .titlebar > div:not(.actions) p { word-break: normal; overflow-wrap: anywhere; }
  .titlebar > .actions { flex: 0 0 auto; padding: 0 !important; }
  .titlebar > .actions:empty { display: none; }
  .titlebar > .actions .tag, .titlebar > .actions .pill, .titlebar > .actions .badge { white-space: nowrap; writing-mode: horizontal-tb; }
}
/* 头像橙色圆圈统一（10-09）：「我的」页、个人中心、顶部账户条的头像都用同一个橙色描边 + 光晕 */
.mavatar.my-av, .mavatar.profile-av, .v2-userbar .v2-user-av .mavatar { border: 0 !important; border-radius: 50%; box-shadow: 0 0 0 2px var(--v2-accent, #ff7a1a), 0 0 12px #ff7a1a40 !important; }
.av-edit:hover .mavatar.profile-av { box-shadow: 0 0 0 2px #ffa043, 0 0 16px #ff7a1a66 !important; }

/* 打开 / 关闭弹窗时页面不左右晃（锁定滚动时滚动条消失导致内容宽度变化，10-09） */
html { scrollbar-gutter: stable; }

/* 手机：单件作品行情页头，缩略图右边「作品详情 / 进入交易」靠右排、两个按钮之间留间距（10-10） */
@media (max-width: 600px) {
  .artwork-title > .actions:not(:has(.pm-select)):not(:has(.trade-detail-link)) { display: flex !important; justify-content: flex-end; align-items: center; gap: 12px; }
  .artwork-title > .actions:not(:has(.pm-select)):not(:has(.trade-detail-link)) > .btn { margin: 0 !important; }
}

/* 手机：作品 / 行情 / 交易页顶部账户条（10-10）——一行显示（头像 + 余额 / 持有 / 收益 + 充值），
   毛玻璃悬浮卡片，滚动时吸附在顶部；三个页面标题位置、字号、间距统一 */
@media (max-width: 600px) {
  .v2-userbar { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 8px); z-index: 7; /* 只在本页内悬浮：低于底部导航(8)、顶栏(9)、抽屉菜单(10/11)、弹窗(12)等所有浮层（10-10） */ flex-direction: row !important; align-items: center !important; gap: 10px !important; padding: 10px 12px !important; margin-bottom: 18px !important;
    background: rgba(40, 40, 42, .78) !important; -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4);
    border: 1px solid #ffffff14 !important; box-shadow: 0 12px 30px rgba(0, 0, 0, .45), 0 2px 8px rgba(0, 0, 0, .3), inset 0 1px 0 #ffffff12 !important; }
  .v2-userbar .v2-user { flex: 0 0 auto; }
  .v2-userbar .v2-user > b { display: none; }
  .v2-userbar .mavatar.v2-av { width: 34px !important; height: 34px !important; }
  .v2-userbar .v2-stats { flex: 1 1 auto; min-width: 0; gap: 8px !important; justify-content: space-between !important; }
  .v2-userbar .v2-stat { min-width: 0; gap: 1px; }
  .v2-userbar .v2-stat small { font-size: 10.5px !important; white-space: nowrap; }
  .v2-userbar .v2-stat b { font-size: 13.5px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .v2-userbar .v2-topup { flex: 0 0 auto; min-width: 0 !important; height: 32px; padding: 0 14px !important; display: inline-flex; align-items: center; }
  /* 三个页面的标题统一：同样的起点、字号、标题下间距；行情页插图不再把标题往下推 */
  #main.tab-root > .titlebar, #main.tab-root > .v2-list-head { margin-top: 0 !important; padding-top: 0 !important; margin-bottom: 18px !important; align-items: flex-start !important; }
  #main.tab-root > .ui-scene-title:has(> .ui-page-header) { min-height: 72px; }
  #main.tab-root > .titlebar h1, #main.tab-root > .v2-list-head h1 { margin: 0 0 6px !important; line-height: 1.2; }
}

/* 已显示过的图片再次出现（返回上一页、换页回来）：直接显示，不再从透明渐显（10-10） */
img.pm-now { transition: none !important; }

/* 手机作品详情「交易记录」标题行（10-10）：右边「实时更新」和说明文字与左边标题垂直居中对齐，两行都靠右 */
@media (max-width: 600px) {
  [data-trades] > .titlebar { align-items: center !important; }
  [data-trades] > .titlebar h1 { margin: 0 !important; }
  [data-trades] > .titlebar > .trades-live { flex: 0 0 auto !important; align-items: flex-end !important; text-align: right !important; }
}

/* 手机作品卡片（10-10）：
   1) 右上角显示 24H 涨跌幅（和参考价涨跌幅一致），名字过长省略，不挤掉涨跌幅；
   2) 手机没有悬停：点按时 iOS 会触发 :hover，卡片上移 4px，返回时这张卡还保持悬停状态 → 看起来「跳一下」，这里全部关掉 */
@media (max-width: 600px) {
  .v2-meta [data-lc] { display: inline !important; flex: 0 0 auto; font-size: 11px; }
  /* 名字过长省略；左右上下各留 3px，头像的橙色圆圈不被裁掉（10-10） */
  .v2-meta .v2-creator { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 3px 0 3px 3px; margin: -3px 0 -3px -3px; }
  .v2-meta .mavatar.cr-av { width: 20px !important; height: 20px !important; margin-right: 1px; }
}
@media (hover: none) {
  .v2-card:hover, .art-card:hover, .my-card:hover { transform: none !important; }
  .v2-card:hover .art-top img, .art-card:hover .art-top img { transform: none !important; }
}

/* 头像统一带橙色圆圈（10-10）：作品卡片、作品详情持有人、成交记录、客服等所有头像；大头像、个人中心保留原来更粗的光圈；换头像的候选列表不加 */
.mavatar { box-shadow: 0 0 0 1.5px var(--v2-accent, #ff7a1a), 0 0 6px #ff7a1a33; }
.mavatar.avatar { border: 0 !important; box-shadow: 0 0 0 2px var(--v2-accent, #ff7a1a), 0 0 10px #ff7a1a40; }
.av-opt .mavatar { box-shadow: none; }

/* 区块链确权存证费说明文字（10-10，后台「存证费说明文字」可改） */
.fee-summary-box .fee-row { align-items: flex-start; }
.fee-summary-box .fee-k { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fee-summary-box .fee-k small { font-size: 11.5px; line-height: 1.4; color: var(--c-text-3, #8a8a90); font-weight: 400; }
.fee-summary-box .fee-v { flex: 0 0 auto; text-align: right; white-space: nowrap; }
.fee-note-inline { display: block; margin-top: 2px; font-size: 12px; font-weight: 400; color: var(--c-text-3, #9a9aa0); }
/* 电脑端同样：作品卡片持有人头像的橙色圆圈留出空间，不被名字区域裁掉（10-10） */
.v2-creator { padding: 3px 0 3px 3px; margin: -3px 0 -3px -3px; }
/* 作品卡片标题：名字过长时省略名字，系列编号 #N 始终完整显示（10-10） */
.v2-card h3 a { display: flex; align-items: baseline; gap: 5px; min-width: 0; }
.v2-card h3 .v2-nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v2-card h3 .v2-no { flex: 0 0 auto; }
/* 持有人名字过长：显示省略号（flex 容器里省略号不生效，改为块级，头像和名字同一行） */
.v2-meta .v2-creator { display: block; flex: 1 1 auto; }
.v2-meta .v2-creator .mavatar { margin-right: 6px; vertical-align: middle; }
