/* ============================================================
 * 入学手册（新手教程）样式  tutorial.css
 *  - 教练面板：贴在战场右下角（#stage 是 1280×720 的设计空间）
 *  - 目标高亮：脉动描边，DOM 每次重绘后由 tutorial_ui.js 重新打上
 * ========================================================== */

#tutPanel {
  position: absolute; right: 8px; bottom: 8px; width: 380px; max-height: 560px;
  background: rgba(14, 13, 18, .95);
  border: 3px solid var(--gold-dim, #8a7028);
  box-shadow: 5px 5px 0 #000, inset 0 0 24px rgba(216, 176, 74, .08);
  color: var(--text, #d6d2c4);
  font-size: calc(14px * var(--fs, 1)); line-height: 1.62;
  padding: 9px 12px 11px;
  z-index: 40; overflow: hidden;
  display: flex; flex-direction: column; gap: 6px;
}
#tutPanel.hidden { display: none !important; }
/* 步骤标记 side:'left' 时贴左侧：讲"右侧日志栏"那一步不能挡住日志栏本身 */
#tutPanel.tut-left { left: 8px; right: auto; }

.tut-head { display: flex; align-items: center; gap: 8px; }
.tut-ttl { color: var(--gold, #d8b04a); font-weight: bold; letter-spacing: 2px; }
.tut-step { color: var(--dim, #8f8b80); font-size: calc(12px * var(--fs, 1)); }
.tut-spacer { flex: 1; }

.tut-dots { display: flex; gap: 4px; flex-wrap: wrap; }
.tut-dots i { width: 13px; height: 5px; background: #3a3446; display: block; }
.tut-dots i.ok { background: var(--green, #7ec850); }
.tut-dots i.on { background: var(--gold, #d8b04a); }

.tut-t { margin: 1px 0 0; font-size: calc(15px * var(--fs, 1)); color: #ffe9a8; letter-spacing: 1px; }
.tut-text { margin: 0; }
.tut-text b { color: var(--gold, #d8b04a); }
.tut-tip {
  margin: 0; color: #9fd3ff; font-size: calc(13px * var(--fs, 1));
  border-left: 3px solid rgba(91, 155, 213, .7); padding-left: 7px;
}
.tut-status {
  color: var(--dim, #8f8b80); font-size: calc(12px * var(--fs, 1));
  border-top: 1px dashed #46404f; padding-top: 6px;
}
/* "点击继续" 提示：金色闪烁，明显一点 */
.tut-go { color: var(--gold, #d8b04a) !important; font-weight: bold; animation: tutBlink 1.15s ease-in-out infinite; }
@keyframes tutBlink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.tut-foot { display: flex; gap: 8px; flex-wrap: wrap; }
#tutPanel .pxbtn { padding: 5px 12px; font-size: calc(13px * var(--fs, 1)); letter-spacing: 1px; box-shadow: 2px 2px 0 #000; }

/* ---------------- 目标高亮 ---------------- */
.tut-target {
  position: relative;
  outline: 3px solid var(--gold, #d8b04a) !important;
  outline-offset: 1px;
  box-shadow: 0 0 14px rgba(216, 176, 74, .8) !important;
  animation: tutPulse 1.1s ease-in-out infinite;
  z-index: 6;
}
@keyframes tutPulse {
  0%, 100% { outline-color: #d8b04a; }
  50% { outline-color: #fff3c4; }
}

/* 毕业弹窗 */
.tut-grad { max-width: 560px; }
.tut-grad .mbtns.col { margin-top: 10px; }