*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#11192e;color:#e8ecf7;font:15px/1.6 system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif}
a{color:#8fb4ff}
:root{
  --brand1:#ff7a18; --brand2:#ffb347; --brand-ink:#1a1206;
  --points:#ffb84d;
  --aux:#93a3c4; --line:#2b3a5f; --panel:#182238; --deep:#0d1424;
  /* 图片舞台衬底：浅底产品图用影棚浅渐变（与白底图无缝衔接），透明底图用深色径向衬底让白色主体跳出来 */
  --stage-light:radial-gradient(130% 105% at 50% 26%,#ffffff 0%,#eef1f6 58%,#d9e0ec 100%);
  --stage-dark:radial-gradient(130% 105% at 50% 28%,#2c3d63 0%,#1a2745 56%,#0f1930 100%);
  --stage-ring:inset 0 0 0 1px rgba(130,150,190,.14);
  --card-shadow:0 6px 18px rgba(3,6,14,.32);
}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;background:#0d1424;position:sticky;top:0;z-index:20;border-bottom:1px solid #24304d}
.brand{display:flex;align-items:center;gap:9px;min-width:0}
.logo{background:linear-gradient(135deg,var(--brand1),var(--brand2));color:var(--brand-ink);font-weight:800;border-radius:8px;padding:2px 8px;font-size:15px;white-space:nowrap}
.brand-text{font-weight:700;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topnav{display:flex;gap:8px;flex-shrink:0}
.nav-btn{display:inline-flex;align-items:center;min-height:40px;padding:0 13px;border:1px solid #3a4a6e;border-radius:9px;color:#dbe4f7;text-decoration:none;font-size:14px}
.nav-btn.primary{background:#d9480f;border:none;color:#fff;font-weight:700}
.steps{background:#0d1424;border-bottom:1px solid #24304d;overflow-x:auto}
.steps ol{display:flex;gap:4px;list-style:none;margin:0;padding:8px 10px;min-width:max-content}
.steps li{padding:5px 9px;border-radius:999px;background:#1a2440;color:var(--aux);font-size:12.5px;white-space:nowrap}
.steps li.active{background:linear-gradient(135deg,var(--brand1),var(--brand2));color:var(--brand-ink);font-weight:700}
main{max-width:1060px;margin:0 auto;padding:0 14px 34px}
.hero{padding:20px 2px 2px}
.hero h1{margin:0 0 6px;font-size:26px;line-height:1.3}
.subtitle{margin:0 0 10px;color:#aebadd;font-size:14.5px}
.payline{margin:0 0 8px;padding:9px 12px;background:#2a2113;border:1px solid #6b5320;border-radius:9px;color:#ffd98a;font-size:13.5px}
.payline.ok{background:#12301f;border-color:#1f6b42;color:#9fe8bb}
.hero-note{margin:0;color:var(--aux);font-size:13.5px}
h2{font-size:19px;margin:26px 0 10px}
.points{color:var(--points);font-weight:800;font-size:14.5px;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 16px;background:#22304f;color:#e8ecf7;border:1px solid #3a4a6e;border-radius:10px;text-decoration:none;font-size:14.5px;cursor:pointer;font-weight:600}
.btn.cta{background:#d9480f;border:none;color:#fff;font-weight:800;box-shadow:0 4px 14px rgba(217,72,15,.35)}
.brand-img{height:26px;width:auto;display:block}
.btn.cta:active{filter:brightness(1.08)}
.btn.big{width:100%;min-height:52px;font-size:17px;border-radius:12px}
/* zones */
.zone-grid,.tool-grid{display:grid;gap:12px}
.zone-grid{grid-template-columns:1fr}
@media(min-width:680px){.zone-grid{grid-template-columns:1fr 1fr}.tool-grid{grid-template-columns:repeat(3,1fr)}}
.zone-card{display:flex;gap:12px;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px;cursor:pointer;color:inherit;font:inherit;min-height:44px;width:100%;box-shadow:var(--card-shadow)}
.zone-card:active{border-color:var(--brand1)}
.zone-img-wrap{flex:0 0 96px}
.zone-img-wrap img{width:96px;height:96px;object-fit:contain;padding:6px;border-radius:12px;background:var(--stage-light);box-shadow:var(--stage-ring);display:block}
.zone-body{display:flex;flex-direction:column;gap:4px;font-size:13.5px;color:#b9c5de}
.zone-body strong{font-size:16px;color:#fff}
.zone-cta{color:#ffa04d;font-weight:700}
/* hot */
.hot-note{color:var(--aux);font-size:13.5px;margin:0 0 12px}
.hot-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:680px){.hot-grid{grid-template-columns:1fr 1fr}}
.hot-card{position:relative;background:var(--panel);border:1px solid #3d4f7c;border-radius:16px;overflow:hidden;cursor:pointer;text-align:left;box-shadow:var(--card-shadow);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.hot-card img{width:100%;aspect-ratio:4/3;object-fit:contain;padding:14px;background:var(--stage-light);box-shadow:var(--stage-ring);display:block}
.hot-tag{position:absolute;top:10px;left:10px;background:rgba(13,20,36,.85);color:#ffa04d;border:1px solid var(--brand1);font-size:12px;font-weight:700;padding:2px 9px;border-radius:999px}
.hot-tag.real{background:linear-gradient(135deg,var(--brand1),var(--brand2));color:var(--brand-ink);border:none}
.hot-body{padding:12px 14px 14px}
.hot-body h3{margin:0;font-size:17.5px;line-height:1.35}
.hot-meta{margin:4px 0 2px;color:var(--aux);font-size:13px}
.hot-points{margin:2px 0 10px}
.hot-points .points{font-size:17px}
.hot-start{width:100%;min-height:48px;font-size:16px;border-radius:12px}
/* tools */
.tool-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px;box-shadow:var(--card-shadow)}
.tool-card img{width:100%;aspect-ratio:16/10;object-fit:contain;padding:12px;border-radius:12px;background:var(--stage-light);box-shadow:var(--stage-ring);display:block}
.tool-card h3{margin:10px 0 4px;font-size:16px}
.tool-card p{margin:0 0 12px;color:#b9c5de;font-size:13.5px;min-height:63px}
.tool-btn{width:100%;border-color:var(--brand1);color:#ffa04d;background:rgba(255,122,24,.08);font-weight:700}
/* channels （商城与渠道：纯文字卡，无图） */
.channel-card h3{margin-top:2px}
.channel-card .channel-link{display:block;text-align:center;text-decoration:none;line-height:38px}
/* catalog */
.catalog-count{color:var(--aux);margin:0 0 10px;font-size:13.5px}
.catalog-tools{display:flex;flex-direction:column;gap:9px;margin-bottom:10px}
@media(min-width:680px){.catalog-tools{flex-direction:row}.catalog-tools input{flex:1}}
.catalog-tools input,.catalog-tools select{min-height:44px;border-radius:10px;border:1px solid #3a4a6e;background:var(--deep);color:#e8ecf7;padding:0 12px;font-size:15px;width:100%}
.chips{display:flex;gap:7px;overflow-x:auto;padding:2px 0 12px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;min-height:36px;padding:0 13px;border-radius:999px;border:1px solid #3a4a6e;background:var(--deep);color:#b9c5de;font-size:13.5px;cursor:pointer}
.chip.on{border-color:var(--brand1);color:#ffa04d;background:rgba(255,122,24,.12);font-weight:700}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}
@media(min-width:680px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:960px){.grid{grid-template-columns:repeat(4,1fr)}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden;cursor:pointer;box-shadow:var(--card-shadow);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.card img{width:100%;aspect-ratio:4/3;object-fit:contain;padding:10px;background:var(--stage-light);box-shadow:var(--stage-ring);display:block}
@media(hover:hover){.hot-card:hover,.card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(3,6,14,.45);border-color:#4a5f8f}}
.card-body{padding:9px 10px 11px;display:flex;flex-direction:column}
.card-name{font-weight:700;font-size:14.5px;line-height:1.4;display:block}
.card-type{color:#8fb4ff;font-size:12.5px;display:block;margin-top:2px}
.card-spec{color:var(--aux);font-size:12.5px;display:block;margin-top:3px;line-height:1.45}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:9px}
.card-start{min-height:38px;padding:0 13px;font-size:13.5px;border-radius:9px}
.badge{display:inline-block;padding:0 7px;border-radius:999px;background:#24365e;font-size:11.5px;color:#bcd2ff;margin-left:5px;vertical-align:1px}
.badge.laser{background:#4a2f5e;color:#e3c8ff}
.skeleton{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}
.skeleton div{height:210px;border-radius:16px;background:linear-gradient(100deg,#182238 40%,#22304f 50%,#182238 60%);background-size:200% 100%;animation:sk 1.2s infinite}
@keyframes sk{to{background-position:-200% 0}}
.error-box{background:#3a1d1d;border:1px solid #7a3a3a;border-radius:12px;padding:16px;text-align:center}
.empty{color:var(--aux);text-align:center;padding:22px 0}
.footer{display:flex;justify-content:space-between;gap:10px;padding:16px 14px;border-top:1px solid #24304d;color:var(--aux);font-size:13px;max-width:1060px;margin:0 auto}
/* detail */
.overlay{position:fixed;inset:0;background:rgba(4,8,18,.78);z-index:50;overflow-y:auto;padding:14px}
.sheet{position:relative;background:#16203a;border:1px solid var(--line);border-radius:16px;max-width:560px;margin:12px auto;padding:18px}
.sheet h3{margin:0 34px 2px 0;font-size:19px;line-height:1.4}
.close-btn{position:absolute;top:10px;right:10px;width:42px;height:42px;border-radius:50%;border:1px solid #3a4a6e;background:var(--deep);color:#fff;font-size:22px;cursor:pointer;line-height:1}
.detail-type{color:#8fb4ff;margin:0 0 10px;font-size:13.5px}
.detail-imgs{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;padding-bottom:2px}
.detail-imgs figure{margin:0}
.detail-imgs figure:first-child{grid-column:1/-1}
.detail-imgs img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;padding:10px;border-radius:12px;background:var(--stage-light);box-shadow:var(--stage-ring);display:block}
.detail-imgs figure:first-child img{aspect-ratio:4/3;padding:16px}
.detail-imgs figcaption{font-size:12px;color:var(--aux);text-align:center;margin-top:3px}
.detail-specs{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:12px 0 16px;font-size:14px}
.detail-specs dt{color:var(--aux)}
.detail-specs dd{margin:0}
.detail-specs dd.points-cell{color:var(--points);font-weight:800;font-size:16.5px}
#detailEditor{margin-top:10px}
/* 透明底产品图（主体为白色/浅色/金色，源图无底色）：换深色舞台衬底，主体完整跳出。
   名单按 2026-10-29 逐张实测源图透明通道定的（文件名＝模板图唯一标识）：
   T恤正/背面、圆形军牌、长方形军牌、高尔夫球、圆形冰箱贴、长方形冰箱贴（两款）、
   卷轴形冰箱贴、圆形银币 30/40/50mm、照片书签白胚。 */
img[src*="20260102161444"][src],img[src*="20260102161446"][src],
img[src*="20260102161352"][src],img[src*="20260102161341"][src],
img[src*="20260102161417"][src],img[src*="20260102161401"][src],
img[src*="20260923164847"][src],img[src*="20261004105658"][src],
img[src*="20261004105706"][src],img[src*="20261004105244"][src],
img[src*="20261004105652"][src],img[src*="20261004105655"][src],
img[src*="20260923162315"][src]{background:var(--stage-dark)}
/* 主体在源图画布里占比偏小的两款（照片书签/书签白胚），缩小舞台留白让主体更大 */
img[src*="20260923210858"][src],img[src*="20260923162315"][src]{padding:5px}
.detail-desc{color:#cfd9ef;font-size:14px;white-space:pre-wrap;margin:14px 0 0}
.detail-hint{color:var(--aux);font-size:12.5px;text-align:center;margin:9px 0 0}
