/* 倘卖无 · 旧版 PC 界面科技感皮肤（叠在 index.html 内联样式之后、mobile.css 之前）
 * 只做视觉增强：不改变任何 DOM 结构、不改业务逻辑。
 */
:root{
  --ink:#1A120A; --ink-2:#241A10;
  --mono:"SF Mono",ui-monospace,"JetBrains Mono",Consolas,monospace;
  --glass:rgba(255,255,255,.72);
}

/* ---------- 全局：暖纸张底 → 细网格科技底 ---------- */
body{
  background-color:#FFFDF4;
  background-image:
    radial-gradient(120% 80% at 12% -10%, rgba(242,145,58,.10), transparent 60%),
    radial-gradient(100% 80% at 92% 6%, rgba(242,179,61,.10), transparent 58%),
    linear-gradient(rgba(242,145,58,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242,145,58,.055) 1px, transparent 1px);
  background-size:auto, auto, 32px 32px, 32px 32px;
  background-attachment:fixed;
}

/* ---------- 顶栏：渐变横幅 → 深色科技条 ---------- */
header{
  position:relative; overflow:hidden;
  background:
    radial-gradient(90% 200% at 0% 0%, rgba(255,255,255,.9), transparent 62%),
    radial-gradient(90% 200% at 100% 100%, rgba(252,214,92,.75), transparent 60%),
    linear-gradient(115deg,#FFFFFF 0%,#FFFDF2 42%,#FFE9A3 78%,#FCD65C 100%) !important;
  border-bottom:1px solid #F2E4B8;
  box-shadow:0 10px 26px -20px rgba(190,150,30,.55);
  padding:16px 26px !important;
}
/* 顶部扫描线 */
header::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:linear-gradient(90deg,transparent,rgba(252,214,92,.95),rgba(242,145,58,.75),transparent);
  animation:hdScan 6s ease-in-out infinite;
}
@keyframes hdScan{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } }
header h1{ font-weight:800 !important; letter-spacing:2px !important; }
header p{ color:#7A6633 !important; opacity:1 !important; letter-spacing:.3px; }
header h1{ color:#2B2118 !important; }
header .userbox, header .userbox a{ color:#5B4A1F !important; }
.logo{
  background:none !important;
  border:none !important;
  border-radius:0 !important;
  padding:0 !important;
  box-shadow:none !important;
  width:182px !important; height:80px !important; max-width:none !important;
}
.hero-sell, .btn, .tabs button.active, .tab.active{
  background-image:linear-gradient(135deg,#FFC65C 0%,#F2913A 58%,#E8862E 100%) !important;
  color:#fff !important;
  box-shadow:0 10px 26px -14px rgba(242,145,58,.95) !important;
}
.userbox{ font-variant-numeric:tabular-nums; }

/* ---------- 主容器加宽，靠近 PC 阅读宽度 ---------- */
.wrap{ max-width:1080px !important; }

/* ---------- Tab：药丸 → 科技分段按钮 ---------- */
.tabs button, .tab{
  position:relative;
  background:var(--glass) !important;
  border:1px solid rgba(242,145,58,.16) !important;
  border-radius:12px !important;
  color:#6B5646 !important;
  letter-spacing:.3px;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, color .16s ease;
  backdrop-filter:blur(6px);
}
.tabs button:hover, .tab:hover{
  transform:translateY(-1px);
  border-color:rgba(242,145,58,.45) !important;
  color:#A75F11 !important;
  box-shadow:0 10px 24px -16px rgba(242,145,58,.9);
}
.tabs button.active, .tab.active{
  background:linear-gradient(135deg,#F2913A,#E8862E) !important;
  border-color:transparent !important;
  color:#fff !important;
  box-shadow:0 10px 26px -14px rgba(242,145,58,.95);
}

/* ---------- 卡片：白底柔阴影 → 玻璃拟态 + 顶部光边 ---------- */
.card{
  position:relative;
  background:linear-gradient(170deg,rgba(255,255,255,.94),rgba(255,251,247,.9)) !important;
  border:1px solid rgba(242,145,58,.14) !important;
  border-radius:18px !important;
  box-shadow:0 18px 46px -30px rgba(120,60,20,.55) !important;
  backdrop-filter:blur(8px);
}
.card::before{
  content:""; position:absolute; left:16px; right:16px; top:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(242,145,58,.55),rgba(242,179,61,.45),transparent);
  pointer-events:none;
}
.card h3, .card b{ letter-spacing:.2px; }

/* ---------- 表单：输入框科技化聚焦 ---------- */
input, select, textarea{
  background:rgba(255,255,255,.9) !important;
  border-radius:11px !important;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
input:focus, select:focus, textarea:focus{
  outline:none !important;
  border-color:var(--orange) !important;
  background:#fff !important;
  box-shadow:0 0 0 3px rgba(242,145,58,.14);
}
label{ letter-spacing:.2px; }

/* ---------- 按钮：渐变 + 高光扫过 ---------- */
.btn{
  position:relative; overflow:hidden;
  border-radius:12px !important;
  letter-spacing:.4px;
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.btn:hover{ transform:translateY(-1px); filter:brightness(1.04); }
.btn:active{ transform:translateY(0); }
.btn::after{
  content:""; position:absolute; top:0; bottom:0; left:-40%; width:35%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);
  transform:skewX(-18deg);
}
.btn:hover::after{ animation:btnShine .7s ease; }
@keyframes btnShine{ from{ left:-40%; } to{ left:130%; } }

/* ---------- 行情卡：更深的机器面板感 ---------- */
.market-card{
  border-radius:18px !important;
  border:1px solid rgba(242,145,58,.18) !important;
  box-shadow:0 18px 44px -32px rgba(120,60,20,.55) !important;
}
.market-card::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(242,145,58,.035) 1px, transparent 1px);
  background-size:100% 7px;
  opacity:.55;
}
.market-card .mk-item{
  transition:transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.market-card .mk-item:hover{
  transform:translateY(-1px);
  border-color:rgba(242,145,58,.55);
  background:linear-gradient(160deg,#FFFFFF,#FFF3E6);
  box-shadow:0 8px 20px -14px rgba(242,145,58,.6);
}

/* ---------- 表格：斑马纹 + 悬浮高亮 ---------- */
thead th{ background:#FBF3EC !important; letter-spacing:.3px; }
tbody tr{ transition:background .14s ease; }
tbody tr:hover{ background:#FFF7F1; }
td{ font-variant-numeric:tabular-nums; }

/* ---------- 状态标签：加一点描边，更利落 ---------- */
.tag{ border:1px solid currentColor; border-color:color-mix(in srgb, currentColor 26%, transparent); }

/* ---------- 通知面板 ---------- */
.notiPanel{ border-radius:16px !important; border:1px solid rgba(242,145,58,.16); }

/* ---------- 宽屏（PC 专属增强） ---------- */
@media (min-width: 900px){
  header{ padding:18px 34px !important; }
  .wrap{ padding:26px 24px 40px !important; }
  .card{ padding:24px 26px !important; }
  .market-card{ padding:20px 22px 16px !important; }
  .market-strip{ gap:10px; }
  /* PC 端卡片适当加宽，与手机端保持同一套滚动逻辑 */
  .mk-item{ flex:0 0 160px !important; width:160px !important; }
  /* PC 端显示左右滑动箭头 */
  .mk-arrow{ display:flex; }
  /* 表单两列更舒展 */
  .row{ gap:18px; }
}

/* ---------- 宽屏两侧光晕（氛围） ---------- */
@media (min-width: 1100px){
  body::before, body::after{
    content:""; position:fixed; z-index:0; pointer-events:none; border-radius:50%;
    filter:blur(70px); opacity:.5;
  }
  body::before{
    width:340px; height:340px; left:-120px; top:22%;
    background:radial-gradient(circle,rgba(242,145,58,.30),transparent 68%);
  }
  body::after{
    width:300px; height:300px; right:-110px; bottom:10%;
    background:radial-gradient(circle,rgba(242,179,61,.26),transparent 68%);
  }
  .wrap, header{ position:relative; z-index:1; }
}

/* ---------- 动效降级 ---------- */
@media (prefers-reduced-motion: reduce){
  header::after, .btn::after{ animation:none !important; }
  .tabs button, .tab, .btn, .card, .market-card .mk-item{ transition:none; }
  .tabs button:hover, .tab:hover, .btn:hover, .market-card .mk-item:hover{ transform:none; }
}
