/* =====================================================
   AI 万物皆可造 · Create v1.0 (XT-CREATE-20260916)
   深色矩阵风 · 零内联样式（CSP: default-src 'self'）
   ===================================================== */
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  background: #0B1220; color: #E2E8F0; line-height: 1.6;
  min-height: 100vh;
}
a { color: #38BDF8; text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- 顶栏 ---------- */
.cr-topbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 28px; background: rgba(15, 23, 42, .92);
  border-bottom: 1px solid #1E293B; position: sticky; top: 0; z-index: 50;
  backdrop-filter: blur(8px);
}
.cr-logo { font-size: 20px; font-weight: 700; color: #F8FAFC; }
.cr-logo:hover { text-decoration: none; color: #38BDF8; }
.cr-nav { display: flex; gap: 20px; align-items: center; }
.cr-nav a { color: #94A3B8; font-size: 14px; }
.cr-nav a:hover { color: #38BDF8; }

/* 会员积分徽章（v1.2） */
.cr-pts {
  font-size: 13px; font-weight: 600; color: #FBBF24;
  background: rgba(251, 191, 36, 0.12);
  border: 1px solid rgba(251, 191, 36, 0.35);
  border-radius: 999px; padding: 3px 12px; line-height: 1.4;
  cursor: help; white-space: nowrap;
}
@media (max-width: 720px) { .cr-pts { display: none; } }
.cr-back { border: 1px solid #334155; border-radius: 8px; padding: 4px 12px; }

/* ---------- Hero ---------- */
.cr-hero { text-align: center; padding: 52px 20px 30px; }
.cr-hero h1 { font-size: 42px; font-weight: 800; letter-spacing: 2px; }
.cr-hero h1 em { font-style: normal; color: #F59E0B; }
.cr-hero-sub { max-width: 760px; margin: 14px auto 0; color: #94A3B8; font-size: 15px; }
.cr-hero-chips { margin-top: 20px; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.cr-chip {
  background: #16223B; border: 1px solid #26334D; border-radius: 999px;
  padding: 5px 14px; font-size: 13px; color: #CBD5E1;
}

/* ---------- 生成卡片 ---------- */
.cr-gen-card {
  max-width: 860px; margin: 26px auto; padding: 26px 28px;
  background: #101A2E; border: 1px solid #22304C; border-radius: 16px;
}
.cr-gen-card h2 { font-size: 20px; color: #F8FAFC; }
.cr-gen-sub { color: #94A3B8; font-size: 13px; margin-top: 4px; }
.cr-form { margin-top: 16px; }
.cr-form textarea {
  width: 100%; background: #0B1220; color: #E2E8F0; border: 1px solid #2B3A57;
  border-radius: 10px; padding: 12px 14px; font-size: 14px; resize: vertical;
  font-family: inherit;
}
.cr-form textarea:focus, .cr-form select:focus { outline: none; border-color: #38BDF8; }
.cr-form-row { display: flex; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.cr-form select {
  flex: 1; min-width: 150px; background: #0B1220; color: #E2E8F0;
  border: 1px solid #2B3A57; border-radius: 10px; padding: 9px 12px; font-size: 13px;
}
.cr-btn-gen {
  margin-top: 14px; width: 100%; padding: 12px; font-size: 16px; font-weight: 700;
  color: #08101F; background: linear-gradient(135deg, #F59E0B, #F97316);
  border: none; border-radius: 10px; cursor: pointer; letter-spacing: 1px;
}
.cr-btn-gen:hover { filter: brightness(1.1); }
.cr-btn-gen:disabled { opacity: .55; cursor: wait; }
.cr-btn-sm { width: auto; padding: 8px 22px; margin-top: 8px; }
.cr-gate { display: none; margin-top: 14px; text-align: center; }
.cr-gate.at-show { display: block; }
.cr-gate p { color: #FBBF24; font-size: 13px; }
.cr-status { margin-top: 10px; font-size: 13px; color: #38BDF8; min-height: 18px; }
.cr-status.cr-err { color: #F87171; }

/* AI 结果 */
.cr-ai-result { display: none; margin-top: 18px; }
.cr-ai-result.cr-show { display: block; }
.cr-ai-ok { font-weight: 700; color: #F8FAFC; margin-top: 12px; }
.cr-ai-badge {
  background: rgba(245, 158, 11, .12); border: 1px solid rgba(245, 158, 11, .45);
  color: #FBBF24; border-radius: 8px; padding: 8px 12px; font-size: 12px;
}

/* ---------- 项目库 ---------- */
.cr-library { max-width: 1080px; margin: 30px auto 0; padding: 0 20px; text-align: center; }
.cr-library h2 { font-size: 22px; }
.cr-lib-sub { color: #64748B; font-size: 13px; margin-top: 4px; }
.cr-tabs { margin-top: 16px; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.cr-tab {
  background: #16223B; color: #CBD5E1; border: 1px solid #26334D; border-radius: 999px;
  padding: 8px 18px; font-size: 14px; cursor: pointer;
}
.cr-tab:hover { border-color: #38BDF8; }
.cr-tab.cr-active { background: #0EA5E9; color: #06121F; font-weight: 700; border-color: #0EA5E9; }

/* ---------- 查看器 ---------- */
.cr-viewer { max-width: 1080px; margin: 26px auto 40px; padding: 0 20px; }
.cr-view-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.cr-view-head h2 { font-size: 24px; color: #F8FAFC; }
.cr-meta { display: flex; gap: 8px; flex-wrap: wrap; }
.cr-meta span {
  background: #16223B; border: 1px solid #26334D; border-radius: 6px;
  padding: 3px 10px; font-size: 12px; color: #94A3B8;
}
.cr-meta span.cr-gold { color: #FBBF24; border-color: rgba(245,158,11,.5); }

/* 3D 舞台（CSS 3D，与拆解引擎同语言） */
.cr-3d-wrap {
  position: relative;
  margin-top: 18px; background: radial-gradient(ellipse at 50% 30%, #14203A 0%, #0B1220 70%);
  border: 1px solid #1E293B; border-radius: 16px; padding: 20px 0 8px;
}
.cr-scene {
  position: relative; z-index: 1;
  height: 340px; display: flex; align-items: center; justify-content: center;
  perspective: 1100px; overflow: hidden; touch-action: none; cursor: grab;
}
.cr-scene:active { cursor: grabbing; }
.cr-scene.cr-asm-lock { cursor: progress; }
.cr-stage { position: relative; width: 220px; height: 150px; transform-style: preserve-3d;
  transform: rotateX(var(--rx, 58deg)) rotateZ(var(--rz, -38deg)); }
.cr-layer { position: absolute; left: 0; top: 0; transform-style: preserve-3d; will-change: transform; }
.cr-plate {
  width: 220px; height: 130px; border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, .35);
  display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 4px;
  background: linear-gradient(135deg, #334155, #1E293B);
  box-shadow: 0 0 24px rgba(56, 189, 248, .08);
  transform: rotateZ(var(--anti, 0deg));
}
.cr-sel .cr-plate { border-color: #38BDF8; box-shadow: 0 0 30px rgba(56, 189, 248, .35); }
.cr-layer-idx { font-size: 11px; color: #7DD3FC; font-weight: 700; letter-spacing: 1px; }
.cr-glyph { font-size: 30px; line-height: 1; }
.cr-layer-name { font-size: 13px; color: #E2E8F0; font-weight: 600; }
.cr-3d-ctrl { display: flex; align-items: center; gap: 12px; justify-content: center; padding: 10px 16px 14px; }
.cr-3d-ctrl label { font-size: 12px; color: #94A3B8; }
.cr-3d-ctrl input[type="range"] { width: 260px; accent-color: #0EA5E9; }
.cr-hint { font-size: 11px; color: #475569; }

/* 分区 tabs */
.cr-sectabs { display: flex; gap: 8px; margin-top: 18px; flex-wrap: wrap; }
.cr-st {
  background: #101A2E; border: 1px solid #22304C; color: #94A3B8;
  border-radius: 8px; padding: 8px 16px; font-size: 14px; cursor: pointer;
}
.cr-st.active { background: #0EA5E9; color: #06121F; border-color: #0EA5E9; font-weight: 700; }
.cr-panel {
  margin-top: 14px; background: #101A2E; border: 1px solid #22304C;
  border-radius: 14px; padding: 22px 24px; min-height: 180px;
}
.cr-panel h3 { font-size: 17px; color: #F8FAFC; margin-bottom: 12px; }
.cr-panel h3 .cr-badge {
  font-size: 11px; color: #7DD3FC; background: rgba(14, 165, 233, .12);
  border: 1px solid rgba(14, 165, 233, .4); border-radius: 6px; padding: 2px 8px;
  margin-right: 8px; vertical-align: 2px;
}
.cr-panel p, .cr-panel li { font-size: 14px; color: #CBD5E1; }

/* 总览 */
.cr-overview-text { white-space: pre-wrap; }
.cr-specs { margin-top: 14px; display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.cr-spec {
  background: #0B1220; border: 1px solid #1E293B; border-radius: 10px; padding: 10px 12px;
}
.cr-spec b { display: block; font-size: 12px; color: #7DD3FC; font-weight: 600; }
.cr-spec span { font-size: 13px; color: #E2E8F0; }

/* BOM 表 */
.cr-bom { width: 100%; border-collapse: collapse; font-size: 13px; }
.cr-bom th {
  text-align: left; color: #7DD3FC; font-size: 12px; font-weight: 600;
  border-bottom: 1px solid #26334D; padding: 8px 6px; white-space: nowrap;
}
.cr-bom td { border-bottom: 1px solid #1B2740; padding: 8px 6px; vertical-align: top; color: #CBD5E1; }
.cr-bom tr:hover td { background: rgba(14, 165, 233, .05); }
.cr-bom .cr-price { color: #FBBF24; white-space: nowrap; }
.cr-bom .cr-sub { color: #64748B; font-size: 12px; }
.cr-bom-note { margin-top: 10px; font-size: 12px; color: #64748B; }

/* 接线 */
.cr-wire-svg { width: 100%; height: auto; background: #0B1220; border-radius: 10px; border: 1px solid #1E293B; }
.cr-wire-table { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 12px; }
.cr-wire-table th { text-align: left; color: #7DD3FC; font-size: 12px; padding: 6px; border-bottom: 1px solid #26334D; }
.cr-wire-table td { padding: 6px; border-bottom: 1px solid #1B2740; color: #CBD5E1; }
.cr-wire-table code { color: #FBBF24; font-family: Consolas, monospace; font-size: 12px; }

/* 步骤 */
.cr-steps { list-style: none; counter-reset: step; }
.cr-steps li {
  counter-increment: step; position: relative; padding: 12px 0 12px 46px;
  border-bottom: 1px dashed #1B2740;
}
.cr-steps li:last-child { border-bottom: none; }
.cr-steps li::before {
  content: counter(step); position: absolute; left: 0; top: 12px;
  width: 30px; height: 30px; border-radius: 50%; background: #0EA5E9; color: #06121F;
  font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 14px;
}
.cr-steps b { color: #F8FAFC; }
.cr-steps .cr-step-detail { color: #94A3B8; font-size: 13px; margin-top: 2px; }

/* 代码 */
.cr-code {
  background: #060B15; border: 1px solid #1E293B; border-radius: 10px;
  padding: 14px 16px; overflow-x: auto; font-family: Consolas, "Courier New", monospace;
  font-size: 12.5px; color: #A5F3FC; line-height: 1.55; white-space: pre;
}

/* 校验与风险 */
.cr-checklist { list-style: none; }
.cr-checklist li { padding: 8px 0 8px 34px; position: relative; border-bottom: 1px dashed #1B2740; font-size: 14px; }
.cr-checklist li:last-child { border-bottom: none; }
.cr-checklist li::before { content: "✅"; position: absolute; left: 4px; }
.cr-risklist { list-style: none; margin-top: 14px; }
.cr-risklist li { padding: 8px 0 8px 34px; position: relative; border-bottom: 1px dashed #1B2740; font-size: 14px; color: #FCA5A5; }
.cr-risklist li:last-child { border-bottom: none; }
.cr-risklist li::before { content: "⚠️"; position: absolute; left: 4px; }
.cr-risk-title { color: #F87171; font-size: 14px; font-weight: 700; margin-top: 16px; }

/* 页脚 */
.cr-footer { border-top: 1px solid #1E293B; padding: 24px; text-align: center; color: #475569; font-size: 12px; }
.cr-footer p { margin: 4px 0; }

@media (max-width: 640px) {
  .cr-hero h1 { font-size: 30px; }
  .cr-gen-card { margin: 20px 14px; padding: 20px; }
  .cr-panel { padding: 16px; }
  .cr-scene { height: 260px; }
  /* 制造动画（393px 真机适配）：HUD/星尘贴合矮舞台，按钮不溢出 */
  .cr-asm-hud { top: 20px; left: 8px; right: 8px; height: 260px; }
  .cr-asm-stars { top: 20px; height: 260px; }
  .cr-asm-flash { height: 300px; }
  .cr-asm-text { font-size: 11px; max-width: 92%; overflow: hidden; text-overflow: ellipsis; }
  .cr-asm-corner { width: 18px; height: 18px; }
  .cr-3d-render { gap: 8px; padding: 4px 10px 16px; }
  .cr-3d-render .cr-tool { font-size: 12px; padding: 7px 10px; }
  .cr-asm-bar { margin: 6px 12px 0; }
  /* 大片窗口（393px 适配） */
  .cr-movie { padding: 14px 12px 12px; border-radius: 16px; margin-top: 14px; }
  .cr-movie-head b { font-size: 15px; }
  .cr-movie-empty { padding: 52px 16px; font-size: 13px; }
  .cr-movie-hint { font-size: 11px; }
  /* 构件微缩 */
  .cr-plate::after { height: 8px; }
  /* 我的造物面板（393px 适配）：列表纵向堆叠，搜索条不溢出 */
  .cr-saves-panel { padding: 12px; }
  .cr-save-item { flex-direction: column; align-items: stretch; gap: 8px; }
  .cr-save-ops { justify-content: flex-end; }
  /* 真机适配（20260916 移动审计）：顶栏导航横向滑动，BOM/接线表容器内横滑不裁切 */
  .cr-topbar { padding: 10px 14px; flex-wrap: wrap; row-gap: 8px; }
  .cr-logo { font-size: 17px; white-space: nowrap; }
  .cr-nav { width: 100%; gap: 16px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .cr-nav::-webkit-scrollbar { display: none; }
  .cr-nav a { white-space: nowrap; font-size: 13px; flex: 0 0 auto; }
  .cr-bom-tools .cr-tool { font-size: 12px; padding: 7px 10px; }
  .cr-wire-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
/* BOM 7 列在小屏放不下：表格转为内部横滑块，采购列不再被裁（min-content 自然撑开滚动） */
@media (max-width: 720px) {
  .cr-bom { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .cr-bom th, .cr-bom td { white-space: normal; }
}

/* ---------- 采购工具条（v1.1） ---------- */
.cr-bom-tools { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.cr-tool {
  background: #16223B; border: 1px solid #2B3A57; color: #CBD5E1; border-radius: 8px;
  padding: 8px 14px; font-size: 13px; cursor: pointer; text-decoration: none; display: inline-block;
}
.cr-tool:hover { border-color: #38BDF8; color: #38BDF8; text-decoration: none; }
.cr-tool:disabled { opacity: .55; cursor: wait; }
.cr-ops { white-space: nowrap; }
.cr-buy {
  display: inline-block; margin: 0 3px 3px 0; padding: 3px 8px; border-radius: 6px;
  background: rgba(14,165,233,.12); border: 1px solid rgba(14,165,233,.4);
  color: #7DD3FC; font-size: 12px;
}
.cr-buy:hover { background: rgba(14,165,233,.25); text-decoration: none; }
.cr-buy-tb { background: rgba(245,158,11,.1); border-color: rgba(245,158,11,.4); color: #FBBF24; }
.cr-buy-tb:hover { background: rgba(245,158,11,.22); }
.cr-3d-render { display: flex; align-items: center; gap: 12px; justify-content: center; padding: 4px 16px 16px; flex-wrap: wrap; }
.cr-render-out { font-size: 12px; color: #7DD3FC; max-width: 620px; }
.cr-render-out a { color: #34D399; font-weight: 700; }

/* ---------- 制造动画（v1.2 · cr-asm-*） ---------- */
.cr-asm-btn { border-color: rgba(245, 158, 11, .55); color: #FBBF24; font-weight: 700; }
.cr-asm-btn:hover { border-color: #F59E0B; color: #FDE68A; }
.cr-asm-loop { display: none; }
.cr-3d-wrap.cr-asm-used .cr-asm-loop { display: inline-block; }
.cr-asm-loop-on { border-color: #34D399; color: #6EE7B7; }

/* HUD 科幻取景框（绝对定位于舞台区） */
.cr-asm-hud { position: absolute; top: 20px; left: 16px; right: 16px; height: 340px;
  pointer-events: none; z-index: 5; }
.cr-asm-corner { position: absolute; width: 26px; height: 26px; border: 2px solid #38BDF8; opacity: .85; }
.cr-asm-c-tl { top: 0; left: 0; border-right: none; border-bottom: none; }
.cr-asm-c-tr { top: 0; right: 0; border-left: none; border-bottom: none; }
.cr-asm-c-bl { bottom: 0; left: 0; border-right: none; border-top: none; }
.cr-asm-c-br { bottom: 0; right: 0; border-left: none; border-top: none; }
.cr-asm-text {
  position: absolute; top: 8px; left: 50%; transform: translateX(-50%);
  font-size: 13px; font-weight: 700; color: #7DD3FC; letter-spacing: 1px;
  text-shadow: 0 0 12px rgba(56, 189, 248, .8); white-space: nowrap;
}
.cr-asm-scan { position: absolute; left: 0; right: 0; top: 0; height: 2px; opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(56, 189, 248, .85), transparent); }
.cr-asm-hud.cr-asm-scan-run .cr-asm-scan { animation: crAsmScan 1s linear; }
@keyframes crAsmScan {
  0% { opacity: 0; transform: translateY(0); }
  12% { opacity: 1; } 88% { opacity: 1; }
  100% { opacity: 0; transform: translateY(336px); }
}

/* 背景星尘（仅动画期间浮现） */
.cr-asm-stars { position: absolute; top: 20px; left: 0; right: 0; height: 340px;
  pointer-events: none; z-index: 0; }
.cr-asm-stars i { position: absolute; width: 3px; height: 3px; border-radius: 50%;
  background: #BAE6FD; opacity: 0; box-shadow: 0 0 6px rgba(125, 211, 252, .9); }
.cr-scene.cr-asm-on ~ .cr-asm-stars i { animation: crAsmTw 2.4s ease-in-out infinite; }
.cr-asm-stars i:nth-child(1) { left: 7%;  top: 16%; animation-delay: 0s; }
.cr-asm-stars i:nth-child(2) { left: 21%; top: 68%; animation-delay: .3s; width: 2px; height: 2px; }
.cr-asm-stars i:nth-child(3) { left: 33%; top: 9%;  animation-delay: .7s; }
.cr-asm-stars i:nth-child(4) { left: 45%; top: 82%; animation-delay: .15s; width: 2px; height: 2px; }
.cr-asm-stars i:nth-child(5) { left: 56%; top: 22%; animation-delay: .9s; }
.cr-asm-stars i:nth-child(6) { left: 64%; top: 61%; animation-delay: .5s; width: 2px; height: 2px; }
.cr-asm-stars i:nth-child(7) { left: 74%; top: 12%; animation-delay: 1.1s; }
.cr-asm-stars i:nth-child(8) { left: 82%; top: 47%; animation-delay: .2s; }
.cr-asm-stars i:nth-child(9) { left: 90%; top: 74%; animation-delay: .8s; width: 2px; height: 2px; }
.cr-asm-stars i:nth-child(10) { left: 13%; top: 40%; animation-delay: 1.3s; }
.cr-asm-stars i:nth-child(11) { left: 50%; top: 50%; animation-delay: 1.6s; width: 2px; height: 2px; }
.cr-asm-stars i:nth-child(12) { left: 68%; top: 88%; animation-delay: 1s; }
@keyframes crAsmTw {
  0%, 100% { opacity: .12; transform: scale(.8); }
  50% { opacity: .9; transform: scale(1.25); }
}

/* 合体闪光：一道亮光扫过 */
.cr-asm-flash { position: absolute; top: 0; left: 0; right: 0; height: 380px;
  pointer-events: none; z-index: 6; overflow: hidden; opacity: 0; }
.cr-asm-flash::before { content: ""; position: absolute; top: -20px; bottom: -20px; left: 0; width: 34%;
  background: linear-gradient(105deg, transparent, rgba(125, 211, 252, .3), rgba(255, 255, 255, .5), rgba(125, 211, 252, .3), transparent);
  transform: translateX(-140%) skewX(-12deg); }
.cr-3d-wrap.cr-asm-flash-go .cr-asm-flash { opacity: 1; }
.cr-3d-wrap.cr-asm-flash-go .cr-asm-flash::before { animation: crAsmSweep 1.1s ease-out forwards; }
@keyframes crAsmSweep {
  from { transform: translateX(-140%) skewX(-12deg); }
  to { transform: translateX(480%) skewX(-12deg); }
}

/* 整机合体缩放脉冲 */
.cr-scene.cr-asm-pulse { animation: crAsmPulse .9s ease; }
@keyframes crAsmPulse {
  0% { transform: scale(1); } 35% { transform: scale(1.05); } 100% { transform: scale(1); }
}

/* 装配层辉光状态 */
.cr-layer.cr-asm-hot .cr-plate {
  border-color: #F59E0B;
  box-shadow: 0 0 34px rgba(245, 158, 11, .55), 0 0 64px rgba(245, 158, 11, .25);
  filter: brightness(1.45);
}
.cr-layer.cr-asm-done .cr-plate {
  border-color: rgba(52, 211, 153, .7);
  box-shadow: 0 0 22px rgba(52, 211, 153, .3);
  filter: brightness(1.12);
}

/* 进度条 */
.cr-asm-bar { position: relative; height: 3px; margin: 6px 20px 0; background: #16223B;
  border-radius: 2px; overflow: hidden; }
.cr-asm-bar i { display: block; height: 100%; width: 0;
  background: linear-gradient(90deg, #0EA5E9, #F59E0B); transition: width .15s linear; }
.cr-asm-bar[hidden], .cr-asm-hud[hidden] { display: none; }

/* 降级：用户偏好减少动效 */
@media (prefers-reduced-motion: reduce) {
  .cr-asm-stars i, .cr-asm-hud.cr-asm-scan-run .cr-asm-scan,
  .cr-3d-wrap.cr-asm-flash-go .cr-asm-flash::before, .cr-scene.cr-asm-pulse { animation: none !important; }
  .cr-asm-bar i { transition: none; }
}

/* ---------- 我的造物（保存/查询面板 v1.3） ---------- */
.cr-saves { margin-top: 12px; }
.cr-saves-head { display: flex; align-items: center; gap: 12px; justify-content: center; flex-wrap: wrap; }
.cr-saves-btn { border-color: rgba(52, 211, 153, .55); color: #6EE7B7; font-weight: 700; }
.cr-saves-btn:hover { border-color: #34D399; color: #6EE7B7; text-decoration: none; }
.cr-saves-status { font-size: 12px; color: #94A3B8; }
.cr-saves-status.cr-saves-down { color: #FBBF24; }
.cr-saves-panel {
  margin-top: 12px; background: #101A2E; border: 1px solid #22304C;
  border-radius: 14px; padding: 16px 18px;
}
.cr-saves-bar { display: flex; gap: 10px; }
.cr-saves-q {
  flex: 1; min-width: 0; background: #0B1220; color: #E2E8F0;
  border: 1px solid #2B3A57; border-radius: 10px; padding: 9px 12px; font-size: 13px;
}
.cr-saves-q:focus { outline: none; border-color: #38BDF8; }
.cr-saves-list { margin-top: 12px; }
.cr-saves-empty { font-size: 13px; color: #64748B; text-align: center; padding: 18px 0; }
.cr-save-item {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 10px 4px; border-bottom: 1px dashed #1B2740;
}
.cr-save-item:last-child { border-bottom: none; }
.cr-save-restorable { cursor: pointer; }
.cr-save-restorable:hover .cr-save-title { color: #38BDF8; }
.cr-save-main { min-width: 0; }
.cr-save-title { font-size: 14px; color: #F1F5F9; margin-right: 8px; }
.cr-save-kind { font-size: 11px; border-radius: 6px; padding: 1px 8px; margin-right: 8px; vertical-align: 1px; }
.cr-save-k-project { color: #7DD3FC; background: rgba(14, 165, 233, .12); border: 1px solid rgba(14, 165, 233, .4); }
.cr-save-k-render { color: #FBBF24; background: rgba(245, 158, 11, .12); border: 1px solid rgba(245, 158, 11, .4); }
.cr-save-k-other { color: #94A3B8; background: #16223B; border: 1px solid #26334D; }
.cr-save-time { font-size: 12px; color: #64748B; }
.cr-save-sub { font-size: 12px; color: #94A3B8; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-save-ops { white-space: nowrap; display: flex; gap: 6px; }
.cr-save-ops .cr-tool { font-size: 12px; padding: 5px 10px; }

/* ---------- 🎬 Blender 大片窗口（v20260917c1 · 移植自 /explode/ 范式） ---------- */
.cr-hidden { display: none !important; }
.cr-movie {
  margin: 18px auto 0; max-width: 1020px;
  background: linear-gradient(180deg, #0B1220, #0F172A 70%);
  border: 1px solid rgba(255, 255, 255, .1); border-radius: 22px;
  padding: 20px 24px 16px; box-shadow: 0 18px 42px rgba(2, 6, 23, .5);
}
.cr-movie-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.cr-movie-head b { color: #E2E8F0; font-size: 18px; }
.cr-movie-head span { color: rgba(226, 232, 240, .62); font-size: 13.5px; }
.cr-movie-body {
  position: relative; border-radius: 12px; overflow: hidden;
  background: radial-gradient(circle at 30% 20%, #16233A, #070C16 78%);
  min-height: 200px; display: flex; align-items: center; justify-content: center;
}
.cr-movie-video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #000; outline: none; }
.cr-movie-empty { padding: 96px 24px; text-align: center; color: rgba(226, 232, 240, .55); font-size: 14px; letter-spacing: .3px; }
.cr-movie-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 10px; }
.cr-movie-hint { color: rgba(148, 163, 184, .75); font-size: 12.5px; }
.cr-movie-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cr-movie-status { font-size: 12px; color: #7DD3FC; }
.cr-movie-status.cr-movie-down { color: #FBBF24; }
.cr-movie-dl {
  flex-shrink: 0; color: #7DD3FC; text-decoration: none; font-size: 13px;
  border: 1px solid rgba(125, 211, 252, .4); border-radius: 9999px; padding: 6px 15px;
  transition: background .2s ease, color .2s ease;
}
.cr-movie-dl:hover { background: rgba(125, 211, 252, .14); color: #BAE6FD; text-decoration: none; }

/* ---------- 装配台参数化构件（v20260917c1 · 参数表驱动 + 循环批量构件 + 固定随机种子） ----------
   坐标统一走 --px/--py CSS 变量（JS 只做 setProperty，零内联定位样式，固定种子可复现） */
.cr-plate { transform-style: preserve-3d; }
/* 板厚侧沿（真实衔接感：每层有厚度，不再是一张纸） */
.cr-plate::after {
  content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 12px;
  transform-origin: top center; transform: rotateX(-90deg);
  background: inherit; filter: brightness(.42) saturate(.9);
  border-radius: 0 0 12px 12px;
}
/* 分件材质观感（roughness/metallic 差异化：玻璃高光 / 金属内环 / 哑磨砂） */
.cr-pk-screen { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12), 0 0 24px rgba(56, 189, 248, .08); }
.cr-pk-screen::before {
  content: ""; position: absolute; inset: 0; border-radius: 12px; pointer-events: none;
  background: linear-gradient(115deg, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, .03) 28%, transparent 46%);
}
.cr-pk-pcb { box-shadow: inset 0 0 0 2px rgba(148, 163, 184, .22), inset 0 0 18px rgba(0, 0, 0, .5), 0 0 24px rgba(56, 189, 248, .08); }
.cr-pk-battery, .cr-pk-shell { box-shadow: inset 0 10px 22px rgba(255, 255, 255, .05), inset 0 -14px 26px rgba(0, 0, 0, .4), 0 0 24px rgba(56, 189, 248, .08); }
.cr-parts { position: absolute; inset: 0; z-index: 1; }
.cr-pt { position: absolute; left: var(--px, 50%); top: var(--py, 50%); transform: translate(-50%, -50%); }
/* 文字可读性：构件在底层，文字带投影在上层 */
.cr-plate .cr-layer-idx, .cr-plate .cr-glyph, .cr-plate .cr-layer-name { position: relative; z-index: 3; text-shadow: 0 1px 3px rgba(2, 6, 23, .9), 0 0 8px rgba(2, 6, 23, .7); }

/* 通用件 */
.cr-pt-traces { inset: 0; transform: none; left: 0; top: 0; width: 100%; height: 100%; border-radius: 12px; opacity: .5;
  background:
    repeating-linear-gradient(0deg, transparent 0 14px, rgba(94, 234, 212, .14) 14px 15px),
    repeating-linear-gradient(90deg, transparent 0 22px, rgba(56, 189, 248, .1) 22px 23px); }
.cr-pt-chip { width: 13%; height: 17%; border-radius: 3px;
  background: linear-gradient(160deg, #1F2937, #0B0F1A 70%);
  border: 1px solid rgba(148, 163, 184, .5); box-shadow: 0 2px 4px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .14); }
.cr-pt-chip::before { content: ""; position: absolute; left: -14%; top: 12%; bottom: 12%; width: 12%;
  background: repeating-linear-gradient(0deg, rgba(203, 213, 225, .75) 0 2px, transparent 2px 5px); }
.cr-pt-chip::after { content: ""; position: absolute; right: -14%; top: 12%; bottom: 12%; width: 12%;
  background: repeating-linear-gradient(0deg, rgba(203, 213, 225, .75) 0 2px, transparent 2px 5px); }
.cr-pt-mcu { width: 17%; height: 24%; background: linear-gradient(160deg, #374151, #0B0F1A 72%); border-color: rgba(251, 191, 36, .55); }
.cr-pt-pinrow { --px: 50%; --py: 88%; width: 72%; height: 5%; transform: translate(-50%, -50%);
  background: repeating-linear-gradient(90deg, rgba(251, 191, 36, .85) 0 4px, rgba(30, 41, 59, .9) 4px 9px);
  border-radius: 2px; box-shadow: 0 1px 3px rgba(0, 0, 0, .6); }
.cr-pt-screw { width: 7%; height: 10%; border-radius: 50%; border: 2px solid rgba(148, 163, 184, .55);
  background: radial-gradient(circle, #0B0F1A 42%, rgba(148, 163, 184, .3) 46%, transparent 62%);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, .18); }
.cr-pt-joint { --px: 50%; --py: 99%; width: 22%; height: 7%; transform: translate(-50%, -30%);
  background: linear-gradient(180deg, #334155, #1E293B); border: 1px solid rgba(148, 163, 184, .5);
  border-radius: 3px; box-shadow: 0 2px 4px rgba(0, 0, 0, .55);
  background-image: repeating-linear-gradient(90deg, rgba(251, 191, 36, .6) 0 3px, transparent 3px 7px); }

/* 屏幕（玻璃 roughness 低 → 高光；本体色贴合面板） */
.cr-pt-scr { --px: 50%; --py: 46%; width: 88%; height: 74%; border-radius: 8px;
  background: linear-gradient(160deg, #0F172A, #020617 78%);
  border: 2px solid rgba(148, 163, 184, .45); box-shadow: 0 4px 10px rgba(0, 0, 0, .6), inset 0 0 14px rgba(56, 189, 248, .12); }
.cr-pt-scrface { --px: 50%; --py: 46%; width: 76%; height: 58%; border-radius: 4px; opacity: .85;
  background:
    repeating-linear-gradient(0deg, rgba(2, 6, 23, .35) 0 2px, transparent 2px 5px),
    linear-gradient(135deg, #0EA5E9 0%, #1E3A8A 45%, #312E81 78%, #10B981 100%);
  box-shadow: inset 0 0 12px rgba(2, 6, 23, .8); }
.cr-pt-ribbon { --px: 50%; --py: 92%; width: 34%; height: 6%; border-radius: 2px;
  background: repeating-linear-gradient(90deg, rgba(251, 191, 36, .7) 0 3px, rgba(15, 23, 42, .9) 3px 6px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, .55); }

/* 电池（哑磨砂 roughness 高） */
.cr-pt-bat { --px: 50%; --py: 50%; width: 84%; height: 70%; border-radius: 10px;
  background: linear-gradient(165deg, #475569, #1E293B 76%);
  border: 1px solid rgba(148, 163, 184, .45); box-shadow: inset 0 2px 6px rgba(255, 255, 255, .1), inset 0 -8px 16px rgba(0, 0, 0, .45); }
.cr-pt-cell { width: 30%; height: 56%; border-radius: 6px;
  background: repeating-linear-gradient(90deg, #64748B 0 6px, #334155 6px 8px);
  border: 1px solid rgba(148, 163, 184, .4); box-shadow: inset 0 2px 3px rgba(255, 255, 255, .12); }
.cr-pt-term { --px: 93%; --py: 50%; width: 7%; height: 26%; border-radius: 2px;
  background: linear-gradient(180deg, #FBBF24, #B45309); box-shadow: 0 1px 3px rgba(0, 0, 0, .6); }
.cr-pt-batlabel { --px: 50%; --py: 74%; width: 56%; height: 10%; border-radius: 2px; opacity: .8;
  background: repeating-linear-gradient(45deg, rgba(251, 191, 36, .55) 0 6px, rgba(2, 6, 23, .6) 6px 12px); }

/* 摄像头模组（镜头金属环 + 玻璃） */
.cr-pt-lens { width: 17%; height: 34%; border-radius: 50%;
  background: radial-gradient(circle at 38% 32%, #64748B, #1E293B 58%, #0B0F1A 100%);
  border: 2px solid rgba(148, 163, 184, .6); box-shadow: 0 3px 7px rgba(0, 0, 0, .65), inset 0 1px 2px rgba(255, 255, 255, .22); }
.cr-pt-lensglass { position: absolute; left: 18%; top: 18%; width: 64%; height: 64%; border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, #38BDF8 0%, #1E3A8A 42%, #020617 88%); opacity: .92; }
.cr-pt-camband { --px: 50%; --py: 90%; width: 56%; height: 7%; border-radius: 3px;
  background: linear-gradient(180deg, #334155, #1E293B); border: 1px solid rgba(148, 163, 184, .45); }

/* 传感器（金属壳元件循环） */
.cr-pt-sensor { width: 11%; height: 20%; border-radius: 4px;
  background: linear-gradient(160deg, #94A3B8, #475569 62%, #1E293B 100%);
  border: 1px solid rgba(226, 232, 240, .5); box-shadow: 0 2px 4px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .3); }
.cr-pt-sensor::after { content: ""; position: absolute; left: 26%; top: 24%; width: 48%; height: 40%; border-radius: 50%;
  background: radial-gradient(circle, #0B0F1A 55%, rgba(56, 189, 248, .4) 72%, transparent 80%); }

/* 风扇/散热/喇叭 */
.cr-pt-grille { --px: 34%; --py: 50%; width: 44%; height: 82%; border-radius: 50%;
  background: repeating-radial-gradient(circle at 50% 50%, #1E293B 0 4px, #334155 4px 6px);
  border: 2px solid rgba(148, 163, 184, .5); box-shadow: 0 3px 8px rgba(0, 0, 0, .6); }
.cr-pt-hub { --px: 34%; --py: 50%; width: 12%; height: 22%; border-radius: 50%;
  background: radial-gradient(circle at 36% 32%, #94A3B8, #1E293B 74%); border: 1px solid rgba(226, 232, 240, .5); }
.cr-pt-ventslot { width: 5%; height: 40%; border-radius: 3px; opacity: .8;
  background: linear-gradient(180deg, #0B0F1A, #1E293B); border: 1px solid rgba(148, 163, 184, .35); }

/* 外壳/结构 */
.cr-pt-frame { --px: 50%; --py: 50%; width: 92%; height: 84%; border-radius: 10px; transform: translate(-50%, -50%);
  border: 3px solid rgba(148, 163, 184, .4); box-shadow: inset 0 0 14px rgba(2, 6, 23, .7); }
.cr-pt-slot { --py: 82%; width: 7%; height: 16%; border-radius: 3px; opacity: .85;
  background: linear-gradient(180deg, #0B0F1A, #1E293B); border: 1px solid rgba(148, 163, 184, .3); }

/* 无线/天线（金属屏蔽罩 metallic） */
.cr-pt-shield { --px: 42%; --py: 46%; width: 40%; height: 56%; border-radius: 4px;
  background: linear-gradient(150deg, #CBD5E1, #64748B 40%, #334155 90%);
  border: 1px solid rgba(226, 232, 240, .6); box-shadow: 0 3px 6px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .5); }
.cr-pt-ant { --px: 88%; --py: 34%; width: 3%; height: 46%; border-radius: 2px;
  background: linear-gradient(180deg, #E2E8F0, #64748B 70%, #1E293B); box-shadow: 0 0 6px rgba(56, 189, 248, .35); }

/* 机械/电机 */
.cr-pt-hub2 { --px: 36%; --py: 50%; width: 30%; height: 62%; border-radius: 50%;
  background: conic-gradient(from 40deg, #64748B, #1E293B 25%, #64748B 50%, #1E293B 75%, #64748B);
  border: 2px solid rgba(148, 163, 184, .55); box-shadow: 0 3px 8px rgba(0, 0, 0, .6); }
.cr-pt-arm { --px: 70%; --py: 44%; width: 34%; height: 14%; border-radius: 6px;
  background: linear-gradient(160deg, #475569, #1E293B 80%); border: 1px solid rgba(148, 163, 184, .5);
  box-shadow: 0 3px 6px rgba(0, 0, 0, .6); }

/* 按键/旋钮 */
.cr-pt-btn { width: 9%; height: 22%; border-radius: 4px;
  background: linear-gradient(180deg, #64748B, #1E293B 78%);
  border: 1px solid rgba(148, 163, 184, .55); box-shadow: 0 3px 5px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .2); }
.cr-pt-knob { width: 16%; height: 40%; border-radius: 50%;
  background: radial-gradient(circle at 36% 30%, #94A3B8, #1E293B 72%);
  border: 2px solid rgba(148, 163, 184, .6); box-shadow: 0 4px 8px rgba(0, 0, 0, .65); }

/* ---------- 🧊 真3D 查看器（v20260917c2 · 移植自 /explode/ glbview 范式） ---------- */
.cr-glb {
  margin: 18px auto 0; max-width: 1020px;
  background: linear-gradient(180deg, #0B1220, #0F172A 70%);
  border: 1px solid rgba(255, 255, 255, .1); border-radius: 22px;
  padding: 20px 24px 16px; box-shadow: 0 18px 42px rgba(2, 6, 23, .5);
}
.cr-glb-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.cr-glb-head b { color: #E2E8F0; font-size: 18px; }
.cr-glb-head > span:not(.cr-glb-status) { color: rgba(226, 232, 240, .62); font-size: 13.5px; }
.cr-glb-status { color: #FDE68A; font-size: 12.5px; margin-left: auto; }
.cr-glb-close {
  font: inherit; color: rgba(226, 232, 240, .7); cursor: pointer;
  background: transparent; border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 8px; width: 28px; height: 24px; line-height: 1;
}
.cr-glb-close:hover { color: #fff; border-color: rgba(255, 255, 255, .4); }
.cr-glb-stage {
  position: relative; border-radius: 14px; overflow: hidden;
  background: radial-gradient(circle at 30% 20%, #16233A, #070C16 78%);
  aspect-ratio: 16 / 9; min-height: 240px;
}
.cr-glb-stage canvas { display: block; width: 100%; height: 100%; outline: none; touch-action: none; }
.cr-glb-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.cr-glb-btn {
  flex-shrink: 0; font: inherit; font-size: 12.5px; line-height: 1;
  color: #BAE6FD; cursor: pointer; background: rgba(125, 211, 252, .08);
  border: 1px solid rgba(125, 211, 252, .35); border-radius: 9999px;
  padding: 6px 13px; transition: background .2s ease, color .2s ease;
}
.cr-glb-btn:hover { background: rgba(125, 211, 252, .16); color: #E0F2FE; }
.cr-glb-hint { color: rgba(148, 163, 184, .7); font-size: 12px; margin-left: auto; }
.cr-glb-open { border-color: rgba(125, 211, 252, .55); color: #7DD3FC; font-weight: 700; }
.cr-glb-open:hover { border-color: #38BDF8; color: #BAE6FD; text-decoration: none; }
@media (max-width: 640px) {
  .cr-glb { padding: 14px 12px 12px; border-radius: 16px; margin-top: 14px; }
  .cr-glb-head b { font-size: 15.5px; }
  .cr-glb-status { width: 100%; margin-left: 0; order: 9; }
  /* aspect-ratio × min-height 会反向撑宽（240×16/9=427px），移动端必须放掉 min-height */
  .cr-glb-stage { min-height: 0; aspect-ratio: 16 / 9; }
  .cr-glb-hint { width: 100%; margin-left: 0; }
}

/* ---------- 供货商名录页（supply.html） ---------- */
.sp-wrap { max-width: 1080px; margin: 26px auto 50px; padding: 0 20px; }
.sp-lead { color: #94A3B8; font-size: 14px; margin: 6px 0 18px; }
.sp-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.sp-table th { text-align: left; color: #7DD3FC; font-size: 12px; border-bottom: 1px solid #26334D; padding: 9px 8px; white-space: nowrap; }
.sp-table td { border-bottom: 1px solid #1B2740; padding: 9px 8px; color: #CBD5E1; vertical-align: top; }
.sp-table tr:hover td { background: rgba(14,165,233,.05); }
.sp-table a { color: #38BDF8; }
.sp-tier { font-weight: 700; }
.sp-tier-a { color: #F59E0B; }
.sp-tier-b { color: #7DD3FC; }
.sp-tier-c { color: #94A3B8; }
.sp-card { background: #101A2E; border: 1px solid #22304C; border-radius: 14px; padding: 20px 22px; margin-top: 20px; }
.sp-card h3 { font-size: 17px; color: #F8FAFC; margin-bottom: 10px; }
.sp-card p, .sp-card li { font-size: 14px; color: #CBD5E1; }
.sp-card ol, .sp-card ul { padding-left: 20px; }
.sp-note { font-size: 12px; color: #64748B; margin-top: 10px; }
.sp-kpi { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px,1fr)); gap: 12px; margin-top: 16px; }
.sp-kpi div { background: #0B1220; border: 1px solid #1E293B; border-radius: 10px; padding: 12px; }
.sp-kpi b { display: block; font-size: 12px; color: #7DD3FC; }
.sp-kpi span { font-size: 14px; color: #F8FAFC; font-weight: 700; }

/* ---------- 青少年模式（?from=youth，隐藏采购链路） ---------- */
.cr-youth-banner {
  max-width: 860px; margin: 20px auto 0; padding: 12px 16px; border-radius: 12px;
  background: rgba(52,211,153,.1); border: 1px solid rgba(52,211,153,.45);
  color: #6EE7B7; font-size: 13px; line-height: 1.6;
}
.cr-youth .cr-buy,
.cr-youth .cr-bom-tools .cr-tool,
.cr-youth .cr-bom-tools a[href*="supply"],
.cr-youth #crRender3d { display: none; }