.chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-start;
}

.chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: auto;
  min-height: 0;
  line-height: 1.1;
  white-space: nowrap;
  border: 1px solid var(--line);
  background: rgba(255, 254, 249, 0.96);
  border-radius: 999px;
  padding: 8px 12px;
  cursor: pointer;
  color: var(--muted);
  font-size: 0.82rem;
}

.chip input { display: none; }

.chip span {
  display: inline-block;
  line-height: 1.1;
}

.chip-small {
  padding: 6px 10px;
  font-size: 0.82rem;
}

.chip .chip-content {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.chip .chip-content-warning {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  line-height: 1.05;
}

.chip-label {
  font-weight: 600;
}

.chip-subnote {
  font-size: 0.72rem;
  font-weight: 700;
  color: #7a5310;
  letter-spacing: 0.01em;
  text-transform: none;
}

.compact-chip-list { gap: 8px; }

.sub-control {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(214, 200, 181, 0.75);
}

.inline-chip-list { flex: 1 1 320px; }

.chip {
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    background 160ms ease,
    color 160ms ease;
}

.chip:hover {
  transform: translateY(-1px);
  border-color: rgba(106, 141, 115, 0.48);
  background: rgba(255, 254, 249, 1);
  box-shadow: 0 10px 18px rgba(38, 29, 17, 0.05);
  color: var(--accent-strong);
}

.chip.selected {
  border-color: rgba(51, 92, 68, 0.62);
  background: rgba(255, 250, 240, 0.98);
  box-shadow:
    0 8px 18px rgba(38, 29, 17, 0.05),
    0 0 0 1px rgba(51, 92, 68, 0.14) inset;
  color: var(--accent-strong);
}

.chip.selected span { font-weight: 600; }

.chip.selected:hover {
  transform: translateY(-1px);
  box-shadow:
    0 12px 22px rgba(38, 29, 17, 0.07),
    0 0 0 1px rgba(51, 92, 68, 0.16) inset;
}

.chip-warning {
  border-color: rgba(212, 156, 47, 0.42);
  background: rgba(255, 248, 229, 0.96);
  color: #7a5310;
  box-shadow: 0 8px 18px rgba(212, 156, 47, 0.09);
  white-space: normal;
}

.chip-warning:hover {
  transform: translateY(-1px);
  border-color: rgba(212, 156, 47, 0.58);
  box-shadow: 0 10px 18px rgba(212, 156, 47, 0.11);
}

.chip-warning.selected {
  border-color: rgba(196, 132, 13, 0.7);
  background: rgba(252, 241, 202, 0.98);
  box-shadow:
    0 10px 22px rgba(196, 132, 13, 0.1),
    0 0 0 1px rgba(196, 132, 13, 0.18) inset;
  color: #6c4706;
}

.chip-warning.selected .chip-subnote {
  color: #6c4706;
}

.preset-status-note {
  display: block;
  margin-top: 10px;
  color: #7a5310;
  font-weight: 600;
  line-height: 1.35;
}

.toggle-compact:has(input:checked) {
  border-color: rgba(51, 92, 68, 0.54);
  background: rgba(255, 250, 240, 0.98);
  box-shadow:
    0 8px 18px rgba(38, 29, 17, 0.04),
    0 0 0 1px rgba(51, 92, 68, 0.12) inset;
}

.toggle-compact:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(38, 29, 17, 0.05);
}
