/* box-office-live · 影院红金风：暗红+鎏金、票根卡片、胶片齿孔 */
.box-wrap {
  --box-red: #8f1d22;
  --box-red2: #b5342f;
  --box-gold: #d4a94f;
  --box-gold2: #f0d493;
  --box-bg: #faf6f2;
  --box-card: #fffdf9;
  --box-card2: #fbf1e4;
  --box-txt: #45322c;
  --box-strong: #2c1a16;
  --box-muted: #98806f;
  --box-line: rgba(143, 29, 34, .22);
  --box-bad: #b5342f;
  max-width: 1020px;
  margin: 0 auto;
  padding: 18px 16px 60px;
  color: var(--box-txt);
  font-size: 15.5px;
  line-height: 1.78;
}
.box-wrap h1, .box-wrap h2, .box-wrap h3 { line-height: 1.35; color: var(--box-strong); }
.box-wrap b { color: var(--box-red); }
.box-kicker {
  display: inline-block; font-size: 13px; letter-spacing: .14em; font-weight: 700;
  color: var(--box-gold); background: var(--box-red);
  border-radius: 4px; padding: 4px 14px; margin-bottom: 12px;
}
.box-hero {
  display: grid; grid-template-columns: 1fr 1.4fr; gap: 24px; align-items: center;
  background: linear-gradient(135deg, #4a0f12 0%, #6d171b 55%, #8f1d22 100%);
  border-radius: 18px; padding: 32px 30px; margin-bottom: 16px;
  position: relative; overflow: hidden;
  box-shadow: 0 16px 40px rgba(74, 15, 18, .4);
}
.box-hero::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 10px;
  background-image: radial-gradient(circle, transparent 4px, #2c1a16 4px);
  background-size: 18px 10px;
}
.box-hero::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 10px;
  background-image: radial-gradient(circle, transparent 4px, #2c1a16 4px);
  background-size: 18px 10px;
}
.box-hero h1 { font-size: clamp(24px, 4vw, 33px); color: #f9ecd8; margin: 4px 0 10px; }
.box-hero h1 b { color: var(--box-gold2); }
.box-sub { color: #ecd9c4; margin: 0 0 18px; }
.box-cta { display: flex; gap: 10px; flex-wrap: wrap; }
.box-btn {
  display: inline-block; cursor: pointer; text-decoration: none;
  background: transparent; color: var(--box-gold2); font-weight: 700;
  border: 1.5px solid var(--box-gold); border-radius: 8px;
  padding: 9px 20px; font-size: 15px;
  transition: transform .15s, box-shadow .15s;
}
.box-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0, 0, 0, .3); }
.box-btn.main { background: linear-gradient(120deg, var(--box-gold), var(--box-gold2)); color: #4a2c08; border-color: transparent; }
.box-btn.ghost { color: var(--box-red); border-color: rgba(143, 29, 34, .35); background: #fdf3ef; }
.box-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }
/* 影片视觉 */
.box-film { position: relative; min-height: 180px; }
.box-reel {
  position: absolute; top: 14px; left: 12px; width: 92px; height: 92px; border-radius: 50%;
  border: 8px solid var(--box-gold); background: #2c1a16;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 20px rgba(0, 0, 0, .35);
}
.box-reel span { position: absolute; width: 18px; height: 18px; border-radius: 50%; background: #2c1a16; border: 3px solid var(--box-gold); }
.box-reel span:nth-child(1) { top: 8px; left: 50%; transform: translateX(-50%); }
.box-reel span:nth-child(2) { bottom: 8px; left: 50%; transform: translateX(-50%); }
.box-reel span:nth-child(3) { left: 8px; top: 50%; transform: translateY(-50%); }
.box-reel span:nth-child(4) { right: 8px; top: 50%; transform: translateY(-50%); }
.box-strip {
  position: absolute; bottom: 14px; left: 8px; right: 8px; height: 34px;
  background: #2c1a16; border-radius: 6px; display: flex; align-items: center; gap: 8px; padding: 0 10px;
  overflow: hidden;
}
.box-strip i { flex: 1; height: 12px; background: linear-gradient(120deg, var(--box-gold), var(--box-gold2)); border-radius: 3px; opacity: .85; }
.box-flash {
  position: absolute; top: 118px; right: 10px; font-size: 13px; font-weight: 700; color: #4a2c08;
  background: linear-gradient(120deg, var(--box-gold), var(--box-gold2));
  border-radius: 999px; padding: 4px 12px; transform: rotate(6deg);
}
.box-note {
  font-size: 13.5px; color: #8a4a12; background: #fdf3e4;
  border: 1.5px dashed var(--box-gold); border-radius: 12px; padding: 10px 14px; margin: 0 0 18px;
}
/* 票根卡片 */
.box-card {
  background: var(--box-card); border: 1px solid var(--box-line);
  border-radius: 14px; padding: 24px; margin-bottom: 18px;
  box-shadow: 0 8px 24px rgba(74, 15, 18, .08);
}
.box-card.ticket {
  position: relative;
  border: 1.5px solid var(--box-gold);
  background-image: linear-gradient(var(--box-card), var(--box-card)), repeating-linear-gradient(90deg, var(--box-gold) 0 10px, transparent 10px 20px);
  background-origin: border-box; background-clip: padding-box, border-box;
  border-top: none; border-bottom: none;
}
.box-card.ticket::before, .box-card.ticket::after {
  content: ''; position: absolute; left: 0; right: 0; height: 12px;
  background-image: radial-gradient(circle at 9px 0px, transparent 5px, var(--box-card) 5px);
  background-size: 20px 12px;
}
.box-card.ticket::before { top: -1px; }
.box-card.ticket::after { bottom: -1px; transform: rotate(180deg); }
.box-card h2 { font-size: 20px; margin: 0 0 12px; }
.box-tip { font-size: 14px; color: var(--box-muted); margin: 0 0 14px; }
.box-tip code { background: var(--box-card2); border: 1px solid var(--box-line); border-radius: 6px; padding: 1px 6px; font-size: 13px; color: var(--box-red); }
.box-textarea {
  width: 100%; min-height: 110px; background: var(--box-card2); color: var(--box-strong);
  border: 1.5px solid var(--box-line); border-radius: 10px; padding: 12px 14px;
  font-size: 14px; line-height: 1.7; resize: vertical; box-sizing: border-box;
}
.box-textarea:focus { outline: none; border-color: var(--box-red); }
.box-actions { display: flex; gap: 10px; flex-wrap: wrap; margin: 12px 0; }
.box-err { display: block; min-height: 20px; font-size: 13.5px; color: var(--box-bad); }
.box-verdict { font-size: 14.5px; color: var(--box-strong); margin-top: 10px; }
.box-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.box-table { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 620px; }
.box-table th, .box-table td { border: 1px solid var(--box-line); padding: 9px 12px; text-align: left; vertical-align: top; }
.box-table thead th { background: var(--box-red); color: #f9ecd8; white-space: nowrap; }
.box-table tbody tr:nth-child(even) { background: var(--box-card2); }
.box-table td b { color: var(--box-red); }
/* 档期日历 */
.box-cal { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.box-cal-item {
  display: flex; gap: 12px; background: var(--box-card2);
  border-left: 4px solid var(--box-gold); border-radius: 10px; padding: 12px 14px;
}
.box-cal-month { font-weight: 800; color: var(--box-red); white-space: nowrap; font-size: 14px; }
.box-cal-item p { margin: 2px 0 0; font-size: 13.5px; color: var(--box-muted); }
/* 决策清单 */
.box-check { margin: 0; padding-left: 20px; display: grid; gap: 8px; }
.box-check li::marker { content: '🎟 '; }
.box-steps { margin: 0; padding-left: 20px; display: grid; gap: 8px; }
.box-faq { margin: 0; }
.box-faq dt { font-weight: 700; color: var(--box-strong); margin-top: 14px; }
.box-faq dd { margin: 4px 0 0; }
.box-src { font-size: 13px; color: var(--box-muted); border-top: 1px solid var(--box-line); padding-top: 12px; margin-top: 26px; }
@media (max-width: 768px) {
  .box-hero { grid-template-columns: 1fr; padding: 24px 18px; }
  .box-film { min-height: 150px; order: -1; }
  .box-cal { grid-template-columns: 1fr; }
  .box-card { padding: 18px 14px; }
}
@media (max-width: 400px) {
  .box-cta .box-btn, .box-actions .box-btn { flex: 1 1 100%; text-align: center; }
}
/* 深色模式 */
html[data-theme="dark"] .box-wrap {
  --box-bg: #170d0b;
  --box-card: #241412;
  --box-card2: #2e1a16;
  --box-txt: #e3cfc4;
  --box-strong: #f9ecd8;
  --box-muted: #ab9081;
  --box-line: rgba(212, 169, 79, .3);
}
html[data-theme="dark"] .box-note { color: #f0d493; background: rgba(212, 169, 79, .08); }
html[data-theme="dark"] .box-textarea { background: #1c0f0d; }
html[data-theme="dark"] .box-btn.ghost { background: transparent; color: var(--box-gold2); border-color: var(--box-line); }
html[data-theme="dark"] .box-cal-item { background: var(--box-card2); }
html[data-theme="dark"] .box-card.ticket { background-image: linear-gradient(var(--box-card), var(--box-card)), repeating-linear-gradient(90deg, rgba(212,169,79,.6) 0 10px, transparent 10px 20px); }
html[data-theme="dark"] .box-card.ticket::before, html[data-theme="dark"] .box-card.ticket::after {
  background-image: radial-gradient(circle at 9px 0px, transparent 5px, var(--box-card) 5px);
}

/* ===== v1.1 · 总票房预测 / 打分卡 ===== */
.box-form { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 6px; }
.box-field { display: flex; flex-direction: column; gap: 4px; font-size: 13.5px; min-width: 160px; flex: 1 1 180px; }
.box-field input { padding: 8px 10px; border-radius: 8px; border: 1px solid var(--box-line, rgba(0,0,0,.15)); background: var(--box-card2, #fff); color: inherit; font-size: 15px; }
.box-range input[type= range] { width: 100%; accent-color: var(--box-accent, #c0392b); }
.box-tag-ok { color: var(--box-ok, #1e7e34); font-weight: 700; }
.box-tag-mid { color: var(--box-warn, #b8860b); font-weight: 700; }
.box-tag-bad { color: var(--box-bad, #c0392b); font-weight: 700; }
@media (max-width: 768px) {
  .box-field { flex-basis: 100%; }
}
