* { margin:0; padding:0; box-sizing:border-box; }
:root { --a1:#ff7a33; --a2:#e8301e; }
html, body { height:100%; }
body {
  background: linear-gradient(135deg, #e8edf5 0%, #f6f8fc 50%, #ffffff 100%);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  color:#1f2937;
  -webkit-font-smoothing:antialiased;
}

/* ===== 响应式主容器 ===== */
.app {
  position:relative; width:100%; height:100vh; height:100dvh; margin:0 auto;
  display:flex; flex-direction:column; overflow:hidden;
  background: linear-gradient(160deg, #f3f6fb 0%, #ffffff 100%);
}
.app::before {
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image: radial-gradient(rgba(232,48,30,0.07) 1px, transparent 1px);
  background-size: 22px 22px;
  mask-image: linear-gradient(180deg, #000 0%, transparent 65%);
  -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 65%);
}
.app::after {
  content:""; position:absolute; top:-90px; left:50%; transform:translateX(-50%);
  width:280px; height:200px; border-radius:50%; pointer-events:none; z-index:0;
  background: radial-gradient(circle, var(--a1) 0%, transparent 70%);
  opacity:.14; filter: blur(18px); transition: background .4s;
}

.statusbar { display:none; }
.header { position:relative; z-index:2; padding:14px 22px 10px; }
.hrow { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; }
.hlogo {
  width:46px; height:46px; border-radius:13px; object-fit:cover; flex:none; align-self:center;
  box-shadow:0 12px 24px -12px rgba(200,22,29,.55);
}
.hello { display:none; }
.htitle {
  font-size:23px; font-weight:700; margin-top:2px; letter-spacing:1px;
  background:linear-gradient(90deg, var(--a1), var(--a2));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  transition: background .4s;
}
.hsub { font-size:12px; color:#9ca3af; margin-top:4px; }

/* 视图切换 */
.view-switch {
  display:flex; align-items:center; gap:3px; padding:3px; border-radius:14px; flex:none;
  background:rgba(0,0,0,0.04); border:1px solid rgba(0,0,0,0.04);
}
.view-btn {
  width:34px; height:34px; border-radius:11px; border:none; background:transparent;
  cursor:pointer; display:flex; align-items:center; justify-content:center; color:#9ca3af; transition: all .25s;
}
.view-btn.active {
  background:linear-gradient(135deg, var(--a1), var(--a2));
  color:#fff; box-shadow:0 6px 14px -4px var(--a1);
}

/* 顶部横向滚动新闻条 */
.ticker {
  position:relative; z-index:2; margin:0 16px 14px; padding:12px 14px; border-radius:18px;
  background:#fff; border:1px solid rgba(0,0,0,0.05); box-shadow:0 4px 18px rgba(0,0,0,0.05);
  display:flex; align-items:center; gap:10px;
}
.ticker-label {
  flex:none; font-size:11px; font-weight:700; color:#fff;
  background:linear-gradient(135deg,#f43f5e,#fb7185); padding:4px 9px; border-radius:10px;
  box-shadow:0 4px 10px rgba(244,63,94,0.25);
}
.ticker-track { flex:1; overflow:hidden; }
.ticker-list { display:flex; gap:44px; white-space:nowrap; animation: ticker 18s linear infinite; }
.ticker-list:hover { animation-play-state: paused; }
.ticker-list li { font-size:13px; color:#374151; list-style:none; }
@keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* 二级子导航 */
.subtabs { position:relative; z-index:2; display:none; gap:8px; padding:0 16px 12px; }
.subtab {
  flex:1; padding:9px 0; border-radius:12px; border:none; background:rgba(0,0,0,0.04);
  color:#6b7280; font-size:13px; font-weight:600; cursor:pointer; transition:.25s;
  font-family:inherit;
}
.subtab.active {
  background:linear-gradient(135deg, var(--a1), var(--a2));
  color:#fff; box-shadow:0 6px 16px -6px var(--a1);
}

/* 内容区 */
.content { position:relative; z-index:2; flex:1; overflow-y:auto; padding:2px 16px 18px; }
.content::-webkit-scrollbar { width:0; }
.grid { display:grid; gap:12px; }
.view-grid { grid-template-columns: 1fr 1fr; }
.view-list { display:flex; flex-direction:column; }

.card {
  position:relative; padding:16px; border-radius:18px; overflow:hidden; cursor:pointer;
  background:#fff; border:1px solid rgba(0,0,0,0.05); box-shadow:0 4px 18px rgba(0,0,0,0.05);
  transition: transform .22s, box-shadow .22s, border-color .22s; animation: fadeUp .45s both;
}
.view-list .card { display:flex; align-items:center; gap:14px; }
.card:active { transform: scale(.97); }
.card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--a1) 35%, transparent);
  box-shadow: 0 14px 32px rgba(0,0,0,0.10), 0 6px 18px -6px color-mix(in srgb, var(--a1) 40%, transparent);
}
.view-list .card:hover { transform: translateY(-3px); }

.badge {
  width:42px; height:42px; border-radius:12px; flex:none;
  background:linear-gradient(135deg, var(--a1), var(--a2));
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:17px; font-weight:700;
  box-shadow: 0 8px 18px -6px var(--a1); transition: background .4s;
  overflow:hidden;
}
.badge.badge-img { background: #fff; border: 1px solid rgba(0,0,0,0.06); box-shadow: 0 6px 14px -5px rgba(0,0,0,0.12); }
.badge.badge-img img { width:100%; height:100%; object-fit:cover; display:block; }
.mn { font-size:14px; font-weight:700; color:#1f2937; margin-top:13px; }
.ms { font-size:12px; color:#6b7280; margin-top:5px; line-height:1.35; }
.view-list .mn { margin-top:0; }
.view-list .ms { margin-top:2px; }
.view-grid .badge { margin: 0 auto; }
.view-grid .mn, .view-grid .ms { text-align:center; }

/* 更多项目列表 */
.more-grid { display:flex; flex-direction:column; gap:12px; }
.m-card {
  display:flex; align-items:flex-start; gap:14px; padding:12px;
  border-radius:18px; cursor:pointer; background:#fff;
  border:1px solid rgba(0,0,0,0.05); box-shadow:0 4px 18px rgba(0,0,0,0.05);
  transition: transform .18s, box-shadow .18s, border-color .18s;
}
.m-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--a1) 35%, transparent); box-shadow:0 10px 26px rgba(0,0,0,0.09); }
.m-card:active { transform: scale(.985); }
.m-thumb {
  flex:0 0 64px; width:64px; height:64px; border-radius:14px; overflow:hidden;
  background:linear-gradient(135deg, color-mix(in srgb, var(--a1) 22%, #fff), color-mix(in srgb, var(--a2) 26%, #fff));
  display:flex; align-items:center; justify-content:center; position:relative;
}
.m-thumb svg { stroke: var(--a1); }
.m-body { flex:1; min-width:0; padding-top:2px; }
.m-title { font-size:15px; font-weight:700; color:#1f2937; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.m-desc { font-size:12px; color:#6b7280; margin-top:4px; line-height:1.45; white-space:normal; word-break:break-all; }
.m-go {
  flex:0 0 auto; height:34px; padding:0 14px; border-radius:17px; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--a1), var(--a2)); color:#fff;
  box-shadow:0 8px 18px -8px var(--a2);
  transition: transform .18s;
  align-self:center; margin-top:2px;
  font-size:13px; font-weight:600; white-space:nowrap; font-family:inherit;
}
.m-card:hover .m-go { transform: translateX(2px) scale(1.05); }

/* 联系方式页 */
.contact-grid { display:flex; flex-direction:column; gap:14px; }
.ct-hero {
  position:relative; overflow:hidden;
  background:linear-gradient(150deg, var(--a1), var(--a2));
  border-radius:22px; padding:18px 18px 20px; text-align:center; color:#fff;
  box-shadow:0 14px 30px -12px var(--a2);
}
.ct-hero::after {
  content:''; position:absolute; right:-40px; top:-40px; width:140px; height:140px;
  background:radial-gradient(circle, rgba(255,255,255,.18), transparent 70%);
}
.ct-hero-badge {
  width:48px; height:48px; margin:0 auto 8px; border-radius:15px;
  background:rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center;
  backdrop-filter:blur(4px);
}
.ct-hero-badge svg { width:26px; height:26px; stroke:#fff; }
.ct-hero-h { font-size:20px; font-weight:800; letter-spacing:1px; }
.ct-intro { font-size:12.5px; opacity:.92; margin-top:6px; line-height:1.5; }
.ct-qr {
  width:172px; height:172px; margin:16px auto 0; border-radius:18px; background:#fff;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.ct-qr img { width:100%; height:100%; object-fit:contain; }
.ct-wx {
  display:flex; align-items:center; justify-content:center; gap:10px; margin-top:12px;
  background:rgba(255,255,255,.16); border-radius:14px; padding:10px 12px;
}
.ct-wx-label { font-size:13px; opacity:.9; }
.ct-wx-val { font-size:16px; font-weight:700; letter-spacing:.5px; }
.ct-copy {
  border:none; cursor:pointer; padding:6px 12px; border-radius:10px; font-size:12px; font-weight:600;
  background:#fff; color:var(--a2); display:flex; align-items:center; gap:4px; flex:0 0 auto; font-family:inherit;
}
.ct-copy svg { width:13px; height:13px; stroke:var(--a2); }
.ct-phone {
  display:flex; align-items:center; gap:13px; padding:14px;
  background:#fff; border-radius:18px; border:1px solid rgba(0,0,0,.05);
  box-shadow:0 4px 18px rgba(0,0,0,0.05);
}
.ct-phone-ic {
  flex:0 0 44px; width:44px; height:44px; border-radius:13px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--a1), var(--a2)); color:#fff;
}
.ct-phone-ic svg { width:21px; height:21px; stroke:#fff; }
.ct-phone-body { flex:1; min-width:0; }
.ct-phone-label { font-size:12.5px; color:#6b7280; }
.ct-phone-val { font-size:17px; font-weight:700; color:#1f2937; margin-top:2px; letter-spacing:.5px; }
.ct-phone .ct-copy { background:linear-gradient(135deg, var(--a1), var(--a2)); color:#fff; }
.ct-phone .ct-copy svg { stroke:#fff; }
.ct-call {
  flex:0 0 auto; text-decoration:none; padding:8px 14px; border-radius:12px; font-size:13px; font-weight:700;
  color:#fff; background:rgba(31,41,55,.85); display:flex; align-items:center; justify-content:center;
}
.ct-call:active { transform: scale(.96); }
.ct-board {
  background:#fff; border-radius:20px; padding:18px 16px 20px;
  border:1px solid rgba(0,0,0,.05); box-shadow:0 4px 18px rgba(0,0,0,.05);
}
.ct-board-h { font-size:17px; font-weight:800; color:#1f2937; }
.ct-board-sub { font-size:12px; color:#9ca3af; margin-top:4px; margin-bottom:14px; }
.ct-form { display:flex; flex-direction:column; gap:10px; }
.ct-input {
  width:100%; box-sizing:border-box; font-size:14px; padding:11px 13px; border-radius:12px;
  border:1px solid #ececef; background:#fafafa; color:#1f2937; outline:none;
  transition:border-color .15s, background .15s; font-family:inherit;
}
.ct-input:focus { border-color:var(--a1); background:#fff; }
.ct-textarea { resize:vertical; min-height:78px; line-height:1.5; }
.ct-submit {
  margin-top:2px; border:none; cursor:pointer; height:46px; border-radius:14px; font-size:15px; font-weight:700; color:#fff;
  background:linear-gradient(135deg, var(--a1), var(--a2)); box-shadow:0 10px 22px -10px var(--a2);
  transition:transform .15s, filter .15s; font-family:inherit;
}
.ct-submit:hover { transform:translateY(-1px); filter:brightness(1.04); }
.ct-submit:active { transform:scale(.98); }
.ct-submit:disabled { opacity:.6; cursor:default; transform:none; }
.ct-form-ok {
  margin-top:12px; padding:11px 14px; border-radius:12px; font-size:13px; color:#15803d;
  background:#f0fdf4; border:1px solid #bbf7d0; text-align:center;
}

/* 空状态 */
.empty-state {
  grid-column: 1 / -1;
  text-align: center;
  padding: 60px 20px;
  color: #9ca3af;
}
.empty-state svg {
  margin-bottom: 12px;
  opacity: 0.5;
}

/* 底部导航 */
.tabbar {
  position:relative; z-index:3; display:flex; gap:10px;
  padding:10px 14px calc(12px + env(safe-area-inset-bottom));
  background:#f6f6f8;
  border-top:1px solid rgba(0,0,0,0.04);
}
.tab {
  flex:1; display:flex; flex-direction:column; align-items:center; gap:5px;
  padding:10px 0 8px;
  border-radius:18px;
  background:linear-gradient(150deg, #fff3f1, #ffe5e0);
  box-shadow:0 2px 10px rgba(232,48,30,0.06), 0 1px 2px rgba(232,48,30,0.04);
  border:1px solid rgba(232,48,30,0.10);
  color:#d8584a; cursor:pointer; font-family:inherit; font-size:11px; font-weight:600;
  transition:all .28s cubic-bezier(.25,.8,.25,1);
}
.tic {
  width:30px; height:30px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.6); border-radius:10px; transition:all .28s;
}
.tab .tic svg { width:24px; height:24px; stroke:#e0584b; transition:stroke .28s; }
.tab.active {
  background:linear-gradient(145deg, var(--a1), var(--a2));
  color:#fff;
  box-shadow:0 12px 24px -8px rgba(255,122,51,0.45), 0 4px 8px -2px rgba(232,48,30,0.25);
  transform:translateY(-2px);
  border-color:transparent;
}
.tab.active .tic { background:rgba(255,255,255,0.22); }
.tab.active .tic svg { stroke:#fff; }

/* 网站备案号（页面最底部） */
.site-footer {
  flex:none; z-index:3;
  display:flex; align-items:center; justify-content:center;
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  background:#f6f6f8;
  border-top:1px solid rgba(0,0,0,0.04);
  font-size:12px; line-height:1.4; color:#9aa0a6;
}
.site-footer a {
  color:#9aa0a6; text-decoration:none; letter-spacing:.3px;
  transition:color .2s;
}
.site-footer a:hover { color:#e0584b; }

/* ===== 二级详情页（手机全屏 / 桌面右侧抽屉） ===== */
.scrim {
  position:fixed; inset:0; z-index:9; background:rgba(15,18,25,0.42); backdrop-filter:blur(2px);
  opacity:0; visibility:hidden; transition: opacity .3s, visibility .3s;
}
.scrim.show { opacity:1; visibility:visible; }
.detail {
  position:fixed; inset:0; z-index:10; background:#f6f8fc;
  display:flex; flex-direction:column; transform: translateX(100%); transition: transform .34s cubic-bezier(.22,1,.36,1);
}
.detail.show { transform: translateX(0); }
.d-top {
  position:relative; z-index:12; display:flex; align-items:center; gap:10px;
  padding:14px 16px 10px; background:rgba(246,248,252,0.92); backdrop-filter:blur(8px);
}
.d-back {
  width:36px; height:36px; border-radius:12px; border:none; cursor:pointer; background:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,0.06); display:flex; align-items:center; justify-content:center; color:#374151; flex:none;
}
.d-top-t { font-size:16px; font-weight:700; color:#1f2937; }
.d-top-s { font-size:11px; color:#9ca3af; }
.d-scroll { flex:1; overflow-y:auto; padding:4px 16px 24px; }
.d-scroll::-webkit-scrollbar { width:0; }
.d-fade { animation: fadeUp .5s both; }

.d-cover {
  height:154px; border-radius:22px; position:relative; overflow:hidden;
  background:linear-gradient(135deg, var(--a1), var(--a2));
  display:flex; align-items:flex-end; padding:18px; color:#fff; box-shadow:0 16px 34px -12px var(--a1);
}
.d-cover::before { content:""; position:absolute; top:-40%; right:-20%; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,0.35), transparent 65%); }
.d-cover::after {
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 35%, rgba(0,0,0,0.35)), radial-gradient(rgba(255,255,255,0.16) 1px, transparent 1px);
  background-size: auto, 16px 16px;
}
.d-cover .cv-tag {
  position:absolute; top:15px; left:15px; font-size:11px; font-weight:700;
  background:rgba(255,255,255,0.28); padding:5px 11px; border-radius:20px; backdrop-filter:blur(6px); z-index:3;
}
.d-cover .cv-fav {
  position:absolute; top:13px; right:14px; z-index:3; width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,0.22); backdrop-filter:blur(6px); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; color:#fff;
}
.d-cover .cv-num { font-size:24px; font-weight:800; position:relative; z-index:2; line-height:1; text-shadow:0 2px 10px rgba(0,0,0,0.25); }
.d-cover .cv-sub { font-size:11px; opacity:.9; margin-top:5px; position:relative; z-index:2; }
.d-cover.has-bg { background-image: none; }
.d-cover-shade { position:absolute; inset:0; z-index:1; background:linear-gradient(135deg, rgba(0,0,0,0.45), rgba(0,0,0,0.25)); pointer-events:none; }
.d-chips { display:flex; gap:8px; margin:14px 2px 2px; flex-wrap:wrap; }
.d-chip { font-size:11px; font-weight:700; color:#e8301e; padding:5px 11px; border-radius:20px; background:rgba(232,48,30,0.10); border:1px solid rgba(232,48,30,0.18); }
.d-stats { display:flex; gap:10px; margin:14px 0 4px; }
.d-stat { flex:1; background:#fff; border-radius:18px; padding:14px 8px; text-align:center; box-shadow:0 6px 20px rgba(0,0,0,0.05); position:relative; overflow:hidden; transition: transform .2s; }
.d-stat:hover { transform: translateY(-3px); }
.d-stat .si { width:30px; height:30px; border-radius:10px; margin:0 auto 8px; background:linear-gradient(135deg, rgba(255,122,51,0.16), rgba(232,48,30,0.18)); display:flex; align-items:center; justify-content:center; }
.d-stat .si svg { stroke:#e8301e; }
.d-stat .v { font-size:19px; font-weight:800; background:linear-gradient(90deg,var(--a1),var(--a2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.d-stat .k { font-size:11px; color:#9ca3af; margin-top:3px; }

.d-sec { margin-top:22px; }
.d-sec-h { font-size:14px; font-weight:700; color:#1f2937; display:flex; align-items:center; gap:8px; margin-bottom:11px; }
.d-sec-h::before { content:""; width:4px; height:15px; border-radius:3px; background:linear-gradient(var(--a1),var(--a2)); }
.d-stats-wrap .d-sec-h { margin-top:4px; }
.d-stats-wrap .d-stats { margin-top:0; }
.d-text { font-size:13px; line-height:1.95; color:#4b5563; text-align:justify; word-break:break-all; }
.d-text b { color:#e8301e; font-weight:700; }
/* 富文本内容（iframe 隔离渲染） */
.d-html-frame {
  width:100%; border:none; border-radius:16px; display:block; background:transparent;
}
.d-imgs { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.d-img {
  height:108px; border-radius:16px; position:relative; overflow:hidden;
  background:linear-gradient(135deg, rgba(255,122,51,0.20), rgba(232,48,30,0.24)); border:1px solid rgba(232,48,30,0.10);
  display:flex; align-items:center; justify-content:center; cursor:pointer; transition: transform .25s, box-shadow .25s;
}
.d-img svg { stroke:#e8301e; opacity:.75; }
.d-img:hover { transform: translateY(-3px) scale(1.02); box-shadow:0 12px 24px -10px var(--a1); }
.d-img.wide { grid-column:1 / -1; height:124px; }
/* 图片布局：单排整行 / 竖版大图（高度可在后台自由设置） */
.d-imgs { align-items:stretch; }
.d-img.full { grid-column:1 / -1; height:150px; }
.d-img.portrait { height:380px; }
.d-img .ph { position:absolute; left:10px; bottom:9px; font-size:10px; color:#fff; background:rgba(0,0,0,0.28); padding:3px 8px; border-radius:8px; }
/* 邀请码：居中完整展示，支持长按保存 / 识别 */
.d-invite { display:flex; flex-direction:column; align-items:center; }
.d-invite-img {
  display:block; max-width:100%; height:auto; object-fit:contain; border-radius:14px;
  box-shadow:0 10px 26px -14px rgba(0,0,0,.28);
  -webkit-touch-callout:default; -webkit-user-select:auto; user-select:auto;
}
.d-invite-hint { margin-top:9px; font-size:12px; color:#9ca3af; text-align:center; }
.d-invite-empty {
  width:100%; min-height:140px; border-radius:14px; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:6px; color:#e8301e;
  background:linear-gradient(135deg, rgba(255,122,51,0.20), rgba(232,48,30,0.24)); border:1px solid rgba(232,48,30,0.10);
}
.d-invite-empty svg { opacity:.75; }
.d-invite-empty .ph { font-size:10px; color:#fff; background:rgba(0,0,0,0.28); padding:3px 8px; border-radius:8px; }
/* 视频 */
.d-video-wrap { position:relative; }
.v-landscape {
  margin-top:10px; display:inline-flex; align-items:center; gap:5px;
  padding:8px 16px; border-radius:999px; border:none; cursor:pointer;
  background:linear-gradient(135deg, var(--a1), var(--a2)); color:#fff;
  font-size:13px; font-weight:600; box-shadow:0 6px 16px -6px var(--a1);
}
.v-landscape:active { transform:scale(.97); }
/* 全屏（横屏播放）时：视频铺满整个屏幕 */
.d-video-wrap:fullscreen { background:#000; display:flex; align-items:center; justify-content:center; }
.d-video-wrap:-webkit-full-screen { background:#000; display:flex; align-items:center; justify-content:center; }
.d-video-wrap:fullscreen .d-video,
.d-video-wrap:-webkit-full-screen .d-video { height:100%; border-radius:0; }
.d-video-wrap:fullscreen video,
.d-video-wrap:-webkit-full-screen video { width:100%; height:100%; object-fit:contain; }
.d-video-wrap:fullscreen .v-cap,
.d-video-wrap:fullscreen .v-landscape,
.d-video-wrap:-webkit-full-screen .v-cap,
.d-video-wrap:-webkit-full-screen .v-landscape { display:none; }
.d-video {
  height:200px; border-radius:20px; overflow:hidden; position:relative; cursor:pointer;
  background: radial-gradient(circle at 72% 28%, rgba(255,122,51,0.45), transparent 55%), linear-gradient(135deg, #2c2c34, #16161c);
}
.d-video video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; z-index:2; }
.d-video::before { content:""; position:absolute; inset:0; background-image: repeating-linear-gradient(45deg, rgba(255,255,255,0.04) 0 2px, transparent 2px 14px); pointer-events:none; }
.d-play {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:60px; height:60px; border-radius:50%;
  background:rgba(255,255,255,0.95); box-shadow:0 10px 30px rgba(0,0,0,0.4); display:flex; align-items:center; justify-content:center; z-index:3;
}
.d-play svg { fill:#e8301e; margin-left:3px; }
.d-play::after { content:""; position:absolute; inset:-6px; border-radius:50%; border:2px solid rgba(255,255,255,0.4); animation: pulse 2s infinite; }
@keyframes pulse { 0%{transform:scale(.9);opacity:.8} 70%{transform:scale(1.25);opacity:0} 100%{opacity:0} }
.d-video .v-cap { position:absolute; left:14px; bottom:46px; color:#fff; z-index:3; font-size:13px; font-weight:600; text-shadow:0 1px 6px rgba(0,0,0,0.5); }
.d-video .v-ctrl { position:absolute; left:0; right:0; bottom:0; height:38px; z-index:3; background:linear-gradient(180deg, transparent, rgba(0,0,0,0.55)); display:flex; align-items:center; gap:10px; padding:0 14px; color:#fff; }
.d-video .v-ctrl svg { stroke:#fff; flex:none; }
.d-video .v-bar { flex:1; height:3px; border-radius:3px; background:rgba(255,255,255,0.3); overflow:hidden; }
.d-video .v-bar i { display:block; height:100%; width:38%; background:#fff; border-radius:3px; }
.d-video .v-time { font-size:11px; opacity:.9; flex:none; }
.d-video.playing .d-play { background:rgba(255,255,255,0.16); backdrop-filter:blur(4px); }
.d-video.playing .d-play svg { fill:#fff; }

.d-info { background:#fff; border-radius:18px; padding:4px 16px; box-shadow:0 6px 20px rgba(0,0,0,0.05); }
.d-info li { list-style:none; display:flex; align-items:center; gap:10px; padding:12px 0; border-bottom:1px solid #f1f3f7; font-size:13px; }
.d-info li:last-child { border-bottom:none; }
.d-info .ic { width:28px; height:28px; border-radius:9px; background:rgba(232,48,30,0.08); display:flex; align-items:center; justify-content:center; flex:none; }
.d-info .ic svg { stroke:#e8301e; }
.d-info .ik { color:#9ca3af; }
.d-info .iv { margin-left:auto; color:#1f2937; font-weight:600; }

.d-links { background:#fff; border-radius:18px; padding:4px 14px; box-shadow:0 6px 20px rgba(0,0,0,0.05); }
.d-link { display:flex; align-items:center; gap:12px; padding:13px 2px; border-bottom:1px solid #f1f3f7; text-decoration:none; cursor:pointer; transition: background .2s; }
.d-link:last-child { border-bottom:none; }
.d-link:hover { background:rgba(232,48,30,0.04); }
.d-link .lic { width:36px; height:36px; border-radius:11px; background:linear-gradient(135deg, rgba(255,122,51,0.16), rgba(232,48,30,0.18)); display:flex; align-items:center; justify-content:center; flex:none; }
.d-link .lic svg { stroke:#e8301e; }
.d-link .ln { font-size:13.5px; font-weight:600; color:#1f2937; }
.d-link .ls { font-size:11px; color:#9ca3af; margin-top:2px; display:block; }
.d-link .arr { margin-left:auto; color:#c9ccd4; flex:none; }

.d-btns {
  display:flex; gap:10px; margin-top:24px;
}
.btn-share {
  flex:0 0 100px; height:50px; border-radius:15px; border:1px solid rgba(232,48,30,0.25); background:#fff; color:#e8301e;
  font-weight:700; font-size:14px; cursor:pointer; font-family:inherit; display:flex; align-items:center; justify-content:center; gap:6px;
}
.btn-claim {
  flex:1; height:50px; border-radius:15px; border:none; cursor:pointer; font-family:inherit;
  background:linear-gradient(135deg, var(--a1), var(--a2)); color:#fff; font-weight:800; font-size:15px;
  box-shadow:0 12px 26px -8px var(--a1); display:flex; align-items:center; justify-content:center; gap:8px; position:relative; overflow:hidden;
}
.btn-claim::after {
  content:""; position:absolute; top:0; left:-60%; width:50%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent); animation: shine 2.6s infinite;
}
@keyframes shine { 0%{left:-60%} 60%,100%{left:120%} }
.btn-claim:active { transform: scale(.98); }
.d-divider { height:1px; background:linear-gradient(90deg, transparent, rgba(0,0,0,0.08), transparent); margin:22px 0 0; }
@keyframes fadeUp { from { opacity:0; transform: translateY(16px); } to { opacity:1; transform: translateY(0); } }

/* ===== 响应式：平板 / PC ===== */
@media (min-width: 600px) {
  .view-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 900px) {
  .app {
    max-width: 1040px; height: calc(100vh - 48px); height: calc(100dvh - 48px);
    margin: 24px auto; border-radius: 28px; overflow:hidden;
    box-shadow: 0 40px 120px rgba(0,0,0,0.16), inset 0 0 0 1px rgba(0,0,0,0.04);
  }
  .header { padding-top: 18px; }
  .htitle { font-size:26px; }
  .app::after { width:360px; height:240px; }
  .view-grid { grid-template-columns: repeat(4, 1fr); }
  .ticker { margin: 0 24px 16px; }
  .content { padding: 2px 24px 24px; }
  .subtabs { padding: 0 24px 14px; }

  /* 详情页变成右侧抽屉 */
  .detail {
    left:auto; right:0; top:0; bottom:0; width: 460px; height:100%;
    box-shadow: -24px 0 70px rgba(0,0,0,0.22);
    border-radius: 24px 0 0 24px;
  }
  .d-scroll { padding: 4px 22px 24px; }
}
@media (min-width: 1280px) {
  .app { max-width: 1200px; }
  .view-grid { grid-template-columns: repeat(5, 1fr); }
}
