/* 游戏播放页样式（作用域限定在 .adv-root，可安全嵌入编辑器预览区而不污染全局） */
.adv-root {
  --bg: #1b1f2a;     /* 底色，可被配色面板实时覆盖 */
  --fg: #e8eaf0;     /* 文字色，可被配色面板实时覆盖 */
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  min-height: 100vh;
  transition: background .25s ease, color .25s ease;
}
.adv-root * { box-sizing: border-box; }
.adv-wrap {
  max-width: 680px;
  margin: 0 auto;
  padding: 24px 18px 60px;
}
.adv-game-title {
  text-align: center;
  font-size: 14px;
  letter-spacing: 2px;
  color: rgba(127,127,127,.9);
  margin-bottom: 18px;
  text-transform: uppercase;
}
.adv-scene {
  background: rgba(127,127,127,.08);
  border: 1px solid rgba(127,127,127,.18);
  border-radius: 14px;
  padding: 22px 22px 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  animation: advFade .35s ease;
}
@keyframes advFade {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.adv-image { margin: -4px 0 16px; text-align: center; }
.adv-image img {
  max-width: 100%;
  max-height: 320px;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0,0,0,.4);
}
.adv-title {
  font-size: 20px;
  margin: 0 0 12px;
  color: #ffd479;
}
.adv-text {
  font-size: 16px;
  line-height: 1.85;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--fg);
}
.adv-choices {
  margin-top: 22px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.adv-btn {
  font: inherit;
  cursor: pointer;
  border: none;
  border-radius: 10px;
  padding: 13px 16px;
  text-align: left;
  transition: transform .08s ease, background .2s ease;
}
.adv-choice {
  background: linear-gradient(135deg, #3a86ff, #5e60ce);
  color: #fff;
  font-size: 15px;
  border: 1px solid rgba(255,255,255,.12);
}
.adv-choice:hover { transform: translateY(-1px); filter: brightness(1.08); }
.adv-choice:active { transform: translateY(0); }
.adv-choice:disabled {
  background: rgba(127,127,127,.18);
  color: rgba(127,127,127,.85);
  cursor: not-allowed;
  border: 1px dashed rgba(127,127,127,.4);
}
.adv-tag { font-size: 12px; opacity: .7; }
.adv-ending {
  margin-top: 20px;
  text-align: center;
  color: rgba(127,127,127,.9);
  letter-spacing: 4px;
  font-size: 14px;
}
.adv-missing { color: #ff9a9a; }
.adv-controls {
  margin-top: 18px;
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
}
.adv-mini {
  background: rgba(127,127,127,.15);
  color: var(--fg);
  font-size: 13px;
  padding: 8px 14px;
}
.adv-mini:hover { background: rgba(127,127,127,.25); }
.adv-hint {
  text-align: center;
  color: rgba(127,127,127,.8);
  font-size: 12px;
  margin-top: 14px;
}

/* ===== 配色面板（⚙） ===== */
.adv-theme { position: fixed; top: 14px; right: 14px; z-index: 60; font-family: inherit; }
.adv-theme-btn {
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.45);
  background: rgba(20,22,30,.55); color: #fff;
  font-size: 20px; line-height: 1; cursor: pointer;
  backdrop-filter: blur(6px);
  box-shadow: 0 3px 14px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.08);
  text-shadow: 0 1px 2px rgba(0,0,0,.5);
  transition: transform .1s ease, background .2s ease, box-shadow .2s ease;
}
.adv-theme-btn:hover { background: rgba(35,38,50,.75); transform: translateY(-1px); box-shadow: 0 5px 18px rgba(0,0,0,.55); }
.adv-theme-btn:active { transform: translateY(0); }
.adv-theme-panel {
  position: absolute; top: 50px; right: 0; width: 208px;
  background: rgba(20,22,30,.96); color: #e8eaf0;
  border: 1px solid rgba(255,255,255,.14); border-radius: 12px;
  padding: 12px; box-shadow: 0 12px 34px rgba(0,0,0,.5);
}
.adv-theme-panel[hidden] { display: none; }
.atp-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; font-size: 13px; }
.atp-row input[type=color] { width: 44px; height: 28px; border: none; background: none; cursor: pointer; padding: 0; }
.atp-presets { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.atp-swatch {
  font-size: 11px; padding: 5px 7px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,.25); cursor: pointer;
}
.atp-actions { margin-top: 2px; }
.atp-actions button {
  font: inherit; font-size: 12px; padding: 6px 11px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,.25); background: transparent; color: #e8eaf0; cursor: pointer;
}
.atp-actions button:hover { background: rgba(255,255,255,.12); }
.atp-tip { margin-top: 9px; font-size: 11px; color: #9aa0ad; line-height: 1.5; }