/* 壓力測試元件與圖表（由 stress.js 自動載入）。根元素帶 data-ui：真的介面片段，表單欄位可以有框線。 */
.stress { background: var(--paper-2); padding: clamp(16px, 3vw, 28px); margin: 1.8em 0; }
.stress-title { margin: 0 0 4px; font-size: 1.25rem; padding: 0; }
.stress-intro { margin: 0 0 12px; color: var(--ink); font-size: 1rem; }
.stress .controls { margin: 12px 0 16px; background: var(--paper-3); }
.stress .controls label { align-content: start; }
.stress td.num { white-space: nowrap; }
@media (max-width: 560px) { .stress table { font-size: .9rem; } .stress th, .stress td { padding: 6px; } }
.stress .controls .hint { font-size: .85rem; color: var(--ink-soft); }
.stress-scenarios { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.stress-scenarios button {
  font: inherit; font-size: .95rem; border: 0; background: var(--paper-3); color: var(--ink);
  border-radius: 0; padding: 7px 14px; cursor: pointer; transition: background .15s, color .15s;
}
.stress-scenarios button:hover { background: var(--ink); color: var(--paper); }
.stress-scenarios button[aria-pressed="true"] { background: var(--seal); color: var(--seal-ink); }
.stress-scenarios input[type="month"] { font: inherit; font-size: .95rem; border: 1px solid var(--border); background: var(--paper); color: var(--ink); border-radius: 0; padding: 5px 8px; }
.stress-verdict { font-family: var(--sans); font-size: 1.1rem; font-weight: 700; margin: 16px 0 10px; padding: 14px 18px; background: var(--paper-3); }
.stress-verdict.bad { background: var(--danger-soft); color: var(--danger); }
.stress-verdict.ok { background: var(--good-soft); color: var(--good); }
.stress table td.num.neg { color: var(--danger); }
.stress table th { background: var(--paper-3); }
.stress details { margin-top: 12px; font-size: .95rem; color: var(--ink-soft); }
.stress details summary { cursor: pointer; color: var(--ink); font-weight: 600; }
.stress-error { color: var(--danger); }

.lc-legend { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: .92rem; color: var(--ink-soft); margin-bottom: 6px; }
.lc-legend span, .lc-tip div { display: inline-flex; align-items: center; gap: 6px; }
.lc-legend i, .lc-tip i { display: inline-block; width: 18px; height: 4px; }
.lc-legend i.dash { height: 0; border-top: 4px dashed; }
.lc-plot { position: relative; width: 100%; touch-action: pan-y; }
.lc-plot svg { display: block; width: 100%; height: auto; overflow: visible; }
.lc-tip { position: absolute; top: 8px; z-index: 5; background: var(--ink); color: var(--paper); box-shadow: 0 8px 24px rgba(0,0,0,.25); padding: 8px 12px; font-size: .88rem; line-height: 1.6; pointer-events: none; white-space: nowrap; } /* taste-skill-ignore: floating tooltip */
.lc-tip div { display: flex; }