/* =========================================================
   interval.css — 间歇计时器专属部分
   需配合 base.css + tool.css 使用。
   ========================================================= */

.tool{--a1:var(--cyan);--a2:var(--mint)}

/* 节拍相位配色 */
.timer[data-phase="work"]{--timer-glow:rgba(53,224,255,.5)}
.timer[data-phase="rest"]{--timer-glow:rgba(124,92,255,.42);--timer-ink:var(--violet);--timer-halo:rgba(124,92,255,.45)}
.timer[data-phase="long"]{--timer-glow:rgba(255,196,107,.4);--timer-ink:var(--amber);--timer-halo:rgba(255,196,107,.42)}
.timer[data-phase="ready"]{--timer-glow:rgba(255,255,255,.16)}
.timer[data-phase="done"]{--timer-glow:rgba(72,255,190,.42);--timer-ink:var(--mint);--timer-halo:rgba(72,255,190,.4)}
.timer[data-phase="work"].is-last .timer__clock{animation:beat 1s var(--ease) infinite}
.timer[data-phase="rest"].is-last .timer__clock,.timer[data-phase="long"].is-last .timer__clock{animation:beat 1s var(--ease) infinite}

/* ---------- 参数面板 ---------- */
.cfg{display:grid;gap:18px}
.cfg__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.cfg__total{margin:0;font-size:.86rem;color:var(--muted)}
.cfg__total b{color:var(--ink);font-weight:660}
.controls--one{grid-template-columns:1fr}

/* ---------- 预设卡上的节拍摘要 ---------- */
.plan__beat{
  display:flex;flex-wrap:wrap;gap:6px;margin-top:2px;
}
.plan__beat span{
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.04em;color:var(--ink-2);
  padding:.26em .6em;border-radius:6px;background:rgba(255,255,255,.06);border:1px solid var(--line);
}