/* 指数の採用・除外 候補一覧。 /jp-stock/index-changes/ と /us-stock/index-changes/ で共用。
   色は必ず「面と文字を同時に」指定する。文字だけトークン化すると、明面で
   白地に白文字になる（memory: light-surface-plus-dark-token-text）。 */
.ic-lead{background:var(--kb-surface);border:1px solid var(--kb-border);border-radius:var(--kb-radius-md);
  padding:14px 16px;margin:0 0 14px;color:var(--kb-text-2);line-height:1.75;font-size:.84rem}
.ic-lead h2{font-size:var(--kb-fs-h2);font-weight:800;color:var(--kb-text);margin:0 0 6px}
.ic-lead p{margin:0 0 8px}
.ic-lead p:last-child{margin-bottom:0}

.ic-filters{background:var(--kb-surface);border:1px solid var(--kb-border);border-radius:var(--kb-radius-md);
  padding:12px 14px;margin:0 0 12px}
.ic-frow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.ic-frow:last-child{margin-bottom:0}
.ic-flabel{font-size:.74rem;font-weight:800;color:var(--kb-text-3);min-width:4.5em}
.ic-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;cursor:pointer;
  font-size:.76rem;font-weight:700;line-height:1.4;white-space:nowrap;
  background:var(--kb-surface-2,var(--kb-surface));color:var(--kb-text-2);border:1px solid var(--kb-border)}
.ic-chip:hover{border-color:var(--kb-accent);color:var(--kb-text)}
.ic-chip.active{background:var(--kb-accent);color:#fff;border-color:var(--kb-accent)}
.ic-chip .ic-count{font-size:.7rem;font-weight:800;opacity:.85}

.ic-summary{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.ic-scard{flex:1 1 160px;background:var(--kb-surface);border:1px solid var(--kb-border);
  border-radius:var(--kb-radius-md);padding:10px 12px}
.ic-scard .t{font-size:.72rem;color:var(--kb-text-3);font-weight:700}
.ic-scard .v{font-size:1.25rem;font-weight:900;color:var(--kb-text);line-height:1.3}
.ic-scard .s{font-size:.7rem;color:var(--kb-text-3)}

.ic-table-wrap{overflow-x:auto;background:var(--kb-surface);border:1px solid var(--kb-border);
  border-radius:var(--kb-radius-md)}
table.ic-table{width:100%;border-collapse:collapse;font-size:.8rem}
.ic-table th{position:sticky;top:0;z-index:1;background:var(--kb-surface-2,var(--kb-bg));color:var(--kb-text-2);
  font-size:.72rem;font-weight:800;text-align:left;padding:8px 10px;border-bottom:1px solid var(--kb-border);white-space:nowrap}
.ic-table td{padding:8px 10px;border-bottom:1px solid var(--kb-border);color:var(--kb-text);vertical-align:top}
.ic-table tr:last-child td{border-bottom:none}
.ic-table a{color:var(--kb-accent);text-decoration:none;font-weight:700}
.ic-table a:hover{text-decoration:underline}
.ic-code{font-variant-numeric:tabular-nums;font-weight:800}
.ic-num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.ic-reason{color:var(--kb-text-2);font-size:.75rem;line-height:1.6;max-width:30em}

/* 種別の札。面と文字を対で決める */
.ic-tag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.68rem;font-weight:800;white-space:nowrap}
.ic-tag.add-fixed{background:color-mix(in srgb,var(--kb-positive) 20%,var(--kb-surface));color:var(--kb-positive);
  border:1px solid color-mix(in srgb,var(--kb-positive) 45%,var(--kb-surface))}
.ic-tag.drop-fixed{background:color-mix(in srgb,var(--kb-negative) 20%,var(--kb-surface));color:var(--kb-negative);
  border:1px solid color-mix(in srgb,var(--kb-negative) 45%,var(--kb-surface))}
.ic-tag.add-maybe{background:color-mix(in srgb,var(--kb-positive) 10%,var(--kb-surface));color:var(--kb-positive);
  border:1px dashed color-mix(in srgb,var(--kb-positive) 45%,var(--kb-surface))}
.ic-tag.drop-maybe{background:color-mix(in srgb,var(--kb-negative) 10%,var(--kb-surface));color:var(--kb-negative);
  border:1px dashed color-mix(in srgb,var(--kb-negative) 45%,var(--kb-surface))}
.ic-tag.member{background:var(--kb-border);color:var(--kb-text-2);border:1px solid var(--kb-border)}
.ic-band{display:inline-block;padding:1px 7px;border-radius:999px;font-size:.66rem;font-weight:800;
  background:var(--kb-border);color:var(--kb-text-2)}
.ic-band.likely{background:color-mix(in srgb,var(--kb-warning) 22%,var(--kb-surface));color:var(--kb-warning);
  border:1px solid color-mix(in srgb,var(--kb-warning) 45%,var(--kb-surface))}

.ic-pager{display:flex;gap:6px;align-items:center;justify-content:center;flex-wrap:wrap;margin:12px 0 4px}
.ic-pbtn{padding:6px 12px;border-radius:var(--kb-radius-sm);border:1px solid var(--kb-border);
  background:var(--kb-surface);color:var(--kb-text-2);font-size:.78rem;font-weight:700;cursor:pointer}
.ic-pbtn:hover:not(:disabled){border-color:var(--kb-accent);color:var(--kb-text)}
.ic-pbtn:disabled{opacity:.45;cursor:default}
.ic-pbtn.active{background:var(--kb-accent);color:#fff;border-color:var(--kb-accent)}
.ic-pinfo{font-size:.76rem;color:var(--kb-text-3);font-weight:700}

.ic-note{font-size:.74rem;color:var(--kb-text-3);line-height:1.7;margin:10px 2px 0}
.ic-empty{padding:26px 14px;text-align:center;color:var(--kb-text-3);font-size:.84rem;line-height:1.8}
.ic-rule{background:var(--kb-surface);border:1px solid var(--kb-border);border-radius:var(--kb-radius-md);
  padding:12px 14px;margin:12px 0 0;font-size:.78rem;color:var(--kb-text-2);line-height:1.75}
.ic-rule h3{font-size:.86rem;font-weight:800;color:var(--kb-text);margin:0 0 6px}
.ic-rule + .ic-rule{margin-top:8px}
.ic-rule .src{font-size:.72rem;color:var(--kb-text-3);margin-top:6px}
.ic-rule .src a{color:var(--kb-accent);text-decoration:none}
